logo
Getting StartedGetting Started

Getting Started with SproutOS: From Prompt to Export

Create your first website project in SproutOS. Start with a prompt or Guided Brief, generate a sitemap, customize the design, and export in one flow.

SproutOS takes you from a project idea to an export-ready website design in one structured flow. You start with a text prompt or a Guided Brief on the dashboard. SproutOS generates your sitemap automatically. You then customize the design and export to Elementor, Gutenberg, or Figma. Brief, sitemap, design, and export all happen in one place. No separate tools needed.

Best Used For

  • Freelance web designers scoping client sites before committing to detailed design work
  • WordPress agencies generating pre-sales mockups from discovery calls and client briefs
  • Solo founders and small teams building a first marketing site without a dedicated designer

Key Features

  • Quick Prompt — Type a short description and get a full sitemap generated in seconds. Use this when you already know what you want and need a fast starting point.
  • Guided Brief — Answer a structured questionnaire covering goals, audience, and brand direction. Use this when you need a more tailored, client-ready result or want a shareable brief for sign-off.
  • Sitemap Editor — Visually add, remove, reorder, and rename pages and sections before design. Use this to lock in information architecture before any pixels are generated.
  • Design Editor — Swap color palettes, font pairs, layout variants, and images with live preview across mobile, tablet, and desktop. Use this to match a client brand without hand-editing CSS.
  • Multi-Format Export — Export the finished design to Elementor, Gutenberg, or Figma. Use this to hand off to a developer, drop straight into a WordPress site, or continue in your design tool.

Before You Start

  • A SproutOS account. Sign up at https://sproutos.ai if you do not have one
  • A basic description of the website you want to build

Step 1: Log In to the Dashboard

Go to https://dashboard.sproutos.ai and log in with your email or Google account.

SproutOS dashboard showing the prompt box in the center and recent projects on the left sidebar
SproutOS dashboard showing the prompt box in the center and recent projects on the left sidebar

You land on the main dashboard. Your recent projects appear on the left. The prompt box sits in the center of the screen.

Step 2: Start Your Project

SproutOS gives you two ways to start a project.

Quick Prompt generates a sitemap from a short description immediately. Guided Brief walks you through structured questions for a more tailored, client-ready result. Both lead to the same Sitemap Editor.

Option 1: Quick Prompt

Type a short description of the website in the prompt box. One or two sentences is enough.

SproutOS prompt box with example text 'Make a website for a restaurant' and the Generate button
SproutOS prompt box with example text 'Make a website for a restaurant' and the Generate button

Click Generate. SproutOS uses your prompt to build a sitemap immediately.

Not sure what to write? Click Spin up an idea below the prompt box to get a starting suggestion.

Option 2: Guided Brief

Click Start with a Guided Brief below the prompt box. This opens a step-by-step questionnaire covering project goals, target audience, brand direction, and references.

Guided Brief opening screen showing the first step of the questionnaire
Guided Brief opening screen showing the first step of the questionnaire

Use the Guided Brief when you need a more tailored starting point or want to share a structured brief with your client before designing.

Guided Brief

Learn how to fill out each step of the Guided Brief and get the most out of it.

Step 3: Review Your Sitemap

After you click Generate (or complete the Guided Brief), SproutOS builds a full sitemap for your project.

Sitemap Editor showing auto-generated pages and sections in a visual layout
Sitemap Editor showing auto-generated pages and sections in a visual layout

The sitemap shows your pages and sections in a visual layout. You can add, remove, reorder, or rename anything before moving to design. Nothing is locked in at this stage.

Sitemap Editor

Learn how to add pages, reorder sections, and use the AI chat to refine your site structure.

Step 4: Customize Your Design

Once your sitemap is ready, SproutOS generates a full visual design for every page and section.

Design Editor showing a generated website with color palette options and font pairs in the sidebar
Design Editor showing a generated website with color palette options and font pairs in the sidebar

In the Design Editor, you can:

  • Switch between color palettes and font pairs
  • Swap section layout variants
  • Upload images or browse the stock photo library
  • Edit text directly on the canvas
  • Preview on mobile, tablet, and desktop

Design Editor

Learn how to customize colors, fonts, images, and section layouts in the Design Editor.

Step 5: Export Your Project

When your design is ready, export it to your production tool.

Export panel showing the three format options: Elementor, Gutenberg, and Figma
Export panel showing the three format options: Elementor, Gutenberg, and Figma

SproutOS exports to three formats:

FormatWhat It Does
ElementorReady-to-import WordPress page builder template
GutenbergWordPress block editor format
FigmaDesign file for handoff or further editing

Export Guide

Step-by-step import instructions for every export format.

Frequently Asked Questions

Next Steps