Canvas#

The Canvas is the design surface where a survey is built. It has three areas: the structure tree on the left, the card canvas in the middle, and, when enabled, the live preview on the right.

The Structure Tree#

The Structure tree shows the whole survey. Each row shows an item’s type icon and label, and a question’s row also shows its number; sections show a count of their descendants, and conditional items carry a branch badge. Selecting a row opens that part of the survey on the canvas and scrolls the matching card into view. Rows can be dragged to reorder the survey.

The Survey Overview#

Selecting the survey root shows the overview: statistic cards for Sections, Questions, With display logic, and Validation issues, which counts the findings of the validation checks, followed by one card per top-level section.

The Section Header#

When a section is open, its header shows the section’s label, name chip, and description. If the section is conditional, a Display if chip summarizes the condition. The header also carries the Editor, Split, and Preview mode switch, a comment button, Edit details, a button that exports the section as a Specification in PDF or HTML, and a button that deletes the section.

Cards#

Every item in the open section is a card. A card shows the item’s type icon, its name chip, its label chip, and its content, such as question text and a rendering of the response options. A question card also carries the question’s number, Q1, Q2, and so on, in a pill at the left of its header. The numbers are assigned automatically and follow the rule in Question Numbers. Question text can be edited directly on the card; press Enter to commit or Esc to cancel.

Cards support the following actions.

Drag the handle on the left edge to reorder items.
Hover between two cards to reveal an Insert an item here band that opens the add-item palette at that position.
Edit opens the item’s full editor; see Question Editor and Item Editors.
The branch button adds or edits the item’s display logic; see Display Logic and Expressions.
The input indicator appears when the item consumes earlier answers and opens the Inputs dialog.
The comment button opens the item’s comment thread.
The delete button removes the item.
The overflow menu offers Remove Display Logic and Replace This Item With a Copy.

If an item carries a condition, a condition chip renders the rule on the card. Chip colors state the condition’s kind: green for a formal condition the application can evaluate, gray for a described condition, blue for native source code, and dark red for a broken condition.

When a newer version of an item exists in a repository, the card shows an Update available tag and becomes read-only until the item is updated.

The Live Preview#

The Editor, Split, and Preview switch controls the live preview pane. Split shows the editor and the preview side by side; Preview shows the preview alone.

The Canvas in Split mode with editable cards on the left and the respondent preview on the right

The preview renders the open section as a respondent would see it: a title, a progress bar, and answerable question blocks. Answers evaluate display logic, text fills, edit checks, and computations immediately, and they carry across sections for a whole run of the survey. The footer reads Edits apply live; canvas changes appear in the preview as soon as they are saved.

The preview header offers three controls.

A language dropdown, shown when the survey has more than one language, renders the preview in the chosen language with fallback to the default language.
Scenario, shown when the survey has computations or data lookups, opens the scenario tray under the preview. A badge on the button counts the pinned values and answers.
The restart button clears all answers except pinned ones.

Continue advances to the next section; the canvas follows. From the survey overview, Start preview begins a full run at the first section. Questions whose display logic references a Refused or Don’t Know operator show REF and DK chips so those states can be exercised. Pointing at a question reveals a Pin chip, which keeps the question’s answer when the preview restarts; a pinned question is tinted and its chip reads Pinned. A computation or data lookup appears as a card at its place in the flow, with its name, its live value, the answers it is derived from, and a box to pin a value. A footer note counts items currently hidden by display logic.

The Scenario Tray#

The scenario tray holds the pinned values and answers that make up a test scenario. Pins survive the restart button, and they are saved with the survey, so a scenario is still in place after the survey or the application is reopened. The tray is resized by dragging its top edge; its height and whether it is open are remembered.

The tray’s header offers two tabs, each with a count, and these controls.

Control	Description
Variables	Lists every computed variable and data lookup output in the survey.
Pinned answers	Lists the questions whose answers are pinned on the preview.
Filter	Narrows the variables by name, kind, or section.
Clear pins	Removes every pinned value and pinned answer; shown while there is one.
Close button	Closes the tray.

The Variables tab has one row per variable, grouped by the section the variable is computed in, with the open section first and the rest in survey order.

Column	Description
Name	The variable’s name, with a status dot: green for a computed value, amber for a data lookup, and red for a value the preview cannot evaluate.
Kind	Number, Date, Codes, or Text.
Computed in	The section that holds the computation.
Live value	The value computed from the current answers and the answers it is derived from; struck through while a pin overrides it. A data lookup, or a computation written in described logic, native source code, or an invalid expression, reads that it cannot be evaluated and needs a pin.
Pinned value	A Pin a value box, or a code dropdown for a Codes variable, and a clear button while a value is pinned.

The same rows back the computation cards on the preview, so a value pinned in either place shows in both.

The Pinned answers tab lists each pinned question’s text, its section, and its current answer, with an Unpin button.