Animationen im Web

Animationen sind eine der ältesten Träume der Menschheit – sofern man so manchen Historikern Glauben schenken möchte. Die Theorie beginnt schon bei Höhlenmalereien: In vielen dieser Gemälden haben die Kreaturen unnatürlich viele Extremitäten. Einige Forscher meinen nun, dass das die frühesten Versuche sind, Bewegungen in Bildern einzufangen.

Kaum etwas ist Natürlicher als eben das, schließlich leben wir ja auch in einer sich bewegenden Welt. Animation ist Bewegung und Veränderung. Sie ist eine der besten und natürlichsten Ansätze, unser Leben als Kunstform widerzuspiegeln. Von sich großflächig bewegenden Bildern bis hin zu kaum sichtbaren Hover-Effekten: Zumindest kleine Animationsansätze sind mittlerweile überall auch im digitalen Design zu finden.

Animationen sind für Webdesigner keine Neuigkeiten mehr – sie werden sogar mehr und mehr die Basis für effektives Interaktionsdesign.

Aber warum?

In den Beginnerjahren des Webdesigns hat noch niemand Animationen verwendet, um die Nutzerfreundlichkeit einer Website zu verbessern – Animationen waren einfach nur Dekoration und weil sie im damals so schnöden Web einfach Spaß gemacht haben. Das hat sich mittlerweile drastisch geändert: Animationen helfen uns, die Usability einer Website wesentlich zu verbessern.
In vielen Fällen werden sie genutzt, um die Aufmerksamkeit der Nutzer auf bestimmte Details zu lenken, um den Nutzern zu helfen, ihre Eingaben nachzuvollziehen, die Eingaben zu vereinfachen und vieles mehr.

Endlose Möglichkeiten

So imitieren einige Animationen auch menschliches Verhalten wie das Schütteln des Kopfes, indem das Eingabefeld wackelt, wenn die Eingabe inkorrekt war. Größer und allgemeiner gedacht imitieren Animationen seit vielen Jahren die Interaktion mit realen Objekten. Denkt man an sein Smartphone, wird dessen „flüssige“ Bedienung – mit all dem Swipen und Scrollen – nur durch sehr geschickten Einsatz von Animationen ermöglicht.
Einfache Beispiele die zeigen, wie wirkungsvoll Animationen eingesetzt werden können und wie sie – richtig eingesetzt – helfen, digitale Interaktionen enorm aufzuwerten, und in manchen Fällen sogar erst effektiv zu ermöglichen.

Die folgenden Blogeinträge sollen tiefere Einblicke in ausgewählte Anwendungsfälle geben.

Quellen

Animation in Web Design: Why and When to Use
Web Animation In The Post-Flash Era
8 Ways Animation Can Improve Your Design
An Introduction to Animation in Web Design