The new design handoff isn't just for a human engineer; it's for their AI agent. The process now involves preparing summary documents and high-level context that an engineer's agent can interpret to assist with implementation, changing how designers package their work.
The long-held fear of duplicating component libraries is now obsolete. AI agents are so proficient at translating and syncing code between environments that maintaining a separate, prototype-optimized version of your production code is a viable and powerful strategy for accelerating design.
AI makes high-fidelity mockups easy, risking premature feedback on visual polish. To counter this, intentionally apply a low-fidelity style (e.g., grayscale, handwritten font) to high-fidelity code. This visually signals the work-in-progress stage and focuses critiques on core concepts.
To iterate faster with AI, have it describe design approaches in text first. This allows for quick evaluation of the core concepts, enabling you to reject bad ideas before wasting time and resources on generating full user interfaces for them.
Embed your team's design principles into your development environment so an AI agent can perform automated critiques. This provides an objective first-pass analysis of new designs, ensuring they align with core values before involving the wider team.
A flexible design prototyping environment can serve a dual purpose. At Sublime Security, prototypes that solve recurring needs for the brand and marketing teams鈥攍ike an Open Graph image generator鈥攁re "graduated" into permanent, self-serve internal tools within the same system.
A sweet spot exists between disposable mockups and rigid production environments. A centralized, code-based sandbox offers the flexibility of open-ended prototyping while allowing the design team's work to compound over time, avoiding the constraints of production code.
Patrick Morgan's complex prototyping environment wasn't built from a grand blueprint. It evolved one feature at a time, with each addition solving the next immediate "tension" in the workflow鈥攆rom centralizing files, to getting feedback, to creating repeatable prototype setups.
In agentic workflows, structured documentation (e.g., Markdown files defining rules and data structures) acts as the primary control layer. This "shadow application" written in Markdown becomes the API that allows the agent to orchestrate complex tasks correctly.
Instead of building a complex, backend-heavy commenting system from scratch for his custom tool, Patrick integrated Vercel's Toolbar. This solved the critical need for feedback collection on deployments with minimal engineering effort, demonstrating a pragmatic approach to internal tooling.
