201026Jul

HTML5: Demos mit 8-Bit Color Cycling

Wer sich an die neunziger Jahre, Amiga-Spiele und die damit verbundenen 8-Bit-Grafiken erinnern kann, wird vermutlich auch die Color Cycling-Technik kennen — dabei wird die Farbpalette einer Grafik animiert, um den Anschein einer Bewegung zu erwecken. Dadurch konnten Effekte wie Rauch, Schnee, Wasser oder Wolken simuliert werden, ohne viel Prozessorlast zu beanspruchen.
Joseph Huckaby von EffectGames hat es sich zur Aufgabe gemacht, die Technik auf HTML5 und das canvas-Element zu übertragen. Fertige Demos gibt es auf dieser Seite zu bestaunen.

Canvas Cycle - True 8-bit Color Cycling with HTML5

Das Projekt ist sehr abgefahren und kann sich auf jeden Fall sehen lassen. Die Demos funktionieren unter allen Browsern, die das canvas-Tag unterstützen. Folglich werden derartige Animationen erst mit Version 9 des Internet Explorers funktionieren.
Die Arbeit des Entwicklers ist bemerkenswert: Um die Original-Grafiken von Mark J. Ferrari (LucasArts) nutzen zu können, musste ein Converter in C++ geschrieben werden, der das alte ILBM-Format (in Zeiten von Deluxe Paint) umwandelt. Über ein PHP-Skript wird anschließend die Palette als JSON-Array ausgegeben, um sie animieren zu können. Der Autor hat zudem die Technik um "BlendShift Cycling" erweitert, so dass durch Überblendungen sanftere Animationen entstehen. Der Quellcode und weitere Details finden sich in diesem Blog-Eintrag.

Kommentare

Don schrieb am 28.07.2010 #1

pah! supergeil :)