Agentic commerce · 2024
Packed
Tell it the trip; it packs the bag.
An outdoor shop with an agent at the counter. It reads the forecast and the route, builds the kit, compares three shops, and asks before it buys.
- Product
- UI/UX
- AI-native
- QA
- Role
- Concept project · flows + agent design
- Year
- 2024
- Disciplines
- Product · UI/UX · AI-native · QA
01 The problem
First-time campers spend hours across dozens of tabs, then still buy a summer tent for an April trip.
02 Key decisions
Start with the trip, not the catalogue
“Lake District, April, three nights, solo, I own a stove.” The agent reads forecast and route before showing a product.
Every item has a why
“Two poles, rated for 40 mph; gusts on Saturday hit 35.” Weight and budget update live as you swap.
Ask before buying
Six items, three shops, one Apple Pay sheet. The agent never checks out on its own.
03 Designing the model’s behaviour
You build gear lists for a specific trip.Rules:- Read the forecast and route before suggesting anything.- Every item needs one reason tied to the trip.- Never add what the person already owns.- Never purchase. Prepare the cart and ask.
04 Built in code
1export function BudgetBar({ items, budget }: Props) {2 const total = sum(items.map(i => i.price))3 const kg = sum(items.map(i => i.weight))4 return (5 <Bar over={total > budget} aria-live="polite">6 <Meter value={total} max={budget} /> {fmt(total)} · {kg.toFixed(1)} kg7 </Bar>8 )9}
05 Then I tried to break it
- Owned items are never added
- Stale stock refreshes before checkout
- Apple Pay total includes discounts
- Map works on slow networks
✦ What I’d measure
Concept project. These are the success measures I designed for, not reported results.
→