Overview
HillyGoat is a consolidated, easy-to-use hiking mobile application for beginner and advanced hikers with the capability to provide users with key information to design their ideal hiking adventure. This application was created during a semester-long group project within the Human-Computer Interaction in Software Development course at the University of Virginia. My project team and I designed this application from inception to final design.
Duration: 5 months
Methods: User Interviews, Surveys, Work Activity Affinity Diagramming (WAAD), Personas, Preference Tests, Wireframes, Prototyping, Usability Testing, Benchmarking
Tools: Figma, Adobe Illustrator, Adobe Photoshop
Final Prototype: here (Figma link)
Context
Hiking is an enjoyable form of physical activity but can be stressful and even dangerous when hikers are unprepared. In order for hikers of all kinds to stay safe and happy out on the trails, it is important that hikes are planned ahead of time and that hikers have the tools they need to be prepared for their adventure.
However, planning a hike can be time-consuming and overwhelming, especially considering hikers have to visit multiple websites to thoroughly plan a hike. My team and I developed a mobile application that would allow hikers of all experience levels to easily find key information for various trails in their area, including general trail information, reviews, pictures, and weather updates that would help users find their perfect hike, every time.
UX PROCESS
1.
Research
2.
Define
3.
Ideate
4.
Prototype
5.
Evaluate
1. Research 2. Define 3. Ideate 4. Prototype 5. Evaluate
Research
Competitor Analysis
To better understand the competitive landscape, my team and I conducted analysis on two popular hiking apps (AllTrails and TrailLink) and found areas for improvement.
Interviews with Potential Users
To learn more about how hikers made use of existing hiking technologies, any issues they were facing, and general user habits and preferences, we developed a comprehensive interview guide to interview 6 hikers of varying skill levels.
WAAD Creation
We created a Work Activity Affinity Diagram (WAAD) by extracting raw data from our interviews. The creation of this WAAD allowed for the development of functional requirements for HillyGoat.
Key Findings:
The research we conducted helped highlight the most pressing needs and concerns of our users. The main findings from this research include:
Increase Interactivity
Users wanted to be able to interact with trail maps, by leaving comments on certain parts of a trail, reporting hazards, etc.
Make it Social
Being able to view pictures and reviews from fellow hikers or invite friends to planned hikes appealed to many users.
Add More Information
Users wanted a one-stop-shop for all trail information, including difficulty level, elevation, estimated completion time, distance, weather, reports, etc.
2. Define
User Persona
Since there is one major user group for HillyGoat (hikers), we converged upon one main persona out of 4 candidate personas to reference when designing our application to ensure a user-centric focus. This persona is a frequent hiker and social media user.
Modeling
We developed an Existing System Flow Model, Envisioned System Flow Model, and a Hierarchal Task Inventory Model to better understand the current system as it relates to the process of planning for and going on a hike. We were able to further solidify potentially common pain points throughout this pre-existing process.
Core Features of HillyGoat:
Defining a primary persona and identifying common pain points through modeling allowed for us to determine core features needed in HillyGoat. These include:
Interactive Map
HillyGoat will allow for users to mark waypoints on the map or report any hazards or comments while tracking the users location, similar to apps like Waze or Apple Maps.
Search, Filter, & Sort
In order to simplify trail searching, users are allowed to directly search for any trail, or sort and filter based on a variety of fields to find the best trail for them.
Information Download
Considering cell service may be inconsistent out on a trail, HillyGoat provides the option for users to download trail information ahead of time to have on hand throughout the hike.
3. Ideate
Design Ideation
Across various ideation sessions, the team and I developed ideas of the layout of HillyGoat and presented these ideas to our client, which was the sponsor of a hiking club. We used storyboarding to visualize how users might use our hiking app to determine what views and buttons we would need.
Wireframes
In creating wireframes for HillyGoat, I utilized Figma in order to develop views of each screen that highlighted one of HillyGoat's core features. The goal was to develop wireframes that are intuitive and allow for high ease of use.
4. Prototype
After discussing our wireframes with our client, we decided to develop a prototype, including the client's feedback, in Figma. We decided to design a high-fidelity, T prototype with as much detail and interactivity as possible in order for our design to be thoroughly evaluated during user testing.
5. Evaluate
Through conducting usability tests, my team and I were able to refine what users found intuitive and useful and find areas of improvement within HillyGoat. We decided on multiple UX targets and benchmark tasks that relate to the main tasks of the application. Users were asked to complete scenario-based tasks to test multiple features of the app. We also developed a questionnaire to measure user opinion of attractiveness, quality of user experience, and user dissatisfaction, which users were asked to complete after the usability testing.
Key Findings:
We received a mix of positive and negative feedback and were able make changes to HillyGoat as needed based on our evaluation findings.
Strengths
Users were able to complete tasks quickly.
Upon making an error, users were able to recover quickly.
Quality of user experience was high.
Areas for Improvement
Users made more errors than expected.
Users did not report as high initial satisfaction as expected.
Users found some icons to not be the most intuitive.
Conclusion
Considering this was my first UX project, I gained valuable insights into the design process and the importance of user-centered thinking. I learned how crucial it is to engage with users, gather feedback, and iterate based on their needs. Having regular conversations with the client and interviewing users based on the prototype allowed for external perspectives on how to improve the design. This experience taught me the significance of collaboration and communication within a team, as well as the impact of thoughtful design on user experience. Overall, this project not only enhanced my technical skills but also deepened my understanding of how to create meaningful and effective solutions that truly resonate with users.
In reflecting on this project, there are some design changes that I would make in future iterations. For example, I would have the navigation bar along the bottom of the screen on the home page be consistent across screens, add sliders on the filters page so users do not have to manually input the max and min, etc.