Project: Chowshack Food Service App

Role: Interactive and Visual Designer

Duration: Sept-Oct 2022

Project Goals

Chowshack is a local food truck operating mainly in the Sakumono-Tema Metropolitan area of Accra. Chowshack aims to provide clients with a wide range of both continental and local foods from collaborative restaurants with just a click of a button. They offer competitive pricing and mainly target a younger demographic.

The Problem

There is a lack of a dedicated food delivery system perfectly catered to the needs of the inhabitants of Sakumono estates with quick delivery time.

Chowshack

Kickoff

User Research - Summary

Starting off, I asked myself a few initial questions: Who is the primary user? What kind of goals do they have? Why would someone want to use this application? How large of a scope do I want this project to be? Interviews at the initial stage of my research, user personas, and empathy maps confirmed initial assumptions about Chowshack’s customers and their need for such an ordering system.

Pain Points

User research revealed the following pain points:

Meet the Personas

Persona 1 Persona 2

Persona User Journey Map

In order to fully empathize with the user, I created a user journey map to simulate a user's flow while interacting with Chowshack.

User Journey Map

Ideation

Paper Wireframes

I conducted a quick ideation exercise to come up with ideas to enhance the flow and structure of the service system. Drafting several iterations of each screen of the app on paper ensured that the elements that made it to digital wireframes would be well-suited to address user pain points. For the home screen, I prioritized a quick and easy ordering process to help users save time.

Paper Wireframes

Information Architecture

Information Architecture

Digital Wireframes (Mobile)

As the initial design phase continued, I made sure to base screen designs on feedback and findings from user research, specifically insights from the user journey map.

Mobile Wireframes 1 Mobile Wireframes 2

Digital Wireframes (Desktop)

The designs for screen size variations included a desktop view.

Desktop Wireframes

Usability Studies

I conducted an unmoderated usability study with 6 participants to test how easy it was to interact with the flow of the wireframes. This guided the design transition from low-fidelity wireframes to mockups.

Usability Study 1 Usability Study 2

Findings from the Usability Studies:

Mockups

The usability studies revealed that earlier designs were cluttered on a single homepage. I revised the design by using more whitespace to present a more accessible and aesthetically pleasing look. Meal and drink suggestions were included in an image carousel, and a payment confirmation page was added.

Mockup 1

Second Usability Study

After the first mockups were created, a second usability study revealed the need to improve the payment information page experience.

Second Usability Study

Key Mockups

Key Mockup

High-Fidelity Prototype

The high-fidelity prototype demonstrated a clear user flow for ordering meals from Chowshack.

art

Final product after years of iteration


Mobile View of the Application

Link to product

Accessibility Considerations