top of page

Case Study

Delivery Driver Mobile app

Overview

  • Patch is an app designed for restaurant delivery drivers.

  • The objective was to create a product that would integrate with a restaurant's point of sale (POS) system, and ultimately make delivery tasks quicker, easier, and safer. 

  • After several years of delivering food throughout high school and college, I began designing a streamlined mobile solution to help organize the entire delivery operation. 

What I did

Real Silver.png

  • Conducted user research

  • Competitive analysis

  • Usability testing

  • Created wireframes and prototypes from low-fidelity to high-fidelity

Real Space Gray.png

Competitive Analysis

  • To begin, I looked at what existed in the app store and beyond. Because I wanted the app to integrate into restaurant point of sale (POS) systems, I also researched POS providers to see what features they offered and at what price

  • There was a gap to be filled in providing an app that allowed employees and managers to assign a driver multiple orders, and then the driver could simply open the app, hit go, and be off on his routes within google maps integration.

  • The other key features that were missing involved being able to take certain actions, such as calling the customer, right from the GPS screen. 
     

Competitors

habrortouch logo.png
pos solutions logo.png
cervion logo.png
toast logo.png

Initial sketches and ideas

Then I did some sketches to generate and think out ideas related to:

  • What should be on the home screen

  • How to display multiple addresses on a map

  • How to re-order the tickets

  • The in-map actions such as call customer, add a new order, view current orders

  • How the order management would work

IMG_8342.HEIC
IMG_6100.HEIC

First mockups and prototype

​

  • I then discussed these ideas with people that delivered food

  • Since they would be using this on the go while they're in and out of the restaurant, I wanted to observe people trying it out on their phones early in the process, so I made a prototype on proto.io, shown below

​

v1 mochups in phone series.png

Hi-fidelity wireframes

After the proto.io prototype was tested, I continued the project in Adobe XD and created high-fidelity wireframes that addressed the feedback I got, which included adding the necessary screens to

  • Add an order from any screen

  • Preview routes and addresses

  • Expand order cards

  • Remove and replace an order

Patch wireframes set@2x.png
patch 3d.png

Next Steps

Some things that I plan on adding to this case study include​

  • User Personas

  • User Flows 

  • Information Architecture

  • User Testing Results

  • More mockups

Thanks for viewing!

bottom of page