Shipping test-ready product design in 8 hours using AI
AI-assisted workflows
Design systems
Overview
This project simulated a realistic workday to explore how AI can function as a design teammate. Using a hypothetical fintech concept - an AI Investment Assistant - I examined how AI supports UI design and early design system exploration under real-world time constraints.
My role & Design focus
Led end-to-end design exploration, focusing on using AI to accelerate ideation and execution while applying human design judgment to prioritize, refine, and ensure quality in UI and system decisions.
Collaborated with
Chat GPT - strategy and ideation
Free AI tools - visual exploration, UI design, and preparing hand-off
Outcome
Accelerated UI exploration and early design system work using AI
Created a repeatable AI-assisted design workflow
Clarified where AI speeds execution vs. where human judgment leads
Why an 8-hour sprint?
It mirrors a real working day under normal constraints - not a hackathon.
Why focus on UI?
Current AI tools excel in pattern-heavy tasks: layouts, visual exploration, and UI patterns. Discovery work still requires deeper reasoning and contextual judgment, so I kept the scope intentionally “delivery-first.”
What we delivered in 8 hours
3 high-fidelity, test-ready screens
Mini design system (foundations + components)
Visual direction
Structured developer-ready Figma file
Kickoff meeting
Defining requirements
First, ChatGPT and I aligned on the scope and deliverables.
Deliverables
Input screen (goal amount + budget + CTA)
Loading screen
Suggested investment plan screen
Mini design system (foundations + components)
Visual theme exploration
Wireframing
Rapid wireframing by AI, finalized by me
AI
generated initial wireframes
I
merged the best elements from each and refined
Visual direction & Design tokens
AI explores the options, I define the direction
AI
suggested several visual direction, generated color palette
I
made the decision for visual direction, added tokens on Figma
Components
From AI drafts to polished components
AI
generated a neutral black & white component set
I
applied tokens, restructured patterns, refined
Design review & Final mockups
AI reviews, I decide the final design
AI
reviewed the design and provided feedback
I
built the hi-fi mockups, evaluated feedback and refine, finished up the design
Clean up & Organize
Preparing a clean, handoff-ready file
AI
renamed the layers, generated token documentation
I
reviewed the file and documentation
Figma AI: Rename layers
Figma plugin: Auto Documentation
AI impact: what actually improved
Based on my typical workflow, I found that AI noticeably reduced the time spent on execution-heavy tasks:
Wireframing
~70% faster
Initial component creation
~50% faster
Handoff cleanup
~80% faster
These improvements are not absolute benchmarks, but reflect the difference compared to how long these steps usually take me when working without AI tools.
The time saved allowed me to focus on the judgment-intensive parts of design, such as prioritizing information. AI handled speed. I handled direction and intent.
Retrospective
This sprint revealed a consistent pattern: AI accelerates execution. Designers ensure intent.
Where AI helped most
Option generation
Exploration at scale
Producing patterns quickly
Where human judgment remained essential
Structure
Reasoning
Product direction
Where AI consistently failed
Interpreting context
Prioritizing information
Key insight
AI excels at generating breadth. Designers provide the depth. The combination creates speed without sacrificing quality.
Going forward
My next direction is exploring how AI can support earlier phases:
Research synthesis
Insight generation
Hypothesis framing
