Made by Michael
A Jimmy Brings home screen that surfaces the full range, without growing the app.
I redrew the e-commerce flow from research to final. Single-axis scrolls gave way to multi-axis browsing that lets 104 products read like a real range.
Brief
An innovative solution to the Jimmy Brings e-commerce app, shaped by quantitative and qualitative research. Modern, usable, and desirable for the user.
Problem
The original home screen used single-axis scrolling with category drop-downs, so the full catalogue stayed buried. Heavy type and dark surfaces pushed against the premium positioning. The range read as thin even though there were 104 products on offer.
My role
Sole designer on a self-directed end-to-end exercise during my UX/UI postgraduate year:
- Quantitative and qualitative research with target users
- Four personas drawn from interviews and questionnaires
- Affinity mapping across Jimmy Brings and Uber Eats
- UI flow, ideation, low-fidelity wireframes
- Colour, typography, iconography
- A/B testing of two home-screen architectures
- High-fidelity final and prototype hand-off
A premium feel, with the full range surfaced in a single scroll.
Current interface
Single-axis scroll with category drop-downs underneath. Quantity selection was simple and worked. Heavy type and dark surfaces pushed against the premium feel. The payment screen, by contrast, was efficient.
UI flow
The end-to-end app flow: age-gate, login, home, category, product, cart, payment, and live order tracking. Mapping it in one view made it clear the home screen was carrying too much of the navigation work.
Landscape review
Three e-commerce apps reviewed. Wide reading on layout types — landing and product page focus.
Dan Murphy's
Intricate category and search system. Bottom navigation bar for smooth transitions between sectors.
Gumtree
Columns driven by search. Lets users narrow quickly to what they want.
Uber Eats
Multi-axis scrolling — users move effortlessly between categories. An app the Jimmy Brings demographic already knows.
Affinity map
Observation, interviews, and usability testing on Jimmy Brings and Uber Eats. Three clusters carried the weight: navigation friction, perceived range, and category visibility.
Insights
From interviews and the affinity-mapping process:
- "No back button." Moving between categories meant scrolling all the way back up.
- "Limited offerings." 104 products, but the layout made it feel thin.
- "They could use multi-axis scrolling like Uber Eats." Show range, prompt impulse buys.
- "That category should be highlighted from one to another." Visible variety.
- "I like scrolling — it's what I'm used to." Keep the gesture familiar.
Personas
Four personas representing the Jimmy Brings target market — updated through the design process and revisited at every decision point.
Ideation & low-fi wireframes
Two home-screen architectures came out of ideation — one vertical, one multi-axis. Both taken to low-fi so I could test them on real devices.
Colour, typography, iconography
Brand purple as accent; surface to white. Lighter body type for legibility on long category lists. Iconography minimal — hamburger, cart, back chevron.
A/B testing
Both variants tested on target users: find a specific bottle, then browse for something for a party. Variant B (multi-axis) won on both. It carried into the final design.
Final design
Multi-axis lanes on the home, lighter typography, brighter palette, and a back-button pattern that respects how users move between categories.
