Mobile app for food truck ordering

Alan Easton - July 2023

The Product

Foodz is a food truck app designed to allow people to select where they’re going on a trip, find food trucks on that trip and then have the food be ready for when they arrive at that location.

The Problem

Ordering from food trucks has to be done mostly when you arrive, meaning you have to wait for food to be ready, wait in queues and items you want may not be available when you arrive.

The Goal

To reduce the waiting time and have food be ‘piping hot’ when you arrive at the food truck you selected.

Understanding the User

User Pain Points

Time

Visiting food trucks can be a huge time sink to those wanting a quick meal. Arriving at the track, waiting times in queues and waiting for food prep are multiple pain points users can have

Dietary

Many users have dietary requirements, users have to often manually select and filter these and can’t have them synced to their profile. Often making users feel frustrated

Accessibility

Users with different accessibility needs are often frustrated by a lack of accessibility options within apps. Especially when operating systems have built in accessibility support.

Persona: Maria

Problem statement:

Maria is a regular Food truck customer with a dietary requirement and a busy schedule due to her work. She needs to be able to view dietary information about a menu ahead of time because it means she can make an informed purchase decision ahead of time effectively.

Maria's User Journey Map

Maria’s user journey revealed the pain points for users with dietary requirements and how useful it would be to have this automated. It also revealed the wait times within queues.

Starting the Design

Paper Wireframes

The next step of the design process was to create paper wireframes. Throughout this process I focussed on the idea of ‘familiar but new’ for users.

The next step in the design process was digital wireframes where I focussed on ensuring the design vision was cohesive.

I wanted to ensure that users had the option of picking based on a map of there they were going as well as being able to pick local food trucks.

Low-Fidelity Prototype

Once the digital wireframes were complete, the next step was to create a low-fidelity prototype that clearly shows users how they move around the design

[Link to LoFi prototype]

LoFi Prototype Usability Study

Two rounds of usability study were conducted. One at the LoFi stage and then one again at the HiFi stage - below you can find the key findings from these

Round 1 findings

The delay order button not doing anything confused users.
The app needed it’s own card payment system not just Paypal, G/Apple pay
Users want standard device navigation features

Round 2 findings

Total payment amount not listed on card screen
Food truck journey screen not clear that you’re currently on a journey

Refining the Design

Mockups

At the beginning of the usability study the designs were relatively crude and didn’t allow for much customisation. After this when designing the Hi Fidelity prototype I reconsidered the design with more detail.

Before the Usability study

After the Usability study

A core part of the second usability study changes was adding details about the payment being made on the new card screen.

Before the Usability study

After the Usability study

Final Mockups

High Fidelity Prototype

On completion, the high Fidelity prototype gives a good idea of the fundamental travel around the Foodz App

[Link to Hi-fi Prototype]

Accessibility considerations

1

Icons are used where possible to help users with navigation

2

App is designed in a way that it can be scaled by the system when engineering build the product.

3

App has lots of imagery where possible to help users make informed decisions on their purchases.

Going Forward

Impact

Users of Foodz are really happy with the idea of an app that allows them to order from a food truck before arrival and have the food be ready when they arrive for pick up.

What I learned

I learned alot while designing foodz around the specifics of how app design takes shape from concept to High fidelity prototype and the amount of user feedback that is needed for a design to take shape.

Next Steps

1

Conduct final testing to ensure that users are happy with changes to the design.

2

Consider other features of the product including a Loyalty stamp system and user profile screens.

3

Personally, I'm not a fan of the colour scheming I picked for this initially. I think going forward I'd want to spend more time improving the illustrative look of the design system. Possibly looking at using Material.

More Projects...

Nintendo Switch Social Online

Page updated

Google Sites

Report abuse