gmaps-portfolio2

Client: Google
My Role: UX/UI Design
Date: 2021
This is a personal project

Overview

I led the design of creating a new feature for the Google Maps mobile app. The pandemic became a host for unprecedented challenges within society. This has changed people‚Äôs way of living, socializing, and moving about the world. 

The challenge was for this project was to optimize the way people discover and explore their surroundings and improve urban livability. The goal of the project was to create a scenic route feature that Integrates seamlessly with the rest of the app.

The Process

1. Discover

Competitive Analysis
Survey

2. Interpret

Persona

3. Ideate

IA
Sitemap

User flow
Wireframes
UI

4. Test

Prototype
Usability Testing
Affinity Map
Refine

 

1. Discover

Gathering the data

gmaps-ca-1

Competitive Analysis
I began by researching other navigational apps to get a sense of the competitive landscape.

Survey
I used Typeform as a tool for conducting a survey to provide insight into problems and develop ideas. A total of 22 participants completed the survey. 
 

Competitive analysis

Research Findings

Key Takeaways:

Reviews and photos
Trails supplemented with reviews and photos affect people's decisions in choosing a route. 

Time and distance
Participants will choose a route based on the time they have, so distance (shorter vs longer) is a determining factor for prioritizing a route.

Alternative Options
Participants gravitate towards routes that suggest more scenic (nature, landmarks, local shops) and quieter spaces.

Customization
Navigation apps have cars in mind and don't always accommodate pedestrians. Customizable route capabilities improve route options for users.

2. Interpret

I interpreted the data from user insights to create a persona.

Jill has the mindset of exploring on foot gives her a sense of discovery and mindfulness. She likes to have the functionality of searching, building or saving a scenic route.

gmaps-persona-v2

Persona

3. Ideate

Next, I took what I gathered from discovery and user insights and synthesized it into the app architecture. The sitemap reflects the current information architecture of Google Maps with the new add-on feature integrated into relevant areas visualized in grey.

The different user flows illustrate how a user can take to achieve the task of accessing the scenic route feature.

gmaps-portfolio7

Sitemap
 

gmaps-portfolio8

User flow

Design Decisions

gmaps-portfolio

Sketches

Once I had my IA established, I constructed sketches and wireframes where I laid out the new design features based on top priority user goals. 

The new add on features include:

Choose a pre-built route
Explore and choose from a selection of built in scenic routes in your area.

Build your own route
Have more customization and be able to filter through what you want to include in your route. 

gmaps-portfolio2

Low fidelity wireframes

gmaps-portfolio3

Visual design system

I adhered to Google's current style guide when I built my high-fidelity wireframes. 

gmaps-portfolio4

High fidelity mockup

4. Test

gmaps-portfolio12

Affinity map

Test Objectives
I created a high fidelity prototype to conduct usability testing with 4 individuals to recognize any early pitfalls and to validate our thinking.

The 3 main tasks flow were to find a route, build a route and save a route later to access later.

An affinity map was then created to set out the priority revisions. 

Iterations

Findings

1. Interactive map needs more details
Users overlooked the interactive map option as it did not have any labels of the neighborhoods. Labels were added to show that neighborhoods can be selected.

2. Create specific categories
Explore nearby section had vague titles before. By making it more category-specific, it makes for a more diverse range of routes to choose from.

3. Filter options
Originally filters for building a route included difficulty level, ratings, distance, interactive map. Difficulty level and ratings were omitted since they were not necessary for users. 

Learnings

Talking to users helped me make incremental improvements and recognizing pitfalls early. Overall the add-on feature is described as intuitive, easy to use, and familiar. All participants completed each task with minimal frustrations and felt encouraged to use this feature for exploration.