Free Course ยท Vibe Coding Foundations

Lesson 1.4: Reading what the AI gives back

Foundations progress 0 of 7 lessons complete (0%)

When an AI tool hands you a working page or app, you are not done. You are at the start of a conversation. Here is how to read the result like someone who knows what they are doing, even if you do not understand the code.

If you see HTML in the chat instead of a preview: the tool gave you the page as code. Copy it, save it as a file ending in .html, and open that file in your browser. Lesson 1.6 has the full walkthrough.

Look at it, do not read it. Open the preview or your saved HTML file. Does it look like what you asked for? Ignore the code itself for now.

Test the thing it is supposed to do. If you asked for a countdown, does it count down? If you asked for a form, does clicking submit do something?

Name what is wrong in plain language. Not "the div is not rendering correctly." Say "the button is in the wrong place" or "it looks too corporate, I said warm."

Common beginner mistake: trying to read and understand every line of code before trusting the result. You do not review a contractor's blueprints line by line either. You check whether the room looks and works right.

A short script for the back-and-forth

  1. Look at the result. Does it match the what/who/feel from your prompt?
  2. Test the actual function by clicking, typing, and scrolling.
  3. If something is off, describe it in one plain sentence and ask for that one change.
  4. Repeat. Most real results take two or three rounds, not one.

Iterate or start over

If the overall shape is close and only specific details are wrong, keep iterating. If the result fundamentally misunderstood the goal, it is often faster to rewrite the original prompt with clearer what/who/feel than to patch a result built on a misunderstanding.

Spotting subtle stuff

Obvious breaks are easy to catch. Subtle misses need a second look: does the tone match what you asked for, does it work on phone-sized screens if that matters, and would your named audience actually understand it?

Assignment

Assignment 1.4 - Practice the loop, twice

You're done when: you have completed at least two full look, test, describe, fix cycles: one for function and one for feel.

0 of 5 items checked

Self-check

What is the first thing you should do when an AI tool hands back a result?

Which feedback is more useful to give an AI tool?

When does it make more sense to rewrite your original prompt instead of iterating?

← 1.3 Writing your first prompt 1.5 Fixing without code →