Into the AI Ocean
Session 3 at the UXmm bootcamp, on scaling design systems with AI, and how to keep a system consistent when AI writes a big part of your UI.
Lead Product Designer / Bangkok
8+ years shaping fintech, SaaS and AI products across Southeast Asia. I design from the first screen to production code, with Claude Code and Figma MCP, so nothing gets lost in handoff.
Live demo
Frame, Code, Ship. Hover to pause.- Layers
- ▾ 01 Home
- Header
- ▾ PointsCard
- Tier badge
- Points
- Progress
- QR row
- QuickActions
- TabBar
MEMBER CARDGOLD
2,450 points
550 pts to Platinum
PointsCard
- Direction
- ↓ Vertical
- Gap
- 20
- Padding
- 22
- Radius
- 28
Selected case studies
All work ↗Live, in active developmentKlink V3AI-native omnichannel contact center
LiveBangkok Design SystemCode-first design system
Live24eduAI education product
In developmentZed, a dual-subtitle playerEnglish learning Chrome extension
By the numbers
- 8+
- Years in product design
- 10
- Brands worked with
- 3
- Industries: fintech, SaaS, AI
- 0→1
- Where I do my best work
Teaching and talks
How I work
- 01Frame
Shape flows in Figma, grayscale first. Color only where it means something.
- 02Encode
Turn decisions into tokens, skill files and CLAUDE.md rules.
- 03Build
Generate real components with shadcn/ui and Next.js through Figma MCP.
- 04Ship
Deploy, measure, and feed what we learn back into the system.
Worked with
10 brands
