delight

Gestalte eine kleine Szene, die durch Interaktion einen Moment der Freude erzeugt – etwas, das lebendig, verspielt und unerwartet poetisch wirkt. Ausgangspunkt sind reale Dinge: eine Blume, ein Fön, die Sonne usw. Die Aufgabe ist jedoch nicht, das Objekt nur abzubilden, sondern ihm ein neues Verhalten zu geben: Was passiert, wenn darauf geklickt, gehovert oder gescrollt wird? Eine Blume, deren Blütenblätter klickbar sind und verborgene Gedichte enthüllen? Ein Toaster, der eingeschaltet werden kann und aus dem nach geduldigem Warten keine Toastbrote hüpfen, sondern animierte Gifs? Ein Tier, dessen Hals durch Scrollen immer länger wird, bis der Kopf am Bildschirmrand anstößt?

Fragen

Für wen ist die Seite? Für alle? Für bestimmte Person(en)?
Für wann? Freude beim Surfen im Web oder für bestimmten Anlass (wie z.B. der Walk?)
Wie macht ihr deutlich, dass und wie interagiert werden kann?
(Wie) verändert sich die Szene durch wiederholte Interaktion?
Welche grafischen und technischen Mittel nutzt ihr / könnt ihr nutzen?

Kompakt

Schlagwörter:
freudvoll, fokussiert, #keepItSimple (nicht im Code verlieren, sondern gestalten)

Medium:
Webseite

Interaktionen:
Klick, Hover, Scroll (u.ä.)

Material:
Code, Grafiken, Sound (mp3)

Einsatz von KI:
ja (aber kein Muss)

(sehr lose!) Inspiration

Callie Rojewski: Virtual Bubble Gum Machine
(zu wenig Erzählung) Shelby Wilson: Windows & a room with a window
(zu wenig Erzählung) Rafael Rozendaal:
on and off
(kompliziert) Rafael Rozendaal: trash loop
(zu kompliziert) Jérémie Kursner: Comme dans du beurre
Amelie Knopper

Zeitplan

Termin 4:
erste Ideen skizzieren und besprechen
Termin 5:
mitbringen: Entwürfe, erste Code-Skizzen (statische Seite[n]; u.U. KI-generierte Funktionsprototypen, falls Vorhaben komplex)
Termin 6:
mitbringen: aktueller Stand
Termin 7:
Abschluss

To be discussed: zusätzlicher Feedback-Termin

Code(pens)

Für Visual Studio Code: Starter-Kit Click
CodePen: click, einfach
CodePen: click
CodePen: click, mit Zustand