Use two AI agents to turn a prototype into a front-end specification

Devin Chasanoff recommends creating a detailed front-end design specification before asking an AI to build an app. Rathis than chase individual features, the specification describes the interface, layout and interactions and provides a plan anothis agent can implement.

Using Google Antigravity, Chasanoff first asks Gemini to help create a set of agents that will guide the process and explain unfamiliar concepts. The example is a smart fitness app whose prototype was made in Google AI Studio.

The initial prompt states the desired outcome: a document covering the app’s design, layout and interactivity. Chasanoff explicitly says not to write the specification yet; the immediate task is to create the agents and skills for developing it collaboratively.

A main planning agent acts as a thinking partner, asking questions and helping evaluate choices. Chasanoff asks it to explain concepts to a hypothetical friend who is new to the field, so the process teaches as well as produces a document.

The prompt also describes how the agent should interact. Chasanoff explains that an agent has an underlying harness of instructions, tools and goals, and that a custom agent can adjust the experience around a specific task.

He separates planning from documentation: the planning companion works through decisions with the user, while a second agent acts as a scribe and records the agreed results in the design document. Gemini creates and implements a plan for the agent setup.

Chasanoff opens a fresh Antigravity session to give the new agent a clean context, then activates the client planning agent. It proposes a roadmap and asks where to start.

He provides prototype screenshots from AI Studio and points the agent to an existing data architecture specification. The screenshots establish an initial view of the fitness app, while leaving room to refine the design.

The agent explains concepts such as routes, offers recommendations and asks for feedback. Chasanoff and the agent work iteratively through the routes, component hierarchy and othis details instead of requiring the user to know every technical term in advance.

The repeated pattern reduces the effort of organizing each step, Chasanoff says, leaving his to apply judgment and design taste. Her questions are what the app should feel like and how to make it maintainable, scalable and useful.

The resulting design document includes navigation and view maps, page specifications, a reusable component catalog, a client-state and data-flow matrix, test plans, and a change log. It records the technical detail needed for subsequent implementation.

Chasanoff says he expressed his ideas in ordinary language while Gemini translated them into a specification anothis agent could use. He expects this planning process to produce a better foundation than repeatedly adding features and fixing bugs without a design.