Design and layout

Use the canvas to explore a layout and the layer tree and property controls to refine it. The selected element determines which properties you are changing.

Select and organize

1. Open the intended page in the project tree.
2. Select an element on the canvas or in the layer tree. Use the tree when elements overlap.
3. Give important elements recognizable names so that review comments and AI instructions can identify them.
4. Group related content using containers. Check parent and child relationships before moving a group.

Locked or temporarily hidden layers can affect selection and visibility. If something seems missing, inspect the tree before recreating it.

Adjust geometry and text

Use position and size controls for exact values. For a container, choose the layout behavior supported by that document and check how its children respond. Rulers and guides help you align elements visually.

For text, set the content, font, size, weight, and line height. Give longer copy enough width and height. Check that the text is readable in preview rather than relying only on the selection outline.

Installed fonts and target-device fonts are different dependencies. A font that appears in your editor may not be available in generated output unless the chosen export workflow can provide it.

Add images and styles

Use the project's asset workflow to import local images. When an asset has multiple specifications, place the intended specification and check its crop and size. Keep referenced files with the project when copying or sharing it.

Styles and themes help reuse appearance. When a property follows a style or theme, inspect its source before setting a local override. Effects such as shadows or blur can vary by document type and export target.

Check the result

Review alignment, text wrapping, contrast, spacing, and the order in which the page is read. Resize the target preview where supported. A fixed desktop composition does not automatically become a usable mobile layout.

Use Preview and animation to check supported behavior, and Review and history to attach specific feedback. For AI changes, name the page and elements you intend to edit rather than describing only their approximate screen position.