How we built a Flutter-powered AI coffee shop
Article Summary
Craig Labenz from Google's Flutter team turned conference coffee into an AI-powered experience that served 3,000 personalized lattes. The secret? GenUI that lets Gemini dynamically build custom interfaces on the fly.
Google's Flutter team built GenLatte, a demo coffee shop that appeared at Cloud Next and Google I/O. The app combined Flutter, Firebase, Gemini, and Nano Banana to generate personalized latte art based on users' 'happy place' prompts, complete with AI-generated questions to refine the images in real-time.
Key Takeaways
- Monorepo architecture with 5 separate UIs: kiosk, barista, moderator, queue, and display screens
- Three-tiered content moderation: Gemini Flash screening, Nano Banana training, and human approval
- GenUI dynamically selected UI widgets (text fields vs radio buttons) based on question type
- Served 3,000 personalized lattes across two major conferences with zero security incidents
- S-curve composition prompting dramatically improved Nano Banana's image appeal rate
The demo proved GenUI can deliver production-grade experiences by letting AI choose appropriate UI components at runtime while maintaining strict design guidelines and security controls.
About This Article
Craig Labenz's team had to stop conference attendees from posting inappropriate content to a public demo without breaking the user experience across multiple backend screens and admin interfaces.
They used declarative routing checks in GoRouter with Firebase custom claims to block unauthorized access to moderator and barista screens. They also added strict Firestore security rules that required all reads and writes to be tied to account credentials.
GenLatte served 1,200 lattes at Cloud Next and 1,800 at Google I/O with no security incidents. This showed that Firebase's security model could protect production experiences even when deployed to the web, where users could navigate directly via URL bar.