Naar de inhoud springen
kenjtecJournal
Het Journal doorzoeken

Webdesign met AI: met Stitch drie richtingen verkennen in plaats van één ontwerp

Drie ontwerpen worden pas interessant als ze verschillende taken voorrang geven. Een bibliotheekpagina biedt een concrete opdracht voor een eerlijke ontwerpvergelijking.

Ana legt dezelfde kaarten op drie dienbladen in drie verschillende volgordes. AI-illustratie.

Het eerste AI-ontwerp ziet er samenhangend uit. Het heeft een grote kop, vriendelijke kleuren en een opvallende knop. Juist daarom loont het om een tweede vraag te stellen: waarom staat uitgerekend deze actie bovenaan? Een overtuigend scherm kan een willekeurige prioriteit zo vanzelfsprekend laten lijken dat niemand er nog over discussieert.

Op 18 maart 2026 beschreef Google Labs een uitgebreide Stitch-aanpak voor AI-ondersteund UI-ontwerp op een gedeeld canvas. Dit is een oudere aankondiging van een tool, geen actueel nieuwsbericht uit oktober. Voor dit praktijkartikel gebruiken we het als vertrekpunt voor een eigen ontwerpoefening: drie richtingen die inhoudelijk verschillen en allemaal op dezelfde bevestigde feiten zijn gebouwd.

Een variant heeft een ander doel nodig

Onze fictieve buurtbibliotheek heeft zes inhoudelijke onderdelen: boeken zoeken, openingstijden, evenementen, inschrijving, locatie en informatie voor een eerste bezoek. De eerste richting geeft voorrang aan zoeken. De tweede begint met de eerstvolgende evenementdatum. De derde helpt mensen die er nog nooit zijn geweest.

Deze verschillen gaan verder dan een andere hoekafronding of accentkleur. Elke richting beantwoordt een andere aanname over waarom mensen de pagina bezoeken. Zodra de aanname wordt uitgesproken, kan ze ter discussie worden gesteld. Misschien moet een bibliotheek met veel vaste bezoekers anders worden gewogen dan een nieuwe instelling die mensen eerst de weg moet wijzen.

Houd de feiten daarbij vast. Een ontwerp mag niet overtuigender lijken alleen omdat het langere openingstijden verzint of een lastige deelnamevoorwaarde weglaat. Ontwerp ordent de informatie; het krijgt geen vrijbrief om die passend te maken.

Een opdracht die echt om drie richtingen vraagt

Je kunt het volgende sjabloon, dat van onszelf is, aanvullen met je bevestigde inhoud. Het beschrijft een werkopdracht, geen Stitch-uitvoer die daadwerkelijk is gegenereerd.

Ontwikkel drie verschillende instappunten voor dezelfde bibliotheekpagina. A geeft voorrang aan het zoeken naar boeken, B aan de eerstvolgende evenementdatum, C aan oriëntatie vóór het eerste bezoek. Gebruik alleen de aangeleverde feiten. Laat de openingstijden en deelnamevoorwaarden ongewijzigd. Leg per variant uit welke taak als eerste wordt ondersteund en wat daardoor naar achteren schuift.

De laatste vraag is belangrijk. Een prioriteit kost elders ruimte en aandacht. Wie alleen naar de voordelen van een variant vraagt, krijgt gemakkelijk drie positieve onderbouwingen. Door het nadeel zichtbaar te maken, neem je de beslissing serieus.

Vraag eerst naar de volgorde en de samenhang tussen informatieonderdelen, niet naar extra decoratie in het beeld. Een eenvoudige schets laat vaak al zien of de richtingen inhoudelijk verschillen. Kleuren en illustraties kunnen daarna de gekozen bedoeling ondersteunen.

Een gedeelde taak maakt de vergelijking eerlijker

Kies voordat je oordeelt een concrete taak: vind een geschikte evenementdatum en zoek uit hoe je kunt deelnemen. Bekijk dezelfde taak in alle drie de versies. Waar staat de datum? Hoe wordt de voorwaarde zichtbaar gemaakt? Waar leidt de uitgelichte actie naartoe?

Noteer waarneembare problemen. ‘Inschrijving was pas na opnieuw lezen herkenbaar’ is iets waarmee je aan de slag kunt. ‘Ziet er ouderwets uit’ heeft eerst een preciezere toelichting nodig. Het gaat er niet om smaak te verbieden. Die mag alleen niet de enige onderbouwing zijn voor een beslissing over informatie.

Een redactionele beoordeling als deze is nog geen bruikbaarheidsonderzoek. Als mensen de varianten later echt uitproberen, moeten de taken, de omgeving en de waarnemingen worden vastgelegd. Dit artikel doet niet alsof er testsessies hebben plaatsgevonden of alsof er resultaten zijn.

De keuze wordt een nauwkeurige overdracht

Noteer na de vergelijking het voorkeursinstappunt, de hoofdtaak ervan en de details die nog nodig zijn. Voeg eventuele open vragen toe. Misschien werkt de evenementenrichting goed voor een campagnepagina, terwijl de gewone homepage voorrang moet geven aan zoeken. Een onderbouwde keuze mag genuanceerd zijn.

De overdrachtstekst is waardevoller dan een losse screenshot. Die legt uit welke relatie tussen inhoud en interactie behouden moet blijven. Een ontwikkelaar die het werk daarna overneemt, of een andere AI, hoeft dan minder uit het uiterlijk af te leiden.

Een UI-ontwerp is nog geen complete applicatie. Gegevenskoppelingen, gedrag en toegankelijkheid vragen om eigen werk. De kracht van de oefening ligt daarvóór: ze maakt alternatieven zichtbaar zolang het nog gemakkelijk is om de basisrichting te veranderen. Het eerste aantrekkelijke ontwerp blijft dan één mogelijkheid onder meerdere, in plaats van ongemerkt de enige denkbare weg te worden.

Bronnen en stand van zaken

Onderzoek en documentatie bijgewerkt tot 25 oktober 2026. Introductie van vibe design met Stitch.

Hamburg is ons vertrekpunt.

Het nuttige reist met je mee.

Praktische AI uit Hamburg, internationaal uitgelegd.

Bewaarde artikelen