Preview and animation

Preview helps you inspect your work without treating every click as an edit. It is a check of supported content, not a guarantee that a generated application will behave identically.

Preview a page

1. Finish the current edit and open the intended page.
2. Enter the page preview available in your build.
3. Inspect text wrapping, images, clipping, styles, and configured interactions.
4. Return to editing to make corrections, then check the preview again.

Some preview workflows provide test data or scenarios. These are for inspecting the UI; they do not create production data or implement an application backend.

Prototypes and interactions

Prototype components and supported navigation can help communicate an interface flow. Configure the intended action explicitly and test its destination. Static buttons, a screenshot overlay, or a visual state alone do not provide working application logic.

Use a screenshot overlay as a visual reference, then create editable elements for the content you want to maintain. The reference image itself is not an editable UI hierarchy.

Animate supported properties

The current beta supports keyframe workflows for properties including position and opacity. Open the animation editing view, choose the relevant object and property, and check values at specific times before playing the sequence.

Keep the base layout and animated values in mind when checking the first and last frame. Animation keyframes are different from named milestones in editing history: one changes playback; the other identifies a previous edit state.

Video and recordings

Supported saved animations and editor-recording workflows can export MP4. Use the export action belonging to that workflow, select the available output settings, and wait for the task to report completion.

Open the resulting file in a suitable player and check duration, framing, and any audio or captions that matter to you. Some editor video previews are silent, and captions in an export may not appear in the editor's playback view.

Validate the actual target

A successful preview, a generated source directory, and a working deployed app are separate results. After generating code, build and run it in its target environment. Check the sizes and interactions that matter to your users. See Export and generation for the handoff workflow.