Yelp Select Feature

Information and ratings for the specific experience you have in mind

Project Scope

Platform

Roles

Project Partners

Timeline

Design Tools

Design a new product feature for the Yelp app*
Mobile app on iOS
UX Researcher
UX Designer
UI Designer
Content Strategist
Yelp Product Manager** Yelp Product Designer**
3 weeks
Figma
Trello
Google Workspace

Project Scope

Design a new product feature for the Yelp app*

Project Scope

Mobile app on iOS

Roles

UX Researcher
UX Designer
UI Designer
Content Strategist

Project Partners

Yelp Product Manager**
Yelp Product Designer**

Timeline

3 weeks

Design Tools

Figma
Trello
Google Workspace

* conceptual project for Yelp
** to emulate a collaborative product development environment, I consulted with various Yelp PMs and designers to incorporate Yelp’s design strategies, user research, and business constraints into the project

What is the Yelp Select feature?

Yelp Select is a new feature to Yelp that curates and segments business ratings, reviews, photos, and other information based on a user's planned experience.

Users turn to Yelp to research for a specific experience they already have in mind. Instead of sorting through general business information that are often not applicable, users can use the Yelp Select feature to receive curated ratings, reviews, and business information to help make decisions.

The Yelp Select feature is fully integrated within Yelp's existing business page, serving as an extension of a user experience users have come to know and appreciate.

Background

Optimizing Yelp's information and ratings to be more relevant for users

With over 220 million business reviews worldwide, people depend on Yelp for reliable information to help make decisions. Yelp's mission is to "connect people with great local businesses", serving as  a single-stop for users to discover, connect, and transact with local businesses of all sizes.

As an information exchange platform, Yelp uses a three-sided marketplace of Reviewers, Consumers, and Businesses to create a repository of business information to help users streamline research and ultimately, make decisions. However, if a user wants to research information specific to a planned experience (such as lunch, or outdoor dining, or large group celebrations), the onus is on the user to hunt down the relevant information in different sections across different pages of the app.  

The fragmentation of relevant information not only increases cognitive load, but also dissipates the trust that Yelp has worked hard to earn. Unfortunately, the current business page combine general ratings and review information that are often not relevant to the experience a user is researching for.

Yelp has saved users countless hours of independent research, but falls short when it comes to categorizing that information meaningfully, so why not explore a new feature that takes that one step further?

Opportunity

Leveraging UX design to capitalize on the users' need to buy immediately

When users visit Yelp, they do so with the intent to buy immediately, and have a specific experience in mind when they research a business on the app. Whether it is for a specific lunch experience, a special dinner event, or simply the best place to order pick-up for, the majority of users know what category of experience they want before they even open the app.  The notion of experience specific research created an opportunity for me to design an enriched experience that allows Yelp to curate select information users are researching for in a digestible and intuitive way.

Infographic based on a survey conducted by SurveyMonkey for Yelp in June 2019
“When people discover a business on Yelp, they’re ready to buy… People on Yelp make these purchases in a timely manner, too: 51% of users transact with the business they find within a day, and 90% transact within a week”

Empathize

Research shows that users want curated information to help decide where to go for a specific experience

To better grasp how Yelp users currently navigate for relevant information within the app, I conducted interviews with five existing Yelp users.

My key research goals were to empathize with the users’ priorities while making decisions on the app and to validate the assumption that users are looking for an enriched experience on how relevant and reliable information is presented. Over the course of my research, three key patterns of common user mental modals were uncovered.

Research Insight 1:
Users desire curated information

Two key reasons why users turn to Yelp to research into a business is 1) trust and 2) convenience. Curated content allows users to access the most relevant information, in a digestible and discoverable way.  Research shows that an average Yelp user only spends 3.42 minutes on the site per day, a daily session includes the end-to-end experience from search to decision making, as such, curation becomes key in helping users accomplish goals within limited time constraints.

Research Insight 2:
Users turn to Yelp with a specific experience already in mind

Users arrive on Yelp with a specific experience in mind and are ready to act on it after some research and validation. This insight further validated my earlier assumption that users know the kind of experience they want, and visit Yelp with the intent to buy immediately.

Research Insight 3:
Users have common needs in decision making

Users’ prioritization and navigation behavior differ in the decision making process, but the base requirements are the same. Majority of users feel that ratings, photos, menus, and review information are vital to their decision making. Elevating that information’s accessibility is critical in meeting existing user expectations.

User Persona and Empathy Map

To distill the research further, a primary persona emerged to synthesize the user patterns into actionable insights. For a consumer product like Yelp, it was important to have a persona that embodies the ethos of Yelp's primary user group.

An empathy map further highlighted the persona’s mental model and aspirations. My primary persona, Jessica, became the subject of my designs, which allowed me to better empathize with users' needs, experiences, behaviors and goals in a more relatable way.

Customer Journey Map

To better visualize Jessica’s engagement with Yelp over the entire user experience journey, I developed a Customer Journey Map that illustrates her actions and emotions while completing tasks in given scenario.

Customer Journey Map

Define

A specific problem that targets specificity

In the empathize phase, my research helped me get to know my users and some of their shared problems while navigating Yelp. The goals and aspirations I distilled from the empathy map gives way to most impactful problem worth addressing with this feature add.

Problem: Finding business information related to a specific experience can be cumbersome

Hypothesis: Users are looking for a curated experience where information related to the experience they are looking to have is presented clearly and centrally

To better ideate for this hypothetical solution, I keyed in on three design principles that I followed throughout the feature design.

  1. Discoverable: Information should be easily and intuitively discoverable
  2. Curated: Business information should be curated based on the experience the user is planning to have.
  3. Reliable: Users can rely that information is comprehensive and trustworthy

How Might We?

Having established these three principles and equipped with an understand of the needs from the user persona, I framed a few How Might We (HMW) guiding questions to structure potential solutions.

  1. How might we categorize relevant information specific to an experience users are looking for?
  2. How might we reduce user frustration by improving the relevance of the results users get when they search for specific experiences?
  3. How might we provide better context to photos, reviews, and ratings based on a planned experience?

Features vs Filters

When I began brainstorming potential solutions for the Yelp Select feature design, one question that repeatedly surfaced was “does the end justify the means?”. In other words, new features are expensive to build, how can my design solution justify the costs from a cheaper alternative? In this case, will adding more filters solve the same user problems?

Filters don’t curate information by experience comprehensively

The Yelp Select feature does

Filters don’t assist the user in discovering information on specific experiences without some prior understanding on what to look for

The Yelp Select feature does

Filters do rely on the user to make the correct selections to get the correct results

The Yelp Select feature doesn't

Throughout the design process, this "filters vs feature" question was in the back of my mind at all times. As I brainstormed to create possible solutions for this feature design, this comparison helped define the scope of the design project and reaffirmed the rationale behind building a new user-centric feature over adding more filters.

Ideate

Strategize and curate content based on how the user prioritizes information

To brainstorm the content strategies towards solving my problem, I first organized my research based on how users categorize specific experiences and then created a user flow to layout the proposed infrastructure of the Yelp Select feature design.

Site Map

Sitemap of Yelp with integration of the Yelp Select feature

What is a "specific experience"?

A specific experience can imply different things to different users. Ideating based on how a user categorize specific experiences was important as I drew up possible solutions.

This led to some questions during my exploration: How do I ensure that the feature’s categorization of experiences matches that of the users’ mental model? And what if a user wants curated information across multiple categories?  Perhaps an outdoor lunch?  Or a group dinner celebration? Or an intimate night out? 

During my user research, I inquired my participants on what are common experiences they typically would search for on Yelp, in the order of frequency, the top responses were:

  1. Meal type: breakfast / lunch / dinner
  2. Dining Environment: indoor / outdoor dining; takeout / delivery
  3. Group size: large group / small group dining

Seeing that the meal type was by far the most obvious and broadest categorization, it was important for me to develop categorization hierarchy with that in mind. Broader categories with a higher number of reviews will give ratings and review information more meaning. In other words, because more reviewers would have experienced lunch compared to outdoor dining, more reviews will be tagged to lunch compared outdoor dining. This prioritization guided me through in determining that the primary categorization should correspond to meal type and the secondary categorization corresponding to the dining environment and group size.

Note: In this project, I have used a specific example to demonstrate how this feature can positively impact users looking to research restaurants for an outdoor lunch experience, but there are many other opportunities to scale this feature to cover other use cases (some of which I will touch on at the end of this case study).

Yelp Select User Flow

From the hierarchy established from the prior categorization step, I used outdoor lunch as the scenario premise of my user flow diagram. The user flow includes a new entry point to the Yelp Select feature via a Lunch Subpage that directs Jessica to information, ratings, and reviews for the specific lunch experience she is looking for.

How about the reviewer side?

To create this new user flow and implement the categorization of information by experience, it was critical to also address the flow of users who post reviews. Approximately 1.9% of Yelp users post reviews, these “Reviewers” effectively support the usage of the remaining 98.1% of Yelp users who acts as “Consumers”.  To create a complete ecosystem that tags reviews from Reviewers to specific experiences, I had to also redesign the existing Yelp review user interface. The redesigned UI includes a new form section to allow Reviewers to indicate what corresponding categories they are making a review on through a series of radio button selections.

Note: This redesign of the Yelp review UI represents the MVP design as I wanted to leverage as much of Yelp's existing UI to solve the review categorization problem. However, if I had more time to redesign this part of the flow, I would consider adding additional questions and prompts on the form to better guide the Reviewer through the review process.

Prototype

Crafting a design solution that nests within an existing brand and design system

Before prototyping for the feature design, I wanted to reflect back to my formative research, specifically the interviews with Yelp PMs and designers, to re-establish the design principles and usability heuristics that Yelp employs in their designs.

The key heuristic principles that the new feature must follow include:

  1. Utility: the feature must be useful towards meeting user needs
  2. Usability: the feature must be functional and error-free
  3. Desirability: the feature must include new screens that are pleasing to the user based on the look and feel
  4. Brand Experience: the feature must be in alignment with existing Yelp brand

Lo-Fi Wireframes

To iterate on design solutions rapidly, the initial wireframes were done in low fidelity. This level of fidelity helped me visualize the blueprint of the screens with a focus on taxonomy and choreography.

UI Kit

Designing a feature to an existing app meant creating new elements within Yelp's existing design system.  To emulate the design choices in Yelp’s style, I created an UI Kit that documents the new elements to be incorporated into the Yelp Select feature, while utilizing similar styles in color, navigation, and typographic to maintain a level of consistency and standard to the Yelp brand.

Hi-Fi Wireframes

Applying the components from the UI kit, I created high fidelity versions of the wireframes, and integrated the new UI elements I designed into the existing catalogue of shared patterns within Yelp's existing style guide. The hi-fi wireframes were then transposed into a working prototype to test within the following phase.

Yelp Select Hi-Fi Wireframes

Test

Iterating designs to better match Yelp Select with user expectations

To gather feedback on the initial prototypes, I conducted moderated usability tests over Zoom with five existing Yelp users. The objective of these tests is to determine if users find the new Yelp Select feature discoverable and to assess whether the users can accomplish the tasks with ease and confidence. Insights, slips/errors, or pain points were documented along the way.

Affinity Map

Using an affinity map, I summarized the test transcripts into digital post-its and clustered the feedback into categories.  This process allowed me to transpose the qualitative feedback from the usability tests into quantitative data that are quantifiable and actionable.

Five of the top takeaways from usability testing

  1. 5 of 5 users felt the lunch subpage is a useful addition and will use that option when they are searching for a specific experience
  2. 4 of 5 users thought it was difficult to differentiate between the navigation of the general business page and the lunch subpage
  3. 4 of 5 users were interested in reading the user reviews specific to lunch
  4. 4 of 5 users expected to see lunch menus, lunch dishes, and lunch hours when they click on the “Lunch Button”
  5. 3 of 5 users thought the review filter function was helpful and intend to use

Takeaways #1, #3, and #5 were clear wins, these results affirmed that users respond to the new Yelp Select feature positively and intend to use it when searching for experience specific information on Yelp. Takeaways #2 and #4 required further exploration and iteration.

Design Iterations

#2: Page differentiation is key to the feature launch and helps orient the user

To address the feedback received from the usability test concerning the need to better differentiate between the general business page and lunch page, I iterated on a number of possible alternative solutions on the information architecture and feature UI. These changes included the removal of unnecessary elements on the lunch page that may not be specific to lunch and also renaming the subpage header to increase the contrast between pages. For a feature launch to be successful, it is vital for users to first discover the new feature.

#4: Aligning terminology with user's expectation is an iterative process

During the usability testing, I asked the users what they would expect to see happen when they click on the “Lunch Button” on the business page.

When asked, many of users stated that they expect to see information on the restaurant’s lunch hours, lunch menu and lunch dishes.  With this insight in mind, I changed the information architecture of the lunch page to present what the users expect to see in a more discoverable way.

Takeaways

From MVP to Grand Vision

The MVP design in the context of lunch information is only one example of the types of problems the Yelp Select feature can help solve.  In the development of an MVP for this feature, it was important to prioritize the list of use cases for the Yelp Select feature.  Based on my research, users prioritize meal type as the primary categorization in their mental model, hence the MVP was built around lunch based on that key insight. 

The grand vision for the Yelp Select feature is to expand on this content strategy to help users discover relevant information in a digestible way across many other types of experiences. Other relevant user flows can include indoor vs outdoor dining, takeout vs curbside pickup, food rating vs service vs ambiance, and others. From that point, there are also opportunities for Yelp to leverage that categorized data to make restaurant recommendations based on the type of experience, comparison of various restaurants offering similar experiences, etc.

Final thoughts and reflections

The project started out as an exploration on how to alleviate user frustrations from having to sort through massive amounts of information to a business, in hopes to discover a subset of data relevant to the specific experience they want.

As I interviewed users, it was evident that users have different prioritizations and value systems when conducting research. This discovery allowed me to continuously iterate on my information architecture, restructuring the feature page to hierarchize the information that users expect to see.

Designing within the current Yelp style guide also posed its own challenges, requiring me to first empathize with Yelp's existing designs and make sure every new or redesigned UI element conforms to the Yelp brand. This required great attention to detail, especially with a design system that is as robust as Yelp's.

Working with actual Yelp PMs and Product Designers throughout the project was critical as it allowed me to immerse myself into the product team quickly, implementing design and business constraints around this project. This project came to life with more and more of these stakeholder and SME discussions.

With more time on the project, I would like to explore additional applications of the feature and pursue other ways to integrate new entry points into Yelp Select.