Project

Burgerfi is a restaurant dedicated to serving their customers all-natural gourmet burgers. They use only the top 1% of natural Angus beef from ranches who pledge to keep their products free of hormones, steroids, and antibiotics. They have an excellent product, and now they want to bring their restaurant’s experience to their customer’s mobile devices. The goal of the project was to create an app for Burgerfi’s customers to browse the menu and order a meal from their favorite restaurant.

Competitive Analysis

Multiple restaurant apps served as inspiration. Restaurant and food delivery apps such as Wawa, Dunkin’, Pizza Hut all had something to offer. The top three apps was Chipotle, Panera, and Starbucks. Chipotle’s menu was clean and simple, Panera’s app provided an example of intuitive design, and Starbucks’ ability to allow users to easily customize their orders was a few of the elements of a successful restaurant app.

Style

Wanting to keep with Burgerfi’s style, the green was used to highlight elements. Soft pink complemented the bright green, and the black, gray, and white were neutral colors.

The type was Brandon Grotesque; It is a bold type. It commands attention and has a  modern appeal. Titles were capitalized, while paragraphs were sentence cased.

Sketches

My process involved sketching out some rough ideas for the upcoming screens. I wanted to incorporate images of Burgerfi’s burgers, and let the product speak for itself because every item looked so delicious.

Final Designs

Loading Page

Burgerfi's logo appears as the page loads.

Pick Up or Delivery

Burgerfi can place campaigns at the top of the menu button, and users will decide if they wish to pick up or deliver their meal.

First Page

Users are greeted with Burgerfi's specials, and the item’s description. A menu sits at the bottom, allowing users to click on items with their thumbs.

Category Menu

Burgerfi's menu consists of burgers, vegan and vegetarian options, kid's meals, and so much more.

Burger Menu

When selecting a category from the menu, the items under that category are revealed along with the name and price under the item’s photo.

Item Description

Allowing the product to sell itself through imagery, a large photo is placed at the top. Under the photo is a description of the burger, a visual list of the ingredients, and a customize option, or users can add the item to their cart using the 'add to order' button.

Customize

Users have an opportunity to further customize their order.

Customize (Cont.)

Users can pick their sauces and specify if they want the sauce on the side or on the burger.

Customize (Cont.)

At the end of the page, the user can add additional instructions to their item and view the price of their customized burger.

Add More

What goes better with a burger? Fries, of course! A window pops up allowing the customer to add additional items to the cart.

Cart Count

The cart icon reflects the number of items a user currently has in their cart.

Cart Items

Before checking out, users have an oppertunity to check their cart items. The total of all the items allows the user to be sure of their order.