Design ○ Development

Vibe coding biedt snelheid, maar expertise geeft een website karakter.

AI genereert websites met één prompt. Maar wordt alles dan geen eenheidsworst? Hoe behouden wij merkidentiteit als de machine codeert? Wordt mijn rol als designops overbodig?
Geschreven door Johnny Berkmans

vibe coding

single prompt websites

blanding

vibe coding

single prompt websites

blanding

thinktomorrow-berkmansjohnny-profielfoto.png

"Soms voelt het alsof elke pixel en elk design waar ík met zorg aan heb gewerkt, morgenochtend alweer ingehaald wordt door een AI-generated ontwerp of website."

Johnny

Merkenthousiasteling

Simple math

Vibe coding + AI generated images + Claude AI copy = Blanding

AI-tools kunnen in een handomdraai een functionele homepage genereren, op basis van één enkele prompt (vibe coding). Als brand designer, die elke pixel, breakpoint en hover-effect handmatig finetunet, voelt dat als een harde confrontatie. Maar wel de huidige realiteit.

Ok tof, dus vibe coding is een dingetje. En nu? Spring ik mee op die kar? Ga ik snel overnight leren hoe ik een vibe coding prompt wizard word? Wat zijn de pitfalls van AI? Welke tools zijn er allemaal?  ...

Stay cool 🧊

Remember your training.

Tools zijn nooit de oplossing, slechts "a means to an end". 
Vibe coding of andere AI tools ... dwingt mij en mijn team om dieper te denken dan ‘hoe het eruitziet’.

Wat speelt er in onze industrie?

Nog meer éénheidsworst

De kans op eenheidsworst groeit doordat veel van de huidige AI tools werken vanuit dezelfde model-training en component-bibliotheken.

Zonder onze menselijke hand leveren AI-sites gewoon:

  • Dezelfde hero-structuren en grids

  • Gelijkaardige kleur- en typografiekeuzes

  • Identieke navigatie- en footer-patronen

funny-eenheidsworst.jpg

Let op met AI

  • Te veel uniformiteit
    AI gebruikt vaak standaard templates en zuigt de ziel uit een merk.

  • Verminderde betrokkenheid
    de human touch verdwijnt en je bent op het eerste zicht onder de indruk van het resultaat. De AI-workflows vergeten de fijne details en houden geen rekening met de doelgroep.

  • Vergeten UX-tweaks
    Standaard AI-workflows negeren accessibility, laadtijden en optimale mobiele weergave, zaken waar onze developers en designers juist heel goed op letten.

  • Vage meerwaarde
    Wanneer een machine een site bouwt, hoe overtuig ik onze klant dan dat ze mijn expertise – écht nodig hebben?

Bewaak je merk ten alle koste

  • Handmatige finetuning
    Ik bekijk elke AI-output kritisch en breng zelf de laatste hand aan micro-interacties, animaties, copy-tone en beeldkeuze. Zo behoud ik de nuance die een machine nog niet snapt.

  • Schrijf gedetailleerde prompts
    Niet om de look & feel te beschrijven, maar vooral de merkwaarden, doelgroep, tone of voice en call-to-action. Een goede prompt helpt AI om niet alleen de “vibe” te maken, maar ook het échte merkverhaal te gebruiken. En ik lees het na. Ik schrijf. Ik schrap. Ik herwerk.

  • Continue feedbackloop
    Wij hebben ons proces waarbij alle designers, developers en marketeers regelmatig onze sites reviewen, feedback geven, zodat we kunnen bijsturen. Zo blijft een website evolueren en voorkomen we dat alles op elkaar gaat lijken.

3 takeaways als designer

Gebruik AI als springplank voor je merk

☝️ AI als moodboard, niet als output.

Ik gebruik de eerste AI-output als springplank voor mijn eigen visie. De automatische lay-out is geen eindstation, maar een ruwe schets om op voort te bouwen. Ik tweak de inhoud of het ontwerp wat je niet met een prompt kan vatten.

✌️ Stel je strategisch denken voorop.

Ik denk niet alleen na over vorm, maar vooral over functie en doel: wat wil ik als bedrijf of merk bereiken, welke emoties wil je oproepen? Ik ben de architect achter de interface.

🤟 Authentiek merkverhaal

AI genereert dus een oppervlakkige ‘vibe’, maar mist de subtiele waarden en emotionele verbinding. Die je-ne-sais-quoi die jouw klant écht raakt.

Natuurlijk gebruik ik ook AI, maar vertaal wel steeds elke missie en visie naar authentieke copy, straffe boodschappen en merkwaardige visuals.

TLDR; Geschikt voor hobbyprojecten

Vibe coding momenteel komt vooral van pas voor kleinschalige of experimentele projecten, niet voor development waar onderhoud, veiligheid en schaalbaarheid belangrijk zijn.

tools-are-not-the-solution.jpg

AI tools die wij gebruiken

Cursor - een AI-powered code-editor:
een virtuele partner die ontwikkelaars realtime helpt met typsuggesties, refactorings en uitleg vanuit de bestaande codebase. Zo schrijven we sneller, schoner en lanceren we met meer vertrouwen.

Github Copilot onze AI-powered pair-programmer: 
een slimme assistent in de IDE die proactief complete codeblokken, tests en documentatie voorstelt op basis van natuurlijke taal en projectcontext. Zo versnellen we feature-ontwikkeling en verhogen we onze code-kwaliteit.

AI prompt tools

  • Bolt New – AI-gestuurde live editor

  • Lovable.dev – genereren van React-componenten

  • Relume – componentenbibliotheek voor Webflow

  • Replit – code + AI-pair programmer