Bewegst du deinen Cursor nahe an den Warteliste-Button auf der Landingpage, freut sich Mr. Grummel, der daneben gezeichnet ist. Entfernst du dich, kühlt er ab – erst streng, dann genervt, und weit genug weg sichtbar wütend, mit Dampf und allem. Das liest sich wie eine Figur, die dich bemerkt. Darunter steckt eine schlichte Distanzformel, die bei jeder Mausbewegung in einem requestAnimationFrame-Callback läuft: erfreut unter 180 Pixeln vom Zentrum des Buttons, streng unter 420, genervt unter 700, wütend darüber hinaus. Kein Machine Learning, keine Absichtserkennung – die gesamte Gefühlspalette eines Lehrers, zusammengefasst in vier numerischen Schwellenwerten.
Eine Regel, die über der Distanz steht
Die Distanzberechnung hat eine Ausnahmeklausel: Landet der Cursor direkt auf dem Button, bewertet er Distanz überhaupt nicht mehr und feiert – und dieser Zustand hält, bis du wieder gehst. Das muss alles andere übertrumpfen, denn in dem Moment, in dem du auf dem Button bist, hört seine Meinung über dich auf, der Punkt zu sein. Eine Figur, die mitten im Klick weiter Dampf ablässt, würde genau in dem Augenblick das falsche Signal lesen, in dem das Signal aufhört, wichtig zu sein.
Das Quiz auf der Seite betreibt ein verwandtes, aber eigenständiges Stimmungssystem, das an Antworten statt an der Cursorposition hängt. Ein Streak von zwei richtigen Antworten bringt „erfreut"; eine falsche Antwort schiebt einen Eskalationszähler um eins nach oben, gedeckelt bei drei, und jede falsche Antwort setzt außerdem den Streak auf null zurück. Dreimal falsch hintereinander, und er ist „wütend", mit raschelndem Papier und einer Bildschirmtönung, die beide demselben Zähler folgen. Antwortest du danach richtig, geht der Zähler stufenweise zurück statt komplett zurückgesetzt zu werden – eine schlechte Serie kostet dich schrittweise, und eine gute Serie erarbeitet sich den Weg auf dieselbe Weise zurück.
Der Teil, der abgeschaltet bleiben muss
Jede Mausbewegung zu verfolgen, um eine kontinuierlich aktualisierte Animation anzutreiben, ist genau die Art von Bewegung, die prefers-reduced-motion: reduce abschalten soll – deshalb prüft der cursorfolgende Listener diese Einstellung einmal, vorab, und wird bei gesetzter Einstellung erst gar nicht angehängt. Das ist ein echter Kompromiss, kein kostenloser: Wer diese Einstellung aktiviert hat, bekommt weiterhin die diskreten Stimmungen – Hover, Fokus, eine falsche Quizantwort wirken alle weiterhin –, verliert nur die kontinuierliche Version von „er beobachtet, wie du näher kommst". Wir haben uns für die Version entschieden, die die Einstellung vollständig respektiert, statt für eine, die die Bewegung verwässert und trotzdem einen Teil davon ausliefert – denn eine Einstellung, die „größtenteils" respektiert wird, ist eine Einstellung, die nicht respektiert wird.
Wo wir uns noch unsicher sind
Eine Distanz-zum-Button-Metapher für „Engagement" ist eine vernünftige Vermutung und nicht mehr – wer die Seite aufmerksam liest, während der Cursor in einer Ecke geparkt ist, ist nicht desinteressiert, wird von einer Formel, die nur Pixel kennt, einfach nur falsch erfasst. Wir haben nicht gemessen, ob das Stimmungssystem irgendjemanden Richtung Warteliste schubst oder nur einmal bemerkt und angelächelt wird. Das sind unterschiedliche Ergebnisse, und im Moment haben wir nur Belege für das zweite.
Nichts davon ist Lehrstoff – es ist eine Notiz dazu, wie diese Marketing-Seite gebaut ist, nicht etwas, das die App abfragt. Wenn dir Distanzformeln und Event-Listener eher als Quizfrage liegen würden statt als Lesestoff, deckt das Fach Informatik der App die schlichteren Grundbausteine dahinter ab, angefangen bei Programmierung.