E-Comm Re-Design

Making online food customization and ordering, simple and intuitive for users.

Everyone loves Torchy's, but their e-comm site makes ordering food and checking out confusing to users. 

I was part of a team of 6 that had 4 weeks to research and design a simplified and intuitive e-comm food ordering and checkout process for Torchy's, under the pseudo brand, "The Devil Made Me Do It."

My role included:

  • Designing the HiFi responsive prototype

  • Conducting user interviews

  • Developing the check out flow

  • Sketching wireframes

  • Conducting A/B user testing

  • Designing the style guide

  • Testing for accessibility

Our goal was to create a fully customizable, intuitive checkout process, for Torchy's pseudo brand 'The Devil Made Me Do It', a Vegan Taco Food Truck, that gives customers a stress free and easy way to order food online.
 
Understanding the Problem

We Began our Journey on Torchy's Website

In order to get an idea of how we could improve Torchy's website, we analyzed the checkout process and redlined what they were doing well and what could be improved. 

Below are the main points that we felt were important to adjust for the check out process for "The Devil Made Me Do It" website. 

  • Task Efficiency - Keep the customization option, but make it easier to navigate

  • Contrast - Make form smaller and images larger

  • Proximity - All buttons are too small and out of the users ideal viewing area

  • Proximity - Buttons are also too far from the area they are related to

  • Hierarchy is not Clear - Menu should be in the top Navigation

  • Task Efficiency - Add ability to adjust quantity

Navigation should be here

 
Research

Getting to Know the Competition

To begin with, we conducted a Competitor Analysis, which gave us insight into what other plant based restaurants are doing well within their online ordering services and what we can do to make our online ordering process better. We analyzed our findings with a SWOT diagram. 

Survey Says...

We received 108 responses to our online survey which asked about Vegan food habits when eating out and ordering food online. Some highlights from the data we drew from their responses include;

  • The majority of the respondents are female and between the ages 25-40.

  • 65.2% of respondents eat vegan because they care about their impact on the environment.

  • They also try new restaurants based on positive reviews by other vegan's.

We met with our potential users

Each of us interviewed a vegan for a total of 5 interviews. During these interviews, we asked questions about their experience of being vegan as well as questions about ordering food online. 

 

We wanted to put ourselves into Jenny's shoes....

so we Empathized.

Says:

  • "I miss eating the non vegan foods that I used to eat."

  • "Ordering food online is convenient, but it never comes out right."

Does:

  • Uses social media as the primary way of discovering new vegan restaurants.

  • Orders food directly from restaurant.

Feels:

  • Frustrated when eating out at non vegan restaurants.

  • Judged negatively by her vegan lifestyle.

  • Excited to try new vegan restaurants.

Thinks:

  • There is such a stigma associated with being a vegan.

  • Austin is the perfect city for trying out Vegan food truck businesses.

  • Eating out with friends is challenging.

After synthesizing all of the data we collected, we developed the ideal user for "The Devil Made Me Do It", A vegan taco truck eComm site.

Meet Our User

Jenny Love, 30

Vegan for 1 year so far

Eats with 

non-vegans often

Loves Torchy's

Frustrated when ordering food online

Loves Animals & the Environment

When she places her food orders online, they usually get it wrong

Wishes Torchy's had vegan options

Eats vegan to reduce her carbon footprint

Analysis

Jenny's Pains Include:

  • Social Pressure: Eating with groups of Non-Vegans 

  • Restriction: Wants to feel like restaurants have more options &  that she has the freedom to customize her order.

Jenny's Gains Are:

  • Discovery: Loves finding exciting, unique & innovative vegan places. 

  • Comfort: Likes restaurant experiences that meet her diet restrictions in a comforting & inciting way.

Problem Statement

So what's the problem?

And how can we make it better?

Jenny is a young-professional with a plant-based diet that needs a convenient, trustworthy and satisfying option for ordering online.  

 

During our research we discovered that Torchy’s does not offer any vegan options or ways to tailor orders online. We also learned vegans often feel judged and uncomfortable when requesting custom orders to fit their dietary needs.

By creating The Devil Made Me Do It, a vegan Torchy’s spinoff brand, with a fully customizable, intuitive checkout process we give customers with a plant-based diet a safe space to feel confident and at ease about ordering food online.

User Journey

Making the experience better

Jenny discovers that Torchy's has a Vegan food truck called "The Devil Made Me Do It." and the best part is that she can customize and place an order online for pick up!

We wanted to get an idea of what Jenny's experience would be like while using "The Devil Made Me Do It" responsive website, so we mapped out her user Journey.

User Flows

Going with the flow

We created 3 key user flows, based on the stakeholder's requirements.

 

Putting pen to paper

Design

Next, each of us sketched our own wire frames. We reviewed them as a team and combined ideas to create the best possible user experience.

Impactful Improvements

Through wire framing, we felt that the following 3 tasks were important to include for a great user experience.

  • Item Customization Cards

  • Estimated Time Order is Ready

  • Customer Feedback

  • Vegan/Environmental Facts

Designing for the User

The stakeholder requested that the new site have the same fun and "devilish" feel as the original Torchy's website. After reviewing the Trochy's website, I created a style guide utilizing Torchy's color palette, fonts, similar buttons, icons and imagery. 

style guide.jpg

Accessibility

I tested all the color combinations we planned on using for accessibility and all of them passed. I also checked the Torchy's website for alt text on images and a screen reader, however they did not have either. We planned to add both to our site, so that everyone can place an order on The Devil Made Me Do It website.

Preliminary Prototype

Once we were happy with the UI elements and styling, we sketched up the

Hifi prototype. We wanted to make sure that the website was responsive, so we designed the mobile first and then the desk top version.

 
Testing & Analysis

A/B testing is a must

I designed A/B versions of the desktop site and tested both versions, to find out what the users preferred. Check out the A/B testing results below.

  • The Environmental Vegan Facts were more impactful at the end of ordering, then during the ordering process.

“I was paying more attention to my food order than the Vegan Facts.”

-User

  • The consensus was that the Environmental Vegan Fact was more impactful when we added it to the Confirmation Page.

  • Users also preferred to create their account as they were checking out vs before adding items to their cart.

“I don't like to create an account before ordering.”

-User

  • They also felt that there was too much friction when confirming their order. They commented that seeing a confirmation page twice was enough.

“I don't need to see the order again because I already confirmed it twice.”

-User

We also tested for the visual look and feel of the Navigation and Home page design. 

Version A

Version B

 User's hands down, preferred Version A. Their reasons included:

  •  They preferred the centered, clean Title and Menu 

  • Really like the textured background vs the solid background

  • Liked the large CTA button

 
Final Prototype

Final Prototype

Introducing the final prototype of The Devil Made Me Do It.

Order Now to check it out!

Closing Thoughts
 

What we learned

  • Vegan Customers, as well as non vegans, like the option to customize their order.

  • Users appreciate the opportunity to double check their order before placing it.

  • Users can only focus on one task at a time. Too much info at once can get lost.

  • Call to action buttons work well for getting the users' attention.

Contact Me

Linkedin Icon.png
Desktop Version 2.png