Using Visually's new AI-Powered Smart Component Generator

Design, build, and ship on-brand components in minutes turns plain English prompts (or images) into components that matches your brand.

• Ship tests faster (minutes, not sprints)

• Dynamic by default pulling product data/tags/metafields)

• Quick editing

How it works

1. Describe the idea (text or image).

2. AI translates to requirements, designs the element, and generates code aligned to your brand.

3. Ship (or fine-tune visually) and go live.

Quick start

1. Open Smart Component Generator in Visually.

   

2. Paste a prompt or choose from our predefined recommendations.

   

3. Check the preview, edit to fine tune or define the targeting and Publish.

Tips

• Keep prompts specific.

• Use product tags/metafields for dynamic logic.

• Ensure the theme exposes stable selectors.

Troubleshooting

• Component not showing? Check page targeting and product conditions.

• Data not binding? Confirm tags/metafields exist and match your rules.

• Layout off? Open Visual Editor, adjust spacing/typography and republish.

Watch our release post for more inspiration!

You decide what to test. AI does the heavy lifting.