User Interface

The video demonstrates the earlier Designer interface. Its section, container, and workbook-binding concepts still apply, but the current Designer uses a top control toolbar, a persistent Properties panel, and a lower-left Pages drawer.

Start with a ready-made design

For a designed starting point, open Layout & Controls → Overview → Design library. Browse complete flows or individual pages, compare desktop, tablet, and phone previews, then review placement and appearance choices before importing. Use Add component for a reusable section within the current page.

Follow Build an Application with the Design Library for the full import procedure. Appearance suggestions can apply across the whole application. Imported sample values are not connected to your workbook automatically; finish the bindings with Workbook connections from Page overview.

Build and configure individual controls

1. Add a Section to the page. Sections form rows and include a Container; containers form columns that hold controls.
2. Add input and output controls from the toolbar into a valid container. Alternatively, use Quick Add to choose a control and a compatible workbook named range.
3. Select a control to configure its Setup, Appearance, and Behavior settings in the Properties panel. The available fields depend on the control.
4. Assign inputs to the intended workbook inputs and outputs to the relevant calculated results. Check the required range shape for lists and grids.
5. Use the Pages drawer at the lower left to switch pages. Only one page is edited at a time.

You can mix manual controls with library designs. For a workbook-first approach, Elements lets you select cells and ranges before generating interface elements.

Check the application

Open Workbook connections from Overview to review outstanding bindings, labels, visibility, and navigation. Then use Preview app to test representative inputs and results before publishing. See Layout & Controls for the current workspace reference.