Prototyping

Prototype with real components.

Wire screens into a flow people can click through, share a link, and collect feedback on the components themselves.

How it works

From screens to a shareable prototype.

The prototype is the design itself, built from your components. There's no second copy to wire up and keep in step.

  1. 01

    Connect screens.

    Select an element and choose the screen it leads to. The transition stays attached to that element when you edit.

  2. 02

    Play it.

    Play mode clicks through the flow with the same rendering as the canvas.

  3. 03

    Share a link.

    Anyone with the link can click through in a browser, with no account or install.

Adding an on-click transition to the next screen

Transitions between screens. Pick an element and choose the screen it leads to.

A shared prototype open in a browser

A link anyone can open. The prototype runs in the browser. Viewers need no account or install.

Comments

Comments on components.

Comments are pinned to the element they're about, and stay with it when it moves. Feedback stays next to the design instead of in a chat thread.

Reviews

Sign off on a fixed copy.

Save a version for approval while work carries on in the live project.

A flow on the canvas with an on-click transition in the inspector

Named versions. Save a version with a name and a note, then view or restore it in the editor.

Drafts stay out. Frames that aren't connected to the flow can't be reached in the prototype.

Live cursors. See who is in the project and what they have selected.

Notifications. Comments and replies reach the right people in Statecraft and by email.

Build a prototype with your components.