cover.jpg

Explore Restaurants in Seattle

 
 

Bon Appétit

Seattle Restaurant Data Visualization

icon.png
 
 
Bon-Appetit.gif
 
 

Overview

My team created an information visualization in Tableau with the Seattle restaurant data. The goal of this interactive webpage is to help Seattle newcomers explore restaurants more engagingly.

My Role: User research, Prototyping, Usability testing, Visual design
Duration: 3 Months
Team: 4 Members (3 designers + 1 data scientist)
Tools: Tableau, Illustrator, Photoshop

 
 
 
 

Design Challenge

Seattle has become the nation’s fastest-growing big city this decade. According to The Seattle Times, Seattle has gained 18.7 percent total newcomer population since 2010. Our team was interested in how newcomers explore new restaurants.


 
roman-kraft-156096-unsplash.jpg

How might we help Seattle newcomers explore restaurants more engagingly?

 

01. Research

We interviewed 3 Seattle newcomers to understand how they go about exploring new restaurants in Seattle. All of them mentioned Yelp, so we asked them to walk us through their restaurant finding process on Yelp app. We decomposed their process into 3 stages based on:

The Visual Information-seeking Manta

  1. Overview

  2. Zoom & filter

  3. Details-on-demand


image6.jpg

Yelp Competitive Analysis

From our interview observations, we found that there were frictions in newcomers restaurant finding process with Yelp. The pain points are around the overview and zoom & filter stages.

steps_resize.png
 

Research Insights

  1. Neighborhood, cuisine category, and restaurant quality are the most important factors to newcomers.

  2. Business hours, address, and price range are detailed information that becomes important after user selects a restaurant.

We want to focus on providing newcomers “overview” and “zoom & filter” features that are missing from Yelp.

 

02. Data Preparation

data profile.jpg

Our Seattle restaurant dataset consisted listings scraped off from Yelp and Google. The large dataset contained roughly 6000 records spread over 41 attributes. From previous research, we learned which information is important to newcomers, and removed irrelevant data. During the data cleaning process, we filtered out irrelevant cities, pre-defined restaurant categories, edited open and close time formats.

 

03. Design

Braiding Method

  • Explored different types of graphs and charts

  • Tested different encoding methods for restaurant category, rating, number of rating, and opening time

designprocess.jpg
 

Paper Prototyping

Through down-selection we narrowed down our concepts and created paper prototypes for testing. Our goal is to find the most effective combination and arrangement. By testing with our classmates, we learned that:

  1. Information architecture (IA) is important. A clear vision IA can help us organize and structure our graphs and charts so viewers can follow our flow.

  2. Keep encoding consistent for all graphs to avoid confusion. For example, users were confused that we used color encoding for both ratings and cuisine categories.

paper prototype.jpg
 

Mid-fidelity Prototyping & Usability Testing

We used the RITE Method (Rapid Iterative Testing and Evaluation) for usability testing with 5 participants, and did quick iterations after each round. All participants found the first section of our design the most engaging, because they could compare the number of a certain type of restaurants across neighborhoods and learn about their location at the same time.

 
 
 

Usability issues we found and fixed:

  1. Refine titles, headers, and labels.

  2. Incorporate the number of rating data to make the rating data more useful and convincing. Participant 2: “When I sort by ratings, I look at the reviews, and the number of reviews validates the rating.”

  3. Rearranging filters & user flow. In Iteration 1, the cuisine filter controls the entire visualization. Therefore, when looking at sections below the first fold, users would need to scroll back and forth to adjust the filter and view results. This prolonged the information seeking process. Hence, we decided to fit filters and all related charts into one screen, so users can get immediate feedback when adjusting the filters.

final process.jpg
 

04. Final Deliverable

<Please refresh this page if Explore Restaurants in Seattle doesn’t show up!>
View in Tableau Public

 

05. Reflection

  • Designers are no copywriters, but from this project I learned that proper labeling is important in guiding users. I hope to explore better use of language, and more effective visual treatments.

  • The size of our dataset and the Tableau features added limitations to the deliverable, but we worked around it by enhancing user’s interactive experience. Although the restaurant data in Tableau is static, I’m interested in finding ways to make our visualization live.

  • In the next version, I would like to incorporate direct links to Yelp in the last stage of user’s restaurant exploration process. Hopefully newcomers can to get enough details and head straight for the food!