Background

When I started working on the kiosk, loyalty was simple. It was just a banner on the basket screen where guests could scan or type a discount code. One code per order. That was it.

Initial loyalty journey

Over the next few years, the loyalty offering expanded substantially:

• Authentication evolved from basic user ID to phone number, email, and at one point even face scanning. A dedicated loyalty screen was added where operators could upload custom branding.
• Discount management grew from single-use codes to multiple vouchers active at once. I created a discount hub to help guests manage them.
• Redemption methods multiplied from manual number entry to three options: alphanumeric keyboard, keypad, and selecting rewards from a list.
• Automated features arrived: a wallet that applied proactive rewards automatically, with stamp cards coming next.

Each of these had been designed and shipped more or less independently. By the time there were enough of them, the basket screen was difficult to manage. Every new feature made it harder. The underlying problem was that there was no system for how loyalty features should coexist. Each addition had been treated as a separate solution rather than part of a larger architecture.

The business cost was real. Every new loyalty integration required design work from scratch and weeks adapting the existing system to fit it in. What should have been straightforward feature additions became extended projects, with scope, timelines and costs growing each time.

My Role

I led the design on this project from initial scoping through to development handoff, owning decisions on UX structure, component architecture, and visual direction. My colleague supported me with preparing flows and documentation given the scope of scenarios to map out. Direction was shaped in close collaboration with my manager.

The work involved:

• Mapping every possible feature combination and its resulting UI states
• Defining interaction patterns, edge cases, and copy for each scenario
• Collaborating closely with developers to prepare handoff documentation they could build from directly
• Working with the Product Team to frame the modular approach as a product strategy, not just a design deliverable

The Problem

There were two separate but related design problems happening at once.

The first was scalability. There was no coherent system for how loyalty features should work together. When only code entry existed, the design was straightforward. Each new addition - login, multiple vouchers, proactive rewards - needed its own solution, and none of them had been designed to sit alongside each other. The result was a patchwork that became harder to navigate as more features went live.