10 Anzeichen für eine Slop-UI

10 Tells of a Slop UI

10 Anzeichen für eine Slop-UI

Ein Blogbeitrag beschreibt die typischen Merkmale von KI-generierten Interfaces, die als „Slop-UI“ bezeichnet werden. Dazu zählen übermäßige Farbverläufe, pulsierende Badges, Fingernagel-Karten, Emoji-Überfluss, fehlausgerichtete Elemente, generische Schriftarten und redundanter Text. Der Autor kritisiert, dass solche Oberflächen billig wirken und oft ohne Vision erstellt werden, obwohl Vibe-Coding an sich nicht schlecht sei.

Ich habe keine Ahnung, warum es diese hinzufügt, aber es tut es einfach. Es ist in den Trainingsdaten, schätze ich.
  1. tlahtinen

    Anfang dieses Jahres habe ich Claude benutzt, um einen Screen für ein Unreal-Spiel zu entwerfen, an dem ich arbeite. Zuerst dachte ich: Wow, was für ein tolles Layout, das ist ein Game-Changer und gibt mir einen riesigen Vorteil.

    Weniger als ein Jahr später ist es mir peinlich, wie sehr es nach Claude aussieht – blinkender Punkt in der Ecke, doppelte // als Trennung im Header-Text, die Schriftwahl … jetzt sehe ich dieselben Muster überall, und ich bin sicher, dass das Publikum es auch mitbekommt.

    Ich benutze Claude immer noch in meiner Arbeit, aber viel sparsamer; ich frage nach Farb- und Schriftvorschlägen (nicht Rajdhani oder Share Tech Mono!), aber die sind meist nur zur Inspiration und ich kopiere sie nicht blind. Es fühlt sich an, als wäre ich klüger darin, aber vielleicht stelle ich in einem Jahr fest, dass ich der Falle immer noch nicht entkommen bin :)

  2. weakfish

    Ich habe versucht, den Finger darauf zu legen, was passiert, wenn der Roboter Sachen wie das Beispiel „3 Campuses, eine App“ schreibt. Ich bin froh, dass der Autor es als durchsickernden Chat-Kontext identifizieren konnte.

    Die andere Version davon ist, dass der Roboter einen Teil des Prompts übergewichtet und dann Kommentare an Stellen hinterlässt. Ein Beispiel: Ich bitte ihn, Integrationstests mit TestContainers zu bevorzugen, und er fängt an, jedem neuen Test Kommentare wie „Echte Services, keine Mocks“ oder so hinzuzufügen.

    Und ja, ich habe eine Zeile in meiner *.MD, die sagt, dass er das nicht tun soll.

  3. czhu12

    Zumindest einige davon sind einfach aus Mangel an Sorgfalt. Ich habe diese Landingpage kürzlich vibe-coded: https://tui2web.com/ und habe nach ein paar Stunden Iteration viele der Standardvorgaben, die das LLM vorgeschlagen hat, abgewehrt. Fühlt euch frei, sie zu verreißen, ich hänge nicht wirklich daran, aber ich dachte, sie macht einen ziemlich guten Job.

  4. vallerie

    Ich liebe diesen Blog, der das Problem von Implementierungsdetails in Prosa anspricht. Wahrscheinlich mein größter Störfaktor bei vibe-codierten Apps.

    Vieles davon ist ein einfaches Problem zu lösen – man promptet einfach den Agenten seiner Wahl: „Packe allen für Nutzer sichtbaren Text in eine Übersetzungsdatei für i10n“ und geht dann als Mensch durch und bearbeitet besagte Prosa.

  5. zinoc

    Das ähnelt der schnellen frühen Verbreitung des Bootstrap-CSS-Frameworks. Viele Leute waren genervt von der plötzlichen Zunahme von Websites, die gleich aussahen und sich gleich anfühlten, aber ich denke, das war ein enormer Fortschritt in Sachen Benutzerfreundlichkeit und Barrierefreiheit und die erste Welle von 08/15-Websites absolut wert.

  6. jph

    Ich starte mit diesen Regeln und passe sie dann nach Wunsch an …

    BETONE:

    - *Zusammenfassung.* Erster Absatz wie in einer Zeitung (wer, was, wo, wann, wie, warum).

    - *Vorteile.* Konzentriere dich auf die Vorteile für den Leser.

    - *Warum das wichtig ist* Konzentriere dich darauf, was es dem Leser bringt.

    NEIN:

    - *Kein Tech-Stack.* Sage nicht die technische Umsetzung; steht woanders.

    - *Keine Zahlen.* Sage keine Seitenzahlen, Teilezahlen, Kapitelzahlen usw.

    - *Keine spezielle Formatierung.* Nicht fett, nicht kursiv, keine Aufzählungen.

    - *Kein „wenn“.* Sage nicht „Wenn du X tust, dann Y“; verwende stattdessen positive Formulierungen.

    - *Keine Schachtelsätze.* Verwende nicht viele Nebensätze oder zu viele Wörter.

    - *Kein Passiv.* Verwende keine passiven oder subjektlosen Sätze.

  7. mjr00

    Das Wichtigste, was ich beim Übergang von „schlechter Musiker“ zu „passabler Musiker“ (passabel genug, um Hörer und Fans zu haben, zumindest) gelernt habe, war, dass es keinen einzigen großen Trick gibt, der einen Song von schlecht zu gut macht: Es gibt 100 winzige kleine Tricks, die sich summieren. Und man braucht Erfahrung, um zu wissen, welche das sind. Ein geschultes Gehör kann vielleicht sagen: „Die Mitten sind zu komprimiert“, „es gibt zu viele Höhen“, „die Drum-Transienten kommen nicht durch“, aber ein normaler, beiläufiger Hörer sagt einfach: „Ich weiß nicht, es klingt einfach nicht richtig.“

    Dieser UI-Slop ist dasselbe. Ein leicht falsch ausgerichteter Punkt außerhalb der Timeline, Farbwahlen, die angesichts der Website als Ganzes keinen Sinn ergeben, die Verwendung von LLM-typischem Text. Nichts davon ist für sich genommen offensichtlich ein großes Problem. Aber wenn man 50 davon auf einer Website addiert, bekommen Nutzer dieses „das ist Slop“-Gefühl.

    Die Details zählen. Isoliert scheinen sie irrelevant, aber als Ganzes ist es das, was etwas vom KI-Slop-Müllhaufen zu etwas wirklich Gutem erhebt.

  8. tptacek

    Ein „inaktiver“ Student ist jemand, der eingeschrieben ist, aber derzeit keine Kurse besucht.

    Das ist ein super nützlicher Artikel, aber viele dieser Beschwerden über Dinge wie Ausrichtungen sind auch das natürliche Ergebnis davon, dass ich, ein Nicht-Frontend-Mensch, überhaupt irgendein Web-Frontend baue. Also würde ich mich nicht zu sehr damit verrückt machen.

Mehr von diesem Tag

2026-09-27