Prompting Lovable Well

Everything you learned about prompting still applies

If you took the Prompt Engineering course, this lesson is where it starts paying rent. Lovable is an AI wearing a build tool as a costume. Feed it a vague sentence and it will confidently invent a website for a business it has imagined on your behalf.

🤝Heads up: this lesson links to Lovable through an affiliate link, so LearnAI earns a commission if you subscribe. It costs you nothing extra, and it is what keeps these courses free. We tell you where these tools fall short too, including who should not use them.

The single most common beginner mistake is treating the message box like a search bar. It is not a search bar. It is closer to a brief you would hand to a freelancer who is fast, literal, tireless, and has never met you.

The four things a first message should carry

Who it is for. A site for a wedding photographer and a site for an industrial valve supplier should not look remotely alike. Say which one you are.

What sections it needs. List them, top to bottom: the big banner at the top, work samples, about, testimonials, contact. If you do not name the sections you get whatever sections the AI considers typical, which is usually four generic ones and a newsletter signup you never asked for.

How it should feel. Tone words do real work here: warm and editorial, clinical and precise, playful and loud. Two or three adjectives are plenty, and they will visibly change the text sizes, the spacing and the colours.

Any hard constraints. One page or several. Dark or light. Must look right on a phone. Must use this exact brand colour. Constraints are the cheapest quality lever you have.

Vague versus specific, side by side

The good version is longer, but notice that none of it is decoration. Every clause closes a decision the AI would otherwise make for you.

Change one thing, look, change the next

Here is the habit that separates people who enjoy Lovable from people who get frustrated by it.

After the first build, resist the urge to write another giant paragraph. Change one area at a time and look at the result. "Make the gallery two columns on a phone and add a little more gap between images" is a good message. "Redo the gallery, change the fonts, add a blog, and make the whole thing feel more premium" is four separate jobs colliding, and when the result is wrong you will not know which instruction caused it.

Small steps also make it easy to say "undo that" and mean something specific.

Build a [one page / multi page] site for [who it is for and what they do].
Sections in this order:

[section and what it contains]
[section and what it contains]
[section and what it contains]
Tone: [two or three adjectives].
Look: [background colour, text colour, accent colour, font feel].
Constraints: [design for phones first, no placeholder stock photos, keep the writing under X words per section].

And for changes afterwards, keep them surgical:

Only change the banner at the top: make it fill the whole screen when the page loads, and move the headline to the lower left.
In the gallery, use three columns on a laptop and two on a phone, with equal gaps.
Rewrite the about section to be two sentences, written as I rather than she, and drop the marketing language.

Notice the phrase "only change the banner at the top." Naming the area you want touched is the most underrated line you can write, because it stops helpful edits elsewhere that you did not ask for.

Describe the outcome, not the method

You do not need to know a single layout technique by name. Say "these three cards should sit in a row on a laptop and stack on a phone" and let the tool pick how. Where you should be precise is intent: what the visitor sees, in what order, and what you want them to do next.

The best time to practise is on a real project, even a small one. Open a build, run the template above, and watch how much the first result improves.