OverviewDefineIdeateprototypetakeawasys
tikt logo showing a page and a pen

Tikt

The in-seat ordering app for restaurants

Company : retailcloud
Project Type

Dashboard
Application Design
For Android and iOS

Role

UX Designer
UI Designer
Interaction Designer

Contributions

UI/UX Design
Mobile UX
High-fidelity Prototype
Feature & Marketing Video

Tikt demo menu showing list of items
Tikt is a restaurant based web app. It replicates the restaurant menu to online and allows the guest to order and pay from the device itself.

Tikt provides a safer and contactless experience to browse the menu and tip server, all while reducing ordering errors.
Tools Used
figma
adobe illustrator
adobe after effects
adobe animate
Design Thinking
Affinity diagram
Service blueprint
Why we did it.

We want to allow guests to order without touching a menu and limiting server interaction. No more waiting for waitstaff, browse the menu on your phone and order when you want as you want. Make it easier for guest  to “order another round”.

Challenges.

Pandemic froze the flow of customers to restaurants. Restaurant owners are desperate for a solution to make their customers feel safer. The main challenge of Tikt was to design, build and provide the final product as soon as possible. Doing user research and real time testing to  provide MVP at very minimum time was the main challenge that I faced throughout the project.

Analytics showing the post covid restaurant crisis
Empathize & Define
User persona.
🍽😷
Sophia
Sophia is a young professional in her late 20s who enjoys dining out and exploring new restaurants.She used to frequent restaurants regularly, but since the COVID-19 pandemic, her dining habits have changed.Sophia is now cautious about dining out due to health concerns and is looking for a safe and enjoyable dining experience.
️☹️ Problems

Sophia's specific struggle is finding restaurants that prioritize and enforce safety measures during the COVID-19 pandemic.

She wants to make sure that the restaurant she chooses takes the necessary precautions to protect the health of their guests and staff.

️☹️ Problems

Sophia's specific struggle is finding restaurants that prioritize and enforce safety measures during the COVID-19 pandemic.

She wants to make sure that the restaurant she chooses takes the necessary precautions to protect the health of their guests and staff.

️☹️ Problems

Sophia's specific struggle is finding restaurants that prioritize and enforce safety measures during the COVID-19 pandemic.

She wants to make sure that the restaurant she chooses takes the necessary precautions to protect the health of their guests and staff.

Empathy map.

I was able to gather insights on what the user has to say about the present restaurant dining experience. What the user thinks and feels about the experience had more to do than what they said and does. I formed empathy map based on what they does at the restaurant every time they visited. Empathy map provide deeper understanding of user pain points as it clearly shows the concern and fear of dining in present situation. It also helped to find the areas that needs to be focused more to make a better user experience.

Empathy map showing what Darlene says, thinks, feels and does
Creating a mental model.
Representation of the mental model of a Tikt merchant.
Representation of the mental model of a Tikt merchant.
The storyboard.

I scripted the below storyboard of how a guest can achieve contactless dining using their mobile phone to join a table, see menu, order food and place tip & payment. It helped me to build empathy and understand how a group of people at a table wanted to interaction with Tikt.

Storyboard describing the situations a Tikt user would have to go through at a restaurant
Storyboard describing the situations a Tikt user would have to go through at a restaurant.
Ideattion
Identifying the activities involved.

I created the affinity diagram to organise, analyse data and synthesise user research findings about the activities and operations involved in a restaurant and potential actions of the application.

Affinity mapping done by forming different features or ideas into relevant groups.
Affinity mapping done by forming different features or ideas into relevant groups.
Finding out activities involving interaction with waiter.
Menu and available varieties

To check about chef's special,  available options of item and items as course.

Coursing

To specify item delivery order as starters, entree, or dessert.

Food allergies

To specify not to include allergic ingredient or food item in the ordering dish.

Bill & payment

To request for bill/receipt, make the payment and provide tip.

Custom requirements

For unanticipated requirements, booster seats, cleaning table, hot water etc,.

Key design decisions and iterations.
02
Communicating with waiters.

One of the main concerns of the guest dining at restaurant is the safe and quicker communication with waiter.

With the in-build chat feature with waiters I was able to make the life of waiters and guest easier by creating safe and contactless communication.

Now guest does not need to look for a server, just send the query through the app.

Common query like "Request for water" are pre-build for faster communication.

04
Specifying course for dishes to be delivered.

Waiters usually interacts with customers to take notes about the dish and course.

With in-build coursing system. Customers were able to select course for all the available dishes when added in cart.

Direct interaction with waiters was reduced by providing the ability to choose course and notes/cooking instructions and thus providing a contactless and safer dining experience.

Customers found the flexibility in making decision of the food preparation and delivery as an excellent experience.

05
Making payment and providing tip.

Customers had to interact with waiters or cashiers while checking out in most cases for making the payment.

Including the contactless online payment from customer side made them feel safer by restricting waiter interaction.

Making use of auth payment and card wallets boosted ordering another round by not wanting to enter payment details for each order and helped customer retention.

Waiters received tips easily with in-build tipping feature on checking out for preset and custom amounts.

Prototype
Information architecture.
Representation of the Tikt user flow.
Representation of the  Tikt app flow.
Service blueprint.

The service blueprint displays the entire process of service delivery, by listing all the activities that happen at each stage, performed by the different roles involved. The vertical axis shows all the actors involved and the horizontal axis shows the steps required to deliver the service.

Service blueprint that shows the actions of guests, restaurant staffs, and technology.
Service blueprint that shows the actions of guests, restaurant staffs, and technology.
High fidelity prototype
Representation of the high fidelity prototype and interaction with the UI
Representation of the high fidelity prototype and interaction with the UI.
Conclusion
How it turned out.

90%

of customers reported being satisfied with the convenience of in-seat ordering.

95%

of customers felt safer using the app for ordering to minimize interactions with staff.

80%

of customers indicated that in-seat ordering reduced their concerns about COVID exposure.

75%

of customers stated they were more likely to visit the restaurant again and recommend to others due to the app.

Key takeaways.
  • Allow guests to order without touching a menu and limiting server interaction (thanks to QR code and digital menu).
  • No more waiting for waitstaff, browse the QR code menu on your phone and order.
  • Reduce comps and missed charges by eliminating incorrect orders by servers
  • Help mitigate challenges in staffing - servers can focus on providing better restaurant services.
  • The quick design deliverables boosted the feedbacks and kept project on schedule.
  • Tikt makes the life of restaurant owners simpler with safe, faster, and smooth experience with limited number of servers, all without the need of changing their current POS.
Image with different screens including menu, item details, modifiers, cart, search and payment of tikt app
View more projects -
nGauge

SCAMPER

Console

Design thinking