A Quick Tour of the Agentic Builder Interface

This article explains the current interface of the AI Website Builder and the main tools available in Chat view.

Admin and Builder workspaces

You can open the AI Website Builder from your Subbly dashboard by clicking AI WEB BUILDER in the left sidebar. You can also switch between the two workspaces with the BUILDER/ADMIN toggle in the top-left corner.

ADMIN is where you manage products, customers, subscriptions, orders, invoices, analytics, settings, and integrations. BUILDER is where you create and edit your website through projects, chats, previews, and versions.

The toggle only switches workspaces. It does not change or publish your store or website. Changes happen when you ask Builder to make them and then use Publish when you are ready.

If you have no project, Builder opens the first-prompt experience. If you have one project, Builder opens its Chat view. If you have several projects, Builder opens the most recent project you used. To change projects, open the user name or profile menu in the top-right corner and select a project.

The builder opens in a new tab, unless the toggle was used, in which case the builder/dashboard switch inside the same tab. The sidebar items on the builder dashboard are explained below:

• Past chats - brings up the chat tree view so you can browse through the chats (associated with the project in question).
• Marketplace - opens the list of marketplace apps for the builder that can be integrated into the current build.
• Artifacts - gives an insight into the list of artifacts associated with the build.
• Feedback - opens a form where you can share feedback about the builder. Use the support team for general support questions.
• Help & Support - opens support panel with possibilities to browse through FAQs, Help base or to Book a Call with the team
• Your usage - opens My Plans, where you can check token usage and your remaining balance. The balance updates in real time.
• Products - opens the list of currently active and published products (you can build them on the admin or use the Agent to build for you)
• Metafields - opens the list of created metafields.
• Surveys - opens the list of currently active surveys.

Project and Chat view

On the right side of the builder admin, you will see the list of active and past projects. Entering a prompt on the Projects page starts a new project with that prompt.

Clicking a project in the main navigation opens the chats associated with that project. Select a chat to open its Chat view.

The Chat view is where you prompt the AI agent to make changes to the site.

Chat view has three columns: general settings, chat tree, and preview or code view, from left to right.

• You can collapse general settings to make the other columns more visible.
• Use the chat tree to review prompts and communicate with the AI agent.
• Use the preview/code view to review the latest changes to the site.

Visible controls in the chat widget are explained below:

• + - gives access to additional set of tools/functions
  • Attach files - lets you attach files such as fonts and images.
  • Resources - makes it possible for the user to call in resources such as products or metafields and implement into the prompt
  • Page Prompt Builder - lets you choose supported page sections and save them as instructions for the current page.
  • Artifacts - makes it possible for the user to create an artifact and store it into the project.
  • Commands - shows the list of available commands.
• View history - opens the project's version history.
• Edit Mode - brings up the contextual toolbar with additional set of tools listed below.
  • Element Selector - lets you select one or more elements in the preview to modify them.
  • Annotate - lets you draw on the page preview to show the visual change you want.
• Chat Mode - lets you switch between the Build/Plan mode of the Agent's behavior
• Intelligence Settings - lets you select the AI reasoning model used for the prompt execution as well as for toggling Fast Mode on and off
• Feedback - lets you share feedback with the team.
• New Chat - starts a new chat in the chat tree, preserving the current progress but resetting the Agent's context window.
• Send - runs the prompt.

Preview Toolbar

Controls in the third column, the preview, are explained below:

• Refresh preview - refreshes the preview when it is not showing the latest changes.
• URL/slug selector - selects or displays a different site page.
• Open in new tab - opens the preview in a new tab without publishing the project.
• Select device - Lets you switch between the mobile/tablet/desktop view for full accessibility across all different viewports of your build.

Version History, Restore, and New Chat

Open Version History from the Chat view to see earlier versions of the project. Select a version and open its three-dot menu to see the available actions: Restore and New Chat.

• Restore loads the selected version into the current chat. Use it when you want to roll the current chat back. It does not publish the site. Any later changes in the current working branch may be removed, so check the selected version before confirming.
• New Chat creates a separate chat from the selected version. The original chat and its history stay available and unchanged. Continue prompting in the new chat. There is no separate Fork button.

Only the most recent chat accepts new prompts. Earlier chats are marked Read-Only, so their prompt box cannot be used to continue them. Read-Only chats remain available as sources for a new branch: open their Version History, select a version, and choose New Chat.

Restore and New Chat change the Builder project or chat state only. To make the chosen build live on the connected domain, review the preview and use the current Publish action separately.