Problem Statement
Our platform lets users review 3D models in the browser, but the viewer only had a flat, solid-colour background. A detailed 3D asset looks great in a realistic environment but completely wrong in a flat grey void. To see it properly, reviewers had to export files into complex external software, which broke their workflow.
The End-to-End Process
I focus on building integrated pipelines rather than drawing static screens.
Automated Requirements
Using Zoom MCP servers connected to AI tools, live project meetings were automatically transcribed and turned into structured developer tickets instantly.
Direct-to-Code Prototyping
I skipped drawing high-fidelity screens. Instead, I built a basic wireframe to give the AI a visual target, then used Claude Code to spin up a code branch. The feature was built using real components from our live design system.
The Shared-Language Review Loop
I set up a tight three-person loop (Designer, Developer, Product Manager). Because the prototype was built in the actual codebase, we tested it live. Edits were made directly via AI during our calls, eliminating back-and-forth cycles entirely.
What changed
| Improvement | Change | Benefit |
|---|---|---|
| Curated Presets | Added a simple choice of pre-set realistic lighting environments (Studio & Outdoor). | Solved the user problem instantly without making them upload heavy files. |
| Segmented UI | Introduced a clean toggle switch between “Color” and “Image” modes. | Kept the original colour-picker for existing users while making space for future updates. |
| Clear Terminology | Renamed the section from “Environment” to “Background and grid”. | Made the interface instantly understandable, removing technical jargon. |
| The Handoff Bundle | Shipped a text-based spec, visual snapshots, and the working code branch. | Developers loved this format. It provided total clarity and removed visual guesswork. |
Impact & Results
| Area | Outcome |
|---|---|
| Better Handovers | The handover spec enabled us to produce features much faster. While other teams struggled to adopt code-led design, our pod was actively shipping. |
| Faster Time to Market | This pipeline unlocked a ~25% increase in feature releases. More importantly, it allowed us to successfully publish end-to-end features that would’ve normally taken much longer. |
| Team Empowerment | The team felt completely empowered by having working prototypes. Product managers and developers could be directly involved in the design process because everyone finally spoke the same language: code. |
Driving Innovation
I genuinely enjoy finding and building workflows, making me uniquely skilled for AI-integrated roles. I don’t gatekeep my findings - I actively share these processes with the wider team. By constantly investing time into pushing what AI can do, I ensure our team stays a step ahead while continuing to ship features quickly.
