Prompt Engineering — Getting Exactly What You Want from the AI

In part 4, we turned an idea into a prompt and built our first screen. Keep going with vibe coding and you quickly realize one thing: the quality of the result comes down to how you ask. With the same tool and the same AI, the outcome changes dramatically depending on how you write your prompt.

This post covers the practical skill of writing good prompts — what’s often called prompt engineering. The name sounds grand, but the core is simple: it’s no different from delegating a task well to a capable colleague. We’ll keep using the bookmark app as our example.

Three Conditions for a Good Prompt

Three things separate a good prompt from a bad one: specificity, context, and scope.

Specificity — spell out what you want, and in what form.
Context — tell the AI what state the project is currently in.
Scope — decide how far to go in a single request.

Type	Example Prompt	Result
Bad prompt	”Add some features to the bookmark app”	The AI has no idea what feature you mean or what it should look like
Good prompt	See the techniques below	Clear on what, in what context, and how far

Let’s look at five techniques for turning these three conditions into actual prompts.

Technique 1. One Thing at a Time

The first principle to follow is one thing at a time. Without experience, you’ll want to ask for everything at once — “add tags and search and sorting.” But that approach is a recipe for trouble.

Approach	Looks like	Actually
Many features at once	Seems fast	Code gets tangled and hard to change later; when an error hits, the cause is hard to find
One at a time	Seems slow	You can check the result at each step, and when something breaks, the cause is clear

Asking one at a time is actually faster overall. You can see exactly where a bug came from, which cuts the time to fix it dramatically.

Technique 2. Give Structured Context

The AI doesn’t automatically know the full state of your project, so you have to hand it context along with the request. Splitting it into four parts works well.

[Current state]
The bookmark app currently saves a URL and title and shows them as a list.
Data is stored in localStorage, and each bookmark has the shape { id, url, title }.

[Feature to add]
I want to add tags. When saving a bookmark, I should be able to attach several tags,
and clicking a tag in the list should filter down to just that tag's bookmarks.

[Data structure change]
Add a tags: [] array to the existing bookmark data.
For existing data, treat a missing tags field as an empty array.

[Scope limit]
Just do this much for now. Tag editing and deletion will come later.

Writing it in the order current state → what you want → data change → scope limit greatly raises the odds that the AI builds exactly what you want without breaking existing code. If you’ve organized your project structure in CLAUDE.md (part 3), you can replace “current state” with a single line: “refer to CLAUDE.md.”

Technique 3. Show the Shape You Want with an Example

For anything hard to put into words, one example beats a hundred. When the output format or style is already clear in your head, show it instead of describing it.

Change the delete button to look like this:
- Position: top-right corner of the card
- Look: a gray × icon that turns red on hover

To pin down an output format: say “organize the result as a table like this” and add one example row.
To match something that already exists: point at a reference, like “make it in the same style as the BookmarkCard component.”

The AI follows a concrete model far better than an abstract instruction.

Technique 4. Let It Ask When It Doesn’t Know

You don’t have to nail down every detail before you fire off a request. In fact, it’s better to let the AI ask about the fuzzy parts — deciding together, just like collaborating with a person.

I want to add a login feature, but I haven't decided on the method (email/social) or where to store data.
Lay out the options with pros and cons first, and ask me about anything that needs a decision.

Add the line “ask me first if anything is unclear,” and the AI throws confirming questions instead of deciding on its own and barreling ahead. That keeps code from piling up on a wrong assumption.

Technique 5. If It’s Off, Stop and Reset the Direction

Once the AI starts heading the wrong way, don’t watch it play out to the end — stop it right away. The more bad code piles up, the harder it is to undo.

Stop it, point out what went off, and give a correcting prompt.

That last direction wasn't what I meant. I wanted X, but you went with Y.
Redo it based on X.

If the conversation has grown so long that the context has frayed, resetting with /clear and starting fresh from your CLAUDE.md is also an option.

Wrapping Up: A Good Prompt Is Good Delegation

“Prompt engineering” sounds like some special technique, but in the end it’s how to delegate a task well. Think of it as asking a capable colleague for help: be specific about what you want, hand over the context of where things stand, ask for only as much as fits in one go, and leave room to ask back when something’s unclear.

Once this instinct settles into your hands, the same AI gives you far better results. The prompt is the tool you’ll use longest in vibe coding — and the one where skill makes the biggest difference.

In the next post, we cover how to put an app that only ran locally out onto the internet — deployment.