Here's Gracie's user flow. She's headed to a 9PM concert at the tennis stadium in Forest Hills, Queens after work. Her office is in Manhattan. Purple boxes indicate areas for opportunity for me as the designer.

User Goals and Problem Statement

For the Gracie persona, the problem is how to enable someone who is overwhelmed and anxious to more easily travel throughout New York City using public transportation.

For the Yasu persona, the problem is how to streamline the commuting process, from the time he identifies his destination to the moment he’s physically walking to it.

Therefore, the user goals are:

How might we make exploring New York City less daunting and more manageable? How might we make taking the subway less anxiety-inducing for those concerned about their safety? How might we simplify the trip planning process? How might we shave time off one’s commute?

Sitemap

An early version of the sitemap. I would later revise this based on speaking with people. For example, I had put in "How fast do you walk" to help people like Yasu more accurately generate trip time estimates but it's so variable (is he carrying something heavy that day? is he wearing formal shoes that slow him down? is the weather bad out?) and adds another step to the process that doesn't absolutely need to be there.

Insights (Testing for Prototype v1)

Major Takeaways:

The screen with the ride’s subway stops is unclear. (Testers voiced confusion.)

Text is too small. (Tester brought the phone close to his face and squinted.)

The Brooklyn map with all the neighborhoods represented is overwhelming. (A task I gave to users was to locate Park Slope. Testers could not immediately locate it.)

To Keep in Mind:

Icons along the bottom are too small. (Voiced)

There was too much copy on each screen during the route planning. (Voiced)

Improvements:

Clarify the screen with the ride’s subway stops.

Increase text size.

Get rid of all maps until the user arrives at the destination.

Shorten copy where possible.

Insights (Testing for Prototype v2)

Major Takeaways:

The screen with the ride’s subway stops is unclear. (When I asked testers what this screen was about they were silent and appeared stumped.)

People naturally interact with maps. (Observed)

Both maps and text are good for exploring the city but in different usages. (Voiced plus my observation)

The fixed icons along the bottom of the app were all pretty straightforward—except for Help. (Voiced)

Testers found the progressive onboarding helpful. (Voiced)

The design is clear and comfortable to see/use. (Voiced)

Improvements:

Clarify the screen with the ride’s subway stops.

Redesign the Help section.

Add nearby places to the map.

Make the tooltips easier to read (on boarding.)

Refine the copy.

Design

My background is designing visual interfaces and branding so I started to design this app as well. I used Apple's San Francisco font, applied color, employed mobile design patterns, and wanted to make this not look so much like a GPS tool. I named the app "Hoodies NYC" because it's based on neighborhoods and it's a nod to my favorite item of clothing, the hooded sweatshirt. It is my go-to comfort clothing and I wanted this app to feel like that comfortable, trusted friend / New York native you'd consult when getting around New York.

Back to first project: IBM E-Commerce | Go to About