PROBLEM

Navigating Adventures: Revitalizing User Journeys in an Outdoor Adventure Companion App

Solving the problem of users are often lost in an app's complex navigation, making it difficult for them to discover trails, receive gear recommendations, and connect with fellow adventurers. This lack of intuitive design not only frustrates users but also threatens the app's ability to retain and engage its audience.

“How might we simplify navigation and enhance the user experience of the Outdoor Adventure Companion App space to ensure users can easily discover trails, receive gear recommendations, and connect with fellow adventurers?”

Timeline

  • March 19th- April 2ed (two week)

  • This UX design project was completed as part of the Google UX certification intensive UX Design course. Utilizing user research methods learned in the program, including user interviews and surveys, I designed wireframes and prototypes to address key pain points identified within the existing user flow, ultimately leading to an improved user experience.

My roll

  • Research

  • design

  • navigation architecture

  • wireframing

  • prototyping

My tools

  • Figma

  • Canva

  • Photo shop

  • google

THE SOLUTION

Guiding Adventures with Ease

WHITE PAPER RESEARCH

Charting the Course: Exploring Navigation Patterns for Enhanced User Experience in Digital Interfaces

Starting with white paper research, I began to draw research on navigating patterns. I came a crossed this fact from Designing Effective Navigation Systems for Mobile Applications: A Review of Current Practices.

"Research shows that over 70% of users abandon mobile applications if they find the navigation to be confusing or difficult to use."

RESEARCH QUESTIONS

COMPETITIVE + SWOT ANALYSIS

Navigating the Outdoor App Terrain

Our competitive analysis of outdoor navigation apps revealed a landscape rich in diversity and innovation. From AllTrails' comprehensive trail databases to Gaia GPS's advanced mapping technologies and Komoot's social engagement features, each app offers a unique blend of functionalities tailored to different outdoor activities. We observed the pivotal role of active user communities in enriching these platforms, with users sharing trails, reviews, and experiences, fostering a sense of camaraderie among outdoor enthusiasts.

ViewRanger

ViewRanger offers detailed maps for hiking, biking, and other outdoor activities. It includes features like GPS navigation, offline maps, and augmented reality (AR) for identifying peaks and landmarks. ViewRanger also allows users to discover and follow curated trails.

AllTrails

AllTrails is a popular app among hikers, bikers, and outdoor enthusiasts. It offers a vast database of trails with detailed maps, reviews, and photos, making it easy for users to navigate and explore outdoor destinations.

Outdoor active

Outdoor Active is a comprehensive platform for outdoor enthusiasts offering maps, routes, and information on various activities such as hiking, biking, skiing, and mountaineering. It provides detailed route descriptions, GPS navigation, and offline maps, catering to a diverse range of outdoor adventures.

Komoot

Komoot is a versatile app for outdoor navigation, especially popular among cyclists and hikers. It provides route planning capabilities, turn-by-turn navigation, offline maps, and curated collections of trails and routes. Komoot also offers personalized recommendations based on user preferences and fitness levels.

USER INTERVIEWS

Navigating User Needs for the Ultimate Outdoor Adventure Companion

After conducting competitive analyses, I moved into validating findings through surveys, interviews, affinity mapping, and card sorting. I utilized Google Surveys and my personal social media accounts to execute these In addition to the Google Survey, I asked 4 people in my local network if they’d be willing to do in-person interviews. We grabbed coffee and I got to dig deeper into my app design by bouncing ideas off of them and receiving quality feedback.

User Survey take aways…

These findings highlight the importance of intuitive navigation, reliable and up-to-date maps, personalized recommendations, strong safety features, and a user-friendly interface. Enhancements in these areas can significantly improve user satisfaction and engagement with the app.

CARD SORTING

Card sorting & Infinity mapping

With these results, I proceeded to do card sorts and affinity mapping. This part is always fun for me, as it really helps me step into my users shoes, allow peoples' unique to quotes jump off the page at me, and get creative.

Desire

Paint Points

Behaviors

PERSONA’S

Stepping into the Outdoors: Crafting Personas for Trail Blaze

Before my pen hits the paper to create wireframes, I always take the time to step into the shoes of the users who will be experiencing the product. Beyond my initial research, I leveraged user stories, scenarios, and task flows to prepare for the wireframing process. I also dedicated my energy to market research by exploring online communities where potential users "live," such as Facebook groups, Instagram comments, and blogs.

I value connecting with people on a mutual level, meeting them in a human-to-human way that allows them to feel my sincere empathy and interest in their emotions, ideas, and experiences. In past and present projects, I have found this approach yields rewarding research.

Through this process, I gained deep insights that helped me to create, or rather uncover, the personas for the Trail Blaze app.

The insights I gathered during my research helped me to develop 2 personas:

EXPLORATION+ IDEATION

Crafting the Trail Blaze Experience: Innovative Exploration and User-Centric Ideation

Initially, I explored the various ways users might interact with the navigation and route planning features of the Trail Blaze app. For activities like hiking, mountain biking, and trail running, accurate and detailed trail information needs to be collected and presented in a user-friendly way. I also wanted the app to include a route library with a save-to-library option, allowing users to save and easily access their favorite routes without needing to re-enter information repeatedly.

Being able to search, explore, and connect with a community of outdoor enthusiasts was a highlight feature, so I knew the community engagement process needed to be particularly intuitive. Additionally, integrating robust safety features, such as live tracking and emergency alerts, was essential to ensure user safety on their adventures.

With these main features at the forefront of my mind, I began sketching and then created the first wireframes for the app.

Testing the Trail Blaze Experience: Prototyping and Usability Testing

I mocked up an interactive prototype using Figma. To ensure the app's usability, I conducted the first usability test in a moderated, in-person setting with five helpful volunteers. I presented them with specific scenarios and tasks to complete and took detailed notes as they carried out the tests.

Scenario: You've just opened the Trail Blaze app and want to get a good idea of what features the app offers. Then, you plan to find and save a new trail and connect with the community for recommendations.

Task 1: Navigate through the app. Talk aloud about the experience, particularly how well it helps you understand the app and its features.

Task 2: Find and save a new trail to your library.

Task 3: Connect with the community to ask for trail recommendations.

USABILITY TESTING + AFFINITY MAPPING

Organizing Insights

Following the usability test, I created affinity maps to organize the notes and feedback I received. I rated the severity of the observed errors using Nielsen's Severity Rating Scale and logged these into a Google Sheet to prioritize needed iterations.

I conducted a preference test using UsabilityHub.com, focusing on a simple design preference test to compare a bright gradient background against a slightly darker gradient background. The feedback I received led me to completely rethink the UI design of Trail Blaze, which we will delve into shortly.

Usability test results

Affinity mapping

DESIGN

Enhancing the Adventure with 4 Major Design Changes

Based on the insights gathered from user testing and analysis, we have made several key changes to the user interface design of the Trail Blaze app to enhance the overall user experience. These modifications were driven by our commitment to addressing user pain points and improving the app's functionality and aesthetic appeal.

Enhancing Usability with Clean Graphics

Feedback from our user testing indicated that overly complex graphics were contributing to a cluttered and confusing interface. In response, we have simplified the graphics to create a cleaner and more user-friendly design. This simplification aligns with our goal of making the app intuitive and easy to navigate, reducing cognitive load and allowing users to focus on essential functionalities without distraction.

Revamping the Color Palette for Universal Appeal

Our user testing revealed that the original color palette did not captivate the attention of our target audience. To rectify this, we adopted a more minimalistic color scheme. This approach not only broadens the app’s appeal to all genders but also lends a timeless and sophisticated feel to the interface. The new color palette is designed to create a visually pleasing experience that encourages prolonged use and fosters a positive perception of the app.

Enhancing First-Time User Experience

During user testing, it became evident that new users needed a clearer understanding of the app’s capabilities. To address this, we introduced a straightforward user introduction that quickly guides users through the main features of the app. This seamless onboarding process aims to reduce initial confusion and ensure that users can efficiently navigate and utilize the app from the start. By providing this guided introduction, we aim to enhance user confidence and satisfaction, facilitating a smoother transition into the app's ecosystem.

Removal of Bottom Navigation

Based on mentor feedback, letting the user naturally flow to the other parts of the app seemed to be a better fit. First desired bottom navigation tab to allow ease of adaption for the user.

FINAL SCREENS

The Final Product

DEMO

STYLE GUIDE

The Takeaway

Lessons Learned

Creating Trail Blaze taught me invaluable lessons about behavioral navigation patterns through applications. I discovered that effective navigation goes far beyond simple arrows and buttons; it involves understanding user behavior, preferences, and needs at a deep level. I learned that seamless navigation requires multiple layers, including intuitive design, clear information hierarchy, and user-friendly features that anticipate and address potential pain points. This experience has underscored the importance of creating a fluid and enjoyable user journey, ensuring that every interaction feels natural and effortless for the user.

 

  • Improved Accessibility with WCAG Standards

    • If I had more time I would spend time investigating, testing and ideating disability accessibility. More then ever all people are enjoying the outdoors and If we can create an application to make all people feel safe and welcome to step into an outdoor adventure, I would say that would be a large win.

  • Gear exchange:

    • Explore ways to grow the community engagement by implementing a safe gear exchange.

  • Improved Safety feature

  • Not only s.o.s. and tracking but safety as far as privacy goes on the app.

For more work inquiries, or to grab a coffee do email me at Margopagemorrill@gmail.com ☕️ ✨

Thank you for taking the time!