Skip to main content

​
Visual Designer

The Visual Designer at /start is a canvas-based workspace for generating screens visually. Describe what you want, configure your settings, and the AI creates production-ready designs.

​
Workspace layout

​
Studio vs. Chat tabs

The left sidebar has two modes:
  • Studio — The visual generation mode (default). Configure specs, write prompts, generate screens.
  • Chat (Beta) — A Brainstorm mode where AI helps you refine your idea through conversation.

​
Chat / Brainstorm mode

Switch to Chat for a guided ideation experience:
  1. The AI shows you context cards with questions (e.g., “What kind of app are you building?”, “Who is your target audience?”, “What’s the primary action users take?”)
  2. Answer questions via quick-select buttons or free text
  3. The AI builds a comprehensive design brief from your answers
  4. Click Generate from brief to produce screens based on the conversation
  5. You can continue chatting to refine or ask follow-up questions
This is ideal when you’re not sure exactly what to build — the AI guides you through the decisions.

​
Design Specs

Configure before generating:

​
Mode

​
Page type

For Landing Pages and Funnels, set the section count (3–20). The page height equals screen height × section count.

​
Screen size

​
Writing prompts

Your prompt drives the generation. Be as specific as you want:
“A project management dashboard with a left sidebar showing Projects, Tasks, Calendar, Team. Main area shows a kanban board with To Do, In Progress, and Done columns. Each card has a title, assignee avatar, and priority tag.”
“Dark theme with purple accent color, glassmorphism cards, subtle gradients, Inter font, rounded corners.”
“A pricing page similar to Stripe’s, with three plan cards, feature comparison table, and FAQ accordion at the bottom.”
“A restaurant menu with categories: Starters (Bruschetta 8,Soup8, Soup 6), Mains (Pasta 14,Steak14, Steak 22, Fish 18),Desserts(Tiramisu18), Desserts (Tiramisu 9, Ice Cream $7).”

​
Reference images

Upload reference images to guide the AI’s visual output:
  • Click the paperclip icon below the prompt
  • Or drag and drop images directly onto the prompt area
  • Upload up to 10 images per generation
The AI analyzes the style, colors, layout, and components from your references.

​
Enhance Prompt

Click the magic wand (Enhance) button to let AI improve your prompt. It adds design details, structure, and specificity for better results.

​
Deep Design & Max Mode

Enable both for the best possible output on important screens.

​
Generation

Click Generate (single screen) or Generate Flow (multi-screen). In HiFi mode, a sandbox automatically starts to run your app live.

​
Working with generated screens

After generation, screens appear as frames on the canvas. You can:
  • Click a screen to select it — opens the AI Editor at the bottom
  • Pan and zoom the canvas to navigate between screens
  • Move screens by dragging them around the canvas

​
AI Editor (screen editing)

When a screen is selected, the AI Editor appears. Type a change request:
  • “Make the header sticky”
  • “Change the button color to green”
  • “Add a search bar at the top”
  • “Replace the placeholder text with real content about coffee shops”
The AI modifies the code and the live preview updates instantly.

​
Generation History

Click the clock icon next to the Prompt header to see all past generations. You can:
  • Review previous prompts and results
  • Click Use Prompt to reuse any past prompt

​
Next steps

Flow Generation

Generate entire multi-screen apps

Live Preview

Learn about the sandbox environment