Instant's AI allows you to build all kinds of layouts including landing pages, product pages, listicles, home pages, sections, navigations, and more. Generate complete layouts from prompts, import from Figma, or edit existing pages with AI assistance.
Overview
The AI agent can create new layouts from scratch or modify existing ones based on your instructions.
What AI Can Build
Layout Type | Description |
Landing pages | Marketing and campaign pages |
Product pages | Product detail page templates |
Listicles | List-based content layouts |
Home pages | Store homepage designs |
Sections | Reusable page sections |
Navigations | Headers and footers |
Note: All AI-generated layouts are automatically made responsive for all devices.
Getting Started with AI
There are two ways to access the AI builder.
Method 1: From the Dashboard
For creating new layouts:
On the dashboard, locate "What are you building today?"
Enter your prompt in the prompt box
Click Generate to start building
Method 2: From the Editor
For new or existing layouts:
Open the editor with your canvas
Click the AI button in the left sidebar
Choose from available options or enter a custom prompt
Click Generate
Prompt Box Features
Both methods include the same prompt box functionality:
Feature | Description |
Text input | Type your prompt describing what you want to build |
Plus button (+) | Upload a file (such as an image) as a reference |
Microphone icon | Dictate your prompt using voice |
Generate button | Start the AI agent |
Editor AI Options
When accessing AI from the editor, you'll see multiple options:
Quick Start Options
Option | Description |
Landing Page | Generate a new landing page |
Product Page | Generate a new product page |
List | Generate a listicle layout |
Home Page | Generate a homepage |
Import Options
Option | Description |
Import from Figma | Generate layout from a Figma design |
Use website link | Generate layout based on a website |
Edit Options
Option | Description |
Make suggestion | Get AI suggestions for improvements |
Connect Shopify | Connect layout elements to Shopify data |
Edit layout | Modify existing layout with AI |
Editing Existing Layouts
Use AI to modify layouts you've already created.
How It Works
Select an existing layout from the Layout panel (e.g., a product page)
Open the AI from the left sidebar
Enter your edit request in the prompt box
Click Generate
Example Edit Prompts
Request | Description |
"Restyle like brand X" | Apply a different visual style |
"Optimize for conversion" | Improve CRO elements |
"Make it responsive" | Adjust for mobile and tablet |
"Add a testimonials section" | Insert new content sections |
"Change the color scheme" | Update visual styling |
Importing from Figma
Import your Figma designs and have AI rebuild them in Instant.
Requirements
Instant Figma plugin installed
Figma design ready for import
Steps
Open Figma and navigate to your design
Select the page or frame you want to import
Load the Instant Figma plugin
Click Generate prompt in the plugin
Copy the generated prompt
In Instant, open the AI panel
Paste the prompt in the prompt box
Click Generate
The AI will rebuild your Figma design in Instant and make it responsive automatically.
AI Image Editing
Edit and transform images directly on the canvas using AI-powered tools.
Accessing Image Editing
Select an image on the canvas
Click the Edit with AI button that appears floating above the image
The Studio AI box opens with editing options
Quick Edit Options
Option | Description |
Create Pack Shot | Transform image into a product pack shot |
Create Lifestyle Shot | Transform image into a lifestyle scene |
After selecting an option, a prompt box appears where you can describe how you want to edit the image (e.g., "place the object on a wooden table").
Adding Products to Images
Insert your products into existing images:
Click the Product button
Select one of your Shopify products, or upload a product photo
The product will be composited into the image
Scene Presets
Click the Scene button to access scene options:
Tab | Description |
Presets | Choose from pre-configured scene styles |
Create | Build a custom scene with detailed options |
Custom Scene Options
When creating a custom scene, configure:
Setting | Description |
Background style | Set the background appearance |
Cloning style | Control how elements are replicated |
Crop style | Define image cropping behavior |
Expressions | Set facial expressions (for people) |
Poses | Choose body positioning |
Rotation | Adjust orientation |
Tone | Set the overall mood and color tone |
AI Models (People)
Click the Person button to add AI-generated models:
Tab | Options |
Female | Multiple female models with various looks |
Male | Multiple male models with various looks |
Filter models by hair color or skin color to find the right fit.
Image Settings
Setting | Options |
Aspect Ratio | Automatic (default), 1:1, 3:4, 4:3, and more |
Quality | HD (default), 2K, 4K |
AI Model | Gemini Flash (default), Flux Pro, Flux Cline |
Generating the Image
Configure your settings or enter a prompt
Click Generate in the bottom right corner
The AI generates your edited image
AI Tokens
AI operations require tokens. Each plan includes a monthly allocation of tokens for AI tasks.
Token Allocation
Each Instant plan includes a set number of tokens per month. View your plan's token allocation at instant.so/pricing.
Token Usage
Scenario | What Happens |
Tokens available | Use AI features normally |
Tokens depleted | Purchase additional tokens or wait for monthly reset |
Monthly reset | Tokens refill at the start of each billing cycle |
Running Out of Tokens
If you use all your monthly tokens, you have two options:
Option | Description |
Top up tokens | Purchase additional tokens outside your plan |
Wait for reset | Tokens automatically refill at your next monthly cycle |
Quick Reference
Task | Action |
Start new layout (dashboard) | "What are you building today?" → Enter prompt → Generate |
Start new layout (editor) | AI button → Select layout type → Generate |
Upload reference image | Prompt box → Plus button (+) → Upload file |
Use voice input | Prompt box → Microphone icon → Speak |
Edit existing layout | Select layout → AI button → Enter edit prompt → Generate |
Import from Figma | Figma plugin → Generate prompt → Paste in Instant → Generate |
Edit image with AI | Select image → Edit with AI → Configure → Generate |
Create pack shot | Select image → Edit with AI → Create Pack Shot |
Add product to image | Edit with AI → Product button → Select product |
Add AI model | Edit with AI → Person → Select model |
Change AI model | Studio AI box → Top right dropdown → Select model |
Prompt Tips
Tip | Description |
Be specific | Describe the layout, sections, and style you want |
Use references | Upload images for visual direction |
Mention brand | Reference known brands for style inspiration |
Include goals | Mention conversion goals or user actions |
Image Editing Quality Options
Setting | Options |
Aspect Ratio | Automatic, 1:1, 3:4, 4:3 |
Quality | HD, 2K, 4K |
AI Model | Gemini Flash, Flux Pro, Flux Klein & more |
