In this tutorial you will learn how to use Figma AI to generate a wireframe from a text prompt, what to include in your prompts for the best results, and how to turn the output into a production-ready design.

Step 1: Open Figma and create a new file

Create a new Figma file and make sure your account has access to Figma AI features. It is helpful to set up your page with frames sized for the screens you want, such as desktop, tablet, or mobile.

Step 2: Write a clear design prompt

Describe the app or page you need in plain language. Include the type of screen, the main sections, the user’s goal, and any key elements. For example: ‘A mobile onboarding flow with a welcome screen, a sign-up form, and a success state with a progress indicator.’

Step 3: Generate the wireframe

Use Figma AI’s generation feature with your prompt and let it propose a layout. Review the initial output and identify what is close to what you imagined and what needs adjusting.

Step 4: Iterate with follow-up prompts

Refine by giving more specific direction, such as ‘Move the call-to-action to the top’ or ‘Add a secondary section for customer testimonials.’ Small, targeted follow-up prompts help you steer the design without starting over.

Step 5: Add real content and polish

Replace placeholder content with your real copy, images, and branding. Figma AI can generate realistic placeholder text, and you can fine-tune spacing, colors, and typography to match your design system.

Step 6: Share and get feedback

Because Figma is collaborative, share the wireframe with stakeholders and collect comments in real time. Incorporate feedback, then hand the polished design to developers with clean, well-named layers.

Figma AI makes wireframing faster by turning text prompts into starting points you can refine together with your team. With clear prompts and iterative follow-ups, you can go from a brief to a shareable, production-ready design in a fraction of the usual time.