top of page

Designing an online takeout ordering system.

THE CHALLENGE

Yang Chow Restaurant is a fixture of classic Chinese-American cuisine in Los Angeles. It's a popular tourist destination for dining in and has been successful for decades.

The restaurant does not currently offer takeout options and they are interested in expanding their business to include this.

Yang Chow believes that an updated website that includes takeout options is important to their business success.

 

Yang Chow Restaurant

storeFront_1.jpg

MY ROLE: UX DESIGNER

SOFTWARE USED

Through research and synthesis I determined the problems diners face when they order food for takeout.

 

With this information I designed an updated website for Yang Chow that will allow them to successfully expand their business into the takeout market.

pShopIcon.jpg
sketchIcon.jpg
invisionLogo.jpg
googleStudio.jpg

RESEARCH

Heuristic Evaluation, C&C Analysis, Surveys, Interviews

SYNTHESIS

Affinity Mapping, Card Sorting, Feature Prioritization, 

Persona Development, Journey Mapping

PROTOTYPING & DEVELOPMENT

Paper Prototyping, Design Iteration, Mid-Fi Wireframing,

Hi-Fi Wireframing, Wire-Flows, Usability Testing, Visual Design, User Flow 

googleStudio.jpg
googleStudio.jpg

LET'S START WITH A LITTLE BACKGROUND

Chinatown classic Yang Chow is a hit with tourists and anyone needing a nostalgia kick. The place does classic Chinese-American dishes with swift, friendly service — including the iconic and addictive slippery shrimp.

homepage.jpg
slipperyShrimp.jpg

yangchow.com

Slippery Shrimp

WHAT THE WEBSITE LOOKS LIKE NOW

HEURISTIC ANALYSIS: What's not working and what areas could be improved?

 CATASTROPHIC 

alert.png

It is currently not possible to order takeout online. The only way to order is calling on the phone.

heuristics_3_a.jpg

SO WHAT'S THE COMPETITION DOING?

DETERMINING BEST PRACTICES

COMPETITIVE AND COMPARITIVE ANALYSIS: LA Chinese restaurants that offer takeout

hero.jpg

Many use photography, especially in the form of a hero carousel.

NOW LET'S SEE WHAT PEOPLE THINK ABOUT ORDERING TAKEOUT

LOOKING AT THE NUMBERS

QUANTITATIVE DATA : A survey of 15 people revealed actionable insights 

survey_1.jpg
survey_1.jpg

People have concerns about their orders but for various reasons

SYNTHESISING THE DATA

MEET DAVID DOUBTER

PERSONA: A user profile that aligns with my research results

DAVID DOUBTER

Graphic Designer

"I expect everything to go wrong"

doubter.jpg

Age: 27

Status: Single

 

Overview


David has had a lot of restaurant takeout deliveries arrive with something wrong. Wether it’s the wrong item, a missing item, or even his own mistakes, he has been burned so many times that he is very picky about what restaurants he will order from.

Behavior and Habits

 

  • Foodie and likes to try new things

  • Spends time at friend’s houses all over the city

  • Orders takeout food 2-3 times per week

  • Has 2-3 drinks with friends before dinner

  • Paranoid he will mess up the food order

Goals and Needs

 

  • Only orders food online, will not use phone

  • Wants to know as many details about the food as possible

  • Relies heavily on social media and reviews to choose a restaurant

  • Ordering process needs to be simple enough to do it while slightly tipsy

A JOURNEY INTO FRUSTRATION

JOURNEY MAP: Following David Doubter's path as he orders takeout from Yang Chow

journeyMap.jpg

THE PROBLEM IS REVEALED

People who order takeout food from restaurants are concerned that their order will not meet their expectations.

 

How might we help people order takeout food with confidence?

 DESIGN THINKING >>

WHY

HOW

WHAT

Based on Quantitive and Qualitative data analysis we will include these features:

 

  • Online ordering

  • Photos of each menu item

  • Written descriptions

  • Ratings/reviews

  • Updated design

People are concerned that their order won’t meet their expectations

Give users the features they need to order with confidence. 

STEPPING BACK TO MOVE FORWARD - USING AGILE 

SURVEY #2: A group whiteboarding exercise revealed there are many ways to structure a restaurant's menu. I needed to identify the most useful way to define my navigation schema.

survey2.jpg
survey2.jpg
survey2.jpg
survey2.jpg

DETERMINING THE NAVIGATION

NAVIGATION SCHEMA: Armed with quantitative data that was clear, I was able to create a schema for navigating the restaurant's menu.

navSchema.png

CONDUCTING A MORE FOCUSED C&C

WHO DOES IT BEST?

C&C #2: I wanted to look beyond immediate competitors and see what the industry leading takeout ordering sites do when it comes to features

grubHub.jpg

Persistant order ticket

THE MAP TO SUCCESS

SITE MAP: Now that navigation schema and site features are clear, I am able to create a site map of the flow to order food online

siteMap_1.jpg
mapKey2.jpg

MAKING SURE IT WORKS 

WIREFRAMING AND USABILITY TESTING: A key learning was that my sketching skills are so poor that I had to move to mid-fi wires to conduct usability testing. Once I did this, the testing confirmed that my prototype was easy to navigate and accomplish a goal.

paperPrototype_1.jpg
midFiPrototype.jpg

GREAT, NOW WHAT DOES IT LOOK LIKE?

ITS GOTTA HAVE STYLE

Yang Chow was around during the golden age of LA glamour when Chinese restaurant menus had a really graphic and memorable style.

I looked to this era for inspiration.

menus.jpg
signage.jpg

The signage of the original Yang Chow restaurant is bold and iconic. I'd like to incorporate this element into the website design too.

ALL SYSTEMS GO! LET'S TRY THIS AGAIN

Research
Synthesis
Design
Prototype
bottom of page