This assigment was to create an app that tracked data that we believe people would be interested in using. I am very outdoorsy and backpack often. I have always wanted an app that tracks your trail progress, hiking improvements, and trail information.
Inspiration: Via Pinterest
Iteration
I began this project attempting to connect hiking progress to emotion. The app would be more of a journaling assistant. I found this to be quite forced, so I decided to take a different route.
I quickly sketched the main screens I hoped to see. I wanted the user to be able to make their own goals, see trails around them, trail information, and gain achievements.
These were my first wireframe attempt. The final is to be presented in Figma, but I was more comfortable playing around in Illustrator.
I then began to transfer my ideas from Illustrator to Figma
I started filling in gaps between my frames to clear confusion. I included information buttons that explains things like the difficulty rating being used for this app.
I learned how to make useable check boxes!
Progress on my wireframes. Started playing with the idea of having clickable tabs.
Added a section about trail information.
The colors seemed a bit bland. This shows my color process to find a accent color.
Final color pallet
Started to add the new colors in to the frames. Started to set a standard so my frames would look the same. Made text boxes have a rounded corner of 5, while clickable features 20. Made headers, subheaders, and body text standards. Trail progress tabs were still challenging for users to view as clickable.
Began working on my stats pages
Felt that trail information was lacking, so I included extra trial information.
I wanted the app to have a scrollable page. I chose to use this page so that the maps could be as large as possible. I also made it so they fit the theme of the app.
I made the tabs more clear and added an "Im done for now" button for those who are unable to finish the trail. Comparison from the first image (origional) to the new version.
The animations for this app became quite complex.
My professor (Yvette Shen) helped us run user testing for classmates and alumni. It was extremely helpful to see flaws in my work and bounce ideas off of each other.
Final