CSS3 und WebKit-Animationen: Unterwegs mit dem iPad

Ob die Zeit wirklich reif ist für CSS3-Features und ob mit der Technik nicht einfach nur eine Flut dreidimensionaler Marquee-Texte droht, muss jeder für sich entscheiden. Fest steht, dass die aktuellen Browsergenerationen von Safari, über Chrome und Opera bis hin zum IE9 mehr oder weniger weitreichende Unterstützung für CSS3 mitbringen. Ob W3C approved oder nicht, CSS3 lässt sich durchaus zur Anwendung bringen und verspricht (vom augenzwinkernden Marquee-Beispiel vielleicht abgesehen) durchaus praktischen Nutzen.

Wer sich selbst zu echten CSS3-Fans zählt, und jede freie Minute mit dem Entwurf spannender Stylesheets verbringt, für den dürfte die CSS3Machine for iPad in Frage kommen. Mit der App lassen sich unterwegs (oder bequem von der Couch aus) Farbverläufe, Schlagschatten oder ganze WebKit-Animationen entwickeln, editieren und für die weitere Bearbeitung exportieren.

Abb. 1: Ein einfacher Box Reflect

Die CSS3Machine for iPad unterstützt gegenwärtig eine Reihe verschiedener CSS3 und WebKit Properties:

Border Radius
Box Shadows und Reflections
Lineare und radiale Gradienten
Text Shadow – und multiple Textschatten
Text Stroke
Keyframe-Animationen
2D-Transformationen (Rotate, Scale und Skew)
3D Transformationen (Rotate und Translate im dreidimensionalem Raum)
Transform Origin

Abb. 2: Ganze Animationen lassen sich bequem anhand von Keyframes erstellen.

Die erzeugten Stylesheets lassen sich anschließend über das lokale Netzwerk auch am Desktop betrachten, HTML-Templates können direkt in der App erzeugt und bearbeitet werden, oder sich auch bequem via iTunes importieren lassen. Während der Bearbeitung sollen Entwickler dabei jederzeit auf eine umfangreiche Dokumentation zurückgreifen können (s.h. unten Abbildung 3). Der Export der erzeugten Dateien soll sich schließlich via E-Mail, iTunes-Filesharing oder über den bereits angesprochenen lokalen Netzwerkzugriff realisieren lassen.