Case study05 · Before AI
Clientum.ai
Years2014 — 2016
RoleUX / UI Designer · Brand & product
DomainConsumer mobile · Food intelligence

Designing
Food.AI,
in 2015.

— Thesis

A decade before “AI products” became a category: how do you design a smart food advisor that learns what you eat — without transformers, without LLMs, without anyone in the room having ever said the word chatbot?

UM.AI objective board: Personalisation, Smart Search, Food AI — with a brain-network glyph.
— Product

UM.AI — a smart food advisor, before that meant much.

UM.AI tracks what users eat and provides personalised recommendations for meal selection and nutritional value. Its core thesis: distil unstructured information from recipes, product databases and nutritional databases into a common food vocabulary the app can reason about.

In 2015 there wasn't a name for this kind of product. We called it Food.AI internally and shipped the first version on iOS to a small group of London users.

StackiOS · ruled-based recommender · curated food taxonomy
AudienceAccountant · Dieter · Mom of Two
SurfacesSearch · Discover · Log · Recommend
RoleEnd-to-end UX/UI, brand, motion, video
— 01 / Context
Where Food.AI lived in 2015

An early-stage startup, an even earlier AI category.

The interesting problem wasn't making the model smart. It was making the taxonomy smart.

I joined as an early member of the team and delivered the entire design surface across product, brand, marketing and investment — including promotional videos. The product was a logging app on the surface and a knowledge graph underneath: every meal a user logged extended a small, very specific food vocabulary the recommender used to talk back.

This is, in retrospect, where I learned what I now apply to LLM-era AI products: the trust people place in “intelligent” software has very little to do with the model and almost everything to do with the surface around it.

— 02 / Pain
Why food apps stayed shallow

What was wrong with food logging.

Most food apps were built for the algorithm, not the human. They asked you to learn their vocabulary.

A competitive analysis of food-logging apps surfaced two big, persistent problems: logging itself was painful, and search results were irrelevant. Both came from the same root cause — databases that were lists of products, not understandings of food.

The category had spent ten years optimising the act of typing food into a phone — and almost no time on whether the phone understood what you meant.

Pain 01 — Foods Logging

It's hard to navigate through the lists of food.

  • 01Generic taxonomy. Navigators have similar levels of detail across every category.
  • 02Effort first. Most of the lists are pre-set; users have to log everything from scratch.
  • 03No personalisation. The app doesn't learn from previous choices.
Pain 02 — Irrelevant Search

Less relevant results, and a thin understanding of what you typed.

  • 01Wrong matches. Lack of understanding of the fresh ingredients vs. branded products.
  • 02Chicken-broccoli problem. Search treats “chicken broccoli” like a phrase, not a meal.
  • 03No context. Time of day, last meal, dietary preferences are not used.
Fig. 02  ·  Competitive pain board Original artefact
UM.AI pain board: two cards 'Foods Logging' and 'Irrelevant Search Results' with bullet evidence and example screenshots.
— 03 / Objective
What we wanted the system to do

Three jobs the app had to learn.

“Food AI” wasn't a chatbot — it was a better lookup with memory.

The objective split into three things the product had to do well: personalisation (it remembers what you eat and adapts), smart search (it understands fresh vs. branded, ingredient vs. dish), and Food.AI — a small knowledge graph that connects families of foods to each other, so the system doesn't get caught by random word matches.

Objective 01

Personalisation

Tailored accommodations to user needs and tastes — every meal, every search, every recommendation, weighted by what they ate before.

↳ Habit memory
Objective 02

Smart search

At-a-glance results, real auto-complete — with hierarchical understanding of ingredients vs. meals vs. branded products.

↳ Taxonomy as UX
Objective 03

Food AI

Families and known relationships, so the system doesn't get caught by random word matches.

↳ Knowledge graph
— 04 / Research
Interviews · assumptions · personas

Three very different people, one system.

A single recommender had to serve someone who wants to eat less, someone who wants to feed others, and someone who just wants to not think.

Primary research started broad and then narrowed onto three lifestyle archetypes: the Accountant — busy, mid-career, wants to eat better but has no time; the Dieter — working towards a goal, needs precision and feedback; the Mom of Two — feeding others, juggling cost, allergens and time.

Same product. Three completely different definitions of “helpful.”

Fig. 03  ·  Personas Accountant · Dieter · Mom of Two
Three persona cards: Accountant, Dieter, Mom of Two — each with goals and pains.
— 05 / Architecture
A small site map for a deep model

The shape of the app, before any pixel.

The site map became the contract between the design team and the engineers building the food graph.

The app navigation was deliberately small — five top-level surfaces that mapped one-to-one with the recommender's capabilities. The IA was the easiest way to keep the model and the surface honest: if the engineer couldn't hang the feature on the IA tree, the feature didn't exist.

Fig. 04  ·  Site map A tree, not a list
The UM.AI app site map: hierarchical navigation tree of screens.
— 06 / Wireframes
Sketch · then ship

From paper to product, fast.

Low-fi sketches skip the most obvious dead-ends faster than any prototyping tool ever will.

I sketched the entire app on paper first — the same way I'd sketched buildings five years before, in architecture school. The low-fi version found the load-bearing decisions in a week. The hi-fi version locked those decisions into pixels in another two.

Fig. 05  ·  Lo-fi wireframes Paper · pen · one week
Two boards · onboarding & daily flows
Two paper-sketch wireframe boards of the UM.AI app: onboarding flow on the left, daily logging and dashboard flow on the right, with arrows tracing navigation.
Fig. 06  ·  Hi-fi wireframes iOS · final flows
Login · Profile · Dashboard · Timeline · Smart Logging · Recipe · Premium · Devices · Restaurant
The full hi-fi wireframe hierarchy for UM.AI on iOS: Log in / Sign up, Profile, Dashboard, Timeline, Smart Logging, Recipe, Premium, Devices and Restaurant flows, all laid out as a tree.
Every node connects to the site map opposite — the IA is the load-bearing diagram. ↳ Final wires before build
— 07 / Process
Five stages

The method, end to end.

A small studio doing big-studio work — every stage was mine to lead and ship.

One designer, one process, eighteen months. Below: the five stages, what came out of each, and which artefacts above belong to which stage.

— 01
Discover

Competitive analysis. Pain mapping. The two big problems of food-logging surfaced.

→ Pain board
— 02
Define

Three objectives written down. Personalisation, Smart Search, Food AI — the contract for everything else.

→ Objective trio
— 03
Research

Primary interviews. Three personas, three jobs to be done — same app, three definitions of helpful.

→ Personas
— 04
Architect

A small, opinionated site map. The contract between the design team and the recommender.

→ Site map
— 05
Build

Lo-fi to hi-fi in three weeks, shipped on iOS to a small private group.

→ Wires & visual
— 08 / Outcome
What the project actually became

An early seed of the work that came after.

The product didn't scale. The lessons did.
↳ The Food.AI taxonomy work directly informed the icon & quality-score systems I designed at SATIS.AI five years later.

UM.AI shipped, found early users, and eventually wound down — the way most pre-category startups do. What stayed with me was the thing nobody on the team ever said out loud: a product that learns from you is mostly a UX problem, not a model problem. I've been designing on that thesis ever since.

— Surfaces
5 screens
Search · Discover · Log · Recommend · Profile.
— Personas
3 audiences
One app, three completely different definitions of helpful.
— Role
1 designer
End-to-end UX, brand, motion, marketing & investor.
— Era
2015
Years before “AI products” was a job description.
— 09 / What this taught me
About designing for systems that learn

Lessons that aged well.

— Lesson 01

The trust layer was the interface, not the model.

Pre-LLM, the design problem was the same one I work on today: how do you make a learning system feel reliable? The model was rule-based. The trust was UX.

— Lesson 02

Taxonomy is design.

Without a good food vocabulary, the system would have recommended random crap. The recommender was only as good as the taxonomy — and the taxonomy was a design artefact.

— Lesson 03

“Smart” is what the design makes you feel.

Users called UM.AI smart long before it was. Auto-complete, sensible defaults and a clean log surface did the work the model couldn't yet.

— Lesson 04

One designer, one process — finishes things.

The instinct to over-stage AI projects starts here for me. The whole arc — discover, define, research, architect, build — can fit in one head and one ninety-day cycle if you let it.

— 10 / Continue ↳ More work