Product Designer
Photos.gif

Photos Overhall

Photos Re-think/Overhaul

 

Showcasing Yelp’s Depth of Content

In early 2018, my team and I were tasked with helping users on Yelp see more of Yelp’s uniqueness and depth of content . Over the course of 3 months, we shipped 2 new features and re-designed an existing flow, both leveraging Yelp’s photo content. The team consisted of myself as the product designer, a product manager, and a small dev team.

Goal — Getting users to see more photos

Many businesses on Yelp often showcase hundreds of photos uploaded by users. Yet consumers on Yelp typically only see 6-10 photos per session. Leveraging Yelp’s existing research & data, we know that users who see more photos gain a better understanding and arrive at their destination faster. Additionally, users who view photos retain better.

Issues with the old photos experiences were many. 66% of users end up on the photo lightbox, which is a horizontal swipe interaction. Due to this interaction, we found that people only swipe a few times before existing the flow. Of the 33% of users who see the grid, users see over ten times the amount of photos, but the previews are too small to discern the information they needed. Additionally, users saw different experiences from each photo entry point, leading to confusion as to where to find photos vs previews. There were also UI problems per experience.

Old flow, lots of issues

Old flow, lots of issues

Designing & testing

Having spent time in finding the issues, the design solution was fairly straightforward:

  1. differentiating the entry points by offering different values (the header acts like a branded element, while the 2nd entry point is introduces more usefulness (photos by category, rather than individual thumbnails)

  2. improve the logic of the user flow (consistent navigation)

Areas of exploration

Below on some examples of the types of explorations I created, which involved UI improvements, creating a two column grid (new page), prototype of flows, de-cluttering of the photo lightbox (which resulted in improved usability).

Grids.gif
Biztogrid2.gif
2@2x.png
Lightbox3.gif