Flex has three modes (Design, Build, Preview), each used during a different stage of the design process. Each of Flex's modes has unique UI elements and options pertaining to the overall purpose of the mode. Though they are different, you can still add new content to the canvas in the Design and Build modes.
Use the Modes toggle in the top-center of the Flex workspace to toggle between modes. Listed below are the three modes and their use cases.
Design Mode
Design mode is the first mode you use when creating content in Flex. It allows you to:
Add and group content using the Toolbar
Add new pages to your experience and adjust layers using the Pages & Layers Panel
Set position and size settings, as well as edit the visual and layout settings of selected content using the Inspector Panel
Create new Responsive variants
Build Mode
Build mode is similar to Design mode, but replaces the Inspector Panel with the Actions Panel. It allows you to:
Add and group content using the Toolbar
Add new pages to your experience and adjust layers using the Pages & Layers Panel
Add interactive actions to selected objects on the canvas using the Actions Panel
Preview Mode
The purpose of Preview mode is to allow you to test the responsiveness of your experience before publishing (publishing is not currently available in beta). You can use the blue adjustment handles to manually resize the width and height of your experience. Doing so will automatically resize the layout to the next responsive variant when you hit the set breakpoint.
Additionally, you can select a responsive variant to display or input exact width and height dimensions using the Sizing Panel in the top-right corner of the Preview mode workspace.