Papervision3D für Banner?
Ein klassisches Thema: Die Kreation kommt mit einer vermeintlich simplen Banneridee in 3D.
Die technischen Bedingungen:
- Filesize: max. 75 KB
- Flash Player Version: bestenfalls V9
- AS Version: bestenfalls AS3
Die Layouts, die es umzusetzen gilt:
Umsetzung in Papervision3D
Das Papervision3D Framework “Great White 2.0″ fällt beim Zielwert von 75KB komplett aus – alleine bringt es schon 68 KB auf die Waage. Eine von uns abgespeckte Variante schlug immer noch mit 49 Kb zu Buche. Zu viel, um mit den 3D Modellen und Bildern zu einem qualitativ akzeptablen Ergebnis zu kommen. Ernüchterung – aber immerhin hatten wir es versucht.
Umsetzung in FIVe3D
Die Lösung brachte die noch wenig thematisierte Vektor 3D Engine FIVe3D. Das Framework ist mit unter 30 KB extrem schlank. Die angebotenen Klassen sind für simple 3D Umsetzungen wie man sie in einem Banner ohne allzu große Interaktion verwendet völlig ausreichend. Leider ist die Dokumentation nicht ansatzweise so umfangreich wie bei den Alternativen – also mit der Nase in den Code und ansehen, wie das Ding aufgebaut ist. Ein paar Stunden später war die erste Version fertig.
Optimierung
Um den Code noch schlanker zu machen, haben wir auch noch an der Tweening Engine gespart. TweenLite ist mit 4.7 KB für uns schon lange der Standard für Banneranimationen. Mit dem v11 Release des Greensock Tweening Frameworks gibt es ja jetzt zum Glück TweenNano, welche in As3 gerade mal mit 1.6 KB beansprucht.
Am Ende war der Banner inklusive Bilder keine 60 KB groß, sodass wir am Ende die Bilder bei der Komprimierung mit einer stolzen Qualität von 60% ausgeben konnten.
Unsere offene Ressource (mit anderem “Content” – deshalb größer) gibt es hier zum (Preview) Download.
bebe Young Care Banner Beispiel:
Der Autor: Guido von Marientreu
tba … … … … … … … … … … … … … … … … … … … … … … … … … … … … … … … … … … … … … … … … … … …
