The App View and Layouts

The App View allows users to compose Elements from the Logic view into an interactive, beautiful web app that anyone can use.

An App can have one of two layouts: Story or Canvas, which you can select when you first navigate to the App tab in a project.

You can select your layout mode when you first open the app
Layout modes in action

Story Layout

Story Layouts take the contents of your notebook and automatically organizes them into a linear "Story"-like layout.

Inputs Parameters and Outputs (like charts and tables) are automatically added. All cell sources - including raw code - are hidden by default.

You can toggle the visibility of any element using the "Remove from App" button in the upper right of each element, and the "Add" button on elements in the left-hand outline.

Story layouts are also responsive, meaning they adapt to the screen size of the device being viewed.

Canvas Layout

The Canvas allows you to drag and drop elements from the left-hand Outline bar.

Adding Elements to the Canvas

You can drag-and-drop elements from the left-hand bar using the drag handle, or add them directly using the + button on each element.

Selection and Dragging

You can drag elements one at a time or as a group:

Previewing your app

Hit the "Preview" button in the upper right to see what the app would look like in its published state. We simulate how your app will perform when a user visits it by restarting the kernel of your project and running the logic top to bottom. If you see an error in your app preview your app will also have a problem.