The Instant builder is where you design pages, sections, and templates for your storefront. When you open a project, you land in Overview — a wide sidebar with your project overview, analytics, A/B tests, Studio, and plan. Switch to the canvas to start designing: open any layout from the Layouts & layers panel, or press Alt+2 (Option+2 on Mac).
Overview and canvas
The builder has two main views, and you switch between them from the menu at the top-left of the header:
Overview — The wide project view: overview, analytics, A/B tests, Studio, and your plan. Press
Alt+1to return here.Canvas — The design view, where the left sidebar narrows to a panel and the canvas fills the screen. Press
Alt+2to jump straight to it.
Left sidebar panels
On the canvas, the left sidebar shows the panels available for the current layout:
Project — Your project overview and the Layouts & layers panel, where you manage every layout.
Agent — Plan, build, and refine your storefront. The tab shimmers while the Agent is working and shows a dot when there is a reply you have not read. Press
Alt+Shift+3.Insert — Add prebuilt sections and individual elements. This panel is available only in layouts created with Build from scratch. Press
Alt+Shift+1.
The Layouts & layers panel (Alt+Shift+2) is two panels in one: the top half lists every page, section, header, footer, and template in your project, and the bottom half is the Layers tree for the layout you're editing. Drag the divider between them to resize.
From the ⋯ menu you can open Assets. Layouts created with Build from scratch can also show Brand styles and, when enabled for the project, Components.
Assets — Images and media you upload or connect from Shopify.
Brand styles — Reusable typography and colors for drag-and-drop elements.
Components — Reusable groups of drag-and-drop elements.
Canvas and design panel
The center of the screen is the canvas — the live, editable version of your layout at the current screen size. The Agent builds directly onto it. Review the result there, click content to select it, use Ask AI for a focused change, and open Preview to test the layout as a shopper.
When something is selected, the Design panel on the right shows the controls available for that selection. Its controls differ between layouts built with the Agent and layouts created with Build from scratch.
Header controls
Across the top of the builder you'll find:
The Overview / Canvas menu — switch views, open Project settings, or manage Your account.
Undo and Redo — step backward or forward through your recent changes.
Breakpoint controls — preview at Desktop, Laptop, Tablet, or Mobile widths.
Zoom — scale the canvas view without changing the page width.
Preview and Publish — see how the layout looks to shoppers, then push it live to Shopify.
Team avatars — see who else is in the project and jump to their viewport.
Command palette
Press Ctrl+K / Cmd+K anywhere in the builder to open the command palette. Search for layouts, projects, Agent prompts, canvas actions, and help resources without hunting through menus.
Tips for getting oriented
If you lose your place, press
Alt+1for Overview orAlt+2for the canvas.Panel shortcuts use
Alt+Shift+number — the exact number for each panel is listed in the in-app Keyboard shortcuts panel (Ctrl+Alt+//Cmd+Alt+/).