Photoshop
Cinema 4d
Fotografie
Weitere Grafiksoftware
HTML / CSS
JavaScript
Flash
PHP
Webserver
Sonstige
Einsteigertutorial (Flash Tutorial)
Tutorial erstellt von Malte, letzte Änderung am 20.01.2008
Willkommen bei meinem ersten Tutorial zum Thema Flash. In diesem Tutorial werdet ihr mit den nötigsten Grundlagen bekannt gemacht und habt am ende euren ersten Flash-Film fertig. Hierfür benötigt ihr die aktuelle Version von Flash MX (Version 2004), die ihr 30 Tage lang testen könnt. Diese bekommt ihr auf www.macromedia.com.
Vielleicht sollte ich davor noch sagen: Warum Flash?
Wenn jemand z.B. auf seiner Homepage Musik im Hintergrund ausgeben will, dann kann er das mit normalem HTML-Code tun. Greifen wir jedoch auf Flash zurück, bieten sich uns folgende Vorteile:
1. Der User sieht jederzeit, wann die Musik fertig geladen ist (Da wir ganz einfach einen Ladebalken einbauen können). Bei HTML weiß niemand, wann dies der Fall ist.
Jeder kann sich den Quelltext der Seite anschauen und den Pfad zu der Musikdatei finden.
2. Vielleicht möchten wir aber nicht, das dies der Fall ist. Mit Flash können wir verhindern, dass der Benutzer dieses Stück bekommt – Mit speziellen Sicherheitsmaßnahmen.
3. Dasselbe gilt für Filme: Flash-Filme sind nicht nur kleiner als MPG oder AVI-filme, sondern können nur von dem Macromedia Flash Player Plugin abgespielt werden. Das hat zum Vorteil, das sogar auf älteren Betriebssystemen der Film abgespielt wird – Selbst wenn kein geeignetes Media-Player-Plugin installiert ist, welches den ursprünglichen .AVI-Film nicht hätte wiedergeben können.
Nicht nur für Musik ist Flash am besten geeignet, sondern selbst kleine Internet-Spiele und Musikvideos können damit erstellt werden.
Wir sehen, dass Flash viele Vorteile hat (Das dort oben sind längst nichts alle!)
Also: Installieren, starten und Spaß haben!
Fangen wir an:
Als erstes, wenn wir Flash MX 2004 öffnen, überwältigen einen Fluten von Funktionen, wovon die meisten allerdings erst ganz viel später gebraucht werden

Listing 0100:Das Programm
Achtung: Diese Darstellung kann leicht von eurer Arbeitsoberfläche abweichen!
Abgesehen von den Zeichenwerkzeugen, die ihr im rechten Kasten seht (Rot eingerahmter Kasten) und den normalen Menüleisten und Speicher sowie Ladebefehlen (Grün eingerahmter Kasten) interessiert uns als erstes die Bibliothek (Blau eingerahmter Kasten).
In der Bibliothek werden die Dateien gespeichert, die für das aktuelle Bild benutzt werden. Dazu zählen Soundfiles, Bilder, Videos, andere Flashfilme etc. Will man etwas in die Bibliothek hinzufügen, so kann man das über den Menübefehl Datei -> Importieren -> in Bibliothek importieren tun

Listing 0120: Der Importieren-Befehl
Diese Dateien können Bequem mit Drag&Drop auf die Arbeitsfläche, auch Bühne genannt, gezogen werden. Und schon sind wir beim nächsten Begriff: Bühne!

Listing 0130: Die Bühne
Der rot markierte Kasten ist hier die Arbeitsfläche. Wir wollen uns gleich auf einen Begriff einigen, damit es später nicht zu Schwierigkeiten kommt, also sage ich jetzt mal, das in den weiteren Schritten nur noch von der Bühne die Rede ist. Die Bühne ist der sichtbare Bereich des Flashfilmes. Alles, was außerhalb dieses Bereiches platziert wird, ist später nicht sichtbar. Die Größe der Bühne kann über den Button (Der in Listing 0130 mit einem blauen Viereck umrahmt ist) verändert werden. Wir beschränken uns zunächst nur auf die Standarteinstellungen. Wir schon vorher erwähnt, können Dateien aus der Bibliothek ganz einfach mit Drag&Drop auf die Bühne gezogen werden. Der letzte wichtige Begriff nennt sich „Zeitleiste“

Listing 0140: Die Zeitleiste (Roter Kreis)
Die Zeitleiste kann wie der Sucher bei einem Videoprogramm benutzt werden, sie spult zwischen den so genannten „Frames“ im Programm hin und her. Frames werden im Folgenden „Schlüsselbilder“ genannt. Je mehr Schlüsselbilder ein Film hat, desto länger dauert er!
Nun kommen wir zu unserem ersten film, einer Bild-für-Bild-animation. Hierfür müssen wir wissen:
Wenn wir ein neues Schlüsselbild einfügen wollen, also sozusagen ein neues Bild in unserem Film, dann drücken wir die F7-Taste und wir bekommen ein neues, leeres Bild in unserem Film. Da dies aber öfters kein sinn macht, benutzen wir einfach die F6-Taste! Diese kopiert den Inhalt des vorherigen Schlüsselbildes einfach mit und fügt ihn bei dem neu erstellten ein, sodass wir nichts mehr ändern müssen. So leid es mir tut- Scrollt bitte noch mal zurück zu Listing 0130; Der Grüne Kreis markiert dort ein Feld, welches die Bezeichnung BsP trägt. Das bedeutet soviel wie „Bilder pro Sekunde“ und sagt aus, wie viele Bilder bei eurem Film pro Sekunde abgespielt werden sollen. Der Standartwert „12“ ist uns ein bisschen viel, tragt dort bitte mal „6“ ein!
Als erster kleiner Film brauchen wir nicht viel – Wir wollen, dass ein Kreis umherspringt. Dazu malen wir einfach beliebig ein Kreis mit dem Kreis-Werkzeug auf die Bühne. Füllfarbe und alle anderen Werte können beliebig verändert werden.

Listing 0200: Der Anfang des Filmes
Nachdem wir das getan haben, drücken wir F6, um ein neues Schlüsselbild mit demselben Inhalt zu erstellen. Wir „kreisen“ den Kreis ein (Dafür muss der schwarze Mauszeiger ausgewählt sein, der sich ganz oben links bei den Werkzeugen befindet) und verändern beliebig seine Position. Dieser Schritt sollte an die 50-60 mal wiederholt werden, um einen Film in akzeptabler Länge herauszubekommen.
Kleiner Tipp: Ich habe zum verändern der Position die Pfeiltasten benutzt.
Wir testen nun unseren Film indem wir „STRG + Eingabe“ drücken und sollten im Idealfall einen wandernden Kreis sehen!

Listing 0250:Endlich geschafft – Der erste Flashfilm!
Herzlichen Glückwünsch! Sie haben nun ihren ersten Flashfilm erstellt! Bei wem dies noch nicht so gut geklappt hat, kann sich die die Beilage.fla herunterladen und sich dort durcharbeiten!
Kleiner tipp zum Schluss: Wer seinen Film exportieren will, kann dies über Datei -> Exportieren -> Film exportieren tun!
Freut euch schon auf neue Tutorials - als nächstes lernen wir, wie sich der Kreis anhand einer Linie bewegen kann.
>> Allgemeine Fragen oder Probleme mit dem Tutorial? Hier gehts zum Forum!
Vielleicht sollte ich davor noch sagen: Warum Flash?
Wenn jemand z.B. auf seiner Homepage Musik im Hintergrund ausgeben will, dann kann er das mit normalem HTML-Code tun. Greifen wir jedoch auf Flash zurück, bieten sich uns folgende Vorteile:
1. Der User sieht jederzeit, wann die Musik fertig geladen ist (Da wir ganz einfach einen Ladebalken einbauen können). Bei HTML weiß niemand, wann dies der Fall ist.
Jeder kann sich den Quelltext der Seite anschauen und den Pfad zu der Musikdatei finden.
2. Vielleicht möchten wir aber nicht, das dies der Fall ist. Mit Flash können wir verhindern, dass der Benutzer dieses Stück bekommt – Mit speziellen Sicherheitsmaßnahmen.
3. Dasselbe gilt für Filme: Flash-Filme sind nicht nur kleiner als MPG oder AVI-filme, sondern können nur von dem Macromedia Flash Player Plugin abgespielt werden. Das hat zum Vorteil, das sogar auf älteren Betriebssystemen der Film abgespielt wird – Selbst wenn kein geeignetes Media-Player-Plugin installiert ist, welches den ursprünglichen .AVI-Film nicht hätte wiedergeben können.
Nicht nur für Musik ist Flash am besten geeignet, sondern selbst kleine Internet-Spiele und Musikvideos können damit erstellt werden.
Wir sehen, dass Flash viele Vorteile hat (Das dort oben sind längst nichts alle!)
Also: Installieren, starten und Spaß haben!
Fangen wir an:
Als erstes, wenn wir Flash MX 2004 öffnen, überwältigen einen Fluten von Funktionen, wovon die meisten allerdings erst ganz viel später gebraucht werden

Listing 0100:Das Programm
Achtung: Diese Darstellung kann leicht von eurer Arbeitsoberfläche abweichen!
Abgesehen von den Zeichenwerkzeugen, die ihr im rechten Kasten seht (Rot eingerahmter Kasten) und den normalen Menüleisten und Speicher sowie Ladebefehlen (Grün eingerahmter Kasten) interessiert uns als erstes die Bibliothek (Blau eingerahmter Kasten).
In der Bibliothek werden die Dateien gespeichert, die für das aktuelle Bild benutzt werden. Dazu zählen Soundfiles, Bilder, Videos, andere Flashfilme etc. Will man etwas in die Bibliothek hinzufügen, so kann man das über den Menübefehl Datei -> Importieren -> in Bibliothek importieren tun

Listing 0120: Der Importieren-Befehl
Diese Dateien können Bequem mit Drag&Drop auf die Arbeitsfläche, auch Bühne genannt, gezogen werden. Und schon sind wir beim nächsten Begriff: Bühne!

Listing 0130: Die Bühne
Der rot markierte Kasten ist hier die Arbeitsfläche. Wir wollen uns gleich auf einen Begriff einigen, damit es später nicht zu Schwierigkeiten kommt, also sage ich jetzt mal, das in den weiteren Schritten nur noch von der Bühne die Rede ist. Die Bühne ist der sichtbare Bereich des Flashfilmes. Alles, was außerhalb dieses Bereiches platziert wird, ist später nicht sichtbar. Die Größe der Bühne kann über den Button (Der in Listing 0130 mit einem blauen Viereck umrahmt ist) verändert werden. Wir beschränken uns zunächst nur auf die Standarteinstellungen. Wir schon vorher erwähnt, können Dateien aus der Bibliothek ganz einfach mit Drag&Drop auf die Bühne gezogen werden. Der letzte wichtige Begriff nennt sich „Zeitleiste“

Listing 0140: Die Zeitleiste (Roter Kreis)
Die Zeitleiste kann wie der Sucher bei einem Videoprogramm benutzt werden, sie spult zwischen den so genannten „Frames“ im Programm hin und her. Frames werden im Folgenden „Schlüsselbilder“ genannt. Je mehr Schlüsselbilder ein Film hat, desto länger dauert er!
Nun kommen wir zu unserem ersten film, einer Bild-für-Bild-animation. Hierfür müssen wir wissen:
Wenn wir ein neues Schlüsselbild einfügen wollen, also sozusagen ein neues Bild in unserem Film, dann drücken wir die F7-Taste und wir bekommen ein neues, leeres Bild in unserem Film. Da dies aber öfters kein sinn macht, benutzen wir einfach die F6-Taste! Diese kopiert den Inhalt des vorherigen Schlüsselbildes einfach mit und fügt ihn bei dem neu erstellten ein, sodass wir nichts mehr ändern müssen. So leid es mir tut- Scrollt bitte noch mal zurück zu Listing 0130; Der Grüne Kreis markiert dort ein Feld, welches die Bezeichnung BsP trägt. Das bedeutet soviel wie „Bilder pro Sekunde“ und sagt aus, wie viele Bilder bei eurem Film pro Sekunde abgespielt werden sollen. Der Standartwert „12“ ist uns ein bisschen viel, tragt dort bitte mal „6“ ein!
Als erster kleiner Film brauchen wir nicht viel – Wir wollen, dass ein Kreis umherspringt. Dazu malen wir einfach beliebig ein Kreis mit dem Kreis-Werkzeug auf die Bühne. Füllfarbe und alle anderen Werte können beliebig verändert werden.

Listing 0200: Der Anfang des Filmes
Nachdem wir das getan haben, drücken wir F6, um ein neues Schlüsselbild mit demselben Inhalt zu erstellen. Wir „kreisen“ den Kreis ein (Dafür muss der schwarze Mauszeiger ausgewählt sein, der sich ganz oben links bei den Werkzeugen befindet) und verändern beliebig seine Position. Dieser Schritt sollte an die 50-60 mal wiederholt werden, um einen Film in akzeptabler Länge herauszubekommen.
Kleiner Tipp: Ich habe zum verändern der Position die Pfeiltasten benutzt.
Wir testen nun unseren Film indem wir „STRG + Eingabe“ drücken und sollten im Idealfall einen wandernden Kreis sehen!

Listing 0250:Endlich geschafft – Der erste Flashfilm!
Herzlichen Glückwünsch! Sie haben nun ihren ersten Flashfilm erstellt! Bei wem dies noch nicht so gut geklappt hat, kann sich die die Beilage.fla herunterladen und sich dort durcharbeiten!
Kleiner tipp zum Schluss: Wer seinen Film exportieren will, kann dies über Datei -> Exportieren -> Film exportieren tun!
Freut euch schon auf neue Tutorials - als nächstes lernen wir, wie sich der Kreis anhand einer Linie bewegen kann.
>> Allgemeine Fragen oder Probleme mit dem Tutorial? Hier gehts zum Forum!