Automatoon – HTML5 Animationen Deluxe

Bei meinem ersten Besuch auf Automatoon gab es ein ziemliches auf und ab, angefangen bei „Das kann ja jeder“ über „Wie haben sie das bloss gemacht“ bis hin zu „wie geil ist das denn„. Die App wirft nicht nur sinnvolles HTML5/CSS3 aus, sie wurde auch komplett darin erstellt! Dabei geht die Palette vom komplexen Bild-Editor über geniale Animationstools

Screenshot des Automatoon Headers

Automatoon ist primär ein Editor, mit dem man HTML5-basierende Animationen erstellen kann. Im eigenen Bildeditor kann man eigene Charaktere / Landschaften erzeugen, die dann für die kleinen Trickfilme eingesetzt werden können. Ein Charakter besteht hierbei zum Beispiel aus mehreren Einzel-Grafiken die an Gelenken zusammengefügt werden. Die dabei entstehende Puppe wird ähnlich einer Marionette gesteuert. Es sind aber auch die aus Stop-Motion-Pictures bekannten Technologien möglich. Ein Beispiel-Video zeigt, wie innerhalb von 5 Minuten ein Frosch nicht nur gezeichnet, sondern auch animiert werden kann:

httpv://youtu.be/xdRvmHqhiHA

Spannende Frage ist jetzt natürlich, WIE die fertigen Animationen auf die eigenen Seite kommen. Hierzu gibt es einen kleinen Hinweis in der Dokumentation. Laut dieser basiert das Tool auf jQuery, entsprechend muss ein Plugin für dieses eingebunden werden. Auf die Webseite kommt dann ein leerer Div-Layer, in der dann mittels Javascript die Animation gestartet wird. Das dafür notwendige Plugin – Player genannt – liegt bei Github und kann beliebig angepasst werden. Es sieht allerdings so aus, als ob die Anwendung „nachhause telefoniert“ und keine 100%ig lokale Version der Animation erstellt werden kann.

Trotzdem ist Automatoon eine sehr feine Lösung um mal eben schnell eine Animation zu erstellen und einzubinden. Dies ist sie vor allem deshalb, weil sie dermassen einfach gehalten ist, das faktisch jeder problemlos Strichmännchen animieren, und diese in einem kleinen Spielfilm in Aktion treten lassen kann.

Ähnliche Beiträge

Mercury – Der HTML5 WYSIWYG-Editor WYSIWYG-Editoren sind aus der heutigen Online-Welt nicht mehr wegzudenken. Groß und mächtig und vollkommen unhandbar sind sie geworden. Unflexibel, in...
WYSIHTML5 – der schnellere WYSIWYG Editor Was zur Zeit an WYSIWYG-Editoren für das Web unterwegs ist, ist der totale Overkill. Meistens wird ja TinyMCE oder der FCKEditor genommen, die beide n...
CSScomb – Sortieren einer CSS-Datei Die Übernahme von komplexen Seiten dritter ist kein Spaß, aber leider Alltag. In der Regel sieht dieses Szenario bei mir so aus: irgendein Hobby-Frick...
50 CSS3 Button Sets Der Trick ist ja der folgende: Je mehr CSS3, desto weniger Grafiken zum nachladen, desto schneller die Seite. Allerdings (und das muss man ganz klar s...

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.