Dave's Barbecue order app is a platform that enables its users place orders from their favourite BBQ restaurants, and get it delivered to their door step.

Goal Setting

Project Name: Dave's BBQ

Owner: Dave's Studio

Project Summary: Dave's studio seeks to solve one major problem which is , most people who live and work in the major city want to enjoy their favourite roasted meat ,that is BBQ, but due to time and expertise constraints on the part of the users, can't seem to get their food cravings met. Dave's studio has remained committed meeting the needs of busy people by making their lives easier and simpler with the use of easy to use technological options.

Problem/Challenge : Busy workers, commuters, tourists and families who love a well prepared BBQ lack the time and lack the technical know how necessary to prepare a proper BBQ. Another problem was accessibility and discoverability of specialised BBQ restaurants within the metropolis.

Project Goal: Design a mobile application that caters to our user needs which are:

i.) Discovery of various BBQ restaurants, which gives our users the option to select from a variety.

ii.) Online booking , delivery, tracking and payment options.

Targeted Users:

i.) Office workers and busy commuters.

ii.) Work from home (Remote workers)

The Team

-Product designer

-Product manager

-Project manager

-Business Analyst

-Developer

My Role

- User Experience Designer

What I did

- Goal Setting

- User research

- Persona Building

- User Journey map

- User flow creation

- Wireframes design

- High-fidelity design

- Usability testing

User Research

I conducted interviews and created empathy maps to understand the users I’m designing for and their needs. A primary user group identified through research was working adults who don’t have time to prepare a proper BBQ. This user group confirmed initial assumptions about Dave’s BBQ customers, but research also revealed that time was not the only factor limiting users from roasting at home. Other user problems included obligations, interests, or challenges that make it difficult to get groceries for cooking or go to restaurants in-person.​​​​​​​

Persona

Problem statement: Larry is a busy working adult who needs easy access to healthy BBQ ordering options because he has no time to make his favourite BBQ for himself.

About:

Name: Larry

Age: 24

Education: Degree

Family: Single

Occupation: Software Developer

Larry is a software developer living in California US, he loves to be indoors during the day due to the nature of his job , but he is the life of the party on the weekends. One day during an outing with friends they attempted to make BBQ, but actually burnt it up and it ruined their outing so he is constantly checking online to see if there is any special BBQ delivery service available.

Larry would be really happy if he can make these requests online and have them met.

Goals:

- Request BBQ from the comfort of his home and get it delivered to his door step.

-Able to make seamless and secure payment after an order.

-Able to track order and know how long he has to wait for delivery.

Frustrations:

- Leaving his home and going out to restaurants to buy BBQ.

- The amount of work involved in cooking his own BBQ overwhelms.

- Having to pick out less favourable food options during his hang outs.

User Journey map

Mapping Larry’s user journey revealed how helpful it would be for users to have access to a dedicated Larry’s BBQ app.

Ideation

Started with paper wireframes

Taking time to draft iterations of each screen of the application 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 prioritised a quick and easy ordering process to help users save time.

User Flow

I created a user flows for steps a typical user goes through in order to complete the delivery of the BBQ.

Some of these flows were tested and re-iterated upon several times in order to provide a seamless and smooth experience.

One of the challenges that we wanted to solve was the onboarding experience which this flow helped to provide a clearer view for us.

One Advantage to note about user flows is that they make all stakeholders aware of the intended experience for the users and developers can start working on any backend services or processes that needed to be worked on.

Wireframing

Once I had a better understanding of what I wanted to do and the issues to tackle, I took some time to wireframe some ideas for user testing.

From the user flows and journeys, the next step we took was to design wireframes to give an idea of the interface and test it with stakeholders which we did.

The insights gotten from the wireframes helped in informing our design decisions for the design system and hence, the prototypes.

First Usability study: findings

I conducted two rounds of usability studies. Findings from the first study helped guide the designs from wireframes to mockups. The second study used a high-fidelity prototype and revealed what aspects of the mockups needed refining.

Insights from the first usability study(helped guide the designs from wireframes to mockups) :

- Users want to order BBQ quickly.

- Users want more customisation options.

- Users want a time feature in the track delivery option.​​​​​​​

Design system

After working on the wireframes, one of the things we wanted to achieve also was consistency. The importance of consistency is so that users are not confused about the colours , buttons, texts, icons, forms and illustrations as well.

Hi-fidelity mockups

Getting Started.

The get started screens allows both new and existing users to get into the app. Existing users can sign in with their username and password .

Below is the link to the prototype design for this app:

Onboarding

This flow onboards new and existing users login, sign up, and reset their passwords via an OTP generated and sent to their inputed emails.

Menus

This solves the problem of our users searching for individual BBQ restaurants and spots and also gives our users a variety of options to select from , even the details of the make of their selected BBQ was also taken into consideration.

Checkout/payment/delivery/tracking Mockups

This is the concluding part of the application, our users are given options to pay for their food and delivery, choose their address on the map and are allowed to track their orders .​​​​​​​

CSS Styling details to assist the developers

Second Usability study/testing: Findings

The second study used a high-fidelity prototype and revealed what aspects of the mockups needed refining.

Insights from the second usability study(revealed what aspects of the mockups needed refining) :

- The checkout process has too many unnecessary steps

- Accessibility considerations

Solutions

- The checkout process has too many unnecessary steps:

- This has been corrected and the number of unnecessary steps reduced.

- Accessibility considerations:

- Provided access to users who are vision impaired through adding alt text to images for screen readers.

- Used icons to help make navigation easier.

- Used detailed imagery for BBQ and toppings to help all users better understand

Key Takeaways

Impact:

The app makes users feel like Dave’s Studio really thinks about how to meet their needs.

One quote from peer feedback:

“The app made it so easy and fun to request and order BBQ! I would definitely use this app as a go-to for a delicious, fast, and even healthy meal.”

What I learned:

While designing the Dave’s BBQ app, I learned that the first ideas for the app are only the beginning of the process. Usability studies and peer feedback influenced each iteration of the app’s designs.