Een designprompt zonder AI-look

Een prompt van één zin levert een website op die op duizend andere lijkt. Dat ligt niet aan de tool. Elke keuze die jij niet maakt, maakt het model, en het kiest dan wat het het vaakst zag. Hieronder staan de acht onderdelen van een prompt die die keuzes zelf maakt, met per onderdeel voorbeeldregels die je kunt overnemen.

Onderaan staat hoe je de prompt gebruikt. De hele opbouw met invulplekken kun je kopiëren of downloaden als designprompt-template.

Herken je dit?

Elk woord dat je weglaat, kiest het model

“Modern”, “strak” en “professioneel” passen bij bijna elke site waarvan een model leerde. Ze wijzen dus naar het midden van al die sites, en daar staan het verloop en de kaarten. Een bijvoeglijk naamwoord beschrijft een gevoel. Een model heeft beslissingen nodig: welke letter, welke kleurcode, wat er links staat, welke zin in de kop komt.

Een verbod is ook geen beslissing. “Geen paars” sluit één kleur uit en laat de rest open, dus pakt het model de volgende standaard. De prompthandleiding van Anthropic, de maker van Claude, geeft hetzelfde advies: zeg wat het model moet doen, niet alleen wat het moet laten.

De acht onderdelen

1. Merk

Wie je bent, in feiten. Wat je doet, voor wie, waar, sinds wanneer. Heb je een logo en vaste kleuren, voeg ze bij als bestand.

Merk: installatiebedrijf voor cv-ketels en warmtepompen, eigen monteurs,
werkt in de Drechtsteden. Logo als SVG in de bijlage.

2. Doelgroep

Wie de pagina opent, op welk apparaat, en wat die persoon binnen tien seconden wil weten. Dat bepaalt wat bovenaan staat.

Doelgroep: huiseigenaar met een kapotte ketel, op zijn telefoon.
Wil weten: kunnen jullie vandaag komen, en wat kost het.

3. Toon

Beschrijf de toon als een persoon in een situatie, en geef twee zinnen uit je eigen teksten als voorbeeld. Noem ook de woorden die je nooit gebruikt.

Toon: zoals een monteur praat tegen een klant in de keuken. Kort, je-vorm.
Voorbeeld: "Bel voor tien uur, dan komen we vandaag."
Nooit: "oplossingen", "kwaliteit", superlatieven.

4. Layout

Geef per pagina de volgorde van de secties, en zeg wat waar staat. Zeg ook in welke vorm: een lijst, een foto, een tabel met prijzen.

Layout homepage:
1. Kop links, foto van een monteur aan het werk rechts, één knop: Bel ons.
2. Drie diensten als lijst met een prijs per regel, gescheiden door een lijn.
3. Werkgebied als lijst met plaatsnamen.
4. Twee echte Google-reviews, met naam en datum.

5. Typografie

Noem de letters bij naam, met gewicht en grootte. Laat je dit open, dan wordt het Inter. Hoe je een letter kiest, staat in een lettertype kiezen dat niet naar AI ruikt.

Koppen: [letter voor koppen], 800, hoofdletters, hoofdkop 64 px op desktop.
Tekst: [letter voor tekst], 400, 18 px, regelhoogte 1,6.

6. Kleur

Geef kleurcodes, en per kleur zijn taak. Zonder taak zet het model je accentkleur overal neer. Hoe je dit vastlegt als variabelen, staat in design tokens zodat AI consistent blijft.

Kleur: achtergrond #FFFFFF. Tekst #1B1F1D. Alleen knoppen en links #0B5F8A.
Geen andere kleuren.

7. Content

Plak je echte teksten in de prompt, per sectie. Zeg dat het model niets mag verzinnen: geen klanten, geen cijfers, geen reviews. Ontbreekt er iets, dan moet er een zichtbare invulplek komen.

Content: gebruik alleen de teksten hieronder, letterlijk.
Ontbreekt er tekst of een foto, zet dan [TEKST] of [FOTO] neer.
Verzin geen klanten, logo's, reviews of cijfers.

8. Verboden patronen, met wat ervoor in de plaats komt

Noem de patronen die een AI-site verraden, en zet bij elk wat het model in plaats daarvan doet. Waar die patronen vandaan komen, staat in zo herken je een AI-website.

Niet: verlopen.             Wel: effen vlakken in de kleuren hierboven.
Niet: drie kaarten.         Wel: een lijst met lijnen ertussen.
Niet: ronde pilknoppen.     Wel: rechthoekig, hoek van 6 px, zonder pijl.
Niet: glas en blur.         Wel: een effen achtergrond.
Niet: label boven de kop.   Wel: de kop als eerste element.

Zo gebruik je de prompt

Begin met de homepage, en maak daarna pagina voor pagina. Een hele site in één opdracht kost het model zijn details: halverwege worden de koppen weer gecentreerd.

Vraag eerst om een plan in woorden. Laat het model in tien regels beschrijven wat het gaat bouwen. Klopt dat met je prompt, laat het dan pas genereren.

Wil je een site als voorbeeld gebruiken, beschrijf dan wat je eraan goed vindt (“een grote foto die onder de kop doorloopt”) in plaats van een screenshot te plakken. Een screenshot wordt nagebouwd.

Bewaar de prompt als bestand en gebruik hem voor elke volgende pagina. Werk je met Google Stitch, dan hoort hij in een DESIGN.md, het bestand waarin Stitch designregels leest. Hoe je dat opzet, staat in een DESIGN.md maken voor je AI-tools.

Waar het misgaat

Wanneer je hulp nodig hebt

Heb je met deze opbouw een ontwerp dat je goed vindt, dan is de volgende stap een site die snel laadt en die je zelf kunt bijwerken. Dat doen we bij AI-design omzetten naar een echte website. Staat er al een site die nog steeds als AI oogt, dan begint het bij AI-design laten verbeteren. Alle gidsen over ontwerpen met AI staan bij AI-design.