Ein Spaziergang für die Ohren
In einer Welt, in der gefühlt alles immer schneller, komplexer und hektischer wird, tut es gut, zur Ruhe zu kommen. Wie wär’s also mit einem gemütlichen Spaziergang?
Klingt gut, oder? Doch dieser Spaziergang hier ist anders, als du es sonst kennst. Ich nehme dich mit auf einen virtuellen Spaziergang – wo es etwas zu sehen und vor allem zu hören gibt. Ich habe einige Orte fotografiert, an denen ich gerne verweile, wenn ich draussen bin. An jedem der Orte habe ich ausserdem die Geräuschkulisse aufgenommen. Danach habe ich die Fotos mit den Umgebungsgeräuschen unterlegt und Musik dazu komponiert – gerade so, wie es für mich zur Stimmung des Ortes gepasst hat.
Was dabei herausgekommen ist, kannst du dir jetzt anschauen und anhören. Scrolle dich durch die verschiedenen Orte und geniesse die Pause im Alltag.
Hier geht’s los.
(mou)
Ausgangslage
Ich schätze Ruhepausen im Alltag, in denen ich draussen in der Natur den Kopf durchlüften kann. Mit diesem Digezz-Projekt wollte ich ausprobieren, wie sich ein solches analoges Erlebnis in die digitale Welt übertragen lässt. Weil mir Musik wichtig ist, sollten auch selbstkomponierte Stücke eine Rolle dabei spielen.
Umsetzung
Nach der Auswahl der Umgebung, die ich abbilden wollte, machte ich mich auf den Weg und suchte geeignete Orte für die Fotos. An jedem der Foto-Orte nahm ich mit einem Fieldrecorder von Tascam die Geräuschkulisse auf. Als Mikrofon verwendete ich das integrierte Stereo-Mikrofon. Aus den geschossenen Fotos wählte ich zehn Bilder aus, die ich dann in Adobe Lightroom nach meinen Wünschen editierte. Die Sound-Files bearbeitete ich mit Logic Pro, sodass dank eines Equalizers störende Geräusche nicht mehr zu hören sind.
Ausgerüstet mit Mikrofon, Gitarre, Klavier, Melodica und verschiedenen virtuellen Instrumenten in Logic Pro begann ich dann, Musik zu den Fotos zu komponieren und aufzunehmen. Dabei gab ich mir selbst zwei Einschränkungen: Jedes der neun Stücke sollte rund eine Minute lang sein und einen Bezug zum Grundton C haben.
Der letzte, aber nicht weniger wichtige Schritt war die Umsetzung als Website, um dem virtuellen Spaziergang eine Form zu geben. Mittels HTML, CSS und JavaScript baute ich die Inhalte zusammen. Zwei Dinge waren mir hier besonders wichtig: Die Musikstücke sollen automatisch abgespielt werden, wenn man zum entsprechenden Bild scrollt. Und: Das Scrolling soll «snappen», also beim Start jedes neuen Abschnitts einrasten. Mit etwas CSS- und JavaScript-Code und dem Blick in die jeweilige Dokumentation und einige Foren im Internet konnte ich das umsetzen (ausser für iOS-Geräte – Autoplay von Ton funktioniert dort gar nicht und das Scroll-Snapping habe ich mangels Stabilität deaktiviert). Ausserdem habe ich «Smooth Scrolling» aktiviert. In den meisten Browsern reicht es, wenn man das durch einen CSS-Befehl macht. Damit es auch in Apples Safari klappt, musste ich zusätzlich das Skript smooth-scroll.js von Chris Ferdinandi einbetten. Beim Animieren der Zwischentexte hat mir die Anleitung von Alvaro Trigo geholfen.
Erkenntnisse
Beim Aufnehmen der Umgebungsgeräusche merkte ich, wie sensibel die Mikrofone auf Wind reagieren. Leider fehlte mir ein entsprechender Mikrofon-Windschutz, doch mit einem Low-Pass-Filter konnte ich die Störgeräusche in der Nachbearbeitung entfernen.
An dem Tag wo ich die Fotos geschossen habe, war das Wetter sehr sonnig. Das sorgte dafür, dass der Himmel je nach «Blickrichtung» der Kamera zu hell war. In Adobe Lightroom konnte ich das in den meisten Fällen aber recht gut korrigieren. Für ein anderes Mal könnte ich mir überlegen, eine Tageszeit zu wählen, wo die Sonne nicht so stark scheint.
Beim Coden der Website gab es laufend kleinere und grössere Herausforderungen. Ein Beispiel: Die aktuellen Web-Browser unterbinden automatisches Abspielen von Ton. Die meisten erlauben es aber, sobald der User einen Klick auf der Website gemacht hat. Aus diesem Grund habe ich den «Starten»-Link nach dem Titel eingefügt. Das funktioniert aber nicht überall: Bei Safari auf dem Mac braucht es einen einmaligen Klick auf die Play-Taste des Medienplayers. Und unter iOS geht «Autoplay» von Ton gar nicht. Man muss also flexibel bleiben und immer wieder nach neuen Lösungen suchen, um eine Website so zu programmieren, dass sie sich in allen Browsern nach Wunsch verhält. Und manchmal muss man auch damit leben, dass gewisse Dinge je nach Browser gar nicht gehen.
Unter dem Strich
Mit diesem Projekt konnte ich gleich mehrere Dinge auf einmal ausprobieren und üben: Von Fotografie über Bildbearbeitung und Musikproduktion zu Webprogrammierung. Ich merke mir: Es gibt zwar nur ein Internet, doch eine Website kann sich von Webbrowser zu Webbrowser unterschiedlich verhalten.