Zurück zur Übersicht

personal / public

Zwei exakt übereinanderliegende Ebenen mit gleichem Layout, aber gegensätzlichem Inhalt: oben die makellose Fassade „Dr. Viktoria Lund", darunter das echte, private „Viki". Der Cursor wird zur Taschenlampe und enthüllt punktuell, wer hinter dem perfekten Profil wirklich steckt.

Rolle
Konzept & Creative Coding
Jahr
2026
Tools
HTML, CSS, JavaScript
Leistungen
Konzept, Creative Coding, Interaktionsdesign
projekt-thumbnail-personal-public

Herausforderung

Online zeigen wir fast immer nur unsere geschliffene Seite: das perfekte Profil, den lückenlosen Lebenslauf, die professionelle Fassade. Was darunter liegt – das eigentliche, private Ich mit seinen Macken, Hobbys und seinem Chaos – bleibt verborgen. personal / public sollte genau diesen Kontrast zwischen öffentlicher Fassade und wahrem Selbst erfahrbar machen, statt ihn nur zu behaupten.

Die Gratwanderung lag darin, beide Ebenen glaubwürdig zu schreiben: oben „Dr. Viktoria Lund" im tadellosen LinkedIn-Ton voller Buzzwords, darunter „Viki" mit Humor und Selbstironie. Beide mussten dasselbe Layout teilen und pixelgenau übereinanderliegen, damit das Enthüllen wie ein echtes Durchschauen wirkt – nicht wie zwei getrennte Seiten.

Prozess

Technisch besteht die Seite aus zwei deckungsgleichen Ebenen: Die untere, öffentliche Schicht ist immer sichtbar, die obere, dunkle Schicht ist per clip-path komplett ausgeblendet. Bewegt man die Maus – oder auf dem Smartphone den Finger –, berechnet JavaScript die Cursorposition und schneidet dort ein kreisrundes Guckloch in die Maske. Der Cursor wirkt dadurch wie eine Taschenlampe, die punktuell die verborgene Schicht darunter freilegt. Die eigentliche Arbeit steckte im Schreiben der beiden Fassungen als parallele Struktur: Wo oben von Data Science, Machine Learning und Leadership die Rede ist, geht es unten um sterbende Zimmerpflanzen, Pizzateig und Mario Kart – dieselben Positionen, dieselbe Form, entgegengesetzte Wahrheit.

Personal
Public

Lösung

Entstanden ist eine Seite, die sich wie ein Röntgenblick anfühlt: Standardmäßig sieht man nur die glatte, professionelle Fassade. Erst der Cursor – die Taschenlampe – legt Stück für Stück das private Ich darunter frei. Weil beide Ebenen exakt dasselbe Layout teilen und nur Inhalt und Farbe wechseln, entsteht der Eindruck, direkt durch die Oberfläche hindurchzuschauen. Die spielerische Interaktion trägt die Aussage ganz ohne erklärenden Text.

Ergebnis

Das Projekt lebt vom Entdecken: Wer die Taschenlampe über die Fassade wandern lässt, findet hinter der makellosen „Dr. Lund" einen ganz normalen Menschen mit Schwächen, Hobbys und einer guten Portion Chaos. Für mich war es ein schönes Stück Creative Coding, das eine vertraute Wahrheit – hinter jedem perfekten Profil steckt ein echter Mensch – spielerisch und ohne erhobenen Zeigefinger erlebbar macht.

Nächstes Projekt

mono / poly

Lust auf ein gemeinsames Projekt?

Ich freue mich über neue Projekte, Ideen und gute Gespräche – schreib mir einfach.

moritz@feischl.info