An end-to-end global traceability platform

Shell faced a three-month deadline to achieve full traceability for their lubricant products across bottles, cartons, and pallets in multiple locations worldwide. As the lead user interface designer, I collaborated with a user experience designer to map out essential business movements and streamline workflows.
Shell GTP
Figma, Adobe CC

Shell had a contractual obligation with a GKA (global key account) to deliver end-to-end (E2E) traceability for lubricants across plants in Hong Kong, Germany, and Spain. With a tight deadline of four months, my role was to lead user interface design, develop a reliable solution, and ensure a smooth implementation.

Scenes from the war room during kick-off.

The challenge

  • Objective: Ensure traceability of lubricants to minimise counterfeits, supply chain inefficiencies, and faulty products, and enable pallet, carton, and bottle-level traceability.
  • Constraints: Limited time, integration with third-party vendors, barcode implementation, and adaptation to various hardware and environments.

Field trips and user research

Conducting field trips to Spain and Hong Kong allowed us to gather valuable insights, understand real-world challenges, and validate our assumptions. Engaging with warehouse supervisors and staff helped us identify gaps and refine our approach.

A comprehensive traceability suite

To create an effective solution, I designed multiple products to cater to various user groups across the business.

  1. Scanner (iOS app): Custom iOS app for iPhone-mounted handheld scanners, used to trace lubricants in plants and warehouses. Integrated with SAP for live data exchange.
  2. Traceability Lookup (web app): Enables users to check the traceability of lubricants throughout the supply chain.
  3. Material Planner (web app): Streamlines planning and management of lubricants.
  4. Local Printing (web app): Manages barcode generation and printing for seamless integration with the traceability platform.
  5. Scan Reports (web app): Provides warehouse supervisors with a dashboard view of their team's performance, highlighting efficiency, trends, and areas for improvement.
The entire iOS app inside Figma.


Adapting to the unique user needs of the warehouse environment was crucial for the project's success. We used "just enough research" and quick, iterative design methods to overcome ambiguity and constantly push forward. On-site visits to warehouses in Spain and Hong Kong proved vital to understanding the unique challenges faced by warehouse teams and the environment in which the app would be used.

Usability issues around the small iPhone 8 screen and safety glove requirements needed more thought. By sourcing touch-screen safety gloves and enlarging tap targets and text sizes after feedback from warehouse staff, we'd overcome our most troublesome challenges.

The scanner gun we had to use. iPhone 8 only.
First pass at a simple interface, getting ideas down.

As the lead user interface (digital) designer, I worked closely with service and user experience designers, front and back-end developers, and product team members. We managed relationships with third-party suppliers and vendors to ensure seamless integration of our solutions with mandatory tools and processes.

To keep everyone on the same page, I made sure I was frequently sharing the open links to Figma projects so anyone could come in and see the latest version of the screens—we had special approval from Shell IT to allow vendors access to our Figma workspaces. To go the extra mile, I ran short 10 minutes onboarding calls with anyone unfamiliar with design tools so they could confidently navigate my files inside Figma.

This flow I made in Whimsical became a source of truth for the whole team.


The Global Traceability Platform was successfully launched, meeting the tight deadline and delivering on Shell's contractual obligation with a key account. The platform has since proven effective in minimiing counterfeits, supply chain inefficiencies, and faulty products while enabling pallet, carton, and bottle-level traceability. This project showcases my ability to lead UI design, collaborate with multidisciplinary teams, and deliver results under pressure.

Final screens on the iPhone 8.
Alerts, adjusted for warehouse conditions.
Traceability Lookup, to view details about a bottle, carton or pallet.
Troubleshooting — understand why something went wrong.
Access the detailed view and dig into the data.

More case studies

Theft Insurance Flow Redesign

During some recent free time, I explored how the rental or hire industry could increase the sign-ups for theft or other insurance during checkout flows. Here's some of my thinking from a couple of hours.
Take a look

GoodNotes Design Leadership

Supporting 12 designers to define the future of digital paper, bring high-quality study notes to every student, and tell the world about GoodNotes. Led development of the "Ink" design system.
Take a look

Honey Design System

Honey is a design system for Hive Home, a smart home company based in the UK. I led Hive’s first design system to streamline the design process and user experience with beautiful UI and cohesive journeys.
Take a look

LubePro Global

The LubePro app had issues that made it awkward for technical advisors to capture and analyse data during site visits. They found it quicker to use a notepad and their iPhone camera.
Take a look

MarketHub 2.0

Shell MarketHub, a $19B B2B e-commerce site, had a considerable task when investing in a customer-centred digital overhaul. With 100k monthly orders, we faced an enormous challenge.
Take a look