BAKE

The Bake App delivers a custom cake ordering process embedded within the functionality of a traditional food delivery app. It allows a streamlined order and payment process even for users who need custom orders and quick ordering methods.

Category
UI/UX Design
My Role
All phases
Preview
Problem

Busy working professionals’ and housewives’ responsibilities consume most of their time. They want a convenient way to personalise their orders even when they are unable to visit brick-and-mortar stores.

Goal

Create an app where users can easily customize and order cakes in addition to ordering regular baked goods.

USER RESEARCH

The user research involved conducting interviews and creating empathy maps to understand the users and their needs. Two user groups were identified through research – busy working professionals and housewives without much time due to their responsibilities.

The two user group’s problems had common themes – including their obligations in day-to-day life and the unavailability and ambiguity of custom online ordering methods.

PAIN POINTS
PAIN POINTS
01
time

Users have other obligations and do not have time to personally visit stores to make their orders.

02
Confusing Order Processes

Bakeries with existing online ordering methods use order forms that are disorganized and confusing.

03
Ambiguous Menu

Some menu items do not provide images; users find it difficult to make a decision about their orders.

USER personas
USER JOURNEY MAP

Mapping Sofia’s user journey revealed the pain points on existing bakery delivery ordering systems and opportunities for improving developments.

USER flow

To clearly visualize the user's experience, the user flow was mapped out. The diagram covers the actions that the user can do within the app.

paper wireframes

User pain points were addressed in the paper wireframes of each page for the app. The focus for designing each page was a streamlined user experience from launching the app up to tracking the orders.

digital wireframes

Digital mockups were then constructed from the paper prototypes, based on the identified user's needs. Each screen addressed pain points from the user study.

low-fidelity prototype

A low-fidelity prototype was created to test the the primary user flow in the usability study.

USABILITY STUDIES

Two rounds of usability studies were conducted for each phase of the project. Findings from each round of the study were used to revise and edit the prototypes.

Round 1 Findings
  •       Users had difficulty editing their account details.
  •       The menu screen was still unclear to some users.
  •       Users wanted a simple custom order process.
Round 2 Findings
  •       Descriptions on other products needed to be added.
  •       Detailed information for each transaction would be ideal on the order history page.
high-fidelity prototype

The final high-fidelity prototype delivers a streamlined step-by-step customization and checkout process.

screens

Final Design

Prototype

You can view the prototype below, through the link, or by scanning the QR code on your mobile device.

You can view the prototype by
scanning the QR code on your mobile device.

You can view the prototype by clicking the link or scanning the QR code on your mobile device.