Februar

Kick-off

Der Kick-off-Workshop war gleichzeitig Ideenfindung und Eingrenzung. Im Gespräch mit Philipp Stamm und Mitstudierenden verdichtete sich die Frage, die mich von da an leitete: An welcher Stelle kann mit Bewegung und Interaktion eingegriffen werden, um Leser:innen zu lenken – und ab wann kippt diese Lenkung in Ablenkung? Ich merkte, dass diese Spannung auf wahrnehmungspsychologischen Grundlagen basiert, welche mir zu diesem Zeitpunkt noch nicht bewusst waren. Ob ein Eingriff orientiert oder stört, hängt nicht allein vom Mittel ab, sondern vom Moment, in dem es eingesetzt wird.

Skizzen

Die ersten Skizzen dienten dazu, die Vielschichtigkeit der digitalen Leseerfahrung sichtbar zu machen. Oberflächen, Augenführung, Rhythmus und Navigation beeinflussen den Lesefluss. Dabei wurde schnell klar, dass diese Faktoren nicht isoliert wirken, sondern sich gegenseitig beeinflussen. Schon ein Ausschnitt aus den Skizzen zeigte, dass kein einzelner Parameter entscheidet, ob Lesen gelingt oder scheitert.

Moodboard

Experimente

Die ersten Tests waren weniger spezifisch. Das Ziel war vor allem, meine Gedanken visuell verankern und den Möglichkeitsraum zu erkunden, was für das Lesen relevant sein könnte.

Der erste Test setzte einen Beispieltext in HTML und verwendete die CSS-Funktion clamp(), um Schriftgrösse und Flattersatz dynamisch an die Fensterbreite anzupassen. Das klingt technisch, hat aber eine direkte wahrnehmungspsychologische Relevanz: Schriftgrösse, Zeilenlänge und Zeilenabstand beeinflussen die Anzahl der Fixierungen pro Zeile und damit die kognitive Belastung beim Lesen.

Wenn Scrollen die natürlichste Interaktion im digitalen Raum ist: Was passiert, wenn sie keinen Inhalt mehr transportiert? Der endlose Scroll erzeugte eine Situation, in der Leser:innen über den Sinn der Interaktion selbst nachzudenken begannen. Interaktion bedeutet nicht immer Informationsgewinn – manchmal ist sie selbst die Aussage. Diese Idee liess sich nicht direkt in ein lesbares Format überführen, blieb aber als konzeptuelle Referenz bestehen.

Der nächste Schritt brachte als dritte Dimension den Raum hinzu. Ein Gedicht reagierte über das Gyroskop des Smartphones auf die physische Neigung des Geräts. Variable Schriften und Textelementpositionen wurden durch Körperbewegung gesteuert. Das Experiment thematisierte, wie stark körperliche Interaktion das Verhältnis zur Lesbarkeit verändern kann.

Workshop

Während einer Woche besuchte ich den Weiterbildungsworkshop "Responsive Typography" bei Thomas Bircher. Im Vordergrund stand der Umgang mit relativen Einheiten, Skalierbarkeit und der Kontextabhängigkeit typografischer Entscheidungen. Ich lernte, dass Typografie im digitalen Raum nie in einem festen Zustand existiert, sondern immer in Abhängigkeit von Gerät, Auflösung und Nutzungssituation. Während den gestalterischen Phasen versuchte ich, das Gelernte auf mein Themengebiet zu beziehen und responsive Typografie mit Lesbarkeit und Veränderung durch das Medium in Verbindung zu bringen.

Experimente

Die Experimente während des Workshops bewegten sich zwischen der präzisen Kontrolle über Lesebedingungen und dem Erkunden von Effekten.

Die Erstellung eines möglichst gut lesbaren Textabschnittes auf dem Screen war die Ausgangslage für den Umgang mit relativen Einheiten wie em, rem, %, vw, vh und ch. Der erarbeitete Textabschnitt war für die Darstellung an einem MacBook Pro (4112x2658px) konzipiert. Diese Information braucht es, da die Lesebedingung stark von der physischen Oberfläche abhängt. Was auf einem Gerät optimal wirkt, kann auf einem anderen die Lesbarkeit deutlich verschlechtern.

Die x-Position der Maus wurde auf die Rotation und x-Position einzelner Wörter gemappt, sodass der Textblock die Illusion erzeugt, sich im dreidimensionalen Raum zu bewegen. Die Bewegung erzeugt in diesem Fall Aufmerksamkeit, lenkt sie aber nicht auf den Inhalt. Der Blick folgt eher der Bewegung als dem Text.

Hier kommt ein Text zur Veränderung durch reines CSS

Buchstaben verändern durch die Scrollbewegung ihre Position, Rotation und Skalierung. Schnell wird aus einer typografischen Komposition ein spielerisches Element. Das Experiment funktioniert als Eye-Catcher, nicht als Lesehilfe.

Im Gegensatz zum vorherigen Experiment wurde hier die Bewegung nicht zufällig, sondern an die vertikale Position der Elemente auf der Seite gebunden. Die Animation hat klare Bewegungsabläufe, keine offenen Parameter. Der Unterschied zwischen einem klar definierten Bewegungsablauf und einem Rahmen, in dem sich Elemente frei bewegen können, hat direkte Auswirkungen darauf, wie viel vom System verstanden werden muss und wie viel kognitive Kapazität die Interaktion bindet, die dann beim Inhalt fehlt.

Eine Visualisierung, die zeigt, wie sich eine variable Schrift verhalten kann, wenn sie aktiv animiert wird. Das Spannende ist hier der dynamische und ruckelfreie Übergang zwischen vielen Schriftschnitten.

Ein Teil der Schrift wird versteckt und durch Hover aufgedeckt. Gleichzeitig verändert sich der Schriftschnitt und hebt das aktivierte Element stärker hervor. Das Experiment warf eine weiterführende Frage auf: Was würde passieren, wenn ein Element beim Aktivieren nicht stärker, sondern schwächer wird und somit die Hierarchie umgekehrt würde? Die Idee, Wichtigkeit nicht durch Betonung, sondern durch bewusstes Zurücktreten zu erzeugen, blieb als Gedanke offen.

Ein letztes Experiment zeigte, wie ein einfacher Hinweis («click») plötzlich Verständnis für das Gezeigte erzeugen kann. Erst durch den Klick erschliesst sich, worum es geht: Die Position des Buchstabens wird eingefroren und dupliziert, durch Rotation entstehen Überschneidungen, die den Buchstaben schrittweise unlesbar machen.

März

Experimente

Die Experimente im März wurden etwas gezielter. Es ging mehr in die Richtung, was beim Lesen tatsächlich hilft, und nicht mehr, was alles möglich ist. Ich versuchte auch, die Experimente aktiv mit den wahrnehmungspsychologischen Grundlagen in Verbindung zu setzen, die ich durch Lektüre und Gespräche kennenlernte.

Die Zeilenlänge ist einer der wirkungsvollsten, aber am meisten unterschätzten Parameter der Lesetypografie. Zu lange Zeilen erzwingen weite horizontale Augenbewegungen und erhöhen die Fehlerquote beim Zeilensprung; zu kurze Zeilen unterbrechen den Lesefluss. Dieses Experiment ermöglichte es den Leser:innen, per Knopfdruck einen Text in Spalten zu unterteilen und so die Zeilenlänge aktiv anzupassen. Individuelle Anpassbarkeit ist deshalb sehr wichtig, weil Menschen unterschiedlich lesen und unterschiedliche Fixierungsgewohnheiten haben.

Die nächste Frage: Was passiert, wenn nicht die Breite, sondern die Menge der sichtbaren Information reduziert wird? Das Abgrenzen von einzelnen Sätzen vom Gesamttext und das Einbetten in viel Weissraum verlangsamten die Informationsaufnahme spürbar. Das Scrollen fungierte nicht als Navigation durch Menge, sondern als Mittel, um Intensität zu steuern. Der Weissraum gibt dabei dem Gehirn Zeit, Verarbeitetes zu festigen, bevor neue Informationen aufgenommen werden.

Eine Weiterentwicklung des vorherigen Experiments: Die Sätze wurden nicht vollständig voneinander getrennt, sondern nur visuell voneinander getrennt. Der aktive Satz steht immer in der Bildschirmmitte und erzwingt eine angenehme, stabile Blickhaltung. Bereits gelesener Text wurde nicht unsichtbar, sondern nur schwächer lesbar, sodass Regressionen zwar möglich blieben, aber erschwert wurden. Ein begrenzter Scrollbereich verhindert zudem das Überspringen von Sätzen.

Die Einblendung von Text durch die Skalierung einzelner Wörter hat auf den ersten Blick etwas Poetisches. Tatsächlich ist es aber auch eine Visualisierung eines kognitiven Prozesses: Wörter werden im Gehirn als Wortbilder gespeichert und erst durch ihre Verknüpfung zu Sätzen mit Bedeutung aufgeladen. Das Experiment steht zwischen gestalterischer Reflexion und Inhaltsvermittlung.

Interviews

Ich hatte die Möglichkeit mit zwei Expert:innen zu sprechen, deren Perspektiven die Arbeit in zwei verschiedene Richtungen erweiterten: die eine wahrnehmungspsychologisch, die andere aus der gestalterischen Praxis heraus. Beide Gespräche wurden zu festen Bestandteilen der kulturgeschichtlichen Thesis und halfen mir gleichzeitig dabei, die gestalterischen Experimente präziser zu denken.

Gabriele A. Forster

Gabriele A. Forster ist Expertin für bewusste und unbewusste Wahrnehmungs- und Lernvorgänge und Autorin von «Effizient lesen» (2021). Sie unterscheidet scharf zwischen Prosa- und Informationstexten, zwischen Aufmerksamkeit als Wahrnehmungszustand und Textverständnis als kognitivem Prozess, zwischen Steuerung als Tätigkeit und Kontrolle als Emotion. Diese Differenzierungen haben meine gestalterische Fragestellung direkt geschärft. Besonders prägend war die Aussage, dass Konzentration immer ein Ergebnis ist, nie eine Voraussetzung, und dass Design zwar Bedingungen schaffen kann, unter denen Konzentration entsteht, sie aber nicht erzwingen kann.

Fachperson für Grafikdesign und Typografie

Die zweite interviewte Person ist seit mehreren Jahren in der gestalterischen Praxis tätig, mit einem Schwerpunkt auf typografischen Systemen, Editorial Design und digitalen Anwendungen. Entscheidungen über Hervorhebungen, Hierarchien und Bewegungen werden in der Praxis oft nicht frei, sondern in Abhängigkeit von Briefings, Zielgruppen und Kommunikationszielen getroffen. Die Frage, ob ein gestalterischer Eingriff dem Verständnis dient oder ihn verhindert, ist dabei oft eine ethische, nicht nur eine ästhetische. Die Person wünschte keine Namensnennung; das vollständige Transkript liegt dem Autor vor.

Erkenntnisse

Beide Interviews haben konkrete Konsequenzen für das weitere Vorgehen hinterlassen:

Die Unterscheidung zwischen Informationstext und Prosatext ist für alle gestalterischen Entscheidungen grundlegend. Bewegung und Interaktion, die in einem literarischen Kontext poetisch wirken, können im Informationskontext die Verständlichkeit untergraben. Lesegeschwindigkeit ist individuell. Was für eine Person genau die richtige Stimulation erzeugt, überfordert die nächste. Das spricht für anpassbare Systeme statt für festgelegte Animationsabläufe. Das Kontrollgefühl der Leser:innen ist ein eigenständiger Wert. Ein einzelner Button kann das Verhältnis zum Text stabilisieren.

Recherche

Parallel zu den Experimenten und Interviews vertiefte ich mich in verschiedene gestalterische Referenzprojekte. Zwei davon werden im Ausblick der kulturgeschichtlichen Thesis erwähnt und zeigen exemplarisch, wohin sich das Feld gerade bewegt.

Caption with Intention

Scrollytelling New York Times

Erkenntnisse

In beiden Projekten werden die technischen Möglichkeiten eingesetzt, weil sie etwas ermöglichen, das im statischen Format nicht möglich wäre. «Caption with Intention» erschliesst Zugänglichkeit für Menschen, die sonst auf einen Teil der emotionalen Kommunikation verzichten müssten. Das Scrollytelling der New York Times macht komplexe Zusammenhänge schrittweise erfahrbar, statt sie als Ganzes zu präsentieren. In beiden Fällen ist Bewegung kein Eye-Catcher, sondern ein Orientierungsmittel – und genau das ist der Massstab, den ich für die weiteren Experimente anlegen wollte.

April

Recherche

Als ersten Schritt analysierte ich fünf Applikationen, die das digitale Lesen auf unterschiedliche Arten zu verbessern versuchen. Die Auswahl reichte von simplen Lesemodi bis zu algorithmischen Eingriffen in die Typografie selbst.

Instapaper ist eine App, über die man Online-Artikel in einer persönlichen Bibliothek speichern und in einem bereinigten Leseformat lesen kann. Der Fokus liegt auf Ablenkungsfreiheit: Werbung, Navigation und visuelles Rauschen werden entfernt, der Text steht im Vordergrund. Man wählt aktiv aus, was man liest, und wann.

Spritz Reader verwendet RSVP als Methode. Wörter erscheinen einzeln an einer fixen Position, wobei jeweils ein Buchstabe farblich hervorgehoben wird – der sogenannte Optimal Recognition Point, der die Fixation des Auges auf die statisch günstigste Stelle im Wort lenkt. Die Methode ermögliche sehr hohe Lesegeschwindigkeiten, eliminiert jedoch die Möglichkeit der Regression.

BeeLine Reader greift nicht in die Struktur des Textes ein, sondern in seine Farbe: Durch einen Farbgradienten, der von Zeile zu Zeile wechselt, wird der Zeilensprung erleichtert. Das reduziert einen der häufigsten Lesefehler beim Bildschirmlesen – das versehentliche Überspringen oder Wiederholen einer Zeile. Der Ansatz ist subtil und greift die Grundbedingungen des Lesens an, ohne den Text selbst zu verändern.

Bionic Reading setzt die ersten Buchstaben jedes Wortes fett, um die Anzahl der Fixierungen zu reduzieren. Die Idee basiert darauf, dass das Gehirn Wörter ohnehin aus partieller visueller Information ergänzt. Bionic Reading verstärkt den Anfang, damit das Gehirn schneller erkennt. Die Methode ist aber umstritten, da sie die gewohnten Wortbilder verändert und eine Eingewöhnungszeit braucht. Für manche Menschen ist sie effektiv, für andere störend.

Hier schreibe ich noch etwas zum Lesemodus generell.

Browser-Lesemodi sind in den drei grossen Browser – Google Chrome, Apple Safari und Mozilla Firefox – unterschiedlich implementiert. Allen gemeinsam ist das Entfernen von Werbung, Navigation und Bildern sowie eine Grundtypografie, die für Lesbarkeit ausgelegt ist. Die Unterschiede liegen in den Anpassungsoptionen, da nicht alle Browser die gleichen Funktionen bereitstellen. Keiner der drei Modi kennt scrollbasierte Hervorhebung, kinetische Typografie oder erweiterte sensorische Interaktion.

Experimente

Die Recherche inspirierte mich dazu, meinen eigenen Web-Reader zu bauen. Gleichzitig fehlte mir noch die Entscheidung: Welcher Informationstext soll als Grundlage für die weiteren Experimente dienen?

Die Antwort war Wikipedia. Die Artikel sind klar strukturiert, sachlich und werden nicht als Prosa gelesen. Gleichzeitig sind sie wegen ihres Erscheinungsbildes kaum zum Lesen einladend – zu dicht, zu unruhig, zu wenig Weissraum. Die Enzyklopädie ist inhaltlich neutral, da viele verschiedene Autor:innen an den Texten mitwirken. Sie ist frei zugänglich und über die Wikipedia REST API programmatisch abrufbar. Und sie liegt thematisch weit genug von meiner eigenen Thematik entfernt – anders als ein Buch über Typografie würde sie die Beurteilung der Experimente nicht inhaltlich überlagern.

Wikipedia-Artikel haben ausserdem eine klare HTML-Hierarchie aus Überschriften, Absätzen, Listen und Verlinkungen. Diese Struktur lässt sich direkt über Code ansprechen und für Experimente mit Bewegung und Interaktion nutzen.

Der erste technische Schritt war der Aufbau einer Verbindung zwischen dem lokalen Entwicklungsserver und der Wikipedia REST API. Über die Suchleiste lassen sich nun beliebige Artikel in verschiedenen Sprachen abrufen. Die internen Verlinkungen zu anderen Artikeln bleiben erhalten. Ein Klick auf einen verlinkten Begriff lädt den entsprechenden Artikel direkt im Reader. So lässt sich die gesamte Enzyklopädie innerhalb eines einzigen, kontrollierten Leseformats durchqueren.

Beim Laden wird der rohe Wikipedia-HTML bereinigt: Bilder, Infoboxen, Fussnoten, und Navigationsleisten werden entfernt. Was bleibt, ist der reine Textinhalt mit seiner semantischen Struktur. Schon allein die Änderung der Schriftart erzeugte eine spürbar angenehmere Lesesituation.

In einem nächsten Schritt wurden die ersten Steuerelemente hinzugefügt: individuelle Anpassbarkeit von Schriftgrösse, Zeilenabstand und Spaltenbreite.

Parallel dazu entstand ein erster Satzfokus-Modus: Ein Klick auf einen Satz dimmt alle anderen, der aktive Satz bleibt vollständig lesbar. Die technische Umsetzung brachte das Problem ans Licht, dass der Satztrenner nicht jeden Satz korrekt erkannte. Ein weiteres Problem ist die Wahl der Schriftart, welche unter Umständen nicht alle Schriftzeichen beinhaltet.

Mit den erarbeiteten Steuerelementen versuchte ich, den digitalen Text nach typografischen Grundprinzipien zu setzen. Die Parameter sollten so eingestellt werden, dass die Grundbedingungen des Lesens erfüllt sind, bevor weitere Eingriffe durch Bewegung oder Interaktion hinzukommen.

Um zu verstehen, welche Strukturelemente in Wikipedia-Artikeln vorhanden sind, hob ich die HTML-Tags farblich hervor. Jeder Tag-Typ erhielt eine eigene Farbe. Die Untersuchung zeigte, dass die meisten Artikel einer klaren Hierarchie folgen, in einzelnen Fällen aber deutlich komplexer werden. Diese Analyse war die Grundlage dafür, störende Elemente gezielt auszublenden oder umgestalten zu können, ohne den inhaltlichen Zusammenhang des Artikels zu brechen.

In einem zweiten Schritt wählte ich eine andere Darstellungsmethode, um Block-Tags und Inline-Tags visuell gleichzustellen. Ausserdem untersuchte ich, wie Wikipedia Bilder und Bildunterschriften im HTML einbettet und veränderte deren Darstellung.

Hier steht ein Text

Die ersten gestalterischen Experimente untersuchten eine Mouse-Hover Interaktion: Beim Überfahren einzelner Wörter veränderten sich Schriftgewicht und Schriftgrösse über die Achsen der variablen Schrift.

Die Ergebnisse machten vor allem den Unterschied zwischen subtiler und extremer Animation sichtbar. Bei subtilen Veränderungen blieb der Textzusammenhang erhalten. Bei extremen drohten einzelne Wörter aus ihrem Kontext gerissen zu werden. Gleichzeitig entstand ein interessanter Nebeneffekt. Durch das Überfliegen, können durch die zufällige Aktivierung eigene Zusammenhänge zwischen einzelnen Wörter gebildet werden. Das Wort "Überfliegen" kann hier als Lesetechnik und als Beschreibung dessen gesehen werden, was in diesem Experiment passiert.

Im Gespräch mit Gabriele A. Forster wurde die individualisierte Steuerung der Lesegeschwindigkeit als gestalterischer Ansatz diskutiert. Daraus entstand das Gyroskop-Experiment: Die Neigung des Smartphones steuert die Scrollgeschwindigkeit – nach vorne scrollen, zurückneigen verlangsamen. Ein Tap-Scroll bleibt weiterhin möglich, die Fuktion lässt sich per Button ein- und ausschalten.

Die grösste Herausforderung war die Zugänglichkeit. Browser geben Sensordaten aus Sicherheitsgründen unterschiedlich frei – Nutzer:innen müssen den Zugriff explizit erlauben. Nach der Freigabe wird über einen Button der Nullpunkt gesetzt: der Winkel, bei dem kein Scroll stattfindet.

Beim Testen des Gyroskop-Experiments zeigte sich ein wiederkehrendes Problem: Proband:innen schafften den Zeilensprung nicht zuverlässig – die ungewohnte Steuerung erschwerte die Augenführung zusätzlich. Das führte zu einem anschliessenden Experiment, das sich gezielt mit der Führung des Blicks beschäftigt. Inspiriert vom Prinzip des RSVP wird der Text wortweise hervorgehoben – immer in der Mitte des Bildschirms fixiert –, um dem Auge stabilere Fixationspunkte zu geben.

Moodboard

Inspiriert von Blickführung und linearer Hierarchie untersuchte ich die verlinkten Wörter, die in Wikipedia-Artikeln en masse vorkommen. Sie stören den Lesefluss, sind aber nicht wegzulassen. Sie bilden eine Kernfunktion der Enzyklopädie. Ich versuchte, diese Struktur innerhalb eines Artikels sichtbar zu machen: Jeder Link wird in seiner Reihenfolge markiert und mit einer geraden Linie mit dem nächsten verbunden. Es entstehen immer neue Formen, die die Komplexität der Enzyklopädie visualisieren. Gleichzeitig lassen sich durch die Wortpaare grobe Themenfelder eines Artikels erschliessen, ohne den genauen Inhalt zu kennen.

Hier kommt ein Text.

Dieses flüchtige Erfassen von Inhalten war die Inspiration für das nächste Experiment. Das manchmal undurchsichtige Dickicht an Informationen brachte mich dazu, mit der Lesbarkeit einzelner Wörter innerhalb eines Satzes zu spielen.

In der kulturgeschichtlichen Thesis griff ich das Beispiel «Nord» (2003 – 2004) von Esther Hunziker auf. Die spielerische Individualisierung von Inhalten durch einen begrenzten Handlungsspielraum inspirierte mich dazu, einzelne Textabschnitte und Bilder trennbar und frei anordenbar zu machen. Es entsteht eine andere Art zu lesen – Inhalte werden abschnittsweise erfahren, neue Zusammenhänge können gebildet werden. Die Umsetzung war noch holprig: Texte verschoben sich zunehmend nach unten, der Überblick ging schnell verloren.

Ein strukturelles Experiment teilte den Text kapitelweise in Spalten auf. Nebeneinander platzierte Abschnitte lassen sich einfach vergleichen und geben den Gesamtüberblick besser wieder als ein endloser Scroll.

Der April war eine breite Erkundungsphase, in der viele gestalterische Richtungen ausprobiert und ein Überblick über die Möglichkeiten des Formats geschaffen wurden. Die Einschränkung auf Wikipedia-Artikel erwies sich dabei als Vorteil, da sie eine vollständige Konzentration auf die Gestaltung ermöglichte.

Im Mentorat wurden jedoch wichtige Fragen aufgeworfen, die den weiteren Prozess prägen werden. Die Experimente müssen klarer nach ihrem Ziel befragt werden. Geht es um Leseerlebnis, Textverständnis, einen spielerischen Zugang oder um etwas anderes? Und für welche Inhalte passt welches Experiment? Nicht jeder Ansatz funktioniert für jeden Artikeltyp gleich gut.

Deutlich wurde auch, dass Bewegung oft mehr Störung als Unterstützung ist – und dass weniger Interaktion manchmal mehr Orientierung schafft. Das letzte Experiment mit der Spaltenansicht zeigte das exemplarisch.

Zwei Richtungen stehen offen: verschiedene Experimente anhand eines einzigen Artikels oder wenige, präzise Experimente anhand verschiedener Texttypen. Es geht um die genauere Definition der Forschungsfrage im Rahmen der Überschrift «Wikipedia reimagined».

Mai

Eye Tracking

Zwei JS-Libraries wurden getestet: WebGazer erwies sich als zu ungenau, SeeSo zeigte mehr Potenzial, funktionierte auf dem Smartphone aber nicht zuverlässig. Im Gespräch mit Dr. Paloma López Grüninger wurde deutlich, dass Eye-Tracking für eine Ausstellungssituation mit wechselnden Personen und Lichtverhältnissen zu aufwendig ist. Das Experiment wurde zurückgestellt.

Text

Konzeptsuche

Die Schwierigkeiten mit dem Eye-Tracking öffneten eine grössere Frage: Was will ich eigentlich aussagen? Das bisherige Konzept war methodisch sauber, aber emotional flach. Ein Satz aus dem Gespräch mit Paloma blieb hängen: «Wirst du dir bewusst, wie viel das Interface über dich bestimmt?» Nicht die Frage, wie der Körper das Lesen verändert – sondern die Frage, wer beim digitalen Lesen die Kontrolle hat.

Die Lektüre von «Schiff nach Europa» und die Auseinandersetzung mit «Queers in Love at the End of the World» von Anna Anthropy – ein interaktives Werk, das immer dasselbe Ende hat und trotzdem zum Wiederholen zwingt – gaben dem neuen Konzept seine Form.

Das neue Konzept

Statt drei neutraler Experimente entstand die Idee einer Installation mit dramaturgischem Bogen. In nicht mal einer Minute kann man einen Text vollständig lesen. Die Installation simuliert, was wir täglich erleben: zu viele Informationen, zu wenig Zeit und das Gefühl immer hinterherzuhinken. Die besuchende Person versucht es nochmal und kommt wieder nicht bis zum Ende oder erwartet ein anderes. Das Erfolgserlebnis bleibt aus, weil es nicht vorgesehen ist.

Kafkas Türhüterparabel «Vor dem Gesetz» bot den idealen Inhalt: Ein Mann wartet sein Leben lang vor einer Tür, die nur für ihn bestimmt war – und die sich am Ende schliesst. Die Spannung zwischen gefühlter und tatsächlicher Kontrolle ist strukturell identisch mit dem, was beim digitalen Lesen passiert. Man hat theoretisch Zugang zum Text, in dem man das Gerät in der Hand hält und Interaktionen tätigt – aber das Interface bestimmt die Bedingungen. Der Türhüter ist das Interface.

Hier kommt auch der Bezug zur kulturgeschichtlichen Thesis zustande: Design kann Bedingungen schaffen, unter denen Konzentration entsteht, aber auch Bedingungen, unter denen sie systematisch verhindert wird. Die Installation zeigt den zweiten Fall.

Erste gestalterische Ansätze

Die ersten typografischen Experimente bauen auf früheren Auseinandersetzungen mit Typografie im Rahmen dieser Arbeit auf. Der Text ist zunächst nicht lesbar. Erst durch eine Interaktion entsteht eine typografische Reaktion, die ihn lesbar macht und das Fortfahren in der Geschichte ermöglicht. Dabei soll jede Interaktion inhaltlich zur Türhüterparabel passen, um etwas über die Geschichte zu erzählen.

Hier kommt ein Text.

Hier kommt ein Text.

Hier kommt ein Text.

Hier kommt ein Text.

Hier kommt ein Text.

Hier kommt ein Text.

Installation

Parallel zur Konzeptentwicklung entstand eine erste Skizze für den Ausstellungsraum. Eine Person betritt einen abgedunkelten Raum – keine Ablenkung von aussen, nur sie und das Gerät. Smartphone und Bildschirm kommunizieren miteinander, übernehmen aber unterschiedliche Rollen: Das Smartphone liegt als intimes Lesegerät in der Hand, der Bildschirm steht dahinter als übergeordnete Instanz im Raum. Offen bleibt die genaue Proportionierung beider Medien zueinander sowie die Frage der genauen Raumgestaltung und Beleuchtung.

Text zu weiteren Skizzen

Hier kommt ein Text.

Hier kommt ein Text.

Technischer Aufbau

Um Smartphone und Bildschirm in Echtzeit miteinander zu verbinden, wurde ein lokaler Node.js-Server mit Socket.io aufgesetzt. Jede Interaktion auf dem Smartphone – Screen-Wechsel, Timer-Tick, Alarm – wird sofort an den Bildschirm übertragen. Da Gyroskop und Kamera im Browser nur über HTTPS funktionieren, läuft das Smartphone über ngrok. Der Bildschirm öffnet die lokale IP direkt.

Das Projekt ist in zwei getrennte Interfaces aufgeteilt: phone/ für die Geschichte und die Interaktionen, screen/ für Timer und Anweisungen. Beide kommunizieren über denselben Server, halten aber keinen gemeinsamen State – die Logik liegt vollständig auf den Clients. Die Interaktionslogik pro Screen wird noch ausgearbeitet.

Juni

UI-Design

Der Juni startete mit einer Entwurfsserie des User Interfaces für das Smartphone. Zentral war die Frage, wie eine Lösung aussehen kann, die sowohl für statische Textseiten als auch für Interaktionsseiten funktioniert. Die statischen Seiten sollten bewusst einfach gehalten werden, damit der Fokus auf den Interaktionsseiten liegt. Trotzdem war es wichtig herauszufinden, wo der Textblock und die Navigation platziert werden und welche Form diese annehmen können. Rein aus kognitionspsychologischer Sicht kann es hilfreich sein, nicht zu viel Text auf einer Seite zu haben, da das Lesen auf dem Smartphone schnell als anstrengend betrachtet wird.

Schlussendlich habe ich mich bei der Navigation für die Rautenform entschieden, die in der Installation als Säule im Zentrum steht. Ein Slider als Navigationselement verhindert zudem das zu schnelle Überspringen einzelner Abschnitte und fügt eine zusätzliche Interaktionshürde ein.

Beim UI des Bildschirms stand lange die Frage offen, ob nur Typografie oder auch Bilder verwendet werden sollen. Nach vielem Ausprobieren wurde die Tür zum zentralen Element des gesamten Ablaufs – die Typografie wirkt als eine Art Untertitel daneben.

Animation

Beim Testen der Interaktionen auf dem Smartphone zeigte sich ein Problem: Viele Personen blickten wie gebannt auf das Smartphone und beachteten den Bildschirm kaum. Die Lösung war eine dynamische Animation der Tür. Da sich die Beziehung zwischen Türhüter und Mann in der Geschichte über Zeit verändert, sollte sich auch das Erscheinungsbild der Tür verändern. Die KI-generierten Variationen der Tür wurden genutzt, um einen Übergang zu kreieren: Die Tür wird in ihre strukturellen Einzelteile gespalten und setzt sich dahinter in einer neuen Form wieder zusammen – analog zum sich verändernden digitalen Interface. Diese Animation lenkt die Aufmerksamkeit kurz auf den Bildschirm, bevor Text oder Anweisung eingeblendet werden und der Blick zurück auf das Smartphone gelenkt wird.

Hier steht ein Text.

Hier steht ein Text.

Hier steht ein Text.

Installation & DMX

Mit dem überarbeiteten UI und der Animation folgte ein weiterer Test direkt an der Installation – diesmal mit der technischen Konfiguration von Storyline und Scheinwerfern. Die Scheinwerfer wurden über ein DMX-Kabel miteinander und mit dem Hauptserver verbunden. Das Smartphone steuert die Lichtzustände über definierte States, die zeitgesteuert oder durch Interaktion ausgelöst werden. Ein Beispiel: Der Alarm-State – das Rotwerden des Hintergrunds – löst einen Fade der Scheinwerfer zu Rot aus. Diese Funktionalität ist ein Kernelement der Überforderungsdramaturgie und wird weiter ausgebaut.

Details

Hier steht ein Text

Hier steht ein Text

Hier steht ein Text

Hier steht ein Text

Hier steht ein Text