Experimentelles aus der Region mit HTML5 Canvas

Momentan ist HTML5 ein richtiger Hype – Hype genug um sich mit der neuen Technologie auseinanderzusetzen. Wir [9elements] haben deshalb ein kleines Experiment umgesetzt, welches 100 Tweets mit dem Thema "HTML5+Love" lädt und diese mit einer Partikelengine und dem neuen Canvas-Element visualisiert.

Die Partikelengine hatten wir in der Vergangenheit bereits unter Flash/ActionScript3 eingesetzt – für das Experiment haben wir diese mal eben nach JavaScript portiert. Die Visualisierungen wurden mit John Resigs ProcessingJS Library implementiert. Diese ermöglicht das einfache Browser übergreifende programmieren grafischer Visualisierungen.

Zur Überprüfung, ob der Browser die gewünschten Eigenschaften unterstützt, kommt zusätzlich noch die JavaScript-Library Modernizr zum Einsatz, welche ein einfaches CSS und JavaScript Interface zur Verfügung stellt und Support für ältere Browser bereitstellen kann.

Die daruntergemischte Musik ist von spokenlounge.com und wird mit dem neuen HTML5-Element <audio> abgespielt.

Und das Ergebnis: Sexy und Performant – es muss sich nicht hinter seinem Flash Vorbild verstecken. Die Zukunft von HTML5 glitzert bereits am Horizont.