Prototyping

The prototype is where most of the design work happens. It's optional, but for any change with meaningful UI implications, it's the most powerful tool Itera offers.

What a prototype is

When you click Generate Prototype, Itera starts a development server for your frontend. The dev server runs the current main branch of your repo, with the changes from your iteration applied on top. The prototype uses the backend or API endpoints configured by that dev server, so interactivity depends on your project configuration and available runtime services.

You see the prototype on the right side of the screen, with a chat panel on the left. From here you can:

• Type prompts to refine the change
• Send screenshots to give visual context
• Attach files
• Reference a Figma link, if your Figma account is connected
• Use Select to point at a specific component and ask the agent to change it

When you're happy with how the prototype looks, click Apply changes. The changes flow back into the iteration's specifications, ready for engineering.

The change log

Every prompt you send while prototyping creates an entry in the change log. You can browse the history and revert to a previous version if you go too far in the wrong direction.

What a prototype isn't

A prototype is not the production code. The coding agent doesn't ship the prototype as-is. Instead, the prototype produces a visual reference and UI patch that the coding agent uses during the building phase to implement the approved UI in production code, alongside any backend or architectural work that needs to happen.

Think of the prototype as a much more precise version of a Figma file: instead of a static mock, you're handing engineering an interactive, runnable example of exactly what the change should look and feel like.