Eingabehilfen
Adobe
Anmelden Meine Bestellungen Mein Adobe

Flash für Anfänger – Teil 1: Erstellen eines Banners

Adobe® Flash® kann auf den ersten Blick etwas kompliziert wirken. Ein Grund für diese anscheinende Komplexität ist, dass Sie das Programm für viele verschiedene Dinge benutzen können, z. B. für Comic-Animationen, als Media Player und sie ist zugleich eine ausgefeilte Software. Dieser Lehrgang ist für Sie geeignet, wenn Sie Flash zum ersten Mal verwenden. Er zeigt Ihnen einige grundlegende Aspekte des Programms und erklärt, wie Sie damit ein echtes Projekt erstellen. Sie brauchen nichts über Flash oder Animationen zu wissen, um diesen Lehrgang durchzuführen; Sie werden sogar feststellen, wie einfach es ist, mit Flash Elemente in Ihre Webseiten einzufügen.

Dies ist der erste Teil eines dreiteiligen Artikels, in dem erläutert wird, wie ein einfaches animiertes Banner in Flash erstellt und mit Adobe Dreamweaver® in eine Webseite eingefügt wird. Im ersten Teil lernen Sie, wie Sie eine Datei erstellen und ihre Einstellungen ändern, Grafiken aus der Bibliothek importieren und zur Bühne hinzufügen sowie Ebenen erstellen. Im zweiten und dritten Teil fügen Sie eine Animation hinzu und erstellen eine Schaltfläche, über die ein Browserfenster geöffnet wird. Anschließend legen Sie Veröffentlichungseinstellungen fest und fügen das Banner einer Webseite hinzu.

Hinweis: In diesem Artikel wird Flash CS3 Professional verwendet. Wenn Sie noch mit Flash 8 arbeiten, lesen Sie bitte die vorherige Version dieses Artikels. Wenn Sie noch mit Flash MX 2004 arbeiten, können Sie die noch ältere Version des Artikels lesen*.

Sie können sich auch einen Videolehrgang dieser Lehrgangsreihe im Adobe Video-Workshop ansehen.

Voraussetzungen

Damit Sie diesen Artikel nachvollziehen können, benötigen Sie die folgende Software:

Flash CS3 Professional

Beispieldateien:

gnome_part1.zip (ZIP, 973 KB)

Erforderliches Hintergrundwissen:

Kein Hintergrundwissen erforderlich.

Erstellen eines neuen Dokuments

Mit Flash lassen sich alle möglichen Elemente für das Web oder CD-ROMs und Geräte erstellen. Zunächst erstellen Sie eine Datei im Flash-Authoring-Programm, die Sie dann verwenden, um die SWF-Dateien auszugeben. SWF-Dateien sind die Dateien, die Sie online bereitstellen können, indem Sie sie in eine Webseite einbetten. Mit dem Adobe Flash Player-Zusatzmodul wird dann die SWF-Datei angezeigt, sodass die Besucher Ihrer Website den Inhalt sehen und damit interagieren können.

Ihre SWF-Datei kann Videos, MP3-Audio, Animationen, Bilder, Daten usw. enthalten. Der Vorteil einer SWF-Datei gegenüber anderen Formaten ist, dass das Flash Player-Zusatzmodul sehr weit verbreitet ist. Lassen Sie uns damit beginnen, ein Banner zu erstellen.

  1. Starten Sie Flash CS3 Professional.

    Flash zeigt standardmäßig die Startseite an (siehe Abb. 1), auf der Sie ein vor kurzem bearbeitetes Dokument auswählen, neue Arten von Dokumenten (Flash-Dateien, ActionScript-Dateien usw.) oder ein neues Dokument aus einer Vorlage erstellen können.

    Die Startseite

    Abb. 1: Flash zeigt standardmäßig die Startseite an, wenn das Programm gestartet wird.

  2. Klicken Sie auf der Startseite in der Spalte „Neu erstellen“ auf „Flash-Datei (ActionScript 3.0)“. Hiermit wird ein leeres Dokument erstellt. Falls Flash die Startseite nicht anzeigt (die Funktion könnte z. B. von einer anderen Person deaktiviert worden sein, wenn Sie sich den Computer mit jemand anderem teilen), wählen Sie im Hauptmenü „Datei“ > „Neu“, um ein neues Dokument zu erstellen. Klicken Sie ggf. auf die Registerkarte „Allgemein“ (sofern sie nicht aktiviert ist), wählen Sie „Flash-Datei (ActionScript 3.0)“ aus und klicken Sie dann auf „OK“.

     

    Tipp: Ihre zuletzt verwendeten Flash-Dokumente werden in der Spalte „Zuletzt geöffnete Dateien“ aufgelistet. Sie brauchen also nicht auf Ihrer Festplatte nach den Flash-Dateien zu suchen.

  3. Wählen Sie aus dem Hauptmenü „Datei“ > „Speichern unter“ aus. Geben Sie als Namen für die neue Datei „banner.fla“ ein und klicken Sie dann auf „Speichern“. Flash speichert bearbeitbare Dokumente als FLA-Dateien. Aus dem FLA-Dokument exportieren (oder kompilieren) Sie SWF-Dateien, die Sie in eine HTML-Seite einbetten können. Der Flash Player, der auf den meisten Computern installiert ist, spielt die SWF-Dateien ab, die Sie aus Flash exportieren.

Es ist eine gute Idee, zu Beginn und auch zwischendurch ein neues Dokument zu speichern, damit Sie Ihre Arbeit nicht verlieren. Nachdem Sie die Datei gespeichert haben, fahren Sie mit der nächsten Übung fort, in der Sie die Eigenschaften des Dokuments ändern werden.

Ändern von Dokumenteigenschaften

Sie sehen jetzt eine weiße Arbeitsfläche, die von vielen Steuerelementen umgeben ist (siehe Abb. 2). Das große weiße Quadrat wird als Bühne bezeichnet. Hier platzieren Sie die Elemente, die in der SWF-Datei angezeigt werden sollen, z. B. Bilder, Schaltflächen, Text oder Animationen. Die Bühne und die Bedienfelder werden zusammen als Flash-Arbeitsbereich oder Authoring-Umgebung bezeichnet.

Die Bühne

(+) vergrößern
Abb. 2: Die Flash-Authoring-Umgebung enthält eine Bühne, auf der Sie Elemente platzieren und bearbeiten können.

Um die Bühne herum sehen Sie eine Reihe von Bedienfeldern. Das Bedienfeld auf der linken Seite ist das Werkzeugbedienfeld (siehe Abb. 3), das entweder in einer einfachen oder doppelten Spalte angeordnet ist.

Tipp: Klicken Sie auf den Doppelpfeil am oberen Rand des Bedienfelds, um die Werkzeuge in einer oder in zwei Spalten anzuzeigen.

In diesem Bedienfeld befinden sich Werkzeuge zum Erstellen und Bearbeiten von Dokumenten, z. B. Werkzeuge zum Zeichnen und zur Auswahl von Elementen.

Das Auswahlwerkzeug

Abb. 3: Verwenden Sie das Werkzeugbedienfeld, um Elemente zu zeichnen und auszuwählen. Mit dem Auswahlwerkzeug (schwarzer Pfeil) wählen Sie in diesen Lehrgängen Elemente aus.

Ein Bedienfeld im unteren Bereich der Flash-Anwendung trägt den Namen „Eigenschaften“ (wenn Sie das Bedienfeld nicht sehen, wählen Sie „Fenster“ > „Eigenschaften“ > „Eigenschaften“). Dieses Bedienfeld wird als Eigenschafteninspektor bezeichnet (siehe Abb. 4) und ermöglicht es Ihnen, verschiedene Eigenschaften des Elements, das momentan in Ihrem Dokument ausgewählt ist (z. B. eine Grafik oder ein Bild), zu ändern oder Eigenschaften für die gesamte SWF-Datei (z. B. die Bildrate oder die Größe) festzulegen. Wenn Sie keine Elemente oder Bilder ausgewählt haben, können Sie im Eigenschafteninspektor die Eigenschaften des Dokuments selbst ändern.

  1. Öffnen Sie den Eigenschafteninspektor (wählen Sie „Fenster“ > „Eigenschaften“ > „Eigenschaften“) und klicken Sie auf die Schaltfläche neben dem Wort „Größe“, um das Dialogfeld „Dokumenteigenschaften“ zu öffnen.

    Hinweis: Achten Sie darauf, dass kein Bild ausgewählt ist. Klicken Sie auf die Bühne, wenn Sie diese Schaltfläche nicht sehen.

    Das Dialogfeld „Dokumenteigenschaften“

    Abb. 4: Klicken Sie im Eigenschafteninspektor auf diese Schaltfläche, um das Dialogfeld „Dokumenteigenschaften“ zu öffnen. Sie können dann die Größe und die Farbe der Bühne ändern.

    Auf der Schaltfläche ist die aktuelle Größe der FLA-Datei zu sehen. Das Format der Bühne in einem neuen Flash-Dokument ist standardmäßig 550 Pixel breit und 400 Pixel hoch. Wenn Sie auf diese Schaltfläche klicken, öffnen Sie das Dialogfeld „Dokumenteigenschaften“, in dem Sie mehrere dokumentübergreifende Eigenschaften (z. B. die Größe und Farbe der Bühne und die Bildrate des Dokuments) ändern können.

  2. Geben Sie im Dialogfeld „Dokumenteigenschaften“ in das Textfeld „Breite“ die Zahl 160 und in das Textfeld „Höhe“ die Zahl 600 ein.

    Wenn Sie neue Zahlen in diese Textfelder eingeben, ändern Sie die Größe Ihres FLA-Dokuments. Es gibt einen Grund dafür, dass Sie diese spezifischen Maße verwenden müssen. Da Sie ein Banner erstellen, sollten Sie eine Standard-Bannergröße verwenden. In diesem Lehrgang erstellen Sie einen „breiten Wolkenkratzer“. Eine Liste standardisierter Bannergrößen finden Sie auf der Webseite des Interactive Advertising Bureaus unter „Ad Unit Guidelines“.

    Tipp: Sie können auch Banner aus einer Adobe-Vorlage wählen, indem Sie aus dem Hauptmenü „Datei“ > „Neu“ auswählen. Klicken Sie auf die Registerkarte „Vorlagen“ und wählen Sie die Kategorie „Anzeigen“, um die verfügbaren Anzeigevorlagen zu sehen.

  3. Klicken Sie auf „OK“, wenn Sie die neuen Maße im Dialogfeld „Dokumenteigenschaften“ eingegeben haben. Hierdurch kehren Sie wieder zur Authoring-Umgebung zurück.

    In der Authoring-Umgebung sehen Sie, wie sich die Maße Ihres Dokuments geändert haben. Sie können auch die Hintergrundfarbe und die Bildrate des Dokuments im Eigenschafteninspektor ändern, ohne hierzu das Dialogfeld „Dokumenteigenschaften“ aufzurufen. Im zweiten Teil dieses Lehrgangs finden Sie Informationen zur Bildrate.

Denken Sie daran, Ihre Arbeit zu speichern („Datei“ > „Speichern“), bevor Sie fortfahren.

Importieren von Grafiken in Dokumente

Wenn Sie mit Flash arbeiten, werden Sie oft Elemente in ein Dokument einfügen. Vielleicht haben Sie ein Firmenlogo oder Grafiken, die Ihnen ein Designer für Ihre Arbeit zur Verfügung gestellt hat. Sie können eine Vielzahl von Elementen in Flash importieren, z. B. Audio, Video, Bitmapbilder und andere Grafikformate (u. a. PNG, JPEG, AI und PSD).

Importierte Grafiken werden, egal ob Sie sie auf die Bühne oder in die Bibliothek importieren, in der Bibliothek des Dokuments gespeichert. Die Bibliothek enthält sowohl die Elemente, die Sie in das Dokument importieren, als auch die Symbole, die Sie in Flash erstellen. Ein Symbol ist eine Vektorgrafik, eine Schaltfläche, eine Schriftart, eine Komponente oder ein Movieclip, die bzw. das Sie einmal erstellen und dann mehrere Male als Instanzen wiederverwenden. Weitere Informationen zu Symbolen und Instanzen in Flash finden Sie im Videolehrgang Symbole und Instanzen erstellen* im Adobe CS3 Video Workshop.

Um Ihnen zu zeigen, wie leicht es ist, Bilder in Flash zu importieren, haben wir Ihnen in den Quelldateien für diesen Lehrgang ein Bild eines Gartenzwergs zur Verfügung gestellt. Laden Sie bitte, bevor Sie fortfahren, die Beispieldateien am Anfang dieses Lehrgangs herunter (sofern Sie das noch nicht getan haben) und extrahieren Sie die Bilder in den gleichen Ordner, in dem sich Ihr Dokument „banner.fla“ befindet.

In der folgenden Übung werden Sie das Bild auswählen, in das das Element in der Zeitleiste eingefügt werden soll. Anschließend können Sie die Grafik in dieses Bild importieren, das auf der Bühne angezeigt wird.

  1. Wählen Sie Bild 1 in der Zeitleiste aus und klicken Sie dann auf „Datei“ > „Importieren“ > „In Bühne importieren“, um eine Grafik in das aktuelle Dokument in das ausgewählte Bild einzufügen. Das Dialogfeld „Importieren“ (siehe Abb. 5) wird angezeigt, in dem Sie zur Datei navigieren können, die Sie importieren möchten.

     

    gnome.psd

    Abb. 5: Navigieren Sie zu dem Ordner auf Ihrer Festplatte, in dem sich die Adobe Photoshop® CS3-Datei mit dem Namen „gnome.psd“ befindet.

  2. Navigieren Sie zu dem Ordner, in den Sie die zusätzlichen Dateien extrahiert haben, wählen Sie die Datei „gnome.psd“ aus und klicken Sie auf „Öffnen“ (Windows) bzw. „Importieren“ (Mac OS).

    Die Grafik wird auf der Bühne in das Bild importiert, das Sie ausgewählt haben, und wird außerdem in der Bibliothek des Dokuments gespeichert. Photoshop muss nicht installiert sein, um diese Datei zu importieren.

    Hinweis: Sie können Elemente mehrere Male von der Bibliothek auf die Bühne ziehen, wenn Sie mehrere Instanzen der Grafik sehen möchten. Ihre Datei wird nicht größer, wenn Sie auf der Bühne mehrere Instanzen verwenden. Die SWF-Datei speichert nur die Informationen des Originalsymbols bzw. des Elements aus der Bibliothek und behandelt jede Instanz wie ein Duplikat.

  3. Wählen Sie „Fenster“ > „Bibliothek“, um das Bibliothek-Bedienfeld zu öffnen.

    Das Bild, das Sie gerade importiert haben (gnome.psd), wird jetzt in der Bibliothek des Dokuments angezeigt.

  4. Klicken Sie auf das Auswahlwerkzeug und wählen Sie die Instanz auf der Bühne aus.

    Wenn Sie sich den Eigenschafteninspektor ansehen, werden Sie bemerken, dass Sie die Breite und Höhe der Grafik sowie die X- und Y-Position des Bildes (die Koordinaten) auf der Bühne ändern können. Wenn Sie ein Objekt auf der Bühne auswählen, können Sie die aktuellen Koordinaten im Eigenschafteninspektor sehen und modifizieren (siehe Abb. 6).

    Der Registrierungspunkt

    Abb. 6: Die X- und Y-Koordinaten entsprechen dem Registrierungspunkt, der oberen linken Ecke dieses Movieclipsymbols.

  5. Lassen Sie die Grafikinstanz (des Gartenzwergs) ausgewählt und geben Sie in das Textfeld „X“ und „Y“ die Zahl 0 ein, wenn in diesen Feldern nicht bereits eine 0 steht.

     

    X- und Y-Koordinate

    Abb. 7: Legen Sie die X- und Y-Koordinate über den Eigenschafteninspektor fest. Setzen Sie „X“ und „Y“ auf 0.

Wenn Sie neue Koordinaten eingeben, wird die obere linke Ecke des Bildes in die obere linke Ecke der Bühne verschoben. Sie können das Bitmapbild auch mit dem Auswahlwerkzeug über die Bühne ziehen, anstatt die Koordinaten im Eigenschafteninspektor zu ändern. Sie sollten den Eigenschafteninspektor verwenden, wenn Sie eine bestimmte Position für ein Objekt (wie in diesem Schritt) festlegen müssen.

Vergessen Sie nicht, dass Dokument zu speichern, bevor Sie mit der nächsten Übung fortfahren.

Hinweis: Sie können auch Audiodateien in Ihre FLA-Dokumente importieren. Dies wird in diesem Lehrgang nicht abgedeckt, aber Sie können mehr hierüber erfahren, wenn Sie in der Hilfe nach „Audio importieren“ suchen.

Ebenen und die Zeitleiste

Das Zeitleisten-Bedienfeld befindet sich über der Bühne. Mit der Zeitleiste können Sie Elemente in Ihrem Dokument ordnen und auch den Inhalt eines Dokuments anhand der Zeit steuern. Zeitleisten in Flash enthalten Ebenen und Bilder, um die Steuerung des Inhalts zu erleichtern. Flash-Dokumente können über längere Zeit abgespielt werden (wie Video- oder Audio-Dateien), was in Bildern gemessen wird. Ebenen sind wie Folien, die übereinander gestapelt werden. Jede Ebene kann Bilder, Text oder Animationen enthalten, die auf der Bühne angezeigt werden. Im zweiten Teil dieses Lehrgangs erfahren Sie mehr über Bilder und Zeitleisten.

Die FLA-Datei, an der Sie arbeiten, hat eine Ebene (Ebene 1) mit Inhalt in einem einzigen Bild (Bild 1). Dies ist das Standardformat, in dem ein Flash-Dokument geöffnet wird.

In dieser Übung fixieren und benennen Sie Ebene 1 um. Oftmals werden Sie Objekte an einer bestimmten Position auf der Bühne platzieren wollen. Um Ihnen dabei zu helfen, dass diese Objekte an der jeweiligen Stelle bleiben, ermöglicht Flash es Ihnen, Ebenen zu fixieren, damit Sie die Elemente auf einer Ebene nicht versehentlich auswählen und verschieben.

  1. Wählen Sie Ebene 1 in der Zeitleiste aus und klicken Sie auf den Punkt unter dem Fixiersymbol, wie in Abb. 8 gezeigt.

     

    Fixieren einer Ebene

    Abb. 8: Fixieren Sie eine Ebene, damit ihr Inhalt nicht versehentlich verschoben oder von der Bühne gelöscht wird. Sie können auch verhindern, dass unabsichtlich andere Elemente auf diese Ebene gesetzt werden.

    Da Ihre einzige Ebene fixiert ist, müssen Sie neue Ebenen hinzufügen, bevor Sie weitere Objekte auf die Bühne setzen können. Es ist nicht möglich, neue Objekte auf eine fixierte Ebene zu setzen.

  2. Wählen Sie das Auswahlwerkzeug im Werkzeugbedienfeld aus und doppelklicken Sie auf den Namen „Ebene 1“. Wenn Sie auf einen Ebenennamen doppelklicken, können Sie den Namen ändern.
  3. Geben Sie als Ebenennamen „Hintergrund“ ein, um die Ebene umzubenennen, und speichern Sie Ihre Datei.

Wenn Sie Projekte mit vielen Ebenen erstellen, helfen Ihnen Ebenennamen wie Ebene 1 und Ebene 14 nicht weiter, da Sie hieraus nicht ersehen können, was sich auf der jeweiligen Ebene befindet. Es ist darum eine gute Idee, sich von Anfang an daran zu gewöhnen, aussagekräftige Namen zu verwenden.

Tipp: Sie können Ebenen auch in Ebenenordnern ordnen. Weitere Informationen hierzu erhalten Sie, wenn Sie in der Hilfe (F1) nach „Ebenenordner“ suchen.

Erstellen einer neuen Ebene

In so ziemlich jedem Flash-Projekt, in dem Sie importierte Grafiken und Animationen verwenden, werden Sie mindestens ein paar Ebenen erstellen müssen. Sie werden bestimmte Elemente auf eigene Ebenen setzen müssen, insbesondere wenn Sie damit beginnen, Objekte zu animieren. Sie können auch Grafiken übereinander stapeln und sogar den Eindruck von Tiefe oder einer Überlappung erwecken, indem Sie mehrere Ebenen verwenden.

  1. Wählen Sie die Hintergrundebene in der Zeitleiste aus und klicken Sie auf die Schaltfläche „Ebene einfügen“, um eine neue, leere Ebene zu erstellen.

     

    Klicken Sie auf „Ebene einfügen“

    Abb. 9: Klicken Sie auf „Ebene einfügen“, um über der momentan ausgewählten Ebene eine neue Ebene einzufügen.

  2. Doppelklicken Sie auf den Namen der neuen Ebene, sodass der Name der Ebene bearbeitbar wird.
  3. Geben Sie „Animation“ ein, um die neue Ebene umzubenennen.

Grafiken auf der Bühne werden entsprechend der Ebenen in der Zeitleiste gestapelt. Alles, was Sie beispielsweise auf die Animationsebene setzen, wird über dem Bild auf der Hintergrundebene angezeigt. Im zweiten Teil dieses Lehrgangs werden Sie dieser zweiten Ebene eine Animation hinzufügen.

Speichern Sie Ihre Arbeit, bevor Sie fortfahren.

Tipp: Wenn Sie die Reihenfolge Ihrer Ebenen ändern möchten, können Sie die gewünschte Ebene mit dem Auswahlwerkzeug auswählen und sie auf der Zeitleiste über oder unter andere Ebenen ziehen.

Importieren von Elementen in die Bibliothek

In einer Übung weiter vorn in diesem Lehrgang haben Sie das Bild „gnome.psd“ direkt in die Bühne importiert. Sie können Elemente auch statt in die Bühne direkt in die Bibliothek importieren und dann das Element auf eine ausgewählte Ebene auf der Bühne ziehen. Sie werden diese Technik in der nächsten Übung verwenden, in der Sie eine Illustrator-Datei importieren. Es ist nicht erforderlich, Illustrator zu installieren, um diese Datei zu importieren.

  1. Wählen Sie „Datei“ > „Importieren“ > „In Bibliothek importieren“.

    Es wird ein Dialogfeld angezeigt, in dem Sie eine Datei von Ihrer Festplatte auswählen können. Suchen Sie den Ordner mit den Quelldateien für diesen Lehrgang auf Ihrer Festplatte.

  2. Markieren Sie die Datei „join_us.ai“ in den Beispieldateien für diesen Lehrgang und klicken Sie auf „Öffnen“ (Windows) bzw. „In Bibliothek importieren“ (Mac OS). Es wird ein weiteres Fenster geöffnet, in dem Sie festlegen können, wie die Grafik importiert werden soll.
  3. Vergewissern Sie sich, dass alle Optionen aktiviert sind (siehe Abb. 10), und klicken Sie auf „OK“, um die AI-Datei zu importieren.

     

    Aktivieren Sie alle Optionen

    Abb. 10: Vergewissern Sie sich, dass alle Optionen aktiviert sind, damit alle Teile dieser Datei importiert werden.

    Tipp: In einigen Situationen möchten Sie u. U. steuern, wie die Illustration importiert werden soll. Beispielsweise könnten Sie angeben, dass bestimmte Elemente der jeweiligen Datei nicht importiert werden. Hierzu können Sie bestimmte Ebenen oder Ordner deaktivieren, die Sie nicht in Flash importieren möchten.

    Die Grafik wird in die Bibliothek importiert, wo Sie sie weiter bearbeiten können bzw. von wo aus Sie sie auf die Bühne ziehen können. Gleichzeitig wird ein Grafiksymbol erstellt (Abb. 11).

  4. Öffnen Sie das Bibliothek-Bedienfeld („Fenster“ > „Bibliothek“).

    Die Elemente für die Grafik, die Sie soeben in die Bibliothek importiert haben, werden in einem neuen Ordner abgelegt (siehe Abb. 11) und Flash erstellt ein Grafiksymbol der Grafik mit dem Namen „join_us.ai“.

  5. Doppelklicken Sie auf den Namen „join_us.ai“ in der Bibliothek (ich nehme hierbei an, dass dies das erste Element ist, das Sie in die Bibliothek importiert haben) und geben Sie „join_us“ ein, um das Grafiksymbol umzubenennen.
  6. Klicken Sie im Werkzeugbedienfeld auf das Auswahlwerkzeug.
  7. Wählen Sie Bild 1 der Animationsebene aus, markieren Sie dann das Grafiksymbol „join_us“ und ziehen Sie es auf die Bühne. Verschieben Sie die Grafik so auf der Bühne, dass sie sich gerade so über dem Kopf des Gartenzwergs im Bild befindet (siehe Abb. 11).

     

    Grafiksymbol

    Abb. 11: Die Grafik wird als Grafiksymbol in die Bibliothek importiert. Anschließend ziehen Sie das Grafiksymbol auf Bild 1 der Animationsebene. Passen Sie das Bild an, bis es so wie in dieser Abbildung aussieht.

    Wenn Sie ein Element auf die Bühne ziehen, sehen Sie es in der SWF-Datei, wenn die Datei abgespielt wird. Sie werden dies in der nächsten Übung testen.

  8. Wählen Sie „Datei“ > „Speichern“, um Ihr Dokument zu speichern, bevor Sie fortfahren.

Überwachen des Fortschritts

Zum Schluss können Sie Ihr Dokument in Flash testen. Hierbei wird die SWF-Datei im Flash Player getestet. Beispielsweise können Sie sehen, wie Ihr Code im Flash Player funktioniert, wie Animationen in der Zeitleiste abgespielt werden, und Sie können die Benutzerinteraktivität testen usw. Das ist viel schneller, als wenn Sie Ihre Arbeit jedes Mal auf einen Server hochladen, um die SWF-Datei in Aktion zu sehen.

  1. Wählen Sie aus dem Hauptmenü „Steuerung“ die Option „Film testen“ aus.

    Die Testumgebung wird geöffnet und Ihr Dokument wird im Flash Player abgespielt. Sie können jetzt die kompilierte SWF-Dateiversion Ihres FLA-Dokuments sehen. Sie sollten den Befehl „Film testen“ oft verwenden, um Ihren Fortschritt zu betrachten, wenn Sie an einer FLA-Datei arbeiten.

  2. Klicken Sie in der SWF-Datei auf die Schaltfläche „Schließen“, um zur Authoring-Umgebung zurückzukehren.
  3. Suchen Sie den Ordner auf Ihrer Festplatte, in dem Sie „banner.fla“ zu Beginn dieses Lehrgangs gespeichert haben.

Wenn Sie diesen Ordner öffnen, müssten Sie eine weitere SWF-Datei mit dem Namen „banner.swf“ sehen. Dies ist die kompilierte Version des Dokuments „banner.fla“. Wenn Sie eine endgültige Version Ihrer Datei zum Hochladen erstellen möchten, werden Sie vor der Kompilierung Ihrer SWF-Datei zusätzliche Veröffentlichungseinstellungen vornehmen wollen. Diese Einstellungen werden im dritten Teil dieses Lehrgangs behandelt.

Um die fertige und veröffentlichte Datei für diesen Teil des Lehrgangs zu sehen, suchen Sie „banner_pt1.fla“ im Ordner mit den Beispieldateien für diesen Lehrgang.

Weiterführende Informationen

Sie haben in sehr kurzer Zeit ein FLA-Dokument eingerichtet, Elemente in eine FLA-Datei importiert und darin angeordnet, Ebenen erstellt und modifiziert und eine SWF-Datei getestet. Sie werden als Nächstes ein Banner in Flash erstellen, damit Sie es mit Dreamweaver in einer HTML-Seite einbetten können. Im zweiten und dritten Teil dieses Lehrgangs lernen Sie, Symbole zu erstellen und zu modifizieren, eine Animation zu erstellen, ein paar einfache ActionScripts für eine Schaltfläche hinzuzufügen, über die Sie eine Webseite öffnen können, und dann das Banner einer Website hinzuzufügen.

Sie haben jetzt den ersten Teil abgeschlossen. Fahren Sie mit dem zweiten Teil (Flash für Anfänger – Teil 2: Hinzufügen von Symbolen, Animationen und ActionScripts) fort. Im nächsten Lehrgang lernen Sie, wie Symbole und Animationen erstellt werden. Anschließend schreiben Sie sogar ein paar einfache ActionScripts für die Bannerfunktion.