Skip to content

3.3 Tell AI More Clearly What You Want Changed, While Also Keeping Usability in Mind

At this point, what really sets people apart is often no longer whether you know more design terms, but whether you can clearly explain the current problem, the target feel, and the boundaries of the changes all at once. A lot of ineffective revisions get stuck here: if you only say “make it look better,” AI can of course give you a result, but that result is very likely to be merely “different,” rather than “right.”

More effective instructions usually have three layers

First, explain what the current problem is—for example, the hero section feels too scattered, the chat entry point is not obvious enough, or the colors look a bit like a default template. Then explain what kind of feel you want instead—for example, cleaner, with more whitespace, and more like a thoughtfully crafted personal project. Finally, state the boundaries—for example, do not add new modules yet; only adjust the homepage hero section and the overall color palette, while keeping the current content structure. As long as these three layers are all present, AI’s changes will become much more consistent.

You can remember it with a simple and highly practical sentence pattern:

text
What the current problem is
-> What kind of feel I want instead
-> What should and should not be changed this time

For example:

text
The hero section of this page looks too much like a default template right now, the information feels a bit scattered, and the chat entry point is not obvious enough.
I want it to feel cleaner, more structured, and more like a thoughtfully made personal homepage.
For now, please only adjust the hero section layout, colors, and spacing. Do not add new modules, and do not change the chat logic.

This way of expressing it does not pile on jargon, but the direction is already very clear.

You can also give AI a reference

If you have a visual in mind but cannot come up with the right words, that is completely fine. You can absolutely give AI a reference to help it align with your intended feel more quickly. A reference can be:

  • A screenshot of your current page
  • A website whose style you like
  • A very short style description

For example:

text
I want it to feel closer to “clean, spacious, with clear information hierarchy”
It should not look too much like a resume site, nor too much like a flashy landing page.

A reference is not meant to make AI copy it directly, but to help it understand the direction you want to move toward.

Beyond looking good, start building some awareness of “whether it is easy to use”

This is also a good place to develop a basic awareness of user experience. An interface is not just about whether it “looks good,” but also whether it “works well.” A page might have nice colors and a tidy layout, but if visitors cannot immediately tell who you are, do not know where to click, or cannot tell what the chat area is for, then it has not truly reached the level of a “finished project.”

So when you ask AI to modify the interface, you can also include these usability requirements at the same time:

  • The hero section should make it immediately clear who I am
  • The chat entry point should be more obvious
  • Information should remain readable on mobile
  • Buttons should have basic feedback

These requirements are not complicated, but they are especially practical. They move “changing the interface” beyond simply looking good and one step closer to “something people will actually use.”

A reusable prompt template for interface changes

text
The main problems with the current page are: ______

I want it to feel like this after the changes: ______

This time, please only modify these parts: ______
For now, do not change these parts: ______

Also, please keep these basic usability requirements in mind:
- The hero section should make it immediately clear who I am
- The chat entry point should be more obvious
- Text should be readable on mobile
- Do not make the page look more cluttered

At this level of detail, it is already far stronger than simply saying “help me make it look better.”

Want to go deeper?

If you want to systematically learn UI/UX, component libraries, and more complex interface effects, you can jump to the advanced version and keep reading:


Next Section: Chapter Summary: Your Homepage Already Looks Like a Real Project →

Alpha Preview:This is an early internal build. Some chapters are still incomplete and issues may exist. Feedback is very welcome on GitHub.