Zum Studium dieses Moduls benötigen Sie das Flash-5 Plugin.
Falls Sie unten verwendete Flash-Beispiele nicht angezeigt bekommen, holen Sie das Plugin hier
In Modul 6.1.7 (Einbau von Objekten mit GoLive) sind wir bereits einmal mit dem Einbau von Flash-Filmen in Berührung gekommen. Flash-Anwendungen auf Webseiten sind relativ stark verbreitet, der noch weiteren Verbreitung steht wohl nur der Preis der Macromedia-Software entgegen sowie die Tatsache, dass man sich doch relativ stark einarbeiten muss, um Flash zu verstehen. Das Ziel dieses Moduls ist es nun nicht, Ihnen ein klassisches Tutorial zu erstellen, sondern vielmehr, Sie mit den wesentlichen Möglichkeiten und der generellen Arbeitsmethodik von Flash bekannt zu machen und Ihnen dazu den Einsteig zu erleichtern. Danach können Sie entscheiden, ob Flash-Objekte für Ihre Website sinnvoll sind. Insbesondere die Zeichenoptionen erläutern wir nur kurz. Auf Animations- und Script-Möglichkeiten gehen wir jedoch ausführlicher ein.
Flash-Projekte sind jedoch nicht nur auf Webseiten verwendbar, sondern können auch als Standalone-Projekt auf CDs gepresst werden (dann sollte allerdings ins sog. Projektor-Format umgewandelt werden, siehe CD-Modul. Flash-Projekte fürs Web müssen als Flash-Player-Format exportiert werden).
Als Lektüre kann ich folgendes preisgünstige Buch empfehlen: Busche, N. (2001): Flash 5. Das Einsteigerseminar.- 384 S., bhv, Preis ca. 10 Euro. Anähernd alle Funktionen werden dokumentiert in: Koron, A. (2001): Macromedia Flash 5.- 766 S., bhv, Preis Euro 15.29. Hier gibt es u.a. eine Flash ActionScript-Referenz. Diese werden Sie m.E. jedoch nur verstehen, wenn Sie mit JavaScript (oder anderen objektorientierten Programmiersprachen) vertraut sind (aber dazu haben Sie ja Modul 7 dieses Kurses ;-)
Folgende Grundanwendungen für die Darstellung wissenschaftlicher Inhalte auf Webseiten (oder CDs) mit Flash sehe ich:
Einbau von Zeichnungen im Vektorformat, d.h. mit sehr kleinen Dateigrößen
Interaktive Beschriftung bzw. Informationsabruf von Grafiken
Beschriftung sowie Interaktivität für Quicktime-Videos
Vertonung von Angeboten mit mp3-Files.
Frage-Antwort-Projekte zum Selbsttest (ggf. auch mit Datenbankanschluss).
Erstellung kompletter interaktiver Module für Unterrichtseinheiten.
Auch für optisches Gestalten von Webseiten ist Flash äußerst interessant. Ähnlich wie mit dhtml können Sie überlappende Bereiche gestalten und können die Seite zeitabhängig aufbauen lassen. Zusätzlich und im Unterschied zu dhtml sind aber auch Transparenzen und komplexe Animationen möglich.
Bevor Sie sich nun auf Flash stürzen, müssen Sie aber auch folgendes wissen:
Flash ist ein recht mächtiges Autorensystem, welches doch gehörige, zeitintensive Einarbeitung benötigt. Es ist außerdem nicht billig (ca. 500 ¤ für Vollversion, Stand Feb. 2002; es gibt aber auch Lehrversionen).
Flash-Projekte müssen in quasi kompilierter Weise exportiert werden, um auf dem Web dargestellt werden zu können, sie werden dabei im sog. Shockwave-Format (.swf) gespeichert. Bei Änderung brauchen Sie dann immer das Originalprojekt.
Shockwave-Dateien können mit einem kostenlosen, bei Macromedia erhältlichen FlashPlayer angesehen werden. Direkt in Webseiten laufen sie nur, wenn das Shockwave-Plugin installiert ist. Dieses wird bei vielen modernen Browsern aber automatisch mitinstalliert.
Auch das Quicktime-Plugin kann Shockwave-Dateien anzeigen, allerdings hinkt es immer eine Versionsnummer hinterher (das derzeitige Quicktime 5.0-plugin kann Flash 4-Filme darstellen). Außerdem müsste der Benutzer die Dateiendung .swf auf das Quicktime-Plugin eingestellt haben (unter Voreinstellungen im Browser). Dies empfehle ich jedoch nicht. (Eine weitere Möglichkeit, nämlich das Einladen von Flash-Filmen in quicktime-videos und speichern als .mov-Dateien behandeln wir im nachfolgenden Modul).
Den Einbau von Flash-Objekten in Webseiten sollten Sie sich vom Flash-Programm selbst (generiert auf Wunsch den entsprechenden html-Code) oder von einem professionellen Webeditor (z.B. GoLive oder Dreamweaver) abnehmen lassen, damit wird auch gleich ein richtiger Link zur evtl. Downloadstelle für das Plugin platziert (wir hatten dies in Modul 8.4 behandelt). Hier nochmals der entsprechende Einbau-code:
Wichtig: Bei Verwendung von GoLive5 wird standardmäßig die codebase für Flash 4.02 eingetragen. Ändern Sie diese entsprechend auf Version 5, falls Sie mit Flash 5 arbeiten und Ihre Flash-Filme auch für Flash-5-Format abgespeichert haben Am Schluss des codebase-Eintrags müsste es dann heißen /swflash.cab#version=5,0,0,0 In GoLive 6 wird korrekt die Flash 5-Version eingetragen.
Wegen des Plugin-Problems ist es ggf. sinnvoll, eine entsprechende JavaScript-Browserweiche einzubauen, die nach dem Plugin sucht und bei Nichtvorhandensein auf eine alternative Seite umlenkt. Sie können auch eine direkte Auswahlmöglichkeit per Linkklick einbauen. Die entsprechenden Browserweichen können Sie mit Flash generieren. Wählen Sie unter Datei / Einstellungen für Veröffentlichungen unter dem Reiter html / Vorlage ein sog. Banner, dies generiert Ihnen zusätzlich zur swf-Datei eine entsprechende html-Seite mit einer Browserweiche (banner5 lässt z.B. nur Flash-Plugins für Flash 5 zu usw.).
Eine andere Möglichkeit ist die Verwendung eines Java-Flash-Players. Damit benötigen Sie keinerlei Plugin (vgl. Sie hierzu auch Modul 8.6). Der Java-FlashPlayer wird beim Programm mitgeliefert, Sie finden die entsprechenden Java-Klassen im Programmorder / Unterordner Player. Unter den Voreinstellungen für Veröffentlichung (s.o.) wählen Sie html / Vorlage JavaPlayer. Damit wird Ihnen der entsprechende Einbettungscode für eine html-Seite generiert. Sie betten also den JavaPlayer als JavaApplet ein und geben in den Parametern den Flash-Film an (macht Flash automatisch, wenn Sie unter den o.a. Voreinstellungen veröffentlichen). Allerdings kann der Java-Flash-Player nur Flash-Filme in der Version 1 und 2 anzeigen. Für komplexe Animationen eignet er sich damit nicht. Um aber reine unanimierte Vektorgrafiken (siehe unten) ohne die Verwendung eines Plugins einzufügen, ist er aber eine echte Alternative. Hier der Einbettungscode:
Die Javaplayer-Klassen bzw. das Javaplayer-Archiv müssen damit im gleichen Ordner liegen wie die html-Seite. Andernfalls müssen Sie die Pfade anpassen (siehe auch Java-Modul 8.6)
Nachfolgend stelle ich Ihnen eine Auswahl der Arbeitsweisen und Möglichkeiten von Flash vor.
Einbettungen von Vektorgrafiken:
Sie können in Flash wie mit einem Zeichenprogramm zeichnen und diese Vektorgrafiken dann in Webseiten einbetten. Oder aber Sie kopieren Vektorgrafiken anderer Programme in Flash. Die unten abgebildete Graphik wurde mit einem einfachen vektorbasierten Graphikprogramm erstellt, über Copy and Paste in Flash eingesetzt und als .swf-Datei exportiert. Die Größe der Datei ist mit 1,7 kb unschlagbar klein.
Flash erlaubt aber auch die Erstellung komplexer Zeichnungen. Flash verfügt über beliebig viele Ebenen sowie alle bekannten Zeichenwerkzeuge incl. Bezierkurven. Sehr schön können Sie auch Beschneidungen vornehmen (das läuft etwas anders als z.B. mit Illustrator oder CorelDraw). Außerdem können Sie Text in Grafiken umwandeln, Transparenzen verwenden, Pixelbilder einladen, diese auf Wunsch auch vektorisieren und vieles mehr. Gezeichnet wird auf der sog. Bühne.
Auswahl einiger Besonderheiten:
Bei gefüllten Objekten, wie Kreisen, Rechtecken, Polygonzügen werden Umriss und Füllung als extra Objekte angelegt. Wenn Sie die Füllung anfassen und bewegen, bleibt der Umriss stehen, solange sie nicht beide gruppiert haben. Dies ist etwas gewöhnungsbedürftig, erlaubt aber z.B. die getrennte Animation der Randlinie.
Objekte, die nicht gruppiert sind, beschneiden sich gegenseitig, wenn sie auf einer Ebene liegen. Erstellen Sie also z.B. einen gefüllten Kreis und legen einen weiteren teilweise überlappend drüber, bleibt von dem unteren nur eine Mondsichel übrig, wenn sie ihn versuchen wegzubewegen. Hatten beide Kreise die gleiche Farbe, werden sie zu einem Objekt verbunden. Wenn Sie die Objekte getrennt halten wollen, müssen sie entweder gruppiert sein oder auf unterschiedlichen Ebenen liegen. Auch dies ist gewöhnungsbedürftig, aber sie können damit sehr einfach schwierige Formen generieren. Versuchen Sie mal ohne derartige Beschneidung eine gleichmäßige Mondsichel zu erstellen.
Tipp: Sie können auch Pixelgrafiken laden und als Malfarbe z.B. für den Pinsel definieren. Damit können Sie aus Fotos tolle Umrisse gestalten. Sie können dieses Bild dann sogar mit Exportieren wieder ins jpg-Format umwandeln und als solches in Webseiten einbauen. Nebenstehende Grafik wurde so erstellt (ist zwar auch mit Photoshop möglich, aber dort deutlich mühsamer).
Nachstehend ein Screenshot der Bühne und der Werkzeugpalette von Flash. Rote Zahlen: 1 Ebenenanzeige (hier nur eine verwendet), 2 Zeitleiste (hier nur ein Bild verwendet, da keine Animation vorliegt), 3 Zeichenwerkzeugpalette, 4 Bühne (Hauptarbeitsbereich), 5 shortcuts zu diversen Paletten (die ansonsten über das Menu Fenster, Steuerung oder Modifizieren zu erreichen sind).
Eine einfache Daumenkinoanimation:
Neben stehendes ist natürlich kein Kunstwerk, aber es geht uns auch nur ums Prinzip: der Vulkan spuckt kontinuierlich Rauch aus. Die Animation besteht aus sieben gezeichneten Schlüsselbildern, die Abspielrate ist mit 6 Bilder pro Sekunde eingestellt. Wäre natürlich auch über ein animiertes GIF möglich gewesen, aber nicht mit einer Dateigröße von nur 1.4 kb! Und diese Daumenkinoanimation ist noch eine sehr speicherintensive Art für Flash.
Unten sehen Sie den Screenshot für dieses Beispiel. In der Zeitleiste sehen Sie nun 7 Schlüsselbilder dargestellt. Der Abspielknopf (rotes Rechteck mit Strichverlängerung) befindet sich auf dem sechsten Bild. Die Bilder wurden einfach jeweils kopiert und dann der Rauch entsprechend von Hand geändert. Dazu ist die "Zwiebelschalenfunktion" hilfreich, die das jeweils letzte Bild transparent durchscheinen lässt (eingeschaltete Zwiebelschalenfunktion rot eingekreist)
Stichwortartige Kurzanleitung:
Neues Projekt anlegen, unter Modifzieren/Film Bühnengröße anlegen, ggf. auch Bildrate ändern.
Vulkan zeichnen sowie ersten Rauch.
Schlüsselbild duplizieren (z.B. drag+alt in Zeitleiste bzw. mit Einfügen/Schlüsselbild), Zwiebelschaleneffekt einschalten, Rauch ändern, dieses Schlüsselbild wieder duplizieren usw.
Als Flash-Player Film (.swf) unter Datei/Exportieren abspeichern. Hauptprojekt ebenfallsl speichern.