Flash-Player

Medienproduktion
Sommersemester 2010
Dipl.-Inform. Alexander Schulze
Prof. Dr. Ing. Klaus Rebensburg
Ablauf Heute
•
•
Einführung Flash
Stand Projektideen, Diskussion und
weiteres Vorgehen
Flash - eine Einführung
Begriffe sortieren...
Flash-Player, SWF, ActionScript,
Flash-Lite, Flash-Video, Flex, ShockWave, Air,...
Flash ist...
•
...ein Oberbegriff für verschiedene Dinge auf
Basis der Flash-Technologie
•
...ist ein proprietäres Binärformat für
interaktive multimediale Inhalte
•
...ist der verbreitetste Plugin für
Webbrowser
•
...ist die (noch) verbreitetste Technologie zur
Wiedergabe von Video im Web
•
...ist eine proprietäre Entwicklungsumgebung
Adobe Flash - wird eingesetzt als...
•
...Teil einer Webseite:
Navigation, Werbebanner, Video-Player,...
•
•
•
...komplette Webseiten
...UI für Mobiltelefone und Unterhaltungselektronik
...
Adobe Flash - Was ist SWF?
•
binäres Auslieferungsformat für multimediale,
interaktive Flash-Inhalte
(kein Austauschformat)
•
bytecode der durch Laufzeitumgebung ausgeführt
wird (Anwendung oder Plugin)
•
•
•
enthält auch Vektorgrafik, Rastergrafik, Sound
sehr bandbreiten-effizient
ändern / editieren schwer möglich
(nur mit Dekompiler)
Adobe Flash - Was ist FLA?
•
•
•
•
originäres Format der Flash-IDE
•
•
Vorsicht: nicht abwärtskompatibel!
Quelldatei einer Flash-Anwendung
Austauschformat für Flash-Anwendungen
speichert alle Elemente
Vektoren, Bitmap, Sound, ActionScript,...
zunehmend geht man weg von monolitihischen
Flash-Quellen
Aufteilung auf mehrere Dateien: FLA, AS,...
Adobe Flash - Was ist ActionsScript?
•
Programmiersprache für die Flash Player
Laufzeitumgebung
•
Realisierung von Interaktion,Verarbeitung von
Daten und Events
•
AS Anweisungen werden von der Actionscript
Virtual Maschine ausgeführt
•
AS Programmcode wird in Bytecode kompiliert
und in SWF-Dateien gespeichert
•
Flash Player Laufzeitumgebung führt den Bytecode
aus
Adobe Flash - Was ist Flex?
•
...eine alternative Entwicklungsumgebung für FlashInhalte
•
•
stärkere Ausrichtung auf Software-Entwickler
•
aktuelle Version ist Flex 4 (März 2010)
kostenpflichtige IDE (Flash-Builder) basiert auf
Eclipse
Adobe Flash - Was ist der Flash-Player?
•
•
•
•
„Abspielsoftware“ für SWF-Dateien
aktuelle Flash Player 10.1
Stand Alone Player oder Browser-PlugIn
plattform übergreifend verfügbar
•
•
•
•
Windows, Mac, Linux, Solaris
PocketPC mit WindowsMobile
Sommer 2010: Android, Blackberry, WebOS, Symbian
KEIN SUPPORT für iPhone, iPod Touch, iPad
Adobe Flash - Was ist Flash Lite?
•
ressourcen-sparende Runtime-Enginge für mobile
Endgeräte und Unterhaltungselektronik
•
aktuell Flash Lite 3.1 (2009)
basiert noch auf Flash 8
•
•
standalone-player für Flash-Inhalte
geplant Flash Lite 4.0
•
•
als browser plugin realisiert
AS 3.0 Support
Adobe Flash - Was ist Shockwave?
•
•
mehrdeutig verwendeter Begriff
kann bezeichnen...
•
•
•
•
....Flash-Binärformat: Shockwave Flash, SWF
...Flash-Player: Shockwave Flash Player
....Director-Web-Binärformat: Shockwave (.DCR)
...Director-PlugIn: Shockwave Plugin
Adobe Flash - Was ist Flash-Video?
•
•
•
•
•
•
Video-Wiedergabe im Web mittels Flash
derzeit Standard für viele Video-Portale
Wiedergabe „in Software“ durch Flash-PlugIn
YouTube, Vimeo, u.v.m.
derzeit start in der Diskussion
Anzeichen einer Entwicklung in Richtung HTML5
als Alternative
•
siehe www.youtube.com/html5
Adobe Flash - Was ist AIR?
•
•
•
Adobe Integrated Runtime
•
•
plattformübergreifend: Mac, Windows, Linux
Laufzeitumgebung für Rich Internet Applications
erlaubt gemeinsame Nutzung von Flash, PDF, HTML
und JavaScript in einer Desktop-Anwendung
einige Features:
•
•
•
integrierte SQLite-DB
Dateizugriff, TCP-IP-Verbindungen, Drag-n-Drop
AIR 2.0: Multitouch, direkter Zugriff auf Audio-Hardware,...
Flash Versionen & Entwicklung
Adobe Flash - Versionen & Entwicklung
•
•
1995 - FutureSplash
•
•
•
Fa. FutureWave (San Diego, CA) veröffentlich „SmartSketch“
(später „FutureSplash Animator“)
Binärformat (vektorbasiert) „Splash“ (.SPL)
Browser-Plugin (Player) „FutureSplash“
1996-97 - Macromedia
•
•
•
•
•
Fa. Macromedia übernimmt Fa. FutureWave
FutureSplash Animator wird zu „Flash“
FutureSplash Animator wird zu „Shockwave Flash Player“
Flash 1.0 und 2.0 erscheinen (1997)
Einbindung von Rastergrafik und Audio
Adobe Flash - Versionen & Entwicklung
•
•
1998
•
•
•
Macromedia Flash 3.0
mehr Interaktionsmöglichkeiten
„Aktionen“ lassen sich Schlüsselbilder (KeyFrames) zuweisen
1999
•
•
Macromedia Flash 4.0
•
IDE bis hier noch Designer-zentriert
starke Verbesserungen an ActionScript
(bedingte Anweisungen, Schleifen, Eingabefelder für Text und
Nutzung von CGI)
Adobe Flash - Versionen & Entwicklung
•
•
2000
•
•
•
•
•
Macromedia Flash 5.0
starke Verbesserungen an ActionScript, basiert jetzt auf ECMAScript
Professionalisierung der Software-Entwicklung
mehr „appeal“ für Software-Entwickler
Debugger, AS-Suport für XML
2002
•
•
Macromedia Flash MX (6.0)
erste direkte Videounterstützung durch integrierten Codec
Adobe Flash - Versionen & Entwicklung
•
•
2003
•
•
Macromedia Flash MX 2004 (7.0)
ActionScript 2.0 (objektorientiert)
2005
•
•
•
•
•
•
•
Fa. Adobe übernimmt Fa. Macromedia
Adobe/Macromedia Flash Professional 8.0
Rastergrafiken erzeugen und verändern (AS)
Filter (Weichzeichner, Schatten,..)
Ebenen-Modi (wie Photoshop)
einstellbares Easing
VideoCodec (On2) mit Alphakanal-Support
Adobe Flash - Versionen & Entwicklung
•
•
2006
•
•
Flash Player 9
Actionscript 3.0
2007
•
•
•
Flash Player 9 für Linux
Adobe Flash CS3 (9.0)
Integrations-Features mit Photoshop und Illustrator
Adobe Flash - Versionen & Entwicklung
•
•
2008
•
•
•
Adobe Flash CS4 (Flash 10)
Flash Player 10
Umgang mit SWF/FLV-Spezifikationen wird gelockert
(Offenlegung, Nutzung ohne Lizentvertrag möglich)
2010
•
•
•
•
•
Adobe Flash CS5
Cross (Mobil-)Plattform Entwicklung mit Flash
iPhone-App-Entwicklung mit Flash
Integration mit Flash Builder (Flex)
neue Text-Engine (dynamischer Text mit Spalten, Kerning,..)
Flash - Video
Adobe Flash - Problem Web-Video
•
Problem Web-Video - Rahmenbedingungen
•
•
•
Bandbreiten-Beschränkungen
•
unterschiedliche Videoarchitekturen (Windows Media, QuickTime,
Realmedia,...)
•
•
schnelle technologische Entwicklung Videocompression
kein plattformübergreifender, weit verbreiteter, moderner Codec
verfügbar
=> vernünftige Wiedergabe von Webvideo beim
Benutzer war ein Glückspiel
(interims) Lösung: Flash-Video
Adobe Flash - Flash-Video
•
(interims) Lösung: Flash-Video:
•
•
•
universell verfügbarer Browser-Plugin
hard-coded support for Video, d.h.
•
•
•
läuft auf allen unterstützen Betriebssystemen
unabhängig von Video-Architektur
unabhängig von installierten Codecs
vielfach eingesetzt auf Videoportalen
•
YouTube,Vimeo, Clipfish, Myvideo, sevenload,...
Adobe Flash - Möglichkeiten der Umsetzung
•
•
•
Eingebettetes Video
Progressiver Download
Streaming
Adobe Flash - Möglichkeiten der Umsetzung
•
•
Eingebettetes Video
•
•
Video- und Audiodaten in der SWF-Datei enthalten
•
unflexibel, ineffektiv => sollte nicht mehr benutzt werden
Videobilder als Einzelbilder in der Zeitleiste
=> Tempo Zeitleiste bestimmt Wiedergabegeschwindigkeit
Progressiver Download
•
•
•
•
seit Flash MX 2004
Wiedergabe während Übertragung
keine „echtes“ Streaming
Video nicht Teil des SWF (sondern getrennte FLV-Datei)
Adobe Flash - Möglichkeiten der Umsetzung
•
Streaming
•
•
•
•
•
erfordert spezielle Software auf Server-Seite
(Adobe Flash Media Server)
„detect user bandwith and adjust video stream parameters“
überspringen von Teilen ohne Übertragung
Live-Streams möglich
kein Download ins Filesystem des Clients (Kopierschutz)
Adobe Flash - Versionen & Video-Codecs
Flash-Player
Sorenson
VP6
H.264
1 bis 5
—
—
—
6
√
—
—
7
√
—
—
8
√
√
—
9.0.115
√
√
√
Flash das Autorenwerkzeug
Elemente der IDE
Adobe Flash - das Autorenwerkzeug
•
•
•
aktuelle Version: CS5
•
Zeitleisten-basiert,
Animation auf Grundlage
von Keyframes
•
Import vieler Medienformate
Preis ca. 850€
meistgenutztes Werkzeug zum erstellen von FlashInhalten
Adobe Flash - das Autorenwerkzeug
•
•
•
Illustrationswerkzeuge für Vektorgrafiken
Import-Möglichkeiten für Audiodateien
weitreichende Möglichkeiten zur Animation mit
voller Interaktivität
Keyframes, Interpolationssteuerung,
Synchronisation und Interaktion mit Audio und
Video
Adobe Flash - Autorenwerkzeug - Bühne
•
Bereich, in dem grafsche
Elemente platziert werden
•
repräsentiert den
rechteckigen Bereich
im Flash Player oder
Browser Fenster, in
dem das Dokument
bei der Wiedergabe
abgespielt wird
Adobe Flash - Autorenwerkzeug Eigenschafteninspektor
•
Eigenschafteninspektor:
•
Der Eigenschafteninspektor erleichtert den Zugriff auf die am
häufigsten benötigten Attribute des auf der Bühne oder in der
Zeitleiste ausgewählten Elementes
Adobe Flash - Autorenwerkzeug - Bibliothek
•
•
•
Speichern und Verwalten der in Flash erstellten
Symbole und importierter Daten
•
•
•
Bitmapgrafiken
Sounddateien
Videoclips
Bibliothekselemente können in Ordnern
zusammengefasst werden
verschiedene Sortiermöglichkeiten
Adobe Flash - Autorenwerkzeug - Zeitleiste
•
Organisieren und Steuern des zeitlichen Ablaufs
des Dokuments in Ebenen und Bildern
•
Flash-Filme setzen sich aus Folge von Einzelbildern
zusammen
Adobe Flash - Autorenwerkzeug - Bilder
•
•
Flashdokument ist eine Folge von Einzelbildern
Zeitleiste organisiert und steuert Inhalt des
Dokuments mit Hilfe der Bilder
•
•
Schlüsselbild
•
Bild, mit ActionScript-Code zum Steuern
bestimmter Dokumentenaspekte
Bild, in dem Änderungen von Objekteigenschaften
für Animationen gespeichert werden
Adobe Flash - Autorenwerkzeug - Tweening
•
automatische Generation von Bildern zwischen
Schlüsselbildern
•
zwei Arten von Tweens:
•
•
Bewegungs-Tweens:
•
•
•
Festlegen von Eigenschaften wie Position, Rotation und
Skalierung einer Instanz, Gruppe oder Textobjekts zu
einem bestimmten Zeitpunkt
Ändern der Eingenschaften zu einem anderen Zeitpunkt
Animation an einem Pfad
Form-Tweens:
•
Interpolation zwischen den Formen von
Schlüsselbildern zu verschiedenen Zeitpunkten
Adobe Flash - Autorenwerkzeug - Symbole,...
•
Symbol ist Vorlage, die beliebige Zeichnungen,
Objekte oder Animationen enthalten kann
•
•
•
•
•
auf Bühne: Instanz des Symbols
drei verschiedene Symboltypen:
Movieclip
•
•
gleichbedeutend mit eigenständigen Flashfilm
wichtige Elemente bei der dynamischen Contentdarstellung
Schaltfläche
•
•
grundlegendes Element bei der Gestaltung von Benutzeroberflächen
können auf Benutzeraktionen reagieren
Grafik
•
•
kann wie Movieclip mehrere Ebenen, Zeichnungen und Animationen
enthalten
zeitlicher Ablauf abhängig vom Hauptfilm
Adobe Flash - Autorenwerkzeug - Aktionen
•
Aktionen
•
Erstellen und Bearbeiten von ActionScript Code zueinem Objekt
oder Bild
Adobe Flash - Resourcen (Ideenfindung)
•
www.flashforum.de
deutschsprachiges Forum zu Flash, AIR u.m.
•
http://www.flashforum.de/forum/coolsites/
Forum für besonders gute Flash-Site
•
www.thefwa.com - Favourite Website Awards
prämierte Website, vielfach mit Flash
Adobe Flash - Resourcen (Entwicklung)
•
www.flashhilfe.de/forum/flash-3d/
Papervision 3D, Sandy3D, Away3D, Alternativa 3D
und andere Fragen zum Thema 3D in Flash
•
www.flashsandy.org/
Sandy 3d, Flash 3D Engine
•
blog.papervision3d.org/category/demos/
Papervision 3D, Flash 3D Engine
Projekte und Gruppen
Diskussion Projekte
•
Facebook-Spiel mit Flash und "Social Software"Elementen
•
•
•
•
Sensordaten goes Multimedia :-)
Wii-Remote goes 3D
3D-Kurzfilm
kamerabasierte Projektionen
Ende! - noch Fragen?
nächster Präsenztermin: 17.05