Magician is an AI-powered Figma plugin created by Diagram (acquired by Figma) that allows designers to generate UX microcopy, unique vector icons, and images directly within their design files. Its core copywriting tool, Magic Copy, eliminates the need for generic “Lorem Ipsum” by drafting real, context-specific text on demand. 🚀 Key Features for UX Content
Magic Copy: Generates instant headlines, CTA button text, and body copy from text prompts.
Text Suggestions: Uses Figma’s text review API to highlight text layers and suggest alternatives for better grammar, clarity, or tone.
Magic Rename: Automatically cleans up and renames cluttered design layers to keep the file structure organized.
Magic Icon & Image: Complements your copy by converting text prompts into scalable SVG icons or images right next to your text. 🛠️ Step-by-Step Guide to Using Magic Copy 1. Install and Initialize the Plugin Open your project in Figma.
Click the Resources icon in the top toolbar or press Shift + I.
Navigate to the Plugins tab, search for Magician, and click Run.
(First-time use) Authenticate the plugin using the key from your account on the Magician homepage. 2. Replace Placeholder Copy
Select the text frame containing your placeholder text or empty canvas. Open the Magic Copy feature within the Magician side panel.
Type a descriptive prompt detailing the UX component (e.g., “Write an error message for an invalid credit card expiration date”).
Click Generate to apply the text directly to your design layout. 3. Refine Tone and Variations Review the generated options provided by the plugin.
If the result is too technical, update your prompt to adjust the tone (e.g., “Make it friendly”, “Keep it under 40 characters”). Select the best option to instantly update your layout. 💡 Tips for Better UX Microcopy Target UX Element Effective Prompting Strategy Prompt Example CTA Buttons Use active verbs and specify the exact user benefit. “Create a button label for a premium subscription checkout” Onboarding Flows Keep sentences under 10 words and focus on user action.
“Write a 3-step app onboarding header for a fitness tracker” Error Messages State what went wrong clearly and guide the user to a fix. “Write a friendly alert for a weak user password” AI responses may include mistakes. Learn more How Magician uses Figma’s text review API | Figma Blog
Leave a Reply