Kurs · Motion Design
Bewegung, die erklärt
0.1 / Worum es geht
Gute Bewegung erklärt, bevor man liest.
Motion Design ist Gestaltung in der Zeit: Logos, Schrift, Interfaces und kurze Filme, die sich bewegen. Der Kurs führt von den Prinzipien der Animation über Timing und kinetische Typografie bis zur Bewegung im Interface und zur Produktion eines fertigen Clips.
Als durchgehendes Beispiel begleitet dich Museum Klang, ein erfundenes Musikmuseum in Basel mit Website, Social Media und Bildschirmen im Foyer. Du kannst jede Übung auch mit einem eigenen Projekt machen.
Leitfragen des Kurses:
FRAGE 1
Was macht eine Bewegung glaubwürdig und lebendig?
FRAGE 2
Wie lange dauert eine Bewegung, und in welcher Reihenfolge?
FRAGE 3
Wie bewegt sich Schrift, ohne unlesbar zu werden?
FRAGE 4
Wann hilft Bewegung, und wann schadet sie?
Rahmen des Kurses:
ZIELGRUPPE
Gestaltende
Lernende in Grafik-, Medien- oder UX-Design, die ihre Gestaltung in Bewegung bringen wollen.
UMFANG
5 × 90 Min.
Plus Abschlussprojekt; jedes Modul auch einzeln nutzbar.
FORMAT
Hands-on
Kurzinput, Werkzeug und Übung an einem durchgehenden Projekt.
BEZUG
Querverweise
Verbindungen zu Typografie, UX & UI Design, Content & Social Media und Barrierefreiheit.
0.2 / Lernziele
Nach dem Kurs bewegst du Gestaltung mit Absicht.
0.3 / Kursinhalt
Alle Module und Abschnitte auf einen Blick.
Fünf Module, jedes mit einer Kernfrage und einem Werkzeug. Kurz erklärt, dann selbst ausprobiert.
MODUL 01
Was macht Bewegung lebendig?
MODUL 02
Wie lange dauert eine Bewegung?
MODUL 03
Wie bewegt sich Schrift?
MODUL 04
Wann hilft Bewegung im Interface?
MODUL 05
Wie wird aus der Idee ein fertiger Clip?
0.4 / Ablauf pro Modul
Jedes Modul folgt demselben Ablauf.
Jedes Modul ist gleich aufgebaut, damit du dich schnell orientierst und es auch einzeln nutzen kannst.
01
Einstieg (10 Min.)
Eine Beobachtung aus Film, App oder Werbung.
02
Input (20 Min.)
Grundlagen und Regeln.
03
Werkzeug (15 Min.)
Das Thema im interaktiven Werkzeug durchspielen.
04
Übung (35 Min.)
Anwendung an einem eigenen Projekt.
05
Reflexion (10 Min.)
Was übernimmst du in deine Arbeit?
In jedem Abschnitt findest du einen fett gesetzten Merksatz und eine Aufgabe zum Weiterdenken.
0.5 / Leistungsnachweis
Am Ende steht ein bewegtes Erscheinungsbild.
Abschlussprojekt: ein bewegtes Erscheinungsbild für eine reale oder erfundene Institution, mit Logo, Clip und Interface.
01
Konzept
Charakter der Bewegung in drei Wörtern festlegen.
02
Logo
Das Logo in Bewegung, mit ruhiger Fassung.
03
Clip
Ein Social-Media-Clip von höchstens 15 Sekunden.
04
Interface
Drei Microinteractions für die Website.
05
Leitfaden
Dauern, Easing und Regeln für alle festhalten.
Bewertungskriterien: klarer Charakter, gutes Timing, lesbare Schrift, begründete Bewegung im Interface und eine ruhige Fassung.
0.6 / Literatur und Quellen
Gute Bewegung hat Vorbilder.
• Thomas, F. & Johnston, O. (1981): The Illusion of Life: Disney Animation. Abbeville Press.
• Williams, R. (2001): The Animator’s Survival Kit. Faber & Faber.
• Krasner, J. (2013): Motion Graphic Design. 3. Auflage. Focal Press.
• Head, V. (2016): Designing Interface Animation. Rosenfeld Media.
• Google: Material Design 3, Motion. m3.material.io
• W3C: Web Content Accessibility Guidelines 2.2, Abschnitte 2.2.2, 2.3.1 und 2.3.3.
• MDN Web Docs: prefers-reduced-motion.
Hinweis: Die Jahreszahlen nennen die hier verwendete Auflage.