The business needed a way to surface promotional messaging on the device listing page, but the original brief would have produced a one-use component. Through competitor research I proposed mixing flexible cards within the device grid rather than above it, and expanded the scope so the component could support any campaign without going back to dev. Stakeholders chose my solution over one that had already been built and was waiting to go live.
The Problem
The business wanted to surface “Why Choose Three” messaging on the device listing page, things like network quality, rewards, trade-in, insurance and partnerships. Without a plan, every future campaign would need its own build and the page would gradually become a mess. What I didn’t know at the start was that a solution had already been built: three fixed promotional cards sitting above the device grid, done and waiting to go live.
Approach
Look at who has already solved it
My starting point was competitor research. I looked at O2, Vodafone, EE, Sky Mobile and Tesco Mobile, then widened the lens to Currys, Apple and John Lewis. Vodafone and O2 were already mixing promotional cards in amongst their device cards rather than above them. The page kept its primary purpose intact while the promotional content sat naturally within it. People go to a device listing page to look at phones. Pushing that content down works against the user, even if it serves the business short term.
Expand the brief before designing anything
The original ask was a component for “Why Choose Three” messaging. I pushed back on the narrow scope early. If the card had space for an image, title, copy and a CTA, the content could be anything: network perks one month, Black Friday the next, a device launch the month after. Done right, it could handle any campaign without going back to dev. When I later found out a fixed three-card solution had already been built, the contrast was clear. Those cards could only do one thing. Mine could do many.
Use high-fidelity designs to win over developers
The development team pushed back on the flexibility I was asking for. More flexibility meant more build work. I showed them rather than told them, with detailed high-fidelity examples of the same component used for completely different content types. Once they could see it in action the conversation changed.
Write the rules, not just the design
Alongside the component I wrote clear guidance: when the cards should be used, how many should appear on a page, how content should be structured. Without that, there’s nothing stopping the page from becoming exactly the kind of promotional clutter the design was meant to prevent.
The Original Cards
When I presented the proposal, the stakeholders who had commissioned the original solution chose to switch. The existing cards were turned off. Mine will go live instead, mixed in amongst the devices, flexible enough to support whatever the business needs to say at any given time, with guardrails to stop the page from being overloaded.
The previous solution could only do one thing. The goal was to build something that could do many, without needing a developer every time the message changed.
Status
The component was close to complete at the first dev review before I left. It’s due to go live within the next few months and the business is keen to use it.
Reflection
Competitor research is something I do on every project and it consistently pays off. There’s almost always someone who has already wrestled with a similar problem. Starting there doesn’t limit the solution. It just means you’re not solving from a blank page when you don’t have to.
The value of showing rather than describing also came through clearly here. The developers didn’t need a longer explanation of why flexibility mattered. They needed to see it. The high-fidelity examples did that job in five minutes.