Yelp | Footsteps

"A foot is a measurement of distance, the word originating from the distance between a person’s heel and toe. 

Combine feet in different quantities and you get a yard, a mile, a marathon, a journey. The footsteps that make up this journey form a story deserved to be shared, enjoyed, and remembered. 

The stories we create through our feet and movement are ones we all experience, but rarely tell. And, this is the story we hope to tell through the design I helped create: the story of movement, interaction, and moments. 

Thus, Footsteps, the newest feature to we propose to the Yelp ecosystem."

[unex_ce_button id="content_79bg84gel,column_content_3kakmm4y8" button_text_color="#ffffff" button_font="semibold" button_font_size="15px" button_width="auto" button_alignment="center" button_text_spacing="2px" button_bg_color="#cc1406" button_padding="15px 60px 15px 60px" button_border_width="0px" button_border_color="#cc1406" button_border_radius="0px" button_text_hover_color="#cc1406" button_text_spacing_hover="2px" button_bg_hover_color="#ffffff" button_border_hover_color="#cc1406" button_link="https://www.dropbox.com/s/nj59ipid0cn4n96/test.zip?dl=0" button_link_type="url" button_link_target="_blank" has_container="" in_column="1"]DOWNLOAD PROTOTYPE (MAC)[/ce_button]

Yelp: Footsteps

This is a case study my team performed for General Assembly's User Experience Design Immersive. We were tasked with implementing a new feature for Yelp which would add travel functionality to its current offerings. Our solution was Footsteps, a new feature which allowed Yelp users to map their trip throughout the day and create a unified, shareable piece of content that encompassed all the locations they visited that day.

Our design process began with researching the competitive landscape, as well as Yelp's userbase to help us uncover the appropriate design solution. We interviewed casual Yelp users, Yelp Elites, and competitor's users to help inform the design process. We discovered that Yelp users primarily use the product for discovery & documentation. Thus, our solution had to incorporate these key elements of the Yelp product. Footsteps was a way to address the request for trip planning and travel accommodations, while still retaining the Yelp spirit and brand. We collected users by sending out screeners to a large amount of Yelp users, and then filtering them to talk to a diverse group of users with unique needs.

Synthesis & Solution

We learned through research that users want to:

  • plan trips to new, unfamiliar places
  • avoid extensive research and effort
  • discover authentic, local culture
  • document and share their own journeys with like-minded travelers

 

The Footsteps feature built into Yelp provides users a trusted means of discovery and fulfills Yelp’s mission to become the go-to app for itinerary and vacation-planning. Through Footsteps, users can discover and follow user-verified trips (which last anywhere from an afternoon or evening to an entire weekend or longer) and can record / document their own trips, inspired and guided by these suggested routes of fellow Footsteppers.

Interface Design

We were able to synthesize the data and create a design solution informed by the personas we developed from user research. With the solution in mind, we began creating mockups of how this feature might be implemented. What we found was that Yelp currently has a redundancy in its navigation. The Nearby and Search tabs both have the same functionality. For that reason, we decided to replace the Search navigation item with our new Footsteps feature. We also wanted the feature to feel like it was part of the existing Yelp experience. So, we sketched the layout of their existing app to maintain brand and visual integrity.

  • gallery-image
  • gallery-image
  • gallery-image
  • gallery-image
  • gallery-image
  • gallery-image

Usability Testing

Once we had visual mockups for our design solution, it was time to begin usability testing. We found a number of UI errors in our initial designs. In particular, users were unsure how to expand the "read more" function. By implementing a clearer label and associating with an appropriate UI element, we were able to refine the UI to a functional and user-friendly layout.

High-Fidelity Prototyping

For a prototype, we chose to use Principle to design some of the more advanced interactions because of its robust functionality for building multi-screen prototypes with a variety of interaction types. Our prototype allows for swiping between screens and navigating through all of the rich features that Footsteps brings to Yelp. See the video above, or download the prototype (Mac)⟶

Presentation

Our team presented our findings to our cohort. Here, you can find the deck that we used for our presentation. The deck was accompanied by a verbal presentation, and I have lots more information on the overall project if you'd like to see a more detailed analysis. Just email me⟶