I used this survival guide as inspiration for my design.
Bodystorming
I went to every trail that would be on the app and seen what it was like to experience it. This helped me decide what direction to go with the design. Some of the trails required me to do my own tracking to find out important things like: distance, elevation gains, trail types, etc.
Fly-on-the-Wall
For this research technique, I sat on a bench and watched the people using the trails. I tallied things like what kinds of shoes people were wearing, if they brought their dog, trail traffic, and much more.
Interviews
I interviewed two completely opposite users. The first was Amber, she is a busy mom that looks for trails based on who she is walking with: her husband, her, and their young son; her and her son; or just by herself. Depending on who Amber was walking with determined what she was looking for in a trail.
I also interviewed Brad. He is a single dad of two teenage sons. When he goes walking, it will either be just him, or him and his sons. Brad doesn't care as much about what the trail is like, but what there is to do long the trails.
Literature Reviews
The first thing I wanted to figure out is what help people back from going out and hiking. What I found was most people were scared of getting lost or injured while being on their own, something Amber had expressed concern about also. I researched why people got lost and what could be done to prevent it.
While doing my research, I remembered an old survival guide my mother had while I was growing up. This book became a style guide while I was building the design.
Creative Matrix
This app had a lot of information and tools to keep track of, by making a creative matrix I was better able to organize my thoughts and start to categorize the different elements.
Heuristic Evaluation
By sitting down and walking through my low fidelity prototypes, as if I was a user, I was able to pick out errors before placing it in front of an actual user.
Experience Prototyping
Once I had wireframes developed, I was able to test the process on a user. This gave me insight to what was working well and what wasn't working.
User's got a retail or healthcare vibe from this color scheme.
User's liked this color scheme, but there was some readability issues.
After testing the first 2 color schemes, I decided the second was the one to go with. However, it did have some issues that would need to be addressed. To fix the readability, I reversed the color scheme and gave the design a dark background.
A/B Testing
I created a couple different color schemes and tested them on users. The majority of users said the blue/green color scheme reminded them of health care or retail apps. Users preferred the tan/orange/green color scheme, but there were some readability issues. In light of this, I switched things around and made the background a dark green. Users absolutely loved this version and said it was a great color scheme for the rural area.
Heuristic Evaluation
Once I finished applying the final color scheme to all of the page types, I conducted another round of heuristic evaluation. This allowed me to pinpoint things like: readability issues, varying stroke weights, broken links, and more.
Color Blindness Tests
I wanted this app to be accessible to everyone. I was worried about how the colors would contrast with each other for a color blind person. After digging around, I found a program Harvard students used to conduct research on color blindness. Instead of only showing a few types of color blindness, this software shows each type and how colors react to each other because of it.
Desktop Prototypes
Mobile Prototypes
