Describe the reader, the task, the visual rules, and the constraints. Ask for a small, reviewable change, then give feedback about what you can observe.
A long prompt is not automatically a good brief. You can spend a paragraph asking for an elegant, premium, beautiful website and still leave the assistant guessing about every important decision.
Useful direction connects the design to a specific person doing a specific thing. Once that is clear, the visual decisions have something to answer to. A documentation page should make information easy to find. A landing page should explain the offer. An article should make you want to keep reading.
Start with the job of the page
Write a sentence that describes who the page is for and what they should be able to do. Avoid beginning with an inventory of sections. A hero, three feature cards, and a testimonial row describe a layout, but they do not explain why that layout should exist.
Now the assistant can make choices in service of that task. It might emphasize categories, give descriptions more room, or simplify the navigation. You have a reason to accept or reject each change.
Turn taste into observable rules
Words like premium or clean can be a starting point, but they need translation. Specify the qualities you can see: fewer accent colors, a larger gap between sections, a narrower line length, a stronger distinction between titles and labels.
- Typography: describe the hierarchy, weight, line length, and density you want.
- Color: name the main background, text color, and role of the accent.
- Layout: explain what should dominate and which elements should feel secondary.
- Imagery: describe what the visual should communicate and where it should fit.
A reference image is helpful when paired with these notes. Without the notes, the assistant may copy the wrong thing. Say whether you care about the composition, the materials, the spacing, or the way a particular interaction works.
Make the constraints explicit
Tell the assistant which parts of the project already work. Name the framework, the existing components, the routes that must keep working, and any content that must remain accurate. If there is an established design system, point to the source of truth.
Audience: independent developers building with AI.
Goal: help readers choose a practical frontend guide.
Keep:
- Existing article URLs and content
- Keyboard navigation and theme switching
- Shared components and design tokens
Improve:
- Title and summary hierarchy
- Cover imagery and spacing
- Mobile card layouts and empty search states
First show one revised article card.
Explain the choices before applying them site-wide.Constraints are not just limitations. They reduce the number of irrelevant choices and help the model spend its effort on the part you actually want to improve.
Give feedback in small, useful passes
Review one representative section before asking for a whole redesign. This lets you catch a wrong direction while the change is still easy to understand. If the card is too dense, solve that problem before multiplying it across the page.
Be equally specific about what should stay. If the spacing is right but the image is wrong, say so. Otherwise a broad request for another attempt can undo the best parts of the previous one.
Finish with evidence
Ask the assistant to demonstrate the result: show desktop and mobile layouts, navigate the main flow, and test the states it changed. “Done” should mean the behavior was checked, not just that the files were saved.
The best prompt is not a secret formula. It is a clear brief followed by thoughtful feedback. Make the work easier to understand, and you make it easier to improve.
