Ratgeber
Warum KI-Websites gleich aussehen, und wie deine es nicht tut
Lila Verläufe, runde Karten, vier Schritte in einer Reihe: woran man KI-Websites erkennt und wie du deinem Agenten einen eigenen Stil gibst.
Von Tim Haag
Wer ein paar Websites gesehen hat, die ein KI-Agent ohne Vorgaben gebaut hat, erkennt das Muster: Verlauf von Lila nach Blau im Kopf, eine große zentrierte Überschrift, drei Karten mit Icons, vier nummerierte Schritte, alles mit denselben runden Ecken. Das ist nicht hässlich, aber austauschbar. Dieser Ratgeber zeigt, woher das kommt und wie du es vermeidest.
Woher der KI-Look kommt
Ein Agent ohne Vorgaben greift zum wahrscheinlichsten Ergebnis. Das ist der Durchschnitt aus unzähligen Vorlagen und Beispielseiten: die Standardschrift des Frameworks, die Standardradien, die üblichen Abschnitte in der üblichen Reihenfolge. Je weniger du sagst, desto mehr Durchschnitt bekommst du.
Woran du ihn erkennst
- Verläufe als Dekoration, vor allem Lila und Blau, dazu Glow-Effekte und Text in Verlaufsfarben
- dieselbe runde Ecke auf allem, von Knöpfen bis zu Bildern
- jeder Abschnitt gleich aufgebaut: Überschrift mittig, darunter drei oder vier Karten
- Schriften, die nach Systemstandard aussehen
- Emoji oder 3D-Icons statt echter Bilder
- Animationen, die überall etwas einblenden, ohne etwas zu zeigen
Was hilft
Gib eine Idee vor, keinen Stil. „Modern und clean“ führt zum Durchschnitt. Besser ist ein Satz, der deine Seite beschreibt: „Wie eine Werkstattmappe: große Fotos, kurze Texte, viel Weißraum.“
Bring dein Branding mit. Farben, Schrift und Logo, die du schon hast, schlagen jede Regel. Hast du keine, lass deinen Agenten zuerst ein Schriftpaar und wenige Farben vorschlagen, bevor er baut.
Ein Schriftpaar, bewusst gewählt. Eine Schrift für Überschriften, eine für Text. Sag deinem Agenten, er soll die Standardschrift des Frameworks nicht nehmen.
Wenige Farben, konsequent. Eine Grundfarbe, eine Akzentfarbe, dazu gebrochene statt reiner Töne. Keine Verläufe als Schmuck.
Eine Form für Ecken. Entweder eckig, leicht gerundet oder rund, aber im ganzen Projekt gleich.
Abschnitte unterschiedlich bauen. Nicht jeder Teil braucht Karten. Mal ein großes Bild, mal eine Liste, mal ein Zitat.
Mobil zuerst. Die meisten Besucher kommen mit dem Handy. Große Tap-Ziele, nichts, was nur beim Darüberfahren mit der Maus erscheint.
Bewegung nur mit Absicht. Eine Animation, die etwas zeigt, ist gut. Wer in seinem System weniger Bewegung eingestellt hat, bekommt keine.
Echte Bilder. Deine Werkstatt, dein Team, deine Arbeiten wirken mehr als jedes Stockfoto.
Ein Auftrag zum Kopieren
Bei VORREN eingebaut
Seit Version 9 der Vorgaben bekommt jeder Agent, der mit VORREN baut, diese Regeln mit. Die Startvorlagen folgen ihnen, und mit dem Auftrag Seite gestalten geht dein Agent sie ausführlich durch. Mehr dazu im Update Vorgaben Version 9.