Skip to main content
Building with AI (Vibe Coding)

⏱ About 15 min15 XP

Making It Look and Feel Good

A project that works but is ugly or confusing will not get used. Polish is not vanity — it is the last mile of building. When someone opens your project and immediately understands how to use it, and when using it feels smooth rather than frustrating, that is polish. It is what separates a finished thing from a finished-enough thing.

Usability First, Aesthetics Second

There are two distinct goals in making something good: usability and aesthetics. Usability means people can figure out how to use it without instructions. Aesthetics means it looks intentional and pleasant. Usability matters more. A beautiful project that is confusing to use is a bad project. A plain project that is effortless to use is a good project. Focus on usability first. Ask yourself: if I handed this to someone who had never seen it, would they know what to do? If the answer is no, that is your first polish task — labels, button text, instructions, or layout. Once usability is solid, aesthetics can enhance it without hiding anything.

Usability vs. Aesthetics

Usability is whether someone can accomplish their goal with your project without needing help. Aesthetics is whether it looks intentional and pleasant. Both matter; usability comes first. A good test: watch someone else use your project for the first time without explaining anything. Where they get confused is where your usability needs work.

Marcus ran his reading tracker usability test with his younger sister. She opened it and immediately asked 'What do I type here?' — the input box had no label. She also could not tell if the 'Log it' button had worked, because nothing animated or confirmed the action. She kept clicking it repeatedly. Marcus had two clear usability fixes: 1. Add a label above the input box: 'Pages read today' 2. After logging an entry, briefly show a confirmation message: 'Logged!' He made both changes in one short AI prompt: 'Add a label above the input field that says Pages read today. After the user clicks Log it, briefly flash a green message that says Logged! for two seconds, then disappear.' Both changes took fifteen minutes. His sister used it again with zero confusion.

Aesthetic Choices That Actually Help

Once usability is solid, a few well-chosen aesthetic decisions make a project feel cared for without requiring design expertise. Color: Choose one or two main colors and use them consistently. Your AI can apply a simple color scheme from a description: 'Use a dark navy background with white text and a yellow accent color for buttons.' Spacing: Elements that are too close together feel cramped and are harder to read. Ask AI to 'add more padding between elements' or 'center the content on the page with comfortable margins.' Font size: Default text is often too small or inconsistently sized. Ask AI to 'make the heading larger and use a consistent font size throughout.' Feedback: Every action should have a visible response. A button should look pressed when clicked. A form should confirm when submitted. The absence of feedback creates uncertainty — and uncertainty is the enemy of usability.

Describe Style Like You Would Describe a Room

You do not need to know CSS properties to ask for aesthetic changes. Describe what you want in plain language: 'Make it feel clean and minimal, like a notes app. Light background, dark text, no clutter.' AI can translate that description into working style code.

Prompt Challenge

Write an AI prompt that polishes the look and feel of your project.

Your prompt should…

  • Describe the color scheme using plain color names or a mood like 'clean and minimal' or 'dark and focused'
  • Specify at least one usability improvement such as a label, a confirmation message, or clearer button text
  • Ask for consistent spacing and font sizing across the whole project

The Two-Minute First Impression

Your project makes its strongest impression in the first two minutes someone uses it. That two-minute window is what polish targets. To evaluate your own project's first impression, try this exercise. Close the project completely. Wait thirty seconds. Reopen it and interact with it as if you have never seen it before. Notice: - What is the first thing your eye goes to? Is that the right thing? - Is it clear what to do first? - Does every action produce a clear, satisfying response? - Does anything feel unfinished or accidental? Write down your answers. Each 'no' or 'yes, but' is a polish task. Work through them in order of impact — the first thing someone sees matters most.

Polish Is Not the Same as More Features

It is easy to mistake polish for adding more functionality. Adding another feature does not make an existing feature feel better. Polish means refining what is already there: cleaner labels, better spacing, clearer feedback, more consistent color. When your feature list is complete, switch modes entirely and think only about how the current features feel to use.

Marcus's project is fully functional but his sister could not figure out what to type in the input box. What should he fix first?

A student says 'I clicked Save but nothing seemed to happen — I clicked it five more times just to be safe.' What polish does their project need?

Polish Your Project

  1. Step 1: Run the two-minute first-impression exercise on your project — close it, wait thirty seconds, reopen and interact as a first-time user.
  2. Step 2: Write down every moment of confusion, uncertainty, or visual roughness you notice.
  3. Step 3: Sort your list: put usability issues first, aesthetic issues second.
  4. Step 4: Write one AI prompt per usability issue and fix each one.
  5. Step 5: Write one AI prompt that addresses the aesthetic issues together: color, spacing, font sizes, and any remaining rough edges.
  6. Step 6: Run your test checklist from Lesson 5 to confirm nothing broke during polishing.
  7. Step 7: Log all changes in your build log.
  8. Step 8: Ask one other person to use your project without any explanation. Note where they get confused — those are your remaining polish tasks.