.png)
Google Maps
Enabling users to take the scenic route with a feature add-on to the most popular navigation app
Project Date: October 2020
Company: Google
My Role: Research, personas, POV/HMW statements + brainstorming, empathy mapping, sitemap/user flows, sketching, wireframing, prototyping, user testing
Team: Product Manager, Group Crit Peers
Overview
Project Background
Recent studies have shown that due to the pandemic, public transportation ridership has decreased significantly in large urban cities as people have turned to walking and biking as their primary mode of transportation - both activities also doubling as exercise methods due to gyms closing. Cities have adapted by creating pedestrian-only streets and creating extra cycle lanes to encourage social distancing and create more space for this new mode of transportation.
The Challenge
The primary use case of Google Maps is for logistical reasons - how to get from point A to point B in the most efficient way. How might we encourage users of Google Maps to discover and explore more in a world where more and more people are finding ways to get outdoors?
Objectives
Create an add-on feature to Google Maps that enhances the existing Google Maps app experience while adhering to Google's Material Design system to create a seamless experience.
Empathize
Why
Using various research methods to understand and empathize with the user's experience of various mapping / navigational apps / sites in order to identify their goals and frustrations.
How
-
Research Ramp-Up: Secondary Research & Competitive Analyses, Provisional Personas
-
3 Interviews (1 hr per interview)
-
Empathy Map
Competitive Analysis & Provisional Personas
To begin research for Google Maps, it was important to understand the app's direct competitors in order to get a good understanding of their differences and why a user might turn to a competitor to solve problems that Google Maps doesn't solve for them. It was also essential to identify indirect competitors such as Lyft for the user-friendly interface and Citibike integration and Roadtrippers for the map customization and detour/travel features to better understand why these apps appeal to a specific group of users.
I then created provisional personas for the types of users of Google Maps so that I may keep them in mind when conducting user interviews.
.png)
Research Ramp-Up Findings
After identifying the strengths and weaknesses of Google Map's direct and indirect competitors, the below points are what I learned:
What I learned:
-
The more customization capabilities there are, the more popular a mapping app is amongst users - Google Maps & Waze both offer extensive filters and customization in their app
-
Simple is better - simple and clear UI is essential in navigation apps because safety and convenience is the #1 priority when users are always on the go while using the app
-
Offline maps - The limited feature of offline maps for Google Maps is a common frustration for users, so they turn to other apps to supplement their navigation. This is common especially when users lose signal and among those who may not live in an area that Google Maps has a lot of data on.
-
Accommodating Walkers & Bikers - most navigational apps are geared towards drivers (most filters, real-time route updates and customizations are available only for driving), and since more people are walking & biking, popular navigation apps should design for these users.
Interviews
After understanding competitors in the industry, it was time to dig into the habits of users and empathize with them through 1-on-1 interviews, each one lasting up to 1 hour. All users use Google Maps as their primary navigation/map app.
Empathy Map
To summarize my interview findings, I organized notes from my interviews into an empathy map to understand what the user says, thinks, does and feels. My goal for creating a multi-user empathy map was to help create a singular persona for Google Maps during the Define stage (up next).
.png)
Define
Why
To leverage all previous research to define high level goals and identify priorities for the feature add-on.
How
-
User Persona
-
POV/How Might We Statements
-
Feature Roadmap
User Persona
By creating an empathy map, a user persona began to form for the ideal user of this Google Maps feature add-on. This is Sarah, a 25 year old young professional that lives in New York. She's looking for ways to stay active during quarantine and explore her own neighborhood.
"I like to be prepared when I travel and I'm always trying to fit everything into my schedule!"
– Sarah
.png)
POV/HMW Statements
I presented Sarah, my user persona to a group crit and the idea of coming up with POV/HMW statements was a suggestion I decided to take up because it was a way for me to brainstorm quick-fire ideas. I created a total of 4 POV statements and HMW statements to supplement them.
Feature Roadmap
Referring to the HMW/POV Statement document, I prioritized the best solutions in a feature roadmap below, organized by Must-Have, Nice to have, and Surprising and delightful.
Ideate
Why
With my personas and must have features defined, it was time to ideate and visualize how my feature would be integrated into Google Maps.
How
-
Sitemap
-
User Flow
-
Wireframe Sketches
Sitemap & User Flow
Using Whimsical, I created an app map for Google Maps, laying out all the screens that would be relevant to the scenic route feature add-on, and where the feature could be implemented seamlessly. I've used yellow to highlight where the new feature would go.
Using the same tool, I created a user flow for all the actions a user could take to access the feature and its functions (search, save, add a route).
.png)
Sketching Wireframes
Using the Procreate app on my iPad, I began sketching out my wireframes. I referred to my sitemap and user flow to decide on which screens to sketch out, highlighting in green wherever the new feature is added.
Sketched screens:
-
Main page - scenic route exists in a quick search button beneath the search bar, and in a floating action button to the bottom right that triggers a pop-up so users can choose to find routes, go to saved routes, create route, or record a route
-
Explore Page (bottom sheet on main page) - scenic route exists in two different cards, small one on the top row that works similarly to the quick search button, and a larger card under "Featured Lists" that features curated routes by the community
-
List view of nearby scenic routes
-
Curated list of routes
-
Search for directions to a route
-
Route details
-
Saved routes in the Saved tab
-
Add route in the Contribute tab
-
Recommended routes in Updates tab
-
Create a route screen + details form
Digitizing Wireframes
Because the UI and design systems are already spelled out for me with the existing Google Maps app and Google's Material Design, I went straight to transforming my sketches into a high-fidelity wireframe.
Prototype
Why
With the high fidelity wireframes ready to go, the next step was to test my assumptions for the user flows. I worked directly in the Figma file to create a click-through prototype with basic interactions/animations.
How
-
High-fidelity click-through prototype
Test
Why
With my prototype up and running, it was time to validate and test my product and make any necessary revisions.
How
-
Usability Testing
-
Affinity Map
-
Priority Revisions Matrix
Usability Testing
-
Total User Testing Participants: 4
-
Duration: 6 hrs
-
Goal: To test my assumptions of how users would navigate the app and if users would find the features useful
-
# of Tasks: 4
See the four tasks/scenarios outlined below:
-
You have been sitting at your desk for too long while working from home and have been taking walks outside to break up your day. However, you’re running out of ideas of where to go and so you open up Google Maps and use the scenic route feature to take a look at your options. How would you look for some scenic routes?
-
You are browsing around routes and see one for Brooklyn & Manhattan bridge that you’re interested in so you save it for later. Later, you want to access the route you saved. How would you do this?
-
You are out for a stroll and find your walk very pleasant, so you want to record it so you can access it in the future when you want to do the route again. How would you go about recording your route?
-
You’re at home and want to plan a running route around FiDi, how would you add/create a route?
Affinity Map
In order to best organize my notes and identify any patterns in successes and more importantly, concerns, I created an affinity map.
Affinity Map
Some pain points were:
-
The distance usually indicates the distance to the location, so having one singular distance is confusing for a route - users were not sure if it means the distance of the route itself or the distance of the route plus the distance between them and the route
-
Finding the record button was challenging because it is hidden away, and users thought it was more intuitive to click on the Contribute tab to find it when they couldn't easily find it in the main page
-
For some users, it wasn't intuitive to go to the Contribute tab to "add a route" because it wasn't a tab they frequently use. These users thought the option to "add a route" would exist where "recording a route" would be
-
Users mentioned that knowing the distance & time of what they had just recorded, or created would be helpful and informational as they record or create a route
Additional screens to design/prototype:
-
All users wanted to click on "Directions" to see the final step, so designing and prototyping this screen is priority
-
Users were curious as to what "add a note" means when saving a route - they mentioned that it isn't a function they normally feel the need to use, but are more likely to use for routes since it isn't as straightforward as restaurants or clothing stores
Priority Revisions Matrix
The next step was selecting which concerns and suggestions to act on. By organizing the stickies that fell under the "Concerns" and "Suggestions" sections in my Affinity Map in a priority revisions matrix that measured user value against (my) effort to implement, I was able to quickly prioritize which problems to immediately address (high value, low effort), which problems I can tackle next (high value, high effort), and which ones not to focus on at all if they were one-off problems/suggestions with low user value.
Iterate
Why
Based on user testing feedback, improve the usability of my product.
Revisions
See below for major changes I made to my wireframes.
The Problem:
There are two distances to measure, the distance of the route itself and the distance between the user and the route
The Solution:
Added "Distance Away" to differentiate and clarify what the distance measures
The Problem:
It was a bit confusing that pressing record again stops the recording
The Solution:
Changed the record button to a stop button to better differentiate button states
The Problem:
User wants to click on "Directions" and see what happens
The Solution:
Designed & prototyped a new screen for what happens after users tap "Directions"
The Problem:
Users suggested a useful feature to have was to know certain points of interests
The Solution:
Created a distinct pin to represent "Point of interest" and implemented it into the route & step-by-step directions
The Problem:
Users wondered if there was a way to add a stop to an already existing route
The Problem:
Users had trouble finding where to record a route via the homepage - they expected to find it in the Contribute tab
The Problem:
Gestures were unclear here of what to do to draw a line vs move the map with one finger
The Problem:
Users can't see the distance and time when they are recording or creating a route
The Solution:
Added a new screen - under the "more" button on the top right, added the option to duplicate route. This menu also includes the new "Download route" button for those that worry about losing service in a scenario like hiking
The Solution:
When users click on the "add route" button, a new page asks them to make a choice between recording a route and create a route
The Solution:
Edited the copy to add "2 fingers to zoom" to differentiate between 1 finger to draw and 2 to move map
The Solution:
Added a bottom bar that informs users the distance & estimated time it takes to walk
Final Prototype
Last but not least, please enjoy my final prototype!
Keep in mind the 4 tasks as follows as you go through my prototype:
-
Explore scenic routes
-
Save a scenic route (Brooklyn & Manhattan Bridge Loop)
-
Record a route
-
Create a route
Next Steps
Conclusion
Overall, the prototype was a success because I let the research inform what feature to create rather than go into this project with a feature in mind. The end result was a successful product that users find useful and can see themselves using at different capacities. Though I only tested 4 individuals, their responses were diverse and each user were inclined to use one function more than the other. All participants expressed that this feature add-on encourages them to think of Google Maps differently. When they used to rely on it for purely logistical reasons, they now see it as an exploratory application.
"I wish I was the kind of person that takes walks for leisurely purposes and I can see this feature making that an easier habit to start doing."
– Andrew
Future Considerations
Because this project was created in a 2-week sprint, there are a few things I would do differently if I had the time and resources:
-
Interviewing a larger, more diverse group of Google Maps users
-
Conduct user testing with more people
-
Conduct user testing after making revisions to continue iterating and improving the product
This project is a personal exploration of Google Maps and I am not associated with nor have I been compensated by Google to create this project.