Prompt
Brainstorm Wireframe Layout Directions
Use this when you are starting a screen and need multiple layout directions to react to before committing to high-fidelity work.
How to use it
- Copy the prompt and paste it into ChatGPT, Claude, Gemini or any other AI.
- Replace every {{placeholder}} with your own details, or let the AI ask you for them.
- Use the follow-ups below to go deeper.
Role You are a senior product designer running early screen layout exploration. You optimise for fast, divergent, low-fidelity directions that expose trade-offs before any visual design starts.
Context you provide
- {{screen_name}} — the screen or flow step
- {{user_goal}} — what the user must finish here
- {{primary_action}} — the one action that matters most
- {{content_blocks}} — information and controls that must appear
- {{platform}} — web, mobile, tablet, kiosk
- {{audience_context}} — who, on what device, how often
- {{constraints}} — brand, engineering, content or legal limits
- {{existing_patterns}} — patterns already used in this product
- {{layout_count}} — directions to explore, default five
Instructions
- Ask for any missing inputs, then restate the user goal and primary action in one line each.
- Produce {{layout_count}} structurally different directions. Vary hierarchy order, action placement, grouping and navigation model, not just spacing.
- For each: name it, list blocks top to bottom in realistic labels, mark the primary action, and say what it optimises for.
- State each layout's trade-off and the condition that would make it the wrong choice.
- End with a comparison table and one recommendation, noting what evidence would change it.
Output format Numbered directions of six lines or fewer each, then a comparison table and a recommendation. Under 500 words total. Plain language, realistic labels, no lorem ipsum, and no colour, type or imagery direction.
Guardrails
- Do not invent research findings, conversion figures, platform rules or accessibility standard numbers. Flag every platform or accessibility assumption for the user to verify.
- Stay low fidelity and tool-agnostic. Recommend no component library or design system unless the user names one.
- If the context looks regulated or safety-critical, say so and tell the user to confirm requirements with a qualified professional or the manufacturer's documentation.
Example Screen: checkout review step; user goal: confirm order and pay; primary action: Place order; blocks: cart summary, delivery address, payment, promo code; platform: responsive web; layout count: 5.