Tiki Taco Project - Header

Tiki Taco

User Interface Design & Branding

Overview

Problem

The restaurant sells customizable tacos and burritos. They want to start a delivery service and need a website on which their customers can customize their order to their taste easily.

Insights

The users want to see at a first glance if the restaurant delivers to their area. They want to find out if the restaurant is open and see the price of the order at every stage of the ordering process. It should offer a good desktop and mobile experience and they want to be able to follow the order after it has been placed.

Process

User Personas

Michelle, 23, the traveler

Jakob, 26, the studious

  • Studies at the local university
  • Just graduated and started professional life
  • Uses any free time for get aways
  • Likes to invite friends to play video games
  • Likes to spend time with her friends
  • Uses the kitchen only for making coffee
  • Enjoys life
  • Spends a lot of time learning new things

Needs

  1. Sell food online that will be delivered
  2. Provide a system for order customization
  3. Communicate what is offered and that it will be delivered fast
  4. Show delivery area and opening times on the start page
  5. Show prices of every product and additional cost next to every extra ingredient.
  6. Be responsive and easy to navigate on both desktop and mobile.
  7. A screen with a map where users can follow their order.

Requirements

Content:

  • Opening times
  • Prices at any stage of the ordering process
  • Location and delivery radius
  • Food menu
  • Delivery speed
  • About us, Contact, Images, FAQ

Functionality:

  • Choose from a list of pre-defined food
  • Or customize the meal
  • Add items to shopping cart
  • Check out
  • See real-time order status on a map

Sitemap

Tiki Taco Project - Sitemap

User Flow

Tiki Taco Project - User Flow Diagram

Visual Design

Logo

Tiki Taco Project - Logo

Logo Variations

Tiki Taco Project - Logo Variations

Color Palette

Tiki Taco Project - Color Palette

Typography

Tiki Taco Project - Typography

Wireframes & User Testing

Tiki Taco Project - Wireframes

The results of the usability study showed that the users needed to be able to go back at the stages of checkout and order.

I therefore added a button to go back to the previous page.

Prototyping

Tiki Taco Project - Mockups

Next Steps

The plan is to include customization to more products within the menu range. In the future, they want to offer customizable drinks with different tastes and sweetness levels. Before, they want to test the existing feature if it is well accepted by their customers.

Lessons Learned

Convenience factor

I learned that people who want to order food, need much convenience to choose what they like. It has to go fast as they are hungry. The design has to be intuitive and it has to be possible to go back at each step in case they want to change their order. I added pictures to each ingredient so that users can easily select what they want.

Price not highest priority

One of the conditions was that the price should be visible at each step. The user tests showed that the price was not as important as expected because the users were prioritizing their favorite ingredients over the price.

Thank you!