Previously, creating unique illustrations for a mockup required either drawing skills, money for stock/custom work, or time for searching. AI generation changed the equation. Now any textual idea can be instantly turned into a visual. In Figma, this is implemented via plugins (Magician, Bildr AI) or its own integration, functioning as an on-demand service.
1. The Art of the Prompt (Prompt Engineering):
Success is 90% dependent on the ability to craft a query.
Basic Level: Object + action. ("a bear eating a cake").
Professional Level: Style + composition + details + technical parameters. ("Illustration of a bear in a beanie eating a cake, flat design style, pastel palette, on white background, overhead view").
Key Modifiers for UI/UX: `flat design`, `vector illustration`, `minimalistic`, `ui/ux style`, `isometric`, `3d render`, `pastel colors`, `on white background`.
2. Strategic Use Cases in the Design Process:
Ideation and Mood Board Stage: Instead of collecting references from Pinterest, you can quickly generate a series of options in the desired style to discuss the visual direction with a client.
Prototyping with Unique Content: Creating hero images, icons, avatars, product placeholders that perfectly match the product's theme (e.g., images of different plant types for a gardener's app).
Creating System States (Empty States, Error States): Generating thematic illustrations for "No Data", "Error", or "Success" screens. This enhances the emotional connection with the user.
A/B Testing Emotional Response: For a single screen, you can generate several illustration variants (more cheerful/serious/minimalistic) and test them with your audience.
3. Working with the Result Step-by-Step
1. Generating Options: Run the same prompt multiple times or with slight variations to get 6-8 options.
2. Selection and Cropping: Choose the best one, crop as needed directly in Figma.
3. Refinement: AI images often need final polish. Use Figma's vector tools to adjust outlines, add/remove small details, and tweak colors to match the brand palette.
4. Export: The finished image can be exported in the required format.
Technical and Legal Aspects:
Detail and Resolution: Generation directly in Figma often has size limitations (e.g., 1024x1024 px). For large hero banners, a separate service (Midjourney, DALL-E 3) with subsequent import might be needed.
Copyright: Usually, images generated via plugins in Figma can be used freely for commercial purposes, but it's worth checking the license agreement of each specific plugin.
Ethical Considerations: Avoid prompts that could generate stereotypical, discriminatory, or harmful content.
A Tool for the Designer-Producer
Image generation in Figma doesn't make a designer an illustrator. It makes them a visual producer, capable of quickly prototyping the atmosphere, emotion, and context of an interface. It's a tool for rapid hypothesis testing ("how should this look?"), cheap iteration, and creating temporary yet unique content that brings a mockup closer to the final product. The final, polished art may still be a human's work, but the path to it has become shorter and much more interesting.