Naar inhoud

Wat mist je AI om een website op Awwwards-niveau te bouwen?

Je wilt een site die beweegt en indruk maakt zoals het werk van een ontwerpstudio, en je bouwt met een coding agent. Hier lees je wat de jury van Awwwards beoordeelt, waar een AI zonder plan tekortschiet en welke winnaars laten zien hoe het wel kan.

Laatst bijgewerkt op 5 november 2026

Je AI mist vooral richting. Awwwards beoordeelt sites op design (40 procent), bruikbaarheid (30), creativiteit (20) en content (10). Een coding agent zonder plan kiest een templateopbouw, verzint teksten, vergeet mobiel en reduced motion en bouwt geen moment dat mensen onthouden. Leg die keuzes vast voordat hij bouwt, dan heb je een kans, geen garantie.

Struq is een gratis, open source designskill voor Claude Code, Cursor, Codex en andere AI-codeertools: je AI kiest eerst richting, letters, kleur en beweging en bouwt pas daarna, zodat je site eruitziet alsof een studio hem maakte, niet een AI.

Bekijk het in de galerij.

Deze voorbeelden komen uit dezelfde galerij als de rest van Struq. Open een keuze en pas hem direct toe in de receptbouwer.

Wat zijn Awwwards en FWA?

Awwwards en FWA zijn de bekendste plekken waar websites op ontwerp worden beoordeeld. Een prijs daar is voor studio’s en freelancers een visitekaartje, en de winnaars laten zien waar de lat ligt.

  • Awwwards: een jury van minstens 18 juryleden beoordeelt elke ingezonden site, vijf dagen lang. De hoogst beoordeelde sites worden Site of the Day. Uit die winnaars kiest de jury elke maand een Site of the Month en elk jaar een Site of the Year. Daarnaast zijn er de Honorable Mention en de Developer Award. Insturen kost 65 euro per site, of 150 euro per jaar voor één inzending plus een Pro-account.
  • FWA: bestaat sinds 2000. Een jury beoordeelt ingezonden sites live, en de beste krijgen de titel FWA of the Day. Insturen doe je via thefwa.com/submit.

Er zijn meer plekken. CSS Design Awards kiest een Website of the Day en een Website of the Month. De Webby Awards worden uitgereikt door de International Academy of Digital Arts and Sciences, met daarnaast een publieksprijs, de Webby People’s Voice Award.

Waarop beoordeelt de Awwwards-jury, en wat doet je AI fout?

Awwwards publiceert vier criteria met een vast gewicht. Onder elk criterium staat wat een coding agent zonder plan meestal fout doet.

  • Design, 40 procent. De AI kiest wat het vaakst voorkomt: een hero met een knop, drie kaarten op een rij, een verloop en een generiek lettertype. Zo ziet een template eruit, en dat herkent een jury in een paar seconden.
  • Bruikbaarheid, 30 procent. De animaties draaien ook voor wie in zijn systeem minder beweging heeft gevraagd, want reduced motion ontbreekt. Op mobiel valt de opbouw uit elkaar of verdwijnt de beweging die op desktop het verhaal droeg.
  • Creativiteit, 20 procent. Er is geen moment dat mensen onthouden. Elke sectie krijgt hetzelfde invliegende blok, in plaats van één scène die alleen bij deze site hoort.
  • Content, 10 procent. Tijdelijke teksten en verzonnen feiten: klantcitaten die niemand gaf, cijfers die nergens op slaan en een tekst die bij elk bedrijf zou passen.

Wat hebben sites op Awwwards-niveau gemeen?

De vier voorbeelden hieronder verschillen sterk van elkaar, maar in beweging en typografie zie je vier dingen terug:

  • Scrollen dat een verhaal vertelt: beelden en tekst verschijnen in een vaste volgorde, en soms blijft een sectie staan terwijl de inhoud erin verandert.
  • Overgangen tussen pagina’s: je klikt op een project en het beeld groeit door naar de volgende pagina, in plaats van een witte flits.
  • Eén moment dat mensen onthouden: een 3D-scène, een kop die uiteenvalt of een interactie die je wilt herhalen. Eén, niet tien.
  • Typografie met karakter: koppen zo groot dat ze het beeld dragen, een lettertype dat bij het merk hoort en tekst die regel voor regel verschijnt.

Wat ook opvalt: de beweging volgt één ritme, met dezelfde snelheid en dezelfde manier van vertragen, van de hero tot de footer.

Welke winnaars laten zien hoe het moet?

Vier sites die Site of the Day werden en bekend staan om hun beweging of typografie. Bekijk ze zelf: scroll, klik door en let op wat er tussen twee pagina’s gebeurt.

Wat verandert een richting die je vooraf vastlegt?

Elk punt hierboven is een keuze die vóór de eerste regel code valt. Leg je die vooraf vast, dan bouwt je AI naar een plan in plaats van naar het gemiddelde:

  • Design: één richting, twee lettertypes en een opbouw per sectie, zodat de AI niet terugvalt op een template.
  • Bruikbaarheid: reduced motion en mobiel staan in het plan, met per beweging wat er op een telefoon gebeurt.
  • Creativiteit: één moment dat je vooraf kiest en waar de rest van de site naartoe werkt.
  • Content: een verbod op verzonnen citaten en cijfers, en echte tekst of een duidelijke lege plek.
Voordat je AI begint te bouwen

Schrijf eerst een plan, nog geen code. Leg vast: één visuele richting, twee lettertypes met hun rol, een palet met hexcodes, de opbouw per sectie, één moment dat bezoekers onthouden, overgangen tussen pagina’s en één ritme voor alle beweging. Beschrijf per beweging wat er gebeurt bij prefers-reduced-motion en op mobiel. Verzin geen klantcitaten, cijfers of feiten. Bouw pas na mijn akkoord.

De Struq-skill doet dat voor Claude Code, Codex, Cursor en OpenCode. Hij schrijft één plan met merk, concept, lettertypes, kleuren, opbouw en beweging, vraagt één keer om je akkoord en bouwt dan met vloeiend scrollen, overgangen tussen pagina’s en een pronkstuk dat vaststaat terwijl je scrollt. In een blinde vergelijking, met een AI-model als beoordelaar, telde de bouw zonder skill 22 kenmerken van een template en met de skill 8.

Een skill garandeert geen prijs. Struq claimt geen Awwwards- of FWA-prijs, niet voor zichzelf en niet voor sites die ermee gebouwd zijn. Wat een vooraf vastgelegde richting wel doet: de fouten weghalen die een jury in de eerste seconden ziet, zodat je tijd overhoudt voor het werk dat een jury onthoudt.

Veelgestelde vragen

Kan een website die met AI is gebouwd Site of the Day worden?

De jury beoordeelt de site op design, bruikbaarheid, creativiteit en content. Een AI zonder plan schiet op alle vier tekort. Met een vaste richting, echte content en één moment dat mensen onthouden kom je dichter bij de lat, maar een prijs is nooit gegarandeerd.

Wie beoordeelt sites op Awwwards?

Een jury van minstens 18 juryleden, vijf dagen lang. De drie oordelen die het verst van het gemiddelde liggen, vallen automatisch weg. De hoogst beoordeelde sites worden Site of the Day.

Wat kost insturen bij Awwwards?

Een standaard inzending kost 65 euro per site. Voor 150 euro per jaar krijg je een inzending plus een Pro-account. Leden met een abonnement krijgen korting op inzendingen.

Heeft Struq een Awwwards- of FWA-prijs gewonnen?

Struq claimt geen prijs. Deze gids beschrijft de lat, geen resultaat. De Struq-skill legt vooraf een richting en beweging vast, maar een prijs hangt af van het hele werk en van de jury.

Installeer de Struq-skill voor je volgende site.

Kies je AI-codeertool op de skillpagina, klik op Kopieer voor je AI en plak de opdracht. Daarna legt je AI eerst richting, lettertypes, kleuren en beweging vast, en bouwt pas na jouw akkoord.

Naar de skill