Step01
Configure Your AI Design Bot
Set up a personal Grok Bot template (e.g., 'FigmaBro') and connect it to your Figma account. You can teach it your specific preferences for things like artboard layouts and spacing over time.
IntermediateDesign
Automate Repetitive Figma Tasks with a Custom AI Design Bot
Delegate tedious production design work to an AI assistant. This workflow shows how to use a custom bot connected to Figma to handle repetitive tasks like icon placement, freeing you up for more creative work, all from your phone.
Source episode
How I AI: Grok Bot Designers on Building Living Websites and Automated Design Systemswith Claire Vo
Before you start
Tools used
- Grok
xAI's conversational AI assistant
- FigmaVisitFigma
Collaborative design tool
Step by step
The workflow
Follow the sequence once, then adapt the prompts, checks, and handoffs to your own setup.
5 steps
Step02
Capture Context from Figma
From your phone, open the Figma app and take screenshots of the necessary elements. For example, one screenshot of the source icons and another of the target artboards that need updating.
Step03
Send a Voice Memo Prompt
Send the screenshots to your bot along with a conversational voice memo explaining the task. You don't need precise language; just describe the situation and the desired outcome as you would to a colleague.
Example prompt
Okay, here's the situation... I have a screenshot of a couple of icons that need to be essentially placed next to each of the bots in the exact same placement. I have the second screenshot, which shows ones that don't have an icon... take the icon, scale it up, put it in the same position as the rest...
Step04
Let the AI Execute the Task
The bot will interpret your instructions, access the relevant Figma file, and perform the repetitive production tasks automatically, such as scaling and placing icons consistently across multiple frames.
Step05
Review and Complete the Request
Quickly review the outputs generated by the bot. Once satisfied, paste the results into your team's communication channel (e.g., Slack) to complete the request, all while remaining away from your computer.
Build your next product with ChatPRD
Turn an idea into a PRD, user stories, and a plan.
Keep building
Related workflows
advancedProductGrok
How to Turn Voice Memos into Interactive Prototypes Using AI Agents
Instantly transform a fleeting product idea into multiple, high-fidelity interactive prototypes. This workflow uses collaborative AI bots to interpret a voice memo and screenshot, generating working code for rapid exploration.
Open
advancedPersonalGrok
How to Create a Self-Updating Personal Website with AI-Generated Art
Build a dynamic personal website that automatically updates with your latest check-ins. This workflow uses an AI bot to transform locations into unique 3D illustrations and publish them to your site, creating a living record of your life.
Open
advancedEngineeringClaude
How to Implement AI Governance with Context-Aware Project Controls
Create context-aware guardrails for your enterprise AI agent using a 'Project' governance layer. As a project owner, define rules, scope tools, and require human-in-the-loop approval for sensitive actions, ensuring safe and effective AI use.
Open
Start shipping
better products.
Join 100,000+ product managers who use ChatPRD to write better docs, align teams faster, and build products users love.
Free to start
No credit card
SOC 2 certified
Enterprise ready