Role : Lead Product Designer · Team : 2 PM, 1 Engineer, 1 QA · Timeline : 4 weeks · Platform : Mobile (Web)
Shipped to 8+ consumer brands simultaneously. Zero per-brand layout changes.
One product, 8+ consumer brands. Every design decision I made shipped simultaneously to millions of users, with no ability to customise per brand. That constraint shaped every call.
WHO'S USING THIS?
A mobile user in a short session she treats as entertainment. Deciding fast, often distracted, on a small screen. The surface had one job: surface the right information before she moved on.
THE PROBLEM
The brief said visual. The data said something else.
A −15% DAU drop was flagged as a design problem. Before opening Figma, I mapped session drop-off with the PM and Head of Product to confirm whether friction was in the lobby or upstream.
The lobby wasn't failing visually. It was failing informationally. Price, urgency, and availability were buried — no hierarchy, no urgency signalling, every listing visually equal. Users couldn't extract what they needed fast enough to act.
Scattered decision signals
No priority hierarchy
Low Conversion Rate
(11.5%)
THE INSIGHT
We were violating a scanning pattern we already knew about.
F-pattern scanning: attention lands heaviest top-left and drops off fast. Our cards placed every decision-critical signal — price, urgency, availability — centre and right. Exactly where attention dies.
The fix wasn't more information. It was moving the right information to where eyes already land.
P1
Countdown Timer
creates immediate urgency
(Urgency/Cost)
P2
Ticket Price
captured early in the scan
(Cost)
P3
Jackpot
primary financial motivator
(Incentive)
EXPLORATION
Three concepts. Each tested a different hypothesis.
Concept A
Rejected
AI-assisted exploration, tested against our existing user data. Structurally too long — not enough games visible above the fold. Scrolling to decide is a conversion killer for this user. This is the moment we committed to a horizontal tile: the only format that surfaces enough options while maintaining a clean left-to-right scan.
Vertical card
Structurally almost identical to what we shipped. One PM pushed for an explicit buy button. I pushed back: tapping a listing already opens a purchase overlay inside the game room — a progressive disclosure pattern that reduces purchase anxiety. A tile-level button duplicates the action and consumes the space we needed for urgency signals. We removed it. Testing tap-to-enter with real users is the V2 research priority.
Concept B
Horizontal tile + buy button
Concept C went through three rounds of layout iteration before the F-pattern hierarchy was locked. Decision signals anchored top-left in priority order: countdown timer (urgency), ticket price (cost), jackpot (incentive). Deployable across all consumer brands without touching the layout.
Concept C
Horizontal tile + with improved layout
Selected
AI VALIDATION - ATTENTION INSIGHT ANALYSIS
Validating the hypothesis before a line of code was written
THE FINAL DESIGN
Key annotation callouts:
REFLECTIONS
What I'd do differently, and what comes next
Test tap-to-enter earlier. The progressive disclosure decision was grounded in established UX convention, not usability evidence from this specific audience. A 20-person moderated session pre-launch would have confirmed the assumption or caught an edge case before ship.
Instrument card states individually. We measured conversion at the surface level. We didn't know which state — filling fast, full, starting soon — was driving or blocking conversion at the card level. That granularity would have made V2 decisions significantly sharper.