Mobile App
5 min read

MapGuard

Published on
16 Jul
2024
More Case Studies
Connect with me

Project Overview

Traveling has never been easier than it is right now, but how can we improve feeling safe when walking alone? In response to the need for increased personal safety during solo travel, MapGuard, a mobile app, enhances the urban walking experience. It offers various options for viewing walking directions and incorporates safety features to ensure a secure journey from point A to point B.

My Role

I’m the captain of the ship, and I manage every aspect of the product myself. These  roles included:

  • User Research: getting feedback is incredibly important; I interviewed five individuals.
  • UX/UI Designer: think, sketch, design, and define what each experience/experiment will be.
  • Usability Testing: schedule interviews, meet with potential users, and learn how to improve the product per their feedback.
  • Writer: accurately conveys my work and insights to the design community.
  • Prototyper: built the prototypes in Figma and presented them to the users with Figma Prototype.

Tools

The Problem

In today's fast-paced world, safety is a growing concern. Many have fallen victim to crimes, leading to a desire for enhanced security through location sharing. Navigating directions and updating friends on one's whereabouts can be overwhelming in unfamiliar places.

The Solution

I aimed to enhance personal safety during walks by designing MapGuard, an app offering diverse modes for viewing directions (visual, auditory, textual), location sharing with one's network, and an SOS feature for emergency alerts to authorities and the user's selected network of friends and family.

User Research

After choosing a problem space, I prioritized a comprehensive understanding of the problem and the need to create solutions. I started with secondary research involving scholarly journals, government sites, and news articles, I discovered that individuals generally feel safest when sharing their location while walking alone. Furthermore, my exploration unveiled that over 900,000 Americans rely on navigation apps monthly.    I conducted surveys and nineteen individuals complete the Google Forms. One of the questions asked was “What self-defense methods do you use to feel protected when you feel uneasy walking alone?” the responses showed most users share their location or make a phone call when walking alone.

User Interviews

The primary goal of user interviews was to uncover opportunities for enhancing individuals' sense of safety while walking to their destination. From the interviews, a key finding was that five out of six participants shared their location daily with one to eleven individuals. When asked about the reasons, all interviewees expressed that it provided a sense of security, knowing someone would be aware of their exact location in case of an emergency.

“I don’t feel safe when walking alone...”

User Goals

To better understand the issue, I put myself in the perspectives and experiences of the users. Utilizing key insights, I identified commonalities among interviewees through affinity maps. Two notable findings emerged: all participants relied on their phones for mapping directions, and each user used a navigation app of their choice either one a week or daily, ranging from once to several times a day.

Next, I engaged in an empathy map exercise to further understand the connections between the trends identified in the affinity maps. This activity revealed that:

  1. All users I spoke with feel safer sharing their location with a friend.
  2. All users have relied on a navigation app at least once a week or as often as every day.

User Personas

How Might We Resolve The Problem?

A thorough understanding of my users helped me pinpoint problem statements through "How Might We…" (HMW) questions. By reframing problems as questions starting with "How Might We," I could reshape my perspective on the issues and, consequently, my approach to solving them."

How can we create a user-friendly map with daily updates on potential concerning areas without alarming the user? How might we provide options in the app to help users feel safe when walking alone? How might we help the user have easy-to-follow directions to walk from point A to point B?

Brainstorming Solutions

For my ideation process, I sketched out possible solutions and what I felt the app could look like. I tried to focus on my "How Might We…" questions to help me develop solid solutions for the design. One HMW concern was making an SOS feature prominent but not intimidating or overwhelming for the user. This was a concern I repeatedly had to work through throughout the ideation process.

Crafting the Framework

I created a sitemap to better understand the app's organization; this helped me identify screens for my Minimum Viable Product (MVP) and find the red routes for the design of MapGuard. This enabled me to map critical user flows within the comprehensive product context, not just the MVP, and helped prioritize essential screens for the initial prototype.

Competitive Analysis

I compared similar products in the market for insights into their strengths and weaknesses; I conducted a heuristic analysis of three competitors—Google Maps, Apple Maps, and Waze—based on Jakob Nielsen's usability heuristics: User Control and Freedom, Consistency and Standards, and Recognition Rather than Recall. All three companies performed well overall.

I drew inspiration for my UX by observing that users preferred receiving directions gradually throughout the route to their selected destination. It is helpful that all the navigation apps I reviewed offer the option to view and read directions simultaneously. The users felt less overwhelmed when information was presented gradually.

From Concept to Digital Canvas

My initial wireframes had five key flows:

  • Onboarding.
  • The user will search for a favored local Starbucks (closest to the user).
  • Users will decide whether to share the location with their 'network' (friends and family), following walking directions to the selected Starbucks.
  • Successfully navigating to the destination.
  • Lastly, the user will tap the SOS icon in case of an emergency.

Drawing inspiration from Google Maps and Apple Maps, MapGuard's UI patterns prioritize user-friendliness in travel directions through recognizable and brand-centric design. Later, I developed wireframes to illustrate the app's navigation, demonstrating the changes in UI elements as users interact with them.

Creating The Brand

I established a distinct visual style and brand voice to bring my app to life. Drawing inspiration from renowned design systems, I aligned the product's name, personality, and mission based on personas and user research.

Combining navigation and safety features into a user-friendly product took time, but once the style guide was finalized, the product was Previously named “Guarded Maps” but was then renamed to MapGuard. The simple name conveys a visual of a destination pin and shield to emphasize safety during travel from point A to point B.

Style Guide


The High-Fidelity Design Process

This project's most satisfying yet challenging part was integrating MapGuard's brand with the wireframes. After weeks of design work, incorporating mentor feedback, and refining the design further, the high-fidelity mockups were finalized.

Low-Fi Design

These are a few of my Low-Fi designs to prepare for my High-Fidelity designs and usability testing.

The High-Fidelity Usability Testing

I crafted a Figma prototype and devised a usability test plan. Users were tasked with onboarding, searching for a local Starbucks, deciding on location sharing, navigating to the Starbucks, and tapping the SOS icon. Tasks were structured in the app's natural flow to encourage participants to be guided through the flow of the app organically.

The initial five moderated usability tests revealed four key concerns:

  1. Concern with the size and color of the SOS icon.
  2. The "end walk" button should be more prominent on Point of View Screens (POV) screens.
  3. Make the End walk button at the top under "You Arrived, Shannon!"
  4. In one of the create account steps, a user wanted an "always allow" option when choosing if they would share their location with MapGuard.

Other than the four suggestions, All the individuals mentioned that the app made sense and was easy to follow.

Refinements & Final Outcomes

I primarily adjusted element sizes reorganized headers, and resized the SOS icon to tackle the four key usability issues. Additionally, I incorporated accurate street names for a more realistic Chicago map. In the last round of usability testing, fewer users took unintentional detours, and those who did quickly recovered—a positive shift from the previous tests. Locating the SOS icon was no longer a challenge, and overall, users liked the aesthetic and enhanced usability after design adjustments.

Final Hi-Fi Design

Insights

One additional iteration of the MapGuard prototype will address potential usability oversights and aesthetic concerns before the final product is complete. Future work involves expanding on various aspects of the app, such as refining screens and the "SOS" feature used in emergencies. I learned how imperative it is for users to feel safe when walking alone and how much users rely on technology and their network to feel safe. Hopefully, MapGuard can help make a difference.

In conclusion, MapGuard aims to enhance user safety during travel from point A to point B. Designing this product has been a rewarding experience.