Ted McDonald

I design products and interactions that are engaging and accessible. I am studying Human Centered Design and Engineering at the University of Washington.

Improving Navigation for Delivery Drivers

DeliverEase is a navigation app concept that speeds up the delivery process by offering features like quick input methods for multiple addresses and easy route management.

This was a team project I led, completed as part of a UX course in the Human Centered Design & Engineering program at the University of Washington.

My Contributions

  • User research
  • Sketches & ideation
  • Storyboards
  • Information architecture
  • Paper prototypes
  • Wireframing
  • High fidelity mockups

Team Members

  • Ted McDonald
  • Olivia Michaels
  • Laura Dickinson
  • Eduardo Rojas

Introduction

Food delivery is growing at an incredible rate, with a potential to reach $210 billion long term1. My team researched the delivery process for drivers, discovered inefficiencies, and created designs to improve the process. We focused on pizza delivery since it represents a majority of the market.

Observations & Pain Points

Due to a narrow time frame, we limited observations to four interviews and one pizza delivery ride along.

We discovered similarities; delivery drivers were under stress due to time constraints on their deliveries, they had difficulty finding house/building numbers due to various factors (weather, lighting, overgrowth), they often delivered multiple orders in one trip, and they used Google Maps regularly.

The Problem

A consistent theme was speed. Many of the pain points our delivery drivers expressed could be attributed to slowdowns in the delivery process. The bulk of their income comes from delivery tips, which incentivizes multiple deliveries per trip. Having to deal with multiple addresses and difficulty finding building numbers, wasted valuable time for our drivers.

Synthesis of interviews and research.

Design Goals

Our goal was to design an app that speeds up the delivery process by offering a quick input method for multiple addresses, easy route management, and building number overlays on the map.

Ideation, Wireframes, Prototypes

With our design goal in mind, we began to ideate around methods of route input and management.

Sketched concepts include image OCR, multi-route management, and building number overlays.

Pizza delivery drivers are given physical paper slips that include address and order info. In light of this, our early concepts centered around image OCR. This would allow the user to snap a picture of the delivery slip, and the app would recognize the address from the image. Ultimately, voice input tested better, and we added the image OCR concept to our idea parking lot.

Testing early key flows to discover areas in need of improvement.

Before creating higher fidelity deliverables, we tested with paper prototypes. Each test subject was given an objective to complete, which helped us measure the effectiveness of key interaction flows. We also gathered feedback on annotated wireframes, making changes as needed.

Wireframes (left) and annotated wireframes being critiqued (right).

The Solution

After multiple rounds of testing and feedback, I produced high fidelity mockups to demonstrate the functions of our app.

Quick Route Input

Voice input is the focus when inputting an address. It is the fastest, simplest, and most reliable method for entering addresses. The familiarity and wide usage of voice features made it the best choice for our delivery drivers. There is also an option for inputting and editing addresses manually.

Adding stops to route is quick and intuitive. "Add to Route" allows the driver to automatically create route from stops.

If the driver has only one delivery, they can click the “directions” button and begin navigation. If they have multiple addresses to input, they can add each address to the queue by clicking “add to route.”

Multi-Route Overview

The interaction on the route overview panel is similar to a music playlist. The user can click on individual addresses and the map will zoom to specific segments. If a route needs to be manually re-ordered, the user can hold and drag the address to a different spot.

Route overview panel allows the driver to see full route or segments, as well as manually customize.

The route overview panel shows 2 addresses fully, and a glimpse of the third. Our research showed that two deliveries per trip was most common. Drivers can swipe up to show more addresses.

Navigation & Arrival

Since many of our interviewed drivers were familiar with Google Maps, we chose to adopt similar patterns for the navigation screen.

On arrival, the buildings display numbers so that the driver can find their destination quickly. The driver can also add notes for difficult deliveries, in case they ever need to deliver to the same address in the future.

"Start Route" begins navigation. On arrival, driver is able to see building numbers and navigate to next stop.

When the driver is ready, clicking on “next location” will start navigation to the next stop on the route.

Outcome

My team and I had the chance to present our project to designers from Amazon and Blink UX. The feedback was positive, especially on the intuitiveness of the route overview screen and the appropriate scope of the project. Certain concepts led to great discussions, such as the feasibility of using a camera for image OCR (text recognition) after sunset, which is when many deliveries take place.

I also wish there was more time to explore alternative concepts, such as integrating into delivery dispatching software used by various businesses so that the driver would not have to input addresses at all.

I had a great time over the course of this project, and learned a lot about rapid prototyping and revising concepts based on feedback.