Generate a Website Wireframe Description

Creating a website wireframe from scratch can feel overwhelming, especially if you're juggling multiple design decisions at once. This ChatGPT prompt solves that problem by generating detailed wireframe descriptions that cover every essential element of a homepage layout. If you're a UX designer, web designer, product manager, or startup founder who needs to visualize a website structure before diving into design tools like Figma, this prompt streamlines your planning process significantly. Rather than staring at a blank canvas, you get a structured breakdown that accounts for both desktop and mobile experiences.

Using this prompt is straightforward. Replace the [type] placeholder with your actual website category, then let ChatGPT build out a complete wireframe description for you. For example, you might ask ChatGPT to describe a wireframe for a SaaS landing page homepage or an e-commerce product page. The prompt automatically ensures the output includes your hero section layout, navigation structure, CTA placement, social proof sections, content hierarchy, and most importantly, specific guidance on responsive behavior for mobile devices. This last element is crucial because many designers accidentally optimize only for desktop, creating poor mobile experiences.

When you run this prompt in ChatGPT, expect to receive a comprehensive paragraph or section-by-section breakdown describing each homepage element and how it should function across different screen sizes. You'll get specific guidance on spacing, component stacking, and interaction patterns. The description will reference Figma's auto-layout approach, which means you can take these instructions directly into Figma and implement them efficiently using auto-layout frames.

For better results, include additional context in your prompt about your target audience or business goals. For instance, specify whether your site prioritizes conversions, user education, or brand storytelling. This helps ChatGPT tailor the wireframe structure to match your actual design priorities rather than defaulting to generic layouts. You can also ask for accessibility considerations or specific CTA button placements if you have particular requirements.