Making dietary needs the easy part of ordering treats.
Butter & Bloom is a concept ordering app for a neighbourhood bakery. Surveys and interviews with local customers, four personas and a five-person usability test shaped three things: a Vegan Mode people can trust, a menu that’s easy to scan, and a checkout with no surprises.
↓ Skip to what testing changed
01 · In brief
A small bakery, a big trust problem.
The problem
People with dietary needs couldn’t tell what was safe to order online, so they rang the shop, guessed, or gave up at checkout.
My role
Solo, end to end: survey and interviews, personas, journey maps, user flow, wireframes, a low-fidelity prototype, testing and the final UI.
What testing changed
A written VEGAN tag replaced the plant icon, “categories” became Shop, and the cart moved to the top-right corner.
Honest status
A self-initiated concept, designed and tested in Figma. Not built, not live, no sales data.
02 · Challenge
If you can't trust the label, you don't buy the cake.
Independent bakeries often list allergens on a card by the till, not online. For anyone vegan, gluten-free or ordering for a child with an allergy, that means a phone call or a guess. Custom cakes add another layer: sizes, flavours and collection dates that are hard to pin down in a form.
How might we
How might we make dietary needs the easiest part of ordering, not the riskiest?
03 · Research
I assumed people wanted a faster menu. They wanted a menu they could trust.
I ran short surveys and informal interviews with customers at a neighbourhood bakery: young professionals, families and retirees (5 people in total). Three patterns came up again and again: filtering, clarity and checkout.
04 · Personas & journeys
Four personas, one shared need: to trust the menu before they browse it.
I turned the research into four personas and mapped a journey for each. Amelia’s shows the problem most clearly: four of her five steps felt bad, and the worst was scanning the menu for something vegetarian.
05 · Structure
Everything one tap from home, and one clear path to pay.
Before any screens, I mapped the flow: getting in, a home hub with the floating nav, and a single ordering path from product to confirmation.
06 · Iteration
Four rounds, from grey boxes to the final app.
I tested a low-fidelity prototype first, fixed what people stumbled on in the second wireframes, then brought in the brand and made one more round of changes.
07 · Testing
Five people, three moments of hesitation, three changes.
I asked five participants to browse a category, favourite an item, buy something and switch on a dietary filter, then talk me through how each task felt. Overall they found the app easy to use. These were the three places they paused.
08 · Vegan Mode
Rule things out once, for the whole app.
09 · Design system
My components, rebuilt as reusable layers.
The visual language is soft and friendly on purpose: a bakery should feel like a treat. Pills with soft shadows signal “tap me”, and colour tells you what a button does.
10 · Final design
Six screens, one calm way to order.
Six screens that carry the whole idea: a welcome that sets the tone, a home screen that starts with dietary needs, a menu filtered by Vegan Mode, a product page with allergens, one order page and a confirmation with the pickup time.
11 · Accessibility
I audited my own final screens, and found four fails.
Accessibility was part of the brief from the start, especially for older customers. Running the palette through WCAG contrast checks showed the buttons are fine but four pastel-on-pastel words are not. The fixes below are next-round proposals.
Next project
Margins: spoiler-free reading with friends
13 · Options I rejected
Options I rejected.
Research and the usability test talked me out of four things I started with.
✕ Rejected
A faster menu
✓ Instead
A menu people can trust: dietary filters first, then browse what’s left.
✕ Rejected
A plant icon for vegan
✓ Instead
A written VEGAN tag on every card, and a switch called Vegan Mode.
✕ Rejected
“Categories” as the menu label
✓ Instead
Shop, with “Shop by cravings” on the home screen.
✕ Rejected
Notifications in the top-right corner
✓ Instead
The cart goes top right, where people look for it. Notifications join the floating nav.
14 · Reflection
Clarity drives confidence. Words beat clever icons.
The biggest wins came from plain language, not new features: a written VEGAN tag, “Shop” instead of categories, a cart where people expect it. Personalisation mattered too; dietary filters made the app feel like it was built for the person using it. Next time I’d test labels before polishing visuals, and check contrast while choosing the palette rather than after.
Next project