Sushi Ordering App a design project

Sushi Ordering App a design project

Recently went to a sushi store to eat and I was surprised to find out it asked visitors to use their own phone to order.


Bring your own phone to order. This was new to me.

You login into a website. by scanning the QR Code. Once you order you can get a sushi via their rail delivery system.

I stated to see if I can recreate this in my own spare time to use as a learning case to make a full responsive website prototype.

Design my Own Ordering App

Visual Ideas and Colors for my Sushi Ordering App

I start to work out some of the design styles I want to incorporate looking at different color palettes of japan. One of the themes I want to incorporate is the Bullet Trains and food style into this website app.

Site Maps and Flow Charts

I Started off in Axure to create a few basic Sitemaps and ordering flow charts.

Sitemap of the App
User ordering flow chart

Sketch prototype

Next was trying out some basic prototypes and wireframes in Sketch. I am considering to use the Material Design principles eventually to design the UI.

At the moment I am focusing on the User Order portion of the app once they scan a QR Code they will be brought to the homescreen and adding items to the order checkout.

Sketch Wireframe

Next steps

  • Breaking down the UI Components
  • Create the interactions prototypes in Axure / Sketch
  • Create High Fidelity Mockups and Wireframes
  • Learn React JS to create a functional prototype.
Webhost Recommendations For Designer / Artists / Animators wanting a wordpress site. Web Hosting

Teh William, Weiqing

William Teh, Weiqing A Designer turn UI Developer. Animator Apprentice learning to be a Wizard Storyteller. Coding Interactive worlds one pixel at a time. Read More @
Close Menu
%d bloggers like this: