A companion app users could search, save and shop from.
Data-driven personas built from 6 structured interviews.
Participants sampled across ages, genders and nationalities.
Design iterations shipped directly from guerrilla-testing insights.
Project Overview
Project Overview
The user problem
The 99kcal website let users locate recipes but was fairly restrictive in the flexibility it gave them: no way to save recipes conveniently, no control over their own data on-device, and no way to customise the experience to their tastes.
The business objective
Extend the 99kcal.com lifestyle project into a companion app where users could easily find recipes tailored to a low-calorie diet, save them conveniently, and understand which ingredients suited a calorie-restricted lifestyle.
My role and scale of ownership
I designed the 99kcal.com lifestyle brand and experience owning research, information architecture, user flows, wireframing, prototyping, guerrilla testing and final mockups, including the app's photography and content.
How I got from insights to product value
Discover
Heuristic evaluation of competitor apps and 6 structured interviews shaped 3 core user personas.
Define
Expressive scenarios captured user needs and shaped the sitemap and user flows.
Design
Hand sketches evolved into high-fidelity wireframes and an interactive prototype.
Deliver
Guerrilla-tested mockups, iterated on findings, and produced final photography and content.
Execution
Execution
The problem with the website
The website let users locate recipes, but gave them little control: no way to save data on their own device, personalise the experience, or keep coming back for more than one lookup. The app needed to solve three things: recipes tailored to taste, easy return to what they'd already found, and a reason to open it again.
Who we designed for
A heuristic evaluation of competitor recipe apps set the baseline for table-stakes features. From there, 6 structured interviews on weight-loss routines and recipe habits shaped 3 user personas and the needs behind them.
3 personas, each with traits, frustrations, motivations and current behaviour.
The clearest signal: users wanted to search by ingredient or diet, not just recipe name, and to return to recipes they'd already found. Calorie-swapping ingredients and a running shopping list came up just as often. Each need became an expressive scenario, feeding directly into the flows and later testing.
User stories, each paired with an expressive scenario written for that feature.
From sketch to flow
The needs research set the entry points for a sitemap covering every feature, with deep linking connecting related journeys across the app.
Information architecture: sitemap.
User flows, drafted from the expressive scenarios, mapped every use case and decision point across the app.
User flows.
From there, hand sketches materialised the concept fast and cheap, before moving to high-fidelity wireframes and a working prototype to test the interactions directly.
Hand-sketched low-fidelity wireframes.
High-fidelity wireframes.
Evaluating with real users
Sample: 10 participants across age brackets, genders and nationalities.
Guerrilla testing on navigation, feature definition, CTA placement, affordances and UX copy surfaced four concrete iterations:
Guerrilla testing iterations
Grid and landscape views for the calorie count, surfacing more items at once.
Deep linking from the ingredients list back to the recipe that needed it.
Sharper UX copy on calls to action.
Snapping a picture to extract a calorie count, instead of searching for an ingredient.
Final mockups, incorporating the guerrilla testing iterations.
The photo-based calorie counter became the strongest signal for what to build next: it addressed a real point of friction guerrilla testing exposed, not a guess.
Mockups closeup: recipe screen and shopping list.
Results & Business Impact
Results & Business Impact
Validated against the needs it was built to serve.
Usability testing confirmed the experience catered for the main user needs around searching, finding and saving a recipe, while also surfacing the next round of enhancements to design for.
Research-backed personas built from 6 structured interviews across geographies and demographics.
Design iterations shipped directly from guerrilla testing feedback, from grid views to deep linking.
Core needs, validated
Testing confirmed the app served its core purpose well: users could search, find and save a recipe with ease, and additional quick-win enhancements to the ingredients list and calorie count experience were folded into immediate design iterations.
A clear future direction, uncovered
Testing participants were content with both a text and visual search for the calorie counter, useful for non-native speakers, but felt restricted by needing to search within an existing ingredient library. This surfaced the need for a future, image-based calorie counter, addressing the "user control and freedom" heuristic.
A path beyond the website
The app gave 99kcal.com a companion experience with the flexibility, data control and personalisation the browsing-only website could not offer.
Research-backed personas
Three data-driven personas, built from structured interviews across geographies and demographics, gave a shared reference for every design decision from IA through to content.
A backlog grounded in evidence
Guerrilla testing translated directly into a prioritised set of design iterations, from grid/landscape views to deep linking and an image-based calorie counter, rather than a backlog based on opinion.