S'MAC

MY ROLE

TIMELINE

DELIVERABLES

Hi-Fidelity Prototype, Presentation

Two Weeks

UX, UI Designer

PROJECT OVERVIEW

 

THE COMPANY

S'MAC is a macaroni and cheese fast casual restaurant. Their creative dishes allow both adults and kids to indulge in the American comfort food without the grocery store bought boxes. The store front in Manhattan's East Village is decorated with orange and S'MAC's iconic skillet logo. 

PROJECT SCOPE

With my UX/UI team of three, we set out to redesign S'MAC's website. Our goal was to keep the fun brand of the restaurant while creating a more user-friendly responsive web experience. Throughout the design process, we closely collaborated with our web developer counterparts in order to ensure the build was feasible. 

RESEARCH

 

RESTAURANT VISIT

In order to ensure we understood the S'MAC user, my design team and I visited the store, and to our surprise, it was a tech heavy ordering experience. Customers order on large tablets at the counter, clicking through the ordering process and taking a number to their table. Servers then deliver the mac and cheese when it's ready, and take the table number. Customers clear their own dishes when they are ready to leave. 

CURRENT SITE

S'MAC's website is designed mostly for online ordering and information about the restaurant. However, the call-to-actions are labeled "Home," "What," "Where," and "Who," which hardly help the user navigate to an order page or understand all that S'MAC has to offer. In our designs, we wanted to keep the fun feel of the site and brand while helping S'MAC increase sales through online ordering, restaurant discoverability, and catering. 

DESIGN

 
Current Site_3x.png

CURRENT SITE

Main navigation has four, nondescript options

Main Nav_3x.png

REDESIGN

Main navigation has five clear call to actions

Current Site_3x.png

CURRENT SITE

Menu is long and scrollable, does not entice costumers to order

Menu_3x.png

REDESIGN

Menu has images of the food, favorite for later icons (if logged in) and distinct "Add To Cart" call-to-actions. 

BYO Current_3x.png

CURRENT SITE

Create your own mac and cheese menu is cluttered and difficult to read. There are no selection options, confusing the user about whether or not they can order this option. 

CYO_3x.png

REDESIGN

Create your own has clear steps in columns with radio buttons to select toppings. There is an "Add to Cart" button allowing the user to order their creation.

CURRENT SITE

A_3x.png

There is no login function on the site, preventing users from creating accounts, saving menu favorites, and ordering quickly. 

Re-design login_3x.png

REDESIGN

Sign up page allowing users to create an account. In this account the user has ease of ordering and S'MAC can reach the users and contact them. 

PROTOTYPES

Desktop HD Copy_3x.png
Desktop HD Copy 2_3x.png