Projects using Stitch in RabatProjects using Stitch in RabatBayen AI — an AI shopping agent, designed end-to-end with Google Stitch
I'm launching Bayen AI before it's finished — the realtime UX and agentic animations I built with Google Stitch were too fun not to share, and I'd rather show a real, in-progress build than a polished demo.
The story. I found Stitch ~3 months ago and finally built the front end I'd been stuck on. I'm building Bayen solo — infrastructure, backend, matching layer, all of it — so the UI kept slipping. Stitch is what unblocked me.
What Bayen is. An AI shopping agent: you prompt it, it matches and finds the right products across sources — AliExpress, Amazon, Alibaba, and more — so you can find, track, and buy in one place through the sources' official APIs. People first; businesses later. This is a product I'm actually shipping, not a challenge demo — just an early phase.
🛠️ What I built
A complete, on-brand frontend, generated with Stitch during the challenge:
Personalized home — auto-matches to signals (location, currency/language, browsing) with a "matched for you" feed.
The agent — an animated prompt composer: Smart / Deep Smart modes, voice, camera (shop-by-photo), a multi-source toggle, and a / skill palette of source "portals" the agent can call — aliexpress_portal, alibaba_portal, amazon_search, /compare, /track, /under.
Realtime PDP — live price + drop indicator, 30-day sparkline, USD/EUR/MAD switcher, and a Compare Offers table flagging the best live source.
Payment handoff — routes the buyer to the source's official checkout (e.g., Amazon) with affiliate disclosure, plus a Track price popup.
Admin — dashboard, orders, returns.
Design: monochrome zinc + one confident red accent, Poppins (JetBrains Mono for prices), an animated lowercase bayen ai wordmark, full light/dark + responsive.
🔗 Link
https://stitch.withgoogle.com/projects/6579973469378019461
(https://stitch.withgoogle.com/projects/6579973469378019461)✨ How I used Stitch
Stitch generated my entire frontend, not just mockups — via its 2026 Vibe Design workflow:
Multi-screen generation — I described each route in natural language; Stitch produced the whole connected flow (home, agent, PDP, payment, admin).
Design system as text — I fed it a structured spec (tokens, type ramp, components) in the spirit of Stitch's DESIGN.md format, so every screen stayed in the same zinc + red + Poppins language.
Streaming design agent — refining by prompt/voice with live render let me pivot the whole system (flat monochrome → Poppins + red, then rebuild the composer and admin sidebar) in minutes.
Newly launched feature showcased: Vibe Design + multi-screen generation, plus the streaming design agent.
🎞️ Motion, interaction & dynamic UI
Send → generation — the prompt rises into a bubble, the agent streams its "thinking", the reply types in, then product cards stagger in with deal badges popping and prices counting up.
Dynamic composer — sliding Smart/Deep Smart toggle, source dropdown with a number-pop, voice waveform + timer, and a / palette that filters as you type.
Realtime feel — a Live Deal Tracker with pulsing "live" dots and price deltas, plus a price-confirming state in the payment handoff.
🔌 External integrations (in progress)
Headless: a Shopify backend for owned catalog/orders, and official source APIs (AliExpress, Amazon, Alibaba) for matching, live pricing, and the buy handoff — with multi-currency FX.
💬 My feedback on Stitch
Loved: the speed (idea → real screens) that finally unblocked my front end; natural-language multi-screen generation that kept the flow coherent; design-system-as-text (DESIGN.md-style) that made a brand pivot ripple across every screen; real, buildable structure, not just pictures.
Would love next: finer motion-timing/prototype-link control so animated states export as a playable flow; deterministic tokens (lock a hex/spacing scale); better real image fills and reusable components.
Net: Stitch went from "fun to try" to the core of my workflow.
🖼️ Screenshots / recording
Agent match feed, PDP with Compare Offers, personalized home, Admin dashboard — plus a recording of the animated prompt → results flow.
🎥 Walkthrough (bonus)
Video attached, and on Loom (https://www.loom.com/share/85be2bf6a40c41c5aceca35ff8f44c01).
Note: brand names (Amazon, AliExpress, Alibaba) are referenced as planned official-API integrations; product imagery is placeholder/generated.
