TREK CHECK
Assuring a stress free hiking experience
MY ROLE: Research, UX and UI TIMELINE: 16 weeks
PROBLEM
Hikers in Los Angeles have no idea whether they'll be able to find a parking spot at hiking trails
Ongoing resolutions and continuous complaints from residents living near the entrance to hike trails have prompted parking restrictions in their surrounding neighborhoods. Between the permit-only parking zones, the massive crowds, and the lack of parking lots, visitors struggle to find parking. This struggle leaves them confused, wastes time, and makes the whole experience frustrating before a hike.
losangeles.cbslocal.com
“It makes me really sad,” hiker Cecile Wizenfeld said. “It’s gonna make us think twice about coming over here, we’ll probably go to other hiking trails.”
STUDIO CITY (CBSLA) Visitors to the popular Fryman Canyon Park hiking trail in Studio City struggle to find parking.
New Parking Restrictions in the Neighborhoods around Popular Studio City Hiking Trail in effect.
“Parking at Runyon Canyon – one of the most accessible and popular hikes in Los Angeles – is about to get a bit more difficult.”
Due to complaints about parking by residents, the Los Angeles City Council approved a recommendation of restricted parking on the streets immediately south of Runyon Canyon Park.
SOLUTION
Having Control is Key
Filter occupancy to your needs
Prepare before you leave
Avoid overly crowded hikes
Customize trails to specific occupancy level preference
1
Maximize your time
Compare parking status of hikes nearby
Select options, save time & find what you need
Spend more time hiking
2
Set the right Expectations
Know what to expect before you go
Stress-free parking
Confidence infused
3
MY ROLE
The Trek Check app was designed as a concept project in response to the need to assist hikers in avoiding potential roadblocks and making better use of their time. To facilitate and improve the hiking experience in L.A., I used the design process to create the app as the sole UX Designer.
During the 16-week project, I was in charge of:
Conducting research through user interviews and validating designs via usability testing
Creating the app’s information architecture to identify and define the app’s content and functionality
Implementing the end-to-end design process, from first concepts through sketching, to the building and testing of wireframes and prototypes
DESIGN PROCESS
DESIGN FOOD FOR THOUGHT
Here’s a little interesting nugget about the design process for this project - A huge shift was made while in the diamond 2 stage. It should be noted that the arrow that is going from phase 3 (develop) to phase 4 (finalize) of the design process ended up going into a loop for a while. It was during this in-between phase where I actually went back and came up with some new ideas for the design, and redid the design completely. During this refinement process while I was prototyping in the finalize phase, almost ready to dive into validation, I shifted into an ultra modern aesthetic. This forced me to rethink some concepts and also redo the style guide during iterations, which helped me determine which screens needed to be kept, versus which ones could be torn down and rebuilt from scratch. Throughout my UX design process, I covered almost every type of deliverable that is possible within the UX space, making it an in-depth project.
RESEARCH PLAN
Researching potential users of the app
A plan to identify prospective hikers and find solutions to improve the hiking experience in Los Angeles - I created a document that listed out my research goals, as well as the methods I intended to use to accomplish those goals. This research plan also acted as a roadmap that I could refer back to in order to track the progress of my research.
Included:
An outline of the research method I planned to use
The goals I hoped my research would accomplish
A general timeline for the research I’d be conducting
Research questions
Hypothesis
SCREENER SURVEY
Recruiting the right participants
It was crucial that I conduct interviews and other forms of research with people who would help me to collect viable data, so I created this screener survey to gather participants that fit Trek Check's desired demographic. This survey helped me choose who would be the most valuable to interview and screened them so that I could confidently move forward with my research process.
USER INTERVIEWS
Identifying what users need...
I conducted five user interviews with people I had previously screened and who hike often to gain a deeper understanding of pain points, struggles and needs, and overall experience of hiking in LA. I asked participants questions in order to identify trends and patterns in their behavior:
INTERVIEW QUESTIONS
Walk me through your end to end journey when planning a hike.
When do you have your best hikes?
Are there any specific times of day that make the hiking experience more pleasant?
Do your plans to go hiking ever change?
What causes you to return to a specific hiking trail?
USER JOURNEY
Visualizing pain points
More specifically, I found my interviewees were likely to turn around and go to another hiking trail that would be less crowded or give up the hiking activity altogether for that day after looking for parking for 20 minutes or more. They were found to be more likely to succeed with their hiking goals and had an overall more positive experience and recollection of those positive hiking experiences when they didn’t have to struggle to find a spot. They start out very motivated, however as soon as they come across the roadblock of having to struggle for parking, suddenly their enthusiasm declines and it’s usually at this point that the frustration sets in.
AFFINITY MAPPING
To analyze information received from user interviews, I created an affinity map. Interviewee responses were categorized into common themes in order to gain insights that would assist in determining the issues that needed to be addressed, while also considering potential features to incorporate throughout the design phase.
THE MAIN INSIGHT
A lack of hike trail parking was cited as a major source of frustration by 100% of interviewees
Based on the trends of the affinity map and the responses from my user interviews, I identified the overwhelming evidence that dealing with parking was very high on a hiker’s list of issues. This became the primary component of my app to keep the user’s needs at the very center of my designs.
ANALYZING COMPETITORS
The competition had NO PARKING aspect
The competitive landscape was investigated to understand how comparable apps solve some of the issues that were discovered. Keeping the above main insight in mind, I analyzed the three most popular apps in this pain point category. I learned that none of them included a way to relieve the stress associated with parking to assist the user in achieving an optimized experience. As a result, this became my opportunity to find a solution.
EMPATHY MAP
To further understand the users and their needs, I created an empathy map to highlight issues at a deeper level.
PERSONA
Who was I designing this product for?
The empathy map helped me develop two user types to see how they would use the product differently and guide my decisions throughout the design process. Heidi represents the casual hiker who likes to go hiking to disconnect, clear her mind, and get away from the hustle and bustle of the city. John represents the social hiker who likes to enjoy the outdoors surrounded by people while getting some exercise in. These two personas were created as different behavior models as I found that a spectrum of users could benefit from a solution.
PROBLEM STATEMENT
Based on the perceived pain gathered from my research…
The majority of hikers referenced the ability to find parking when going on a hike.
How Might We... ?
In using the personas and data revealed in user interviews, I focused on the problem statement to ask myself What is the easiest way to get the user to have a stress-free hiking experience from end-to-end, from the moment that they decide to go hiking until they’re done? And so I focused on three problem statements framed as the questions…
How Might We Questions (HMW)
How might we inform hikers how crowded a hiking trail is at a specific time?
How might we help users plan a hiking activity that enables them to make better use of their time?
How might we relieve the stress hikers feel while looking for a parking spot?
This gave me an even clearer understanding of the insights that I gained through my research. And helped me to focus on the main goals while working on the rest of the design process.
USER STORIES
Defining the Minimal Viable Product (MVP)
To keep track of how users would move throughout the app and keep the user at the center of my designs, I consciously thought about how they were going to use it based on their needs.
Locations
Find the nearest hikes
Occupancy
See a hike trail’s current occupancy
Find the least crowded hike trail
Recommendations
See ratings / reviews about hike trails
View details about recommended hikes
Community Feed
Get recommendations from friends / experts
Check which hikes my friends visit the most
Profile
Know the distance I hiked
Prioritizing the features that the user needs
I then narrowed down three user stories written from the perspective of the end user as end goals that the user can do. I did this to determine the essential features of the minimal viable product (MVP).
Minimal Viable Product (MVP)
As a hiker, I want to be able to find hiking trails near me.
As a hiker, I want to compare the current occupancy of hiking trails.
As a hiker, I want to find hiking trails with easy parking.
TASK FLOWS
USER FLOWS
Moving through the app to get what they need
After establishing a framework for the app, I utilized User Flows to expand on the goals and needs outlined in the user persona. This red route focuses on monitoring occupancy levels.
Compare parking status of hikes nearby
SKETCHES
Approaching the Design
User flows provided the path for me to draw out early ideas for screen layout. I began with some loose sketches to balance out the visual information with text while leaving plenty of room on each screen to maintain clarity and functionality. This helped me organize and get a better picture of how hikers might use this app.
WIREFRAMES
Catering towards 3 main flows
Following some initial guerrilla testing, I created wireframes to modify any navigation issues while offering a more personalized experience in order to map out content and elements that determined the layout of my app.
Create Account / Get Started
Tailor a Trail
Check Least / Most Occupancy
STYLE GUIDE
Keeping it clean and simple
With the app’s foundation in place, I created the brand and style that would provide energy, clarity, and balance to the design. I considered color psychology and as orange symbolizes motivation and energy, I was inspired to make it my primary color, which also represents the brand attributes: Inviting, fresh, positive, enjoyable.
LOGO
T + Check Mark
HIGH FIDELITY SCREENS
Gradient Flat → UI Design
During first revisions of high fidelity stages I:
Removed orange gradient & changed main color to better fit WGAC standards
Removed unnecessary images
Built from white to maintain a clean aesthetic
USABILITY TESTING
3 major improvements in my design
To prepare for prototype testing, prototype screens were created by integrating all of the data and insights from initial research, ideation, and design. After adding interactions and transition animations to create a working prototype, I conducted 2 rounds of usability tests (total of 10 participants) to discover pain points and improve navigation. This led to three major improvements based on participant feedback.
Onboarding
Unique parking status functionality of the app needed to be emphasized more on initial screens.
Users are given an overview on basic functionalities of the app’s key features:
Explore a hike’s occupancy level
Check current parking status
Locate nearest spot to the entrance
1
Parking status button
Users were unsure they could tap on the parking card to see the amount of parking available and be directed to the nearest spot to the entrance.
Hike details card was modified to make parking button more pronounced.
2
Categories filter
Users were bypassing the filter button next to the search box and were going going straight to the different categories.
Increased the size of the button to highlight it.
Labeled button “All filters”.
3
FINAL SCREENS
The final product
DESIGN PRINCIPLES FOR TREK CHECK
1. Efficiency
As an important component of usability, hikers should quickly complete tasks once they have gotten acquainted with the design of the interface. Keeping the clicks to a minimum for a user to find what they need enhances the experience of navigating through the app.
2. Inclusivity
The information presented in the app is so that a spectrum of users could benefit from a solution. Taking into account what individuals think they need and want, the app may be used in a variety of ways by various levels of hikers. Because features are convenient, everyone can use them without too much effort or separation.
3. Simplicity
To efficiently focus on a solution that best addressed the specific problem I was solving for, it was critical to build a product that was free of unnecessary components and bridge the gap between the user's goals and the means to attain those goals.
4. Consistency
To ensure that the user experience stays consistent, the elements of the app navigation, page layouts, and components look and act the same in order to consistently validate a user's beliefs about the user interface, fostering a sense of control, familiarity, and trust.
LESSONS LEARNED
Overall, the main takeaway and moving forward is to always design with intention, which this project showed me the value of... and thinking about every piece of the project and how it would all eventually come together to contribute to the end result. It is critical to begin a project with a deep grasp of the user through research in order to create a relevant and useful app. Constantly iterating throughout the design process, along with usability testing, was vital in ensuring that modifications were made with the user in mind.
NEXT STEPS
There is still room for further improvement to add and create new features that will benefit both users and businesses. Additional screens dedicated to developing functionalities to continue optimizing a stress-free experience:
Hidden perks behind a subscription model
Travel buddy system to Car Pool
Customize Occupancy Criteria ability to receive notifications when count exceeds threshold set in preference settings