Wie man eine schöne Animation macht...

written by Martin Häcker on

Das ist nämlich gar nicht so einfach.

Ich arbeite ja nun seit ein paar Monaten bei Novamedia - und mein erstes Projekt war, (mit einem 'sportlichen' Zeitplan von etwa 6 Wochen) bis zur Macworld im Januar 08 das Produkt Fone2Phone fertigzustellen.

Ziel der Aktion war es, ein Produkt zu haben, was bei der Migration von einem Telefon weg hilft. Dazu sollte Fone2Phone alles, was das Telefon an Daten enthält, aus diesem herausholen und in die jeweils zuständigen Apple-Applikationen befördern.

Das ist für sich genommen natürlich recht wenig (wenn auch technisch anspruchsvoll), darum haben wir uns von vornherein das Ziel gesetzt, mit dem Produkt auf der Macworld möglichst viele Preise abzusahnen. (Was auch geklappt hat. :)

Aber das ist alles nur Vorrede (und Stolz, schließlich hab ich damit gezeigt, was ich kann). Also auf zum eigentlichen Zweck dieses Posts.

Image

Die Animation. Damit Fone2Phone wirklich geil aussieht, haben wir tief in die Trickkiste gegriffen ('Wir' ist in diesem Zusammenhang mein Kollege Andreas).

Denn damit die Animation richtig gut aussieht, überlagern wir drei Elemente.

  1. Eine Animation, die die beiden Views austauscht
  2. Eine variable Geschwindigkeit, das heißt die Animation beginnt langsam, beschleunigt sich dann und wird am Schluss wieder langsam.

Bis hierher wäre ich auch darauf gekommen - aber der eigentliche Geniestreich liegt in dem letzten Element, das da noch oben drauf kommt:

  1. Die Views werden mit dem Hereinschieben eingeblendet / mit dem Herausschieben ausgeblendet.

Dieses letzte Element macht die Animation soo viel besser - obwohl es in der Komposition zuerst bewust überhaupt nicht wahrgenommen wird.

Und das ist die Lektion, die ich heute mitgenommen habe.