Delivery Tracker

RoleSenior UI/UX Designer & Frontend Developer
ResponsibilitiesUser research, wireframes, concepts, prototypes, product design, AngularJS development, HTML, CSS, JavaScript
CompanyCSR Limited
When2014 - 2019

Live delivery tracking

Designing the CSR Connect delivery tracking experience was a highlight of my time at CSR. Rewarding work; it was a broad project requiring lots of user research, assessing existing solutions, a suite of new icons designed, and presenting a lot of information to the user in a concise and intuitive way.

On the frontend development side, the UI presented data from our own API via the Google Maps JavaScript API, including live delivery time estimates and eventually, real time GPS tracking of delivery vehicles^*.

^* Once the right coordinates were coming in and trucks stopped appearing in the middle of the Pacific Ocean

We didn't have dedicated designers for our comms assets, so I often enjoyed a quick break from the UI to whip something up.

A photograph of a hand holding a touchscreen smartphone running the CSR Connect deliveries feature' — We didn't have dedicated designers for our comms assets, so I often enjoyed a quick break from the UI to whip something up.

My first sketches of the delivery tracker for a small screen

A sketchbook showing early drawings of the CSR Connect delivery tracking interface design, showing various status on a list and a mode with deliveries shown on a map — My first sketches of the delivery tracker for a small screen

Just the right amount of information

Data gathered from customer service representatives around what queries they were fielding for deliveries revealed that our users needed substantial information displayed in order to reliably track their (multiple) orders (Side note: This continued to grow: I think the final implementation was 3 times richer).

We opted out of taking a small-screen-first approach in the first iteration, as our customer data indicated our target segment were primarily at a desktop. When it came to designing the small screen experience, we looked through a new lens focused around onsite users, who were identified as a growth opportunity with found to have simpler and more-immediate needs, eg: "Where is the 7am delivery I'm expecting this morning?" rather than "How many deliveries am I expecting tomorrow and are they scheduled correctly?".

Following on from this once the feature was in customer hands, customer feedback was that active notifications were needed - so the team implemented SMS notifications that securely linked directly to the delivery details, which really rounded out the flow.

Designing a language both familiar and new

There was plenty of convention and inspiration for delivery tracker type applications at the time we were designing. Auspost were working hard to simplify their mobile apps, and most courier companies were improving their messaging too through digital transformation.

So while we set abut designing something for our brand within our design system, the task was really about adapting the growing design language that was developing around delivery tracking and placing it in the CSR context, only adding to it where we needed to.

The predominant language around our delivery tracker was textual - best for usability and accessibility, especially at the introduction of a new feature. As users become familiar with the UI or begin using the map view, the iconography becomes important for at-a-glance indications of status.