Differences

This shows you the differences between two versions of the page.

--- about:grundlagen_der_animation [2025/05/01 11:21] – [Technische Grundlagen] Felix Hardmood Beck
+++ about:grundlagen_der_animation [2025/05/01 11:31] (current) – [Zeit und Bildfrequenz] Felix Hardmood Beck
@@ Line 1: / Line 1: @@
 ====== Grundlagen der Animation ======
-Diese Seite bietet eine Einführung in zentrale Grundlagen der Animation aus gestalterischer Perspektive. Die Inhalte bilden die theoretische und konzeptionelle Grundlage für einfache Animationsübungen (z. B. in GIF-Form) und dienen als Ausgangspunkt für spätere Arbeiten mit interaktiven oder generativen Tools wie TouchDesigner oder vvvv. Animation wird hier nicht nur als technische Disziplin verstanden, sondern als eigenständiges gestalterisches Medium, das Zeit, Bewegung und Transformation als kreative Ausdrucksmittel nutzt.
+Diese Seite bietet eine Einführung in zentrale Grundlagen der Animation aus gestalterischer Perspektive. Die Inhalte bilden die theoretische und konzeptionelle Grundlage für einfache Animationsübungen (z. B. in GIF-Form) und dienen als Ausgangspunkt für spätere Arbeiten mit interaktiven oder generativen Tools wie [[https://editor.p5js.org|P5.JS]], [[https://derivative.ca/download|TouchDesigner]] oder [[https://vvvv.org|vvvv]]. Animation wird hier nicht nur als technische Disziplin verstanden, sondern als eigenständiges gestalterisches Medium, das Zeit, Bewegung und Transformation als kreative Ausdrucksmittel nutzt.
+Die untere Übersicht dient als vertiefter theoretischer Einstieg und Referenzmaterial für Übungen, Besprechungen und spätere Projekte im Bereich Zeit-basierter Gestaltung.
 ===== Zeit und Bildfrequenz =====
-Die Grundlage jeder Animation ist die Erzeugung von Bewegung durch das schnelle Hintereinanderzeigen leicht veränderter Einzelbilder. Dieses Phänomen nutzt die Trägheit der menschlichen Wahrnehmung: Wenn pro Sekunde genügend Bilder gezeigt werden, entsteht der Eindruck kontinuierlicher Bewegung. Dieses Prinzip ist auch als „Persistence of Vision“ bekannt und bildet die Basis sowohl für klassische Trickfilmtechnik als auch für digitale Echtzeit-Animation.
+Die Grundlage jeder Animation ist die Erzeugung von Bewegung durch das schnelle Hintereinanderzeigen leicht veränderter Einzelbilder. Dieses Phänomen nutzt die Trägheit der menschlichen Wahrnehmung: Wenn pro Sekunde genügend Bilder gezeigt werden, entsteht der Eindruck kontinuierlicher Bewegung. Dieses Prinzip ist auch als „Persistence of Vision“((p5.js Coding Tutorial: Persistence of Vision Effect: https://www.youtube.com/watch?v=qO6A8iZZM04)) bekannt und bildet die Basis sowohl für klassische Trickfilmtechnik als auch für digitale Echtzeit-Animation.
-Ein zentraler technischer Parameter dabei ist die Bildfrequenz, gemessen in Frames per Second (FPS). Der klassische Kinostandard liegt bei 24 FPS – eine Geschwindigkeit, die als ausreichend empfunden wird, um Bewegungen flüssig, aber dennoch filmisch zu gestalten. Fernsehen, Videospiele und digitale Medien arbeiten häufig mit 25, 30 oder sogar 60 FPS. Höhere Framerates führen zu technisch „sauberer“ wirkender Bewegung, können aber – je nach Kontext – auch steril oder zu glatt wirken und emotionale Gestaltungsabsicht abschwächen.
+Ein zentraler technischer Parameter dabei ist die Bildfrequenz, gemessen in Frames per Second (FPS). Der klassische Kinostandard liegt bei 24 FPS – eine Geschwindigkeit, die als ausreichend empfunden wird, um Bewegungen flüssig, aber dennoch filmisch zu gestalten. Fernsehen, Videospiele und digitale Medien arbeiten häufig mit 25, 30 oder sogar 60 FPS. Höhere Framerates führen zu technisch „sauberer“ wirkender Bewegung, können aber – je nach Kontext – auch steril oder zu glatt wirken und emotionale Gestaltungsabsicht abschwächen. Eine einfache visuelle Darstellung, die zeigt, wie sich unterschiedliche Bildfrequenzen auf die Wahrnehmung von Bewegung auswirken ist in [[https://hugelol.com/lol/364250|diesem Beispiel]] zu sehen.
 Gestalterisch ist die Wahl der Bildfrequenz niemals neutral: Sie beeinflusst nicht nur die technische Qualität, sondern auch die Rhythmik, Wirkung und Ausdruckskraft einer Animation. Eine niedrige Framerate kann bewusst als Stilmittel eingesetzt werden – etwa um Grobheit, Naivität oder Nostalgie zu erzeugen. Umgekehrt kann eine hohe Framerate zur Darstellung von Präzision, Schnelligkeit oder digitaler Glätte beitragen. In der Praxis entstehen viele gestalterische Entscheidungen im Zusammenspiel von Framerate, Bildanzahl und tatsächlicher Abspielgeschwindigkeit.
@@ Line 102: / Line 104: @@
 Ein fundiertes Verständnis dieser technischen Grundlagen ist essenziell, um gestalterische Entscheidungen bewusst treffen zu können. Nur wer die Auswirkungen von Formatwahl, Komprimierung, Farbtiefe oder Framerate kennt, kann mediengerecht und zielgerichtet animieren. In professionellen Kontexten ist technische Sorgfalt zudem Voraussetzung für funktionierende Produktionsabläufe, plattformübergreifende Verwendbarkeit und nachhaltige Archivierung. Technik und Gestaltung stehen in der Animation nicht im Widerspruch, sondern bedingen sich gegenseitig.
+^ Format  ^ Farbtiefe / Farbmodell ^ Tonunterstützung ^ Transparenz ^ Loop-Funktion ^ Typischer Einsatzbereich ^
+| GIF     | 8 Bit / max. 256 Farben | Nein              | Ja (eine Farbe) | Ja            | einfache Web-Animationen, Memes, kurze Loops |
+| APNG    | 24 Bit (RGB + Alpha)    | Nein              | Ja (vollwertig) | Ja            | Web-Animationen mit Transparenz, bessere Alternative zu GIF |
+| MP4     | 24 Bit (RGB)            | Ja                | Nein           | Nein (nur über Player-Funktion) | Videoanimationen, Präsentationen, Social Media |
+| WebM    | 24 Bit (RGB)            | Ja                | Ja (Alpha möglich) | Ja (browserabhängig) | Webvideos, interaktive Animationen, Streaming |
+| MOV     | 24 Bit (RGB)            | Ja                | Ja (je nach Codec) | Nein (Player-abhängig) | High-End-Video, Filmschnitt, Archivierung |
+| SVG (mit SMIL oder CSS) | Vektorbasiert | Nein | Ja (vektorbasiert) | Ja | skalierbare Interface- oder UI-Animationen |