>_ DevTrendsnl

Taal

Home

Talen

Secties

Frontend Backend Mobiel DevOps AI / ML GameDev Blockchain Embedded Beveiliging
CSS

Hoe je stopt met het maken van websites die eruitzien als generieke AI-sjablonen

Herkenbaar scenario: je vraagt een AI om snel een landingspagina te maken, en het spuugt weer een kloon uit met een gecentreerde headline, een enorme hero-afbeelding en drie voordelen-icoontjes? Alles ziet er netjes uit, maar het heeft allemaal datzelfde "plastic" gevoel. Dit effect heeft al een naam — AI slop.

Onlangs stuitte ik op Hallmark. Het is niet zomaar een code-generator, maar een skill (addon) voor populaire AI-editors zoals Cursor, Claude Code en Codex. Het belangrijkste verkoopargument van het project is de agressieve weerstand tegen standaardpatronen waar taalmodellen op getraind zijn. In plaats van een internetgemiddelde uit te spugen, zoekt de tool actief naar unieke structuren en stijlen.

Wat er onder de motorkap zit bij Hallmark

De ontwikkelaars bij Together AI kozen voor de tegenovergestelde aanpak. In plaats van traditioneel prompten implementeerden ze een systeem van 57 checks ("slop-test gates"). Dit zijn filters die overgebruikte oplossingen wegfilteren. Als een model een standaard "hero"-blok probeert voor te stellen, dwingt het systeem het model om de layout opnieuw te doen tot het eruitziet als werk van een echte ontwerper.

Interessant is dat Hallmark geen kant-en-klare templates gebruikt. Het selecteert een macro-structuur voor een specifieke briefing en "kleedt" deze aan in een van de twintig thema's. Twee verschillende taken leveren twee verschillende websites op, niet slechts een kleurenpalet-uitwisseling.

Hallmark, een designskill die weigert er AI-gegenereerd uit te zien

Vier werkmodi

De tool wordt aangestuurd via eenvoudige commando's. Ik heb twee bruikbare scenario's voor mezelf geïdentificeerd, naast reguliere generatie.

De eerste is hallmark study. Je geeft het een screenshot of link naar een site die je mooi vindt. Hallmark maakt geen pixel-perfecte kopie (wat er meestal treurig uitziet), maar haalt het "DNA" van het design eruit: typografie, ankerkleuren en de logica achter de blokconstructie. De output is een design.md bestand dat je aan elke AI als handleiding kunt geven.

De tweede is hallmark audit. Als je al code hebt, draait de tool deze door zijn "AI slop"-tests en krijg je een lijst met bewerkingen. Het zal de code zelf niet aanpassen om niets te breken, maar het wijst je wel op plekken waar het design te voorspelbaar oogt.

Er is ook redesign, die de paginastructuur volledig herbouwt terwijl je tekst en branding behouden blijven. Dit is handig wanneer een oude landingspagina gedateerd is geraakt en je een frisse blik wilt zonder de inhoud te wijzigen.

Voorbeelden van wat het produceert

De repository bevat volop voorbeelden, en ze zijn echt anders. Er zijn strakke minimalistische interfaces voor SaaS, en er zijn bijna "ambachtelijke" pagina's voor kleine boerderijen of platenlabels.

Als geen van de standaard thema's past bij het wilde idee van een klant, schakelt Hallmark over naar Custom-modus. In dat geval ontwerpt het het kleurenpalet en de grid helemaal opnieuw, zonder te leunen op vooraf ingestelde regelsets.

Hoe je het lokaal aan de praat krijgt

Integratie is vrij eenvoudig. De snelste manier is via npx:

npx skills add nutlope/hallmark

Daarna verschijnen de bestanden in de noodzakelijke mappen. Als je Cursor gebruikt, worden de regels opgehaald in .cursor/rules/hallmark.mdc. Voor Claude Code of Codex verschillen de paden iets, maar het algemene principe is hetzelfde: je voegt een set instructies (SKILL.md) en een referentiemap toe aan je werkmap.

De volledige projectcode is open onder de MIT-licentie. Je kunt het veilig forken, de regels naar eigen behoefte aanpassen of gebruiken in commerciële projecten.

Wie heeft hier baat bij

Ik zou niet zeggen dat Hallmark een professionele ontwerper zal vervangen bij een complex project. Maar als je een backend-ontwikkelaar bent die snel een degelijk admin-paneel of landingspagina voor een persoonlijk project moet in elkaar zetten, is dit een redder in nood. De site zal niet schreeuwen dat hij door ChatGPT in 5 seconden is gemaakt.

De tool is ook geweldig voor snelle prototyping. In plaats van in Figma te pielen, kun je verschillende structurele varianten meteen in code uitwerken en zien welke "vibe" beter bij het product past.

Natuurlijk kan Hallmark het soms overdreven doen en een oplossing produceren die te gedurfd is, wat je handmatig moet bijschaven. Maar het is nog steeds beter dan voor de honderdste keer dezelfde sjabloonlayout te zien. Als je genoeg hebt van AI-designmonotonie, is Hallmark zeker de moeite waard om aan je arsenaal toe te voegen.

Gerelateerde projecten