Arbeiten · Studie A · Logoanimation
Markenbewegung
Eine Wortmarke, die ihr eigenes Timing zeigt.
Freie Konzeptstudie für diesen Webauftritt · kein Kundenauftrag
Aufgabe
Die Wortmarke »Vanessa Konrath« sollte eine kurze Bewegung erhalten, die als Intro, Abspann oder Signet in sozialen Medien funktioniert. Sie sollte ruhig bleiben, auf dunklem Grund gut lesbar sein und in wenigen Sekunden erkennen lassen, worum es geht.
Konzept
Ausgangspunkt ist der Kurveneditor, das wichtigste Werkzeug der Animation. Eine Beschleunigungskurve zeichnet sich, ein Punkt folgt ihr und gibt das Tempo vor, mit dem die Buchstaben aus der Grundlinie steigen. Die Zeitleiste am unteren Rand macht sichtbar, was sonst verborgen bleibt: Jede Bewegung beginnt an einem Keyframe.
Umsetzung
Typografie und Grafik sind als HTML und SVG aufgebaut und mit CSS-Keyframes auf einer gemeinsamen Zeitleiste von sieben Sekunden animiert. Die Buchstaben laufen mit 35 Millisekunden Versatz. Auftritt und Abgang haben bewusst unterschiedliche Kurven: weich abbremsend beim Auftritt, zügig beschleunigend beim Abgang.
Ausschnitte
Schlüsselbilder aus der Zeitleiste
Die Standbilder stammen direkt aus der Animation oben: Jedes zeigt die Zeitleiste an der angegebenen Stelle.
00:01,0 sDie Kurve zeichnet sich, der Punkt gibt das Tempo vor. 00:02,4 sDie Buchstaben steigen mit Versatz aus der Grundlinie. 00:04,6 sEndstand: Wortmarke, Linie und Tätigkeit. 00:06,5 sAbgang nach oben, beschleunigend.
Wo so etwas eingesetzt wird
Intro und Abspann von Videos, Signet für soziale Medien, Präsentationen.