Gaia GPS
Developing a New Feature for an Outdoor Navigation App
Role:
UX/UI Designer
Duration:
80 hours
Tools:
Figma, Ai, FigJam
Overview
Gaia GPS, is a popular outdoor navigation and mapping app, I explored the concept of integrating a First Aid feature. This feature was envisioned to provide outdoor enthusiasts, particularly hikers, with convenient offline access to vital first aid information.
The design aimed to leverage Gaia GPS's offline map capabilities, ensuring that adventurers could rely on this app for essential and user-friendly first aid resources during their outdoor explorations.
The Challenge
Discover strategies to enhance hikers' sense of safety on the trail and cultivate trust and reliance on an app during hiking excursions.
The Solution
Drawing upon insights from UX research and principles of UI design, a conceptual first aid feature was crafted, accompanied by prototypes. This feature is designed to swiftly provide vital information, placing a high priority on simplicity and accessibility to effectively address user needs and preferences.
The Design Process
Research
Research Goal:
Understand the factors contributing to hikers' trust in an app to provide vital information and how to enhance users' comfort in relying on it. Gain insights into the perceptions, preferences, and expectations of potential Gaia GPS users regarding the integration of a first aid feature within the app. Gather valuable insights into users' needs, concerns, and the potential benefits they associate with having such a feature to bolster safety and preparedness during their outdoor explorations.
Research Methods:
User interview: Developed open-ended questions and script to gain insight into the users preferences, experiences and expectations when interacting with a website.
Competitive Analysis:
A competitive analysis focused on trail apps to help identify how other apps cater to users' safety and preparedness needs during outdoor activities. In addition assess whether competitors provide first aid features, what kind of information they offer, and how they present it to users.
User Interviews
For this study, interviews were conducted with five individuals who met the criteria of:
Outdoor Enthusiasts: Individuals who regularly engage in outdoor activities such as hiking, camping, backpacking, etc.
Familiarity with Gaia GPS: Users who have experience using Gaia GPS or similar navigation apps during their outdoor adventures.
First Aid Preparedness: Participants with varying degrees of first aid preparedness, ranging from novices to those who are fairly well-equipped.
Key Findings
1. Relevance of First Aid Feature:
All participants expressed an interest in having a first aid feature in the Gaia GPS app. They recognized the importance of being prepared for potential emergencies during outdoor activities.
2. Minimal Preparation:
Most interviewees admitted to not extensively preparing for hiking trips, opting for the bare minimum in terms of safety equipment and first aid supplies.
3. Visual Aids with clear & concise information:
Participants highlighted a preference for visual aids such as photos or illustrations accompanying the first aid instructions. These visuals enhance understanding and aid in visualizing proper treatment techniques. They appreciated easily accessible guidelines that provide essential details without overwhelming technical jargon.
4. Outdoor Preparation:
Interviewees expressed interest in having a section within the feature on how to prepare for outdoor activities. This section would include information about essential gear, safety tips, and planning guidelines to enhance their overall preparedness.
Competitive Analysis
After conducting a competitive analysis, which included examining the popular apps AllTrails, Komoot, and ViewRanger, it was discovered that all three of these apps provided robust trail mapping and offline map capabilities, much like Gaia GPS.
However, one noticeable gap in their offerings was the absence of a dedicated first aid feature. This finding suggests that there is an opportunity to stand out in the market by incorporating a first aid feature into the app, enhancing safety and user experience for outdoor enthusiasts.
Affinity Map
Findings from the Affinity Map:
Wants & Needs: Clear and concise first aid instructions with visuals, want a feature that includes information on safety tips and preparation for outdoor adventures.
Preparedness: Some participants were confident in being outdoors with minimal preparation and basic first aid, others seek more guidance.
Experience Level: Diverse, ranging from novices to seasoned outdoor enthusiasts.
User Persona
Based on the UX research the user persona Max was developed. Max is a 32 year old Retail Associate based in Connecticut, she is a casual hiker that enjoys exploring nature during her free time.
Max regularly uses Gaia GPS to download hiking trails and would like to know basic first aid for any accidents that may happen when she is on the trail.
Site Structure
Sitemap
The sitemap introduces the newly created First Aid Feature. It includes sections such as First Aid Guide, Find a Hospital, Emergency Numbers, Safety Tips and a comprehensive First Aid Checklist.
Task Flow
A task flow for accessing instructions for an injury was developed as it is a crucial aspect for the feature and it was important to create a smooth and intuitive user experience.
From UX to UI
UI Kit
The brand identity for Gaia GPS is carefully crafted to resonate with its target audience of outdoor enthusiasts. It embraces a nature-inspired color palette, which typically features earthy tones like greens, browns, and blues, mirroring the colors of the natural world. These colors not only evoke a sense of connection to the outdoors but also symbolize reliability and harmony with nature. I considered the brand's color palette, typography, and overall visual style to ensure a cohesive and consistent look. Overall, the focus on promoting exploration and adventure in the great outdoors is at the core of Gaia GPS's brand identity.
By carefully considering elements like color, imagery, and typography, I aimed to provide a cohesive and consistent brand experience that aligns with the existing app and with the audience.
Custom Illustrations:
As a part of the development process for the new first aid feature, I created custom illustrations that align with Gaia GPS's existing brand identity. The illustrations for the first aid guide were created to easily display relevant first aid information. Whilst the safety tips illustrations evoke a sense of preparedness, and confidence, while also being easily understandable and relatable to users in various outdoor scenarios.
Low Fidelity Wireframes
Recognizing the critical importance of providing users with quick and seamless access to essential first aid resources, the wireframes were crafted to present the information in a user-friendly and intuitive manner. Clear navigation pathways were established, guiding users to the First Aid Feature and its various sections.
Emphasis was placed on simplicity and clarity, to ensure users could swiftly locate and retrieve the necessary first aid information, even in stressful outdoor situations with limited time or resources.
High Fidelity Wireframes
To further enhance user understanding, animated GIFs were created as it was recognized that visual aids for both tick removal and CPR would greatly benefit users.
These GIFs were included to provide a more intuitive and comprehensive understanding of these procedures. For instance, in the case of tick removal, seeing the process visually could help users grasp the intricacies of safe removal techniques, ensuring they can confidently and effectively handle such situations.
Similarly, for CPR compressions, the animated GIFs demonstrated not only the correct speed but also the precise hand movements required, making it easier for users to acquire and remember these vital life-saving skills.
Key Screens
Trip Planning Screens
Usability Testing
The usability test aimed to evaluate the user's ability to navigate and access first aid information within the Gaia GPS app. Participants were asked to imagine they are on a hiking trip, and they need to access specific first aid information using the Gaia GPS app.
Task 1: Access Tick Removal Instruction page
Task 2: Navigate to CPR instruction page
Task 3: Navigate to Essential Gear & Equipment page in Safety Tips section
Task 4: Navigate to First Aid Checklist
Methodology
Conduct usability test where users interact with a Figma prototype to complete a task. Testing was done in person or remotely
Participants
Five participants that met the criteria of previous hiking or outdoor experiences.
Testing Goals
Evaluate the efficiency and learnability for users to accomplish basic tasks
Identify user pain points and errors
Gain an understanding of user behavior
Increase usability and design of wirefames
Key Findings
Task Completion: 4/4 participants completed all tasks
All of the participants were able to complete the tasks in a timely fashion and were satisfied with their experience.
There were no high severity issues, however some low level issues/suggestions came up that can be addressed.
After analyzing the feedback, I decided to make three iterations to improve the design.
Iterations:
Guided by user feedback, I initiated minor redesigns aimed at improving the overall user experience.
Iteration: Bold text
One user felt the text blurred together a little. Bolding was incorporated to enhance the text presentation to break up the content and improve visual hierachy.
Iteration: Rewording
Two users expressed concern that the term “Rescue Breath” might be challenging for some individuals to comprehend, potentially hindering their understanding of the first aid instructions. To address this issue and enhance clarity, the wording was iterated to "mouth-to-mouth resuscitation."
Iteration: Improved Access & Visibility of CPR
Based on user feedback, it was observed that users found CPR easy to find within the feature with the search tool. However, considering the urgency of CPR and its critical importance in emergency situations, two users suggested that having a dedicated CPR section would further enhance accessibility. In response to this input an iteration was made to have CPR at the top of the First Aid Guide and to have the icon in a brighter color.
Final Prototype
The final prototype of the first aid feature aims to offer clear instructions, engaging illustrations, and a streamlined user experience, promoting safety and preparedness during outdoor activities.
Lessons Learned
Prioritizing User-Centric Design in First Aid Feature Development
Throughout the development of the first aid feature, I grasped the importance of user-centric design. By conducting comprehensive research and usability testing, I gained valuable insights into user needs, preferences, and pain points, leading to the creation of an intuitive and user-friendly experience.
Enhancing User Experience Through Visual Cohesion
The integration of custom illustrations aligned with the existing branding further enriched the project, emphasizing the significance of visual cohesion.
Accessibility and Clarity: Navigating First Aid Information
Given the nature of a first aid feature, I placed a high priority on navigation and clear information delivery to ensure accessibility for all users.
This project served as a powerful reminder of the paramount importance of putting users at the forefront and crafting solutions that cater to their needs effectively.