Design a UI screen or prototype
Layouts, components, copy, and states for a screen or prototype, with design rationale.
The prompt
Help me design a UI.
Product and screen: [e.g. "onboarding for a budgeting app", "SaaS analytics dashboard"]
User and their goal on this screen: [WHO / GOAL]
Content and data shown: [LIST]
Brand/visual direction: [style, colors, design system if any]
Output: [layout description / wireframe in text / HTML+CSS / Figma-ready spec]
Deliver:
1. Information hierarchy — what's most important and where it goes.
2. Layout, section by section, with components.
3. Microcopy — headings, labels, buttons, empty and error states.
4. States — loading, empty, error, success.
5. Accessibility notes.
6. Rationale for key choices and one alternative layout.
Highlighted [brackets] are blanks to replace with your own details.
Fill in the blanks and use this promptMore Product & UX Design prompts
What to fill in
- WHO / GOAL
- LIST
- style, colors, design system if any
How this prompt is built
This prompt follows the RTF structure (Role, Task, Format). RTF tells the model who to be, what to do and what shape the answer should take. It is the quickest structure that still gives noticeably better results than a bare request.
Related prompts
- Write UX microcopy for buttons, errors, and empty statesClear, on-brand interface text for buttons, form errors, empty states, and confirmations.
- Design empty states that help people get startedGives you content and layout guidance for every empty state in a feature: first use, no results, cleared, and no permission.
- Run a UX teardown of a competitor's product flowBreaks down how competitors handle a specific user flow step by step, comparing patterns, friction, and ideas worth borrowing or avoiding.
- Check my design for dark patterns and manipulative UXReviews a flow for deceptive or coercive patterns, explains user and regulatory risk, and suggests honest alternatives that still meet the goal.