Case studies

Cakevora

Role

UI/UX Designer & UX Researcher

Duration

4 weeks

Tools

Figma

Client

Study Independent Binar Academy

01.-

Introduction

Research Overview

Title : Creating the Cake shop app with delivery feature
Stakeholder : Facilitator Binar Academy
Date : 24 March 2022
Research Goal : Making the app for the cake shop that started had customers who were lazy to get out of the house and wanted delivery.
Product Lifecycle : Design Thinking

02.-

Research

Background Research

This research was made because of a submission from Binar Academy, the case study was given several choices and I chose this case study because I think it is interesting and the scope of application is rather broad for the problem. The application brand name is fictitious and the result of my own making, with the specified deadline, this project has been completed using all stages of design thinking and has been approved and reviewed by Facilitator.

03.-

Empathise

User Persona

To better understand the user's situation, I conducted an interview in which the user described the cakevora application and generated a persona.

User Story

As a Student, I want to order cake from the App so i can have more time to another things.

04.-

Define

Research Findings

In this stage, several research documents that have been carried out previously and collected in the define stage are described to be discussed in the next stage, the type of user studied based on the persona and stereotypes of the user.

Problem statement

Mathilde Langevin is a Student who needs an easy app to order cake by delivery because she doesnt have time to come to the cake shop.


Hypothesis statement

If Mathilde need quick and easily process when ordering the cake then Mathilde should download cakevora for ordering cake via smartphone and delivery method.

04.1

DEFINE

User Flow

At this stage describes the User Flow of the application, contains the general flow of the application.

Goal statement

Our Cake order app will let users Buy the variations of cake quickly and easily with delivery method which will affect A Students by Allowing them to buy the cake from the app We will measure effectiveness by Analyzing the number of delivery orders in a daily or monthly routine.

04.2

DEFINE

User Journey Maps

At this stage, it explains about User Journey Maps, namely the things that are done to be able to operate the application from start to finish.

I used the persona of Mathilde Langevin to research in User Journey Maps


User Journey Maps Report

04.3

DEFINE

Storyboards

At this stage, we explain the Storyboard, in order to better understand the condition of the application running and the atmosphere when the user orders food through the application. I use 2 types of storyboards namely Big Picture Storyboard & Close Up Storyboard.

04.4

DEFINE

Information Architecture

At this stage explain the Information Architecture, in order to better understand the existing and structured data.

05.-

Ideate

Wireframing

At this stage, explaining the digital type Wireframe, an overview of the concept of the application display design that will be made, the application is made to fulfill the main purpose of being able to order cake by delivery.

06.-

Design & Prototype

High Fidelity Prototype

At this stage, explaining the digital type Wireframe, an overview of the concept of the application display design that will be made, the application is made to fulfill the main purpose of being able to order cake by delivery.




Welcome Page

The main page of the application after the user opens the application, here there will be 2 options for the user, namely to sign up and sign in.

Login

Login page, here will display a textfield for users to login and enter their respective accounts to be able to order cakes.

Homescreen

Homescreen page, here will be displayed if the user has signed in to the application. On this page, several menus will be displayed such as recommended menu, category, cart, favorite menu and profile menu and at the top there are discount promos and search features.

Detail Product

login page, here will display the name of the cake, price, variety of cake and a button to add a cake to the cart and a button to buy a cake directly.

Order Page

Order page, here will be displayed if the user has selected the ordered food menu and quantity. On this page, several order settings menus will be displayed such as pickup methods, find addresses, location details, notes and change the quantity of food ordered.

Tracking Delivery

Delivery tracking page, here will be displayed if the user has ordered food. On this page, a real time tracking view of the food delivery will be displayed and when it is finished, you can rate our order directly.

Settings

Settings page, here will display user settings and general settings, where users can adjust the info in the settings to simplify the cake buying process.

07.-

TESTING

Usability Testing

Project : Cake Shop App (Cakevora)
Test Type : Unmoderated Usability Testing
KPI : Completion Rates, System Usability Scale (SUS)
Location : Indonesia, Remote (in home)
Date : 16 - 19 April 2022

Participants : 5 Participant
Session : Session in 40 minutes, include presentation and introduction.
Incentive : Voucher Video App

Target : 4 male, 1 female in range of 20-25. Participants are students (according to persona characteristics), people who often place orders online and people who are usually busy.


Usability Testing Full Report

07.1

TESTING

Synthesize Data

At this stage, all data generated from Usability Testing is collected and used as a conclusion as a revision of the design concept.

The data displayed in the form of Affinity Diagram above & Pattern Identification.

The data below is synthesized data from various features that have been tested.

07.2

TESTING

Synthesize Data Conclusion

Pattern Identification & Insight Identification

The data below are Conclusion of Qualitative Data and Pattern Identification which are summarized from the entire data.

08.-

ITERATE

Revised Design

The data below is the result of a design revision based on the feedback data from usability testing.

09.-

Design System

Brand Identity Design

At this stage displays the brand identity system that is used as a reference brand application.

09.1

Design System

Design System

At this stage displays the system design system that is used as a reference for component design in the application.

10.-

Copyright Information

Creative Common License

All data above is regulated by CC BY-NC-SA 4.0 provisions, This license lets others remix, tweak, and build upon my work non-commercially, as long as they credit me and license their new creations under the identical terms.


CC-BY-NC-SA 4.0