Parcel Touch Screen Interface

Revamping an APM interface for a logistics company resulted in faster parcel collection times and improved satisfaction.
TL:DR

As a freelance Product Designer, I revamped the Automatic Parcel Machine (APM) interface for a large logistics company, resulting in improved efficiency, effectiveness, and satisfaction for customers and couriers. The new interface was modern, accessible, and flexible, enabling the company to compete in a competitive market.

Company

Maido Agency

Role

Product Designer

Year

April 1, 2022

Introduction

As a freelance Product Designer, I had the opportunity to work with one of Europe's largest logistics companies on a project to break into the fiercely competitive UK market. My work spanned multiple touchpoints, including web, mobile, and Automatic Parcel Machines (APMs), which were large containers with multiple compartments for parcel collection, return, and sending. In this case study, I will focus on how I worked on the APMs to improve the user experience for customers and couriers. Please include an image of the APMs with the new interface design.

Problem

The client faced several challenges in their existing APM system, including outdated UI design and low-tech APM technology. The client needed to break into a competitive market where giants like Amazon, DPD, and UPS already had a strong presence. Customers and couriers also experienced pain points with the existing system, such as slow parcel collection times and difficulty locating the correct compartment. As a result, the client needed a more streamlined and user-friendly experience for their customers and couriers to stay competitive in the market. My task was to revamp the APM user interface, create a design system to work across multiple touch screen resolutions and orientations, and to help map out the various user journeys. I will explain how I tackled these challenges and the results achieved in the following sections. Please include an image of the existing APM interface design.

Documentation of the original screen interfaces

Research

To gain insights into the user experience, I worked closely with the internal Product Manager (PM) who observed several trips with couriers to better understand their needs and pain points. We also tested the new interface on real APMs and leveraged accessibility plugins to ensure the interface was easy to use and efficient for users. Please include an image of the accessibility plugins in use.

For customers, we identified two main scenarios: parcel collection and parcel return. We mapped out the user journeys for each scenario and identified several pain points, such as difficulty locating the correct compartment and determining the right size for parcel storage. We addressed these challenges by implementing large arrows on the interface and showing maps of the APM and where the compartments opened. We also provided a "help" button on the screen to guide customers through any troubleshooting steps. Please include an image of the customer interface with the large arrows and maps.

Mapping the customer facing journeys

For couriers, we identified two main scenarios: parcel collection and placing packages for collection. We observed that couriers were under a lot of time pressure and needed a fast workflow to be efficient. We designed the interface to be simple and easy to use, with assigned tasks via a checklist, input/scanning of parcel information, and confirmation of correct parcels via scanning or inputting information. Please include an image of the courier interface with the checklist.

Mapping the courier facing journeys

Design Solutions

To address the challenges identified in the research phase, we implemented several design solutions, including:

User Journeys: We mapped out the user journeys for customers and couriers and designed the interface to be user-friendly and efficient. For customers, we designed the interface to include large arrows and maps to help them locate the correct compartment and provided a "help" button for troubleshooting. For couriers, we designed the interface to be simple and easy to use, with assigned tasks via a checklist and input/scanning of parcel information. Please include an image of the user journey maps.

Simplified user journeys

Revamped UI: To modernize the UI, we leveraged the design language from the web and mobile interfaces and translated that into an accessible, touch-friendly interface. We used the new brand guides and illustrations to incorporate a modern look and feel. We also addressed accessibility challenges by using high-contrast colors and optimizing interactive elements for different screen resolutions and orientations.

Updated UI, adapted for accessibility
Interstitial screen and map screen to indicate the open locker
Success screens

Design System: To ensure cohesion across the touchpoints, we created a global design system file in Figma containing foundational elements such as typography, colors, and assets. We also created a dedicated APM design system to address the unique challenges of the APM interface. We collaborated with another designer to ensure consistency and cohesion across the touchpoints and designed the systems to be flexible and scalable. Please include an image of the design system files in Figma.

Example of components list
Layouts across the 3 main screen resolution types

Localization: To address market-specific needs, we created specialized flows for the France and Italy markets. We worked closely with the PM to identify user needs and pain points and designed the flows to be tailored to those needs. We also leveraged user testing to ensure that the flows were effective and efficient for users in those markets.

Conclusion

Courier success screen

Through user research and design solutions, I was able to revamp the APM interface for a large logistics company, resulting in improved efficiency, effectiveness, and satisfaction for customers and couriers. The new interface was modern, accessible, and flexible, enabling the company to compete in a fiercely competitive market. The collaborative effort with the internal PM and other designers ensured cohesion across the touchpoints, resulting in a successful project deployment. Please include an image of the APMs with the new interface design in use.

Continue reading