Flash MX in 21 Tagen . Schritt für Schritt zum Flash-Profi 9783827263377, 3827263379, 3827262119

Citation preview

Phillip Kerman

Flash MX ■

Schritt für Schritt zum Flash-Profi

■

Animationen mit Film ilmen und Sound

■

Mehr Interaktivität mit ActionScript

Markt + Technik Verlag

Die Deutsche Bibliothek – CIP-Einheitsaufnahme Ein Titeldatensatz für diese Publikation ist bei Der Deutschen Bibliothek erhältlich. Die Informationen in diesem Produkt werden ohne Rücksicht auf einen eventuellen Patentschutz veröffentlicht. Warennamen werden ohne Gewährleistung der freien Verwendbarkeit benutzt. Bei der Zusammenstellung von Texten und Abbildungen wurde mit größter Sorgfalt vorgegangen. Trotzdem können Fehler nicht vollständig ausgeschlossen werden. Verlag, Herausgeber und Autoren können für fehlerhafte Angaben und deren Folgen weder eine juristische Verantwortung noch irgendeine Haftung übernehmen. Für Verbesserungsvorschläge und Hinweise auf Fehler sind Verlag und Herausgeber dankbar. Alle Rechte vorbehalten, auch die der fotomechanischen Wiedergabe und der Speicherung in elektronischen Medien. Die gewerbliche Nutzung der in diesem Produkt gezeigten Modelle und Arbeiten ist nicht zulässig. Fast alle Hardware- und Software-Bezeichnungen, die in diesem Buch erwähnt werden, sind gleichzeitig auch eingetragene Warenzeichen oder sollten als solche betrachtet werden. Authorized translation from the English language edition, entitled SAMS TEACH YOURSELF FLASH MX IN 24 HOURS, by PHILLIP KERMAN, published by Pearson Education, Inc, publishing as Sams Publishing, Copyright © 2002 All rights reserved. No part of this book may be reproduced or transmitted in any form or by any means, electronic or mechanical, including photocopying, recording or by any information storage retrieval system, without permission from Pearson Education, Inc. GERMAN language edition published by PEARSON EDUCATION DEUTSCHLAND, Copyright © 2002 Umwelthinweis: Dieses Buch wurde auf chlorfrei gebleichtem Papier gedruckt. Die Einschrumpffolie – zum Schutz vor Verschmutzung – ist aus umweltverträglichem und recyclingfähigem PE-Material.

10 9 8 7 6 5 4 3 2 1

05 04 03 02

ISBN 3-8272-6337-9

© 2002 by Markt+Technik Verlag, ein Imprint der Pearson Education Deutschland GmbH, Martin-Kollar-Straße 10–12, D–81829 München/Germany Alle Rechte vorbehalten Übersetzung: Ingo Dellwig Lektorat: Melanie Kasberger, [email protected] Herstellung: Philipp Burkart, [email protected] CD Mastering: Gregor Kopietz, [email protected] Satz: reemers publishing services gmbh, Krefeld, (www.reemers.de) Einbandgestaltung: Grafikdesign Heinz H. Rauner, Gmund Druck und Verarbeitung: Bercker, Kevelaer Printed in Germany

Inhaltsverzeichnis Über den Autor. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

17

Vorwort . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

18

Feedback. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

19

Woche 1 – Vorschau . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

21

Tag 1

Grundlagen. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

23

1.1 1.2

Schnelleinstieg . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Ein Überblick. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Die Bühne . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Der Werkzeugkasten . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Die Zeitleiste . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Das Eigenschaften-Bedienfeld . . . . . . . . . . . . . . . . . . . . . . . . . . . Text-Optionen erkunden . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Bedienfelder in Gruppen organisieren . . . . . . . . . . . . . . . . . . . . Die Bibliothek . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Navigation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Die aktuelle Ebene . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Das aktuelle Bild . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Die aktuelle Szene bzw. das aktuelle Symbol . . . . . . . . . . . . . . . In der Benutzeroberfläche navigieren . . . . . . . . . . . . . . . . . . . . . Dokumenteigenschaften . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Dateitypen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quell-Dateien (.fla-Dateien) . . . . . . . . . . . . . . . . . . . . . . . . . . . . Exportierte .swf-Dateien. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . HTML-Dateien, die .swf-Dateien beherbergen . . . . . . . . . . . . . Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

24 27 27 32 33 35 38 38 40 42 42 42 43 45 46 48 48 48 49 50 51 51 52

Malen und Zeichnen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

53

2.1 2.2

55 55 56

1.3

1.4

1.5 1.6

1.7 1.8

Tag 2

Auf der Bühne malen. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Werkzeuge . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Ansicht-Werkzeuge . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

5

Inhaltsverzeichnis

Zeichen-Werkzeuge. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Linien zeichnen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Füllungen. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Mit Linien und Füllungen Figuren zeichnen und verändern . . Texte erstellen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Objekte auswählen und bearbeiten . . . . . . . . . . . . . . . . . . . . . . . Auswahl-Werkzeuge. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Die Pipette . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Vergrößerungsgrad, Rotation, Verzerren und Umhüllen . . . . . . Figuren glätten und begradigen . . . . . . . . . . . . . . . . . . . . . . . . . Objekte über das Andocken verbinden . . . . . . . . . . . . . . . . . . . . Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Übung. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

58 59 62 65 69 72 72 76 78 81 82 85 86 86 87 87

Grafiken in Flash importieren . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

89

3.1 3.2 3.3

90 91 92 92 93 94 95 97 98

2.3

2.4 2.5

Tag 3

3.4

3.5 3.6

6

Vektor- versus Rastergrafiken . . . . . . . . . . . . . . . . . . . . . . . . . . . . Gute Gründe, warum man den Grafikimport vermeiden sollte. Vektorgrafiken importieren . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Aus einer Datei. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Freehand-Dateien importieren . . . . . . . . . . . . . . . . . . . . . . . . . . EPS-Dateien importieren . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Flash-Player-Dateien importieren . . . . . . . . . . . . . . . . . . . . . . . . Aus anderen Programmen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . So stellen Sie die Bild-Integrität sicher . . . . . . . . . . . . . . . . . . . . Das Zusammenspiel zwischen Flash und anderen Vektorprogrammen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Bitmaps verwenden . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Rastergrafiken importieren. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Bitmap-Einstellungen verändern. . . . . . . . . . . . . . . . . . . . . . . . . Rastergrafiken in Vektorgrafiken konvertieren . . . . . . . . . . . . . . Bitmap-Sequenzen. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

99 100 101 103 108 111 113 113 113 114

Inhaltsverzeichnis

Tag 4

Fortgeschrittene Zeichentechniken . . . . . . . . . . . . . . . . . . . . . . . . . . . 4.1 Benutzerdefinierte Farben und Farbverläufe. . . . . . . . . . . . . . . . Farbtöne und Farbverlaufsfelder erstellen. . . . . . . . . . . . . . . . . . Farbverläufe verwenden und bearbeiten . . . . . . . . . . . . . . . . . . . Mit einer Rastergrafik füllen . . . . . . . . . . . . . . . . . . . . . . . . . . . . Texteffekte . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4.2 Objekte isolieren . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Wenn Sie es sehen können, können Sie es auswählen. . . . . . . . Die Leinwand-Ebene verwenden . . . . . . . . . . . . . . . . . . . . . . . . 4.3 Objekte gruppieren . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Effekte von Gruppierungen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Gruppen bearbeiten. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4.4 Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4.5 Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Übungsaufgaben . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

115 116 116 122 125 126 126 127 128 129 130 131 135 135 135 136 136

Tag 5

Die Bibliothek produktiv einsetzen . . . . . . . . . . . . . . . . . . . . . . . . . . . 5.1 Das Konzept der Bibliothek. . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5.2 Wie man Symbole erstellt und verwendet. . . . . . . . . . . . . . . . . . Wie Ihnen Symbole helfen können . . . . . . . . . . . . . . . . . . . . . . Die Dateigröße reduzieren . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Den Arbeitsaufwand minimieren . . . . . . . . . . . . . . . . . . . . . . . . 5.3 Die Bibliothek im Detail . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Den Überblick behalten . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Namen, Sortierung und Ordner verwalten . . . . . . . . . . . . . . . . . 5.4 Symbole aus der Bibliothek verwenden . . . . . . . . . . . . . . . . . . . Instanzen von Symbolen auf der Bühne platzieren . . . . . . . . . . Instanzen von Symbolen bearbeiten . . . . . . . . . . . . . . . . . . . . . . Farb-Effekte von Instanzen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Das Eigenschaften-Bedienfeld. . . . . . . . . . . . . . . . . . . . . . . . . . . Wie sich jede Instanz verschieden verhält. . . . . . . . . . . . . . . . . . Instanzen von Symbolen in Symbolen verwenden . . . . . . . . . . . 5.5 Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5.6 Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

137 139 139 143 144 144 145 145 146 148 148 149 150 150 153 154 158 158 158 159

7

Inhaltsverzeichnis

Tag 6

Animationen verstehen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6.1 Wie Animationen arbeiten. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6.2 Die Komponenten einer Animation . . . . . . . . . . . . . . . . . . . . . . Bilder und Bildrate. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Die Bildrate gegenüber der Anzahl der Bilder . . . . . . . . . . . . . . Die Bildrate verschiedener Animationstypen . . . . . . . . . . . . . . . Schlüsselbilder und leere Schlüsselbilder. . . . . . . . . . . . . . . . . . Tweening . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6.3 Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6.4 Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

161 162 162 163 165 166 167 172 173 173 173 174

Tag 7

Animationen im herkömmlichen Stil. . . . . . . . . . . . . . . . . . . . . . . . . . 7.1 Die »Rohe-Gewalt«-Technik verstehen . . . . . . . . . . . . . . . . . . . . Eine Animation als Test-Film betrachten . . . . . . . . . . . . . . . . . . Ein Schlüsselbild zur gleichen Zeit bearbeiten . . . . . . . . . . . . . Die Bilddarstellung ändern . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Die Zwiebelschalen-Werkzeuge verwenden . . . . . . . . . . . . . . . . 7.2 Die Bild-für-Bild-Animation erweitern . . . . . . . . . . . . . . . . . . . . Pausen integrieren . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Bewegung vorgaukeln . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Der Flimmer-Effekt . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7.3 Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7.4 Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Übung. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

175 176 178 179 179 180 183 183 184 185 187 187 187 188 188

Woche 2 – Vorschau . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

189

Tag 8

191 192 194 195 195 197 197 198

8

Animationen mit Bewegungstweening . . . . . . . . . . . . . . . . . . . . . . . . . 8.1 Einen Bewegungstween erstellen . . . . . . . . . . . . . . . . . . . . . . . . Die Regeln eines Bewegungstweens befolgen. . . . . . . . . . . . . . . Techniken und Tipps . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Mehr als nur die Position tweenen . . . . . . . . . . . . . . . . . . . . . . . Halten Sie sich aus dem Territorium von Flash heraus . . . . . . . Wissen Sie immer, wo Sie sind? . . . . . . . . . . . . . . . . . . . . . . . . . Halten Sie sich an dieses Muster! . . . . . . . . . . . . . . . . . . . . . . . .

Inhaltsverzeichnis

8.2

Feintuning eines Bewegungstweens. . . . . . . . . . . . . . . . . . . . . . . Mehrere Schlüsselbilder . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Abbremsen und beschleunigen . . . . . . . . . . . . . . . . . . . . . . . . . . In einem Bewegungstween rotieren . . . . . . . . . . . . . . . . . . . . . . Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Übungen. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

199 199 200 202 202 203 203 204 204

Morphing mit Formtweening . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

205

9.1

Einen Formtween erstellen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Formtween-Regeln. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Techniken und Tipps . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Feintuning eines Formtweens . . . . . . . . . . . . . . . . . . . . . . . . . . . Formmarken verwenden . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Formmarken verstehen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Gute Gründe, warum man Formtweens vermeiden sollte . . . . . Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Übung. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

206 207 208 211 211 214 216 216 217 217 217 218

Sound einbinden . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10.1 Sounds importieren . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Unterstützte Formate . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Sounds aus einer anderen Bibliothek importieren . . . . . . . . . . . 10.2 Sound verwenden. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Sync-Einstellungen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Effekt-Einstellungen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Wdh-Einstellungen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10.3 Qualität und Dateigröße kontrollieren . . . . . . . . . . . . . . . . . . . . Digital-Audio-Grundlagen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Einstellungen beim Exportieren . . . . . . . . . . . . . . . . . . . . . . . . . Individuelle Export-Einstellungen . . . . . . . . . . . . . . . . . . . . . . . Tricks für mehr Effizienz. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10.4 Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10.5 Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

219 220 221 223 224 225 227 229 232 232 233 235 236 237 237 237 238

8.3 8.4

Tag 9

9.2

9.3 9.4

Tag 10

9

Inhaltsverzeichnis

Tag 11

Effektiv mit Ebenen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11.1 Wie Ebenen funktionieren . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Der wahre Zweck von Ebenen . . . . . . . . . . . . . . . . . . . . . . . . . . Ebenen-Einstellungen, die Ihnen beim Editieren helfen . . . . . Ebenen verwalten. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11.2 Ebenen-Eigenschaften für visuelle Effekte . . . . . . . . . . . . . . . . . Führungs-Ebenen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Pfade . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Maskieren . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11.3 Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11.4 Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Übungen. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

239 240 240 243 246 247 247 250 253 256 257 257 257 258

Tag 12

Filmsequenzen und Grafik-Symbole . . . . . . . . . . . . . . . . . . . . . . . . . .

259

12.1

Das Verhalten von Filmsequenzen . . . . . . . . . . . . . . . . . . . . . . . Eine Filmsequenz erstellen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Filmsequenz- und Grafik-Symbole im Vergleich . . . . . . . . . . . . Wann Sie Filmsequenzen verwenden sollten. . . . . . . . . . . . . . . Filmsequenzen-Feintuning . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Adressierbare Filmsequenz-Instanzen . . . . . . . . . . . . . . . . . . . . . Einsparungen in der Dateigröße . . . . . . . . . . . . . . . . . . . . . . . . . Effekte der Download-Reihenfolge . . . . . . . . . . . . . . . . . . . . . . . Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Übungen. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

260 260 262 265 265 266 267 267 268 268 268 269 270

Schaltflächen für den Anwender. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

271

13.1

272 275 276 278 279 279 282 282 284

12.2

12.3 12.4

Tag 13

13.2 13.3

10

Eine Schaltfläche erstellen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Den Aktiv-Zustand der Schaltfläche definieren . . . . . . . . . . . . . Die Dateigröße von Schaltflächen minimieren . . . . . . . . . . . . . Instanzen von Schaltflächen . . . . . . . . . . . . . . . . . . . . . . . . . . . . Erweiterte Schaltflächen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Animierte Schaltflächen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Schaltflächen-Behandlungs-Optionen . . . . . . . . . . . . . . . . . . . . Schaltflächen mit Sound versehen . . . . . . . . . . . . . . . . . . . . . . . Unsichtbare Schaltflächen. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

Inhaltsverzeichnis

13.4 13.5

Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

286 287 287 287

ActionScript für die Erzeugung nichtlinearer Filme . . . . . . . . . . . . .

289

14.1

Aktionen verwenden . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Aktionen durch Parameter spezifizieren . . . . . . . . . . . . . . . . . . . Bild-Aktionen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Schaltflächen-Aktionen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Filmsequenz-Aktionen. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Aktionen bearbeiten . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . getURL . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Filmsequenzen anvisieren . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Effizienz-Tricks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

290 293 297 298 301 303 304 305 310 310 311 311 312

Woche 3 – Vorschau . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

313

Tag 14

14.2 14.3

Tag 15

ActionScript für mehr Interaktivität . . . . . . . . . . . . . . . . . . . . . . . . . . .

315

15.1

Drag&Drop-Interaktionen erzeugen. . . . . . . . . . . . . . . . . . . . . . Die anonyme Methode . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Die Grundlagen verschiebbarer Sequenzen . . . . . . . . . . . . . . . . In Flash programmieren . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Variablen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Eigenschaften. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Eigenschaften auslesen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . »Benutzerdefinierte« Eigenschaften erstellen. . . . . . . . . . . . . . . Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

316 319 319 322 322 326 328 329 330 330 330 331

Komponenten verwenden . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

333

16.1

334 338 344 346

15.2

15.3 15.4

Tag 16

16.2 16.3

Was ist eine Komponente? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Komponenten erstellen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . »RadioButtons« verwenden . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

11

Inhaltsverzeichnis

16.4

Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

347 347 347

Videos einsetzen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

349

17.1

Videos importieren. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Videos gut aussehen lassen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Unterstützte Formate . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Videos einsetzen. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Fortgeschrittene Videosteuerung. . . . . . . . . . . . . . . . . . . . . . . . . Videos optimieren . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Einstellungen für Sorenson Spark . . . . . . . . . . . . . . . . . . . . . . . . Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Übung. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

350 350 351 354 356 358 358 360 361 361 362 362

Tag 18

Filme ins Internet bringen. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18.1 Standard-Veröffentlichung. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18.2 Ein einfacher Hyperlink . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18.3 Welche Aufgaben im Internet kann Flash noch erfüllen? . . . . . Fenster anvisieren . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . E-Mails senden (mit dem mailto:-Befehl) . . . . . . . . . . . . . . . . . . 18.4 Auf einen Webserver hochladen . . . . . . . . . . . . . . . . . . . . . . . . . 18.5 Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18.6 Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

363 364 367 369 369 370 370 371 371 371 371

Tag 19

Modulare Internetseiten entwerfen . . . . . . . . . . . . . . . . . . . . . . . . . . .

373

19.1

374 377

Tag 17

17.2 17.3 17.4 17.5

19.2 19.3 19.4 19.5

12

Filme und JPGs laden . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Anvisieren von Clips und Stufen . . . . . . . . . . . . . . . . . . . . . . . . . Wann wurde ein Flash-Film komplett geladen, und wie entlädt man ihn wieder? . . . . . . . . . . . . . . . . . . . . . . . . Geteilte Bibliotheken . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Geteilte Bibliotheken verwenden . . . . . . . . . . . . . . . . . . . . . . . . Verknüpfte Skripte . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

378 381 381 385 386

Inhaltsverzeichnis

19.6

Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

386 386 387

Optimierung Ihrer Flash-Site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

389

20.1

Überlegungen zur Dateigröße . . . . . . . . . . . . . . . . . . . . . . . . . . . Ladezeiten kalkulieren. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Was ist groß? Was ist klein? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Sound- und Bitmap-Dateien . . . . . . . . . . . . . . . . . . . . . . . . . . . . Der Bandbreiten-Profiler . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Performance . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Unerwünschte Spezialeffekte . . . . . . . . . . . . . . . . . . . . . . . . . . . Streaming von Sound-Dateien . . . . . . . . . . . . . . . . . . . . . . . . . . Grafiken . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

390 391 391 396 400 409 409 410 411 413 413 413 414

Animationstechniken für Fortgeschrittene . . . . . . . . . . . . . . . . . . . . . . 21.1 Das Resultat zählt, nicht die Technologie . . . . . . . . . . . . . . . . . . Einfache Techniken – sparsam angewandt. . . . . . . . . . . . . . . . . Den Anwender täuschen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21.2 Das Anwenden herkömmlicher Techniken. . . . . . . . . . . . . . . . . Aufmerksamkeit und Spannungsaufbau (Antizipation) . . . . . . . Overkill – das Ende einer Animation . . . . . . . . . . . . . . . . . . . . . Tiefe simulieren . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Kontrolle der perspektivischen Ansichten . . . . . . . . . . . . . . . . . . Behalten Sie immer das Ende im Auge . . . . . . . . . . . . . . . . . . . 21.3 Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21.4 Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

417 418 419 420 421 421 424 425 430 432 432 433 433 433

Bonustag 1 Die Arbeit in Teams und an großen Projekten . . . . . . . . . . . . . . . . . .

435

B1.1 Methoden . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Rollenzuweisungen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Testen der Rollen und Strukturen. . . . . . . . . . . . . . . . . . . . . . . . Trennen von Programmiercode und Daten . . . . . . . . . . . . . . . .

436 436 437 437

Tag 20

20.2

20.3 20.4

Tag 21

13

Inhaltsverzeichnis

B1.2 Angewandte Techniken . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Gemeinsame Bibliotheken . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Komponenten . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Dokumentation und Namenskonventionen . . . . . . . . . . . . . . . . B1.3 Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

440 440 442 446 448 448 448 449

Bonustag 2 Die Flashkenntnisse vertiefen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . B2.1 Profitieren Sie von Beispiel-Dateien . . . . . . . . . . . . . . . . . . . . . . Dateien, die in Flash enthalten sind . . . . . . . . . . . . . . . . . . . . . . Online-Tutorials. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Wie man aus einer abgeschlossenen Arbeit lernt . . . . . . . . . . . . B2.2 Der Beginn eines umfangreichen Projektes . . . . . . . . . . . . . . . . Die Philosophie der kleinen Schritte . . . . . . . . . . . . . . . . . . . . . Schützen Sie sich vor Fehlern. . . . . . . . . . . . . . . . . . . . . . . . . . . Verlieben Sie sich nicht in Ihren Code – lernen Sie, ihn zu löschen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . B2.3 Man lernt niemals aus . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Software wird immer weiterentwickelt . . . . . . . . . . . . . . . . . . . . Auch die Praxis zählt . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Einfache Beispiele und Übungen, die Sie immer wieder brauchen können . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . B2.4 Fehler beheben (Debugging). . . . . . . . . . . . . . . . . . . . . . . . . . . . Traditionelle Methoden. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Verwendung des Debuggers . . . . . . . . . . . . . . . . . . . . . . . . . . . . B2.5 Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . B2.6 Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Übung. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

451 452 452 452 453 457 457 458

460 463 463 465 469 469 469 470 471

Bonustag 3 Die Flash-Anwendung publizieren . . . . . . . . . . . . . . . . . . . . . . . . . . . . B3.1 Wie publiziert man eine Seite? . . . . . . . . . . . . . . . . . . . . . . . . . . B3.2 Benannte Bildanker verwenden. . . . . . . . . . . . . . . . . . . . . . . . . . B3.3 Die Frage nach dem Medientyp . . . . . . . . . . . . . . . . . . . . . . . . . Flash (.swf) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . GIF, JPG und PNG . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Windows- und Macintosh-Projektor . . . . . . . . . . . . . . . . . . . . . . QuickTime. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

473 474 479 481 481 482 484 487 489

14

459 459 460 460

Inhaltsverzeichnis

B3.4 Der Export anderer Medientypen . . . . . . . . . . . . . . . . . . . . . . . . AVI . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Bitmap-Sequenzen. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . B3.5 Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . B3.6 Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . F&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Quiz . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

490 490 490 491 491 491 492

Anhang A

Figuren mit Auswahl, Andocken und den Ebenen . . . . . . . . . . . . . . . A.1 Halbkreis. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . A.2 Speichen in einem Rad . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . A.3 Fünfeckiger Stern. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . A.4 Ein räumlicher Würfel . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . A.5 Wellen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . A.6 3D-Kugel . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . A.7 Das Farbrad . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

493 494 497 501 506 508 510 512

Anhang B

Ressourcen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

515

B.1 B.2

Einführungen und Online-Ressourcen . . . . . . . . . . . . . . . . . . . . Seiten über Inhalte. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Audio- und Soundseiten . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Bilder und Fotos. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Schriftarten und Sonstiges . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Drittanbieter-Produkte . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Inspirierende Seiten . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Statistiken . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

516 517 518 518 519 519 520 520

Anhang C

Workshop-Auflösung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

521

Anhang D

Glossar. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

529

Anhang E

Auf der Buch-CD . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

535

Stichwortverzeichnis. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

537

B.3 B.4 B.5 B.6

15

Über den Autor Phillip Kerman ist selbstständiger Programmierer, Dozent und erfolgreicher Buchautor, der sich auf Macromedia-Produkte spezialisiert hat. Er machte seinen akademischen Abschluss in Medientechnik am »Rochester Institute of Technology«, zu einer Zeit, als »Multimedia« noch eine andere Bedeutung hatte als heute: Unter anderem löste er die Aufgabe, mehrere Diaprojektoren synchron zur Musik zu programmieren. Das war in achtziger Jahren. 1993 entdeckte er Macromedia Authorware als geeignetes Instrument für die Verwirklichung seiner Interessen. Nach einem Engagement bei »The Human Element, Inc.« ging er zurück nach Portland, Oregon, um sich dort selbstständig zu machen. Die Entwicklung von Flash begleitete er seit Beginn durch alle Versionswechsel, als Flash»Jünger« ist er weltweit unterwegs. Sie erreichen Phillip Kerman unter [email protected].

17

Vorwort Ein Web ohne Macromedia Flash ist nicht mehr denkbar: Fast eine halbe Milliarde Nutzer haben bereits den kostenlosen Flash Player installiert, der benötigt wird, um FlashFilme zu betrachten. Die Tools, die Sie benötigen um Flash-Filme zu erstellen, sind da. Nachdem Sie Flash gekauft haben, ist die einzige Investition, die Sie tätigen müssen, Ihre Zeit zum Lernen. Sie können Flash sogar von http://www.macromedia.com/de/ downloaden und 30 Tage lang testen, ohne es zu bezahlen. (Und noch bequemer: Eine Trial-Version finden Sie auch auf der beiliegenden Buch-CD.) Ich finde es aufregend, Leute dabei zu beobachten, wie Sie zuerst mit Flash herumspielen und später unterhaltsame Filme erstellen. Stellen Sie sich einen guten Musiker vor, der ein Instrument in die Hand näme und es innerhalb von Tagen erlernen könnte. Es ist wirklich verblüffend. Wenn Sie motiviert sind, werden Sie mit moderatem Zeitaufwand feststellen, was für ein mächtiges Medien-Tool Ihnen an die Hand gegeben wurde. Flash ist so einzigartig, dass man sagen kann: Je weniger Erfahrung Sie haben, umso besser! Wenn Sie schon jetzt eine Vorstellung haben, was Flash sein könnte, und Sie haben bisher Zeichenprogramme verwendet, ist es wahrscheinlich die beste Idee, alles, was Sie gelernt haben, wieder zu vergessen und neu anzufangen. Dieses Buch ist so aufgebaut, dass Sie sehr schnell Erfolge sehen werden. Mit jeder Aufgabe beweisen Sie sich selbst, dass Sie Wissen und Fähigkeiten dazugewonnen haben. Eigentlich brauche ich gar keine Aufmunterungsrede zu halten, da Sie es ab jetzt selbst erfahren können. Nach wenigen Lektionen werden Sie Zeichnungen erstellen, von denen Sie jetzt noch denken, dass Sie dafür nicht genug Talent haben. Einige Kapitel später werden Sie Animationen generieren, bis Sie schließlich nach der Lektüre dieses Buches unaufhaltsam sein werden. Davon bin ich fest überzeugt. Ich habe Hunderte von Schülern in Flash unterrichtet und immer haben auch diejenigen, die zuerst kein Feuer in den Augen hatten, die Kraft erkannt, die Flash ihnen gegeben hat und haben an ihren FlashFähigkeiten gefeilt. Wie weit Sie Ihre Fähigkeiten ausbauen, ist Ihre Sache, aber Sie werden sich hier eine großartige Grundlage schaffen. Sie werden sich vielleicht nicht über Nacht wie ein Profi fühlen, aber Sie haben ein mächtiges Medien-Tool unter Ihrer Kontrolle. Wenn Sie nicht mehr warten können, anderen Ihre Kreationen zu zeigen, sind Sie auf dem richtigen Weg. Machen Sie sich bereit, Spaß zu haben.

18

Vorwort

Feedback Wir wollen uns ständig verbessern. Bevor Sie das Buch wieder aus der Hand legen, bitten wir – Verlag und Übersetzer – Sie deshalb darum uns wissen zu lassen, was Sie an diesem Buch besonders mochten, was Sie anders gemacht hätten, welche Ihrer Fragen nicht beantwortet wurden oder wo Sie gar Fehler entdeckt haben. Schicken Sie Ihre Fragen, Ihre Anregungen und Ihre Kritik zur vorliegenden deutschsprachigen Ausgabe bitte an [email protected]. Vielen Dank dafür im Voraus – und nun viel Spaß und Erfolg mit Flash MX!

19

T ag 1

Grundlagen

23

T ag 2

Malen und Zeichnen

53

T ag 3

Grafiken in Flash importieren

89

T ag 4

Fortgeschrittene Zeichentechniken

115

T ag 5

Die Bibliothek produktiv einsetzen

137

T ag 6

Animationen verstehen

161

T ag 7

Animationen im herkömmlichen Stil

175

T ag 8

Animationen mit Bewegungstweening

191

T ag 9

Morphing mit Formtweening

205

Tag 10

Sound einbinden

219

Tag 11

Effektiv mit Ebenen

239

Tag 12

Filmsequenzen und Grafik-Symbole

259

Tag 13

Schaltflächen zum Anklicken für den Anwender erstellen

271

AktionScript verwenden, um nichtlineare Filme zu erzeugen

289

Tag 14

Tag 15

ActionScript für mehr Interaktivität

315

Tag 16

Komponenten verwenden

333

Tag 17

Videos einsetzen

349

Tag 18

Filme ins Internet bringen

363

Tag 19

Modulare Internetseiten entwerfen

373

Tag 20

Optimierung Ihrer Flash-Site

389

Tag 21

Animationstechniken für Fortgeschrittene

417

W O C H E

W O C H E

W O C H E

Grundlagen

s 1

Grundlagen

Die Flash-Umgebung sieht ziemlich einfach aus und es ist leicht, mit dem Zeichnen anzufangen und kleine Animationen zu erstellen. Allerdings reagiert Flash in manchen Situationen nicht so, wie Sie es vielleicht erwarten. Um sicherzugehen, dass Sie mit dem richtigen Fuß aufstehen, zahlt es sich aus, sich ein paar Grundlagen anzueignen. Obwohl Flash in mancher Hinsicht mit anderer Software vergleichbar ist, gibt es doch auch viele Unterschiede. Sowohl erfahrene Benutzer als auch Anfänger sollten die Grundlagen verstehen, die in diesem Kapitel vermittelt werden. In dieser Lektion werden Sie 쐽

sehen, wie einfach man zeichnen und einfache Animationen erstellen kann,

쐽

sich mit der Oberfläche von Flash vertraut machen,

쐽

Bedienfelder anordnen und lernen, wie man sie benutzt,

쐽

lernen, wie die neuen Bedienfelder ständig ihre Anzeigen aktualisieren, womit Ihnen wichtige Informationen angezeigt werden,

쐽

die Dateitypen kennen lernen, die Ihnen bei Flash begegnen. Bedienfelder sind eine Eigenart von Flash, die Ihnen die Möglichkeit gibt, die meisten Einstellungen zu betrachten und zu ändern, während Sie eine Datei bearbeiten. Das Eigenschaften-Bedienfeld ist wohl das Nützlichste, da es sich der jeweiligen Arbeitssituation anpasst. Wenn Sie z.B. gerade Text editieren, können Sie im Eigenschaften-Bedienfeld die Schriftart und -größe verändern.

1.1

Schnelleinstieg

Es ist möglich, das Erstellen von Animationen mit Flash in kürzester Zeit zu lernen. Auch wenn diese Übung längst nicht alles behandeln wird, was es zu lernen gibt, werden Sie sehen, dass man den Stein ganz schnell ins Rollen bringen kann.

Übung: Erstellen Sie eine Animation in 30 Sekunden Folgen Sie diesen Schritten, um zu beweisen, dass man mit Flash MX in Windeseile Animationen erstellen kann: 1. Öffnen Sie Flash MX und stellen Sie sicher, dass Sie ein großes weißes Rechteck in der Mitte des Bildschirmes sehen (man nennt es »Bühne«). Sollten Sie das Rechteck nicht sehen, wählen Sie einfach DATEI / NEU.

24

Schnelleinstieg

2. Drücken Sie nun (R), um das Rechteck-Werkzeug auszuwählen. (Sie können beobachten, dass das Rechteck-Werkzeug auch im Werkzeug-Bedienfeld am rechten Bildschirmrand ausgewählt wird.) 3. Klicken Sie in der linken Seite der Bühne und ziehen Sie die Maus bei gedrückter linker Maustaste, um ein mittelgroßes Rechteck zu zeichnen. So soll unsere Animation beginnen. 4. Stellen Sie sicher, dass das Zeitleiste-Bedienfeld sichtbar ist (wählen Sie FENSTER / ZEITLEISTE, wenn das nicht der Fall ist). Die Bilder in der Zeitleiste sind nummeriert. Klicken Sie bitte auf Bild 20. Drücken Sie nun (F7), um ein leeres Schlüsselbild einzufügen. Hier legen Sie gleich fest, wie die Animation bei Bild 20 aussehen soll (siehe Abbildung 1.1).

Abbildung 1.1: Nach Auswahl von Bild 20 können Sie ein leeres Schlüsselbild erstellen, indem Sie (F7) drücken.

5. Drücken Sie nun (O), um das Ellipse-Werkzeug auszuwählen. Zeichnen Sie dann auf der rechten Seite der Bühne eine mittelgroße Ellipse. 6. Springen Sie nun wieder in das erste Bild, indem Sie auf das Rechteck mit dem Kreis unterhalb der Ziffer »1« in der Zeitleiste klicken. 7. Stellen Sie sicher, dass das Eigenschaften-Bedienfeld sichtbar ist. (Sollte das nicht der Fall sein, können Sie es über FENSTER / EIGENSCHAFTEN öffnen.) Da das Eigenschaften-Bedienfeld immer Informationen über den aktuellen Arbeitsprozess anzeigt, sollten Sie darin die Eigenschaften des ersten Bildes sehen (weil Sie zuletzt darauf geklickt haben). Sollte das Eigenschaften-Bedienfeld nicht wie in Abbildung 1.2

25

Grundlagen

aussehen, klicken Sie bitte erneut auf das Rechteck mit dem Kreis unter der »1« in der Zeitleiste. Abschließend brauchen Sie dort nur noch den Eintrag Form aus dem TWEEN-Drop-Down-Menü auswählen und Sie haben es geschafft. Abbildung 1.2: So sieht das Eigenschaften-Bedienfeld nach Auswahl des Bildes aus.

8. Wenn Sie die Animation nun betrachten möchten, drücken Sie einfach (Enter). Wenn Sie einen Macintosh verwenden, werden Sie sich darüber freuen, dass die Macintosh- und die Windows-Version von Flash fast identisch sind. Allerdings sind Macintosh- und Windows-Tastaturen leicht unterschiedlich. Verwenden Sie einfach die folgende Legende, um die Tastaturbefehle zu übersetzen: Wenn Windows diese Taste verwendet:

Dann verwendet der Macintosh diese:

(Strg)

Taste mit dem Apple-Symbol

(Alt)

(MacOpt)

rechter Mausklick

(MacBef) + Mausklick

Tabelle 1.1: Übersetzung der Windows-Tasten für den Macintosh

Wenn Sie also unter Windows (Alt)+(X) drücken sollen, betätigen Sie beim Macintosh (MacOpt)+(X). Die Funktionstasten (zum Beispiel (F8)) sind bei beiden Systemen gleich. Wenn Sie eine Maus von einem Drittanbieter verwenden, die auch eine rechte Maustaste besitzt, müssen Sie diese erst programmieren, um die (MacBef)-Taste zu vermeiden. Selbstverständlich werden Sie noch viel mehr über Animationen erfahren, aber es ist doch erstaunlich, wie einfach die zuletzt erstellte war, oder? Das ist auch der Grund, warum Flash so fesselnd ist: Man sieht sehr schnell Erfolge. Allerdings wird man leicht verleitet abzuschweifen und das Lernen der Grundlagen zu vernachlässigen. Dieses Buch beschränkt sich nur auf die wichtigsten Features, damit Sie selbst an Ihren Herausforderungen wachsen können. Und keine Sorge — es wird Ihnen Spaß machen und Sie investieren Ihre Zeit klug, wenn Sie den Basics etwas Aufmerksamkeit widmen.

26

Ein Überblick

1.2

Ein Überblick

Der Schlüssel zum Verständnis von Flash ist, immer zu wissen, »wo Sie sind«. Ihnen wird die Möglichkeit gegeben, alles zu bearbeiten: statische Grafiken, Animationen, Schaltflächen und mehr. Sie sollten sich zu jeder Zeit bewusst sein, was Sie gerade bearbeiten. Es kann leicht passieren, dass Sie die Orientierung verlieren und nicht wissen, welches Element gerade verändert wird. Dieser Abschnitt wird Ihnen zeigen, wie Sie sich am Besten orientieren. Lassen Sie uns eine kleine Reise über die Flash-Arbeitsoberfläche machen: 쐽

Die Bühne ist Ihr sichtbarer Arbeitsbereich. Jede Grafik, die in diesem Bereich platziert wird, ist für den Anwender sichtbar.

쐽

Das Werkzeug-Bedienfeld (auch »Werkzeugkasten« genannt) enthält alle (und es gibt viele) Zeichengeräte von Flash. Diese werden im nächsten Kapitel näher beschrieben.

쐽

Die Zeitleiste enthält die Verkettung von Bildern, die eine Animation ausmachen. Die Zeitleiste kann auch aus mehreren Animationsebenen bestehen. Auf diese Weise können bestimmte Grafiken über oder unter anderen erscheinen und Sie können mehrere Animationen zur gleichen Zeit ablaufen lassen.

쐽

Bedienfelder sind an andere Bedienfelder angedockt und befinden sich außerhalb der Bühne (darum verteilt). Alternativ können Sie die Bedienfelder abdocken, damit sie über allem anderen »schweben«. Mann kann sogar mehrere solcher schwebenden Bedienfelder zusammendocken. Generell kann man also die Bedienfelder so anordnen, dass sie den eigenen Arbeitsstil unterstützen. Der Ausdruck Anwender bezeichnet die Person, die Ihren Film betrachtet oder Ihre Internetseite besucht. In diesem Buch werde ich mich sehr oft auf den Anwender beziehen. Manchmal werde ich den Anwender auch das Publikum oder den Betrachter nennen. Es ist wirklich egal, welchen Ausdruck Sie verwenden. Wichtig ist nur der Unterschied zwischen Ihnen (dem Autor, Entwickler, Designer) und dem Anwender (oder Publikum, Betrachter oder wie auch immer Sie ihn bezeichnen wollen). Als Autor können Sie den Flash-Film bearbeiten, wohingegen der Anwender den Film nur betrachten und gegebenenfalls mit ihm interagieren kann.

Die Bühne Das große weiße Rechteck in der Mitte des Flash-Oberfläche wird Bühne genannt. Text, Grafiken, Fotos, einfach alles, was der Anwender sehen soll, wird auf der Bühne angezeigt. (siehe Abbildung 1.3).

27

Grundlagen

Abbildung 1.3: Die Bühne ist die große weiße Fläche in der Mitte. Hier werden alle sichtbaren Elemente Ihrer Animation angezeigt.

Stellen Sie sich die Bühne als Leinwand vor, auf die ein Maler einen Rahmen malt, in dem ein Fotograf Bilder anbringt. Manchmal wollen Sie eine Grafik-Animation außerhalb der Bühne starten lassen, um sie dann auf die Bühne zu bewegen. »Außerhalb der Bühne« ist der graue Bereich, der die weiße Fläche umrandet. Sie können diesen Bereich nur sehen, wenn im Menü ANSICHT der Punkt ARBEITSBEREICH aktiviert ist. (Wenn Sie diesen Punkt anklicken, wechselt dessen Status zwischen aktiviert und deaktiviert.) Sie sollten die Standardeinstellung (ARBEITSBEREICH ist aktiviert) bevorzugen, da Sie nur so Grafiken außerhalb der Bühne platzieren können. Bitte bedenken Sie, dass die Einstellungen, die Sie im Menü ANSICHT vornehmen, nur das beeinflussen, was Sie sehen. Der Betrachter wird allerdings noch immer genau den gleichen Film sehen. Es gibt nicht allzu viel über die Bühne zu lernen – sie ist ganz einfach Ihr sichtbarer Arbeitsbereich. Allerdings gibt es zwei wichtige Konzepte, die eine nähere Betrachtung wert sind: die Bühnengröße und der Skalierungsfaktor. Standardmäßig ist die Bühne ein Rechteck mit einer Breite von 550 Bildpunkten und einer Höhe von 400 Bildpunkten. Später in diesem Kapitel werden Sie lernen, wie man die Breite und die Höhe eines Filmes verändert (in dem Unterkapitel »Dokumenteigenschaften«). Die Angaben in Bildpunkten sind nicht so wichtig wie die damit erzielte Form der Bühne (Breiten-Höhen-Relation). Die Anzahl der Bildpunkte spielt keine Rolle, denn sobald Sie den Film veröffentlichen, können Sie einen Flash-Maßstab in einer beliebigen Pixelgröße angeben.

28

Ein Überblick

Die Breiten-Höhen-Relation ist das Verhältnis zwischen Breite und Höhe. Jedes Quadrat oder Rechteck besitzt eine solche Breiten-Höhen-Relation. Zum Beispiel hat ein normaler Fernseher eine Breiten-Höhen-Relation von 4:3, wobei es egal ist, wie groß Ihr Fernseher ist. Er ist immer drei Einheiten hoch und vier Einheiten breit (OK, es gibt inzwischen neuere Geräte, die mit einem 16:9-Format arbeiten). Auch im Computerbereich wird fast immer das Verhältnis 4:3 verwendet, denn die gängigsten Bildschirmauflösungen sind 640 x 480, 800 x 600 und 1.024 x 768. Sie können natürlich eine beliebige Breiten-Höhen-Relation für Ihre Internetseite wählen; bedenken Sie nur, dass ungenutzter Platz auf dem Bildschirm frei bleibt. Ein Breitbild-Format (z.B. 16:9) wird einen ganz anderen Effekt erzielen als ein quadratisches 1:1-Format. Skalieren nennt man das Anpassen der Größe an individuelle Bedürfnisse. Ein Flash-Film behält seine Breiten-Höhen-Relation, wenn er skaliert wird. Er wird also nicht verzerrt. Sie können zum Beispiel festlegen, dass der Film zu 100% an die Größe des Browserfensters des Anwenders angepasst wird. Es ist genauso möglich, einen Film in der Größe 100 x 100 zu erstellen und auf 400 x 400 zu vergrößern. Sie können Ihren Flash-Film nicht nur in jeder beliebigen Größe bereitstellen (da Flash sehr gut skaliert), sondern beim Arbeiten in Flash auch einen bestimmten Bereich der Bühne vergrößern, um einen bestimmten Effekt genauer unter die Lupe nehmen zu können als in der aktuellen Größe. Versuchen Sie sich einmal an der folgenden Übung, in der ich einige wichtige Werkzeuge einführen werde, die für die Bühne von Bedeutung sind.

Übung: Ändern Sie die Ansicht der Bühne 1. Öffnen Sie Flash. Sie werden ein leeres, ungespeichertes Dokument erhalten, das Unbenannt-1 heißt. 2. Anstatt bei Null anzufangen, werden wir eine existierende Datei öffnen. Wählen Sie DATEI / ÖFFNEN und suchen Sie bitte die Datei Stiletto.fla, die sich in Ihrem FlashOrdner unter Tutorials/FlashIntro befindet. Der komplette Pfad lautet also bei einer Standardinstallation: C:\Programme\Macromedia\Flash MX\Tutorials\FlashIntro. 3. Bitte beachten Sie die Anzeige der Vergrößerungsstufe am oberen Rand der Bühne (siehe Abbildung 1.4). Dieses Steuerelement ist eine Möglichkeit, um die aktuelle Ansicht zu verändern. Andere Möglichkeiten sind das Menü ANSICHT / VERGRÖßERN und das Vergrößerungs-Werkzeug (der Knopf mit der Lupe in der Ansicht-Werkzeugleiste), welches wir im nächsten Kapitel noch näher kennen lernen werden.

29

Grundlagen

Abbildung 1.4: Mit dem Vergrößerungs-Steuerelement können Sie die Bühne vergrößern oder verkleinern. Das hat allerdings keine Auswirkung auf das Erscheinungsbild für das Publikum.

4. Vergrößern Sie die Ansicht auf 400%. Wie Sie sehen, hat sich alles vergrößert. Der Film an sich hat sich dabei jedoch nicht verändert. 5. Wahrscheinlich können Sie nun nicht mehr die gesamte Bühne sehen (es sei denn, Sie haben einen riesigen Monitor). Allerdings können Sie die anderen Teile der Bühne auf zwei Arten betrachten: Einerseits können Sie die normalen Bildlaufleisten am rechten und unteren Fensterrand bewegen, andererseits können Sie aber auch das Handwerkzeug verwenden. Dieses können Sie am besten aufrufen, indem Sie (____) gedrückt halten. Versuchen Sie es einmal und klicken Sie (während Sie (____) gedrückt halten) auf die Bühne und bewegen dann die Maus bei gedrückter Maustaste. Sie bewegen sich nun zu anderen Teilen der Bühne, ohne irgendetwas zu verändern. Sie verändern mit dem Handwerkzeug also lediglich den für Sie sichtbaren Ausschnitt der Bühne. Das Schöne an dieser Aktion ist, dass Sie über die (____)-Taste das Werkzeug genau so lange verwenden können, bis Sie die Taste wieder loslassen. Wir werden im nächsten Kapitel weitere Werkzeuge kennen lernen, die man auf die gleiche Weise ansprechen kann. 6. Stellen Sie das Vergrößerungs-Steuerelement nun auf Alles zeigen ein. Flash wird nun die Bühne so verkleinern, dass Sie wieder alles im Blick haben, egal welche Bildschirmauflösung Sie verwenden. 7. Zwei weitere interessante Werkzeuge stehen im ANSICHT-Menü zur Verfügung: Das Gitternetz (Raster) und die Hilfslinien. Wählen Sie ANSICHT / RASTER / RASTER EINBLENDEN. Es erscheint nun das Gitternetz hinter allen Grafiken, die sich auf der Bühne befinden (siehe Abbildung 1.5). Diese Linien kann der Betrachter später natür-

30

Ein Überblick

lich nicht sehen. Im nächsten Kapitel werden Sie lernen, wie Ihnen das Gitternetz bei der perfekten Ausrichtung von Grafiken behilflich sein kann. Unter ANSICHT / RASTER / GITTERNETZ BEARBEITEN können Sie die Farbe und die Abstände der Linien verändern. Schalten Sie nun das Netz wieder aus, indem Sie ANSICHT / RASTER / RASTER EINBLENDEN wählen und so diese Option wieder deaktivieren.

Abbildung 1.5: Wenn Sie das Gitternetz einschalten, können Sie Objekte besser ausrichten.

8. Hilfslinien sind mit dem Gitternetz vergleichbar, allerdings muss man sie an die richtige Stelle ziehen. Zuerst aktivieren Sie ANSICHT / LINEALE. Nun können Sie auf eines der beiden Lineale klicken und eine Hilfslinie auf die Bühne ziehen (siehe Abbildung 1.6). Über das linke Lineal erzeugen Sie vertikale Hilfslinien und mit dem oberen Lineal lassen sich horizontale Linien generieren. Wenn Sie eine Hilfslinie löschen wollen, ziehen Sie diese einfach wieder auf das Lineal zurück (bitte wählen Sie zuvor gegebenenfalls das Pfeil-Werkzeug aus). Wie zuvor bei den Gitternetzlinien finden Sie unter ANSICHT / HILFSLINIEN / HILFSLINIEN BEARBEITEN die Einstellmöglichkeit für die Farbe. Zusätzlich können Sie die Linien festhalten (HILFSLINIEN SPERREN), um ein versehentliches Verschieben zu verhindern. 9. Schließen Sie nun diese Datei, ohne sie zu speichern.

31

Grundlagen

Abbildung 1.6: Hilfslinien sind mit den Gitternetzlinien vergleichbar. Allerdings können Sie diese frei platzieren.

Der Werkzeugkasten Das Werkzeug-Bedienfeld ist wohl das Bedienfeld, mit dem Sie am vertrautesten werden dürften. Jedes Mal, wenn Sie etwas auf der Bühne zeichnen oder auswählen möchten, müssen Sie ein Werkzeug aus diesem Bedienfeld auswählen. Wie viele andere Bedienfelder, ist auch das Werkzeug-Bedienfeld andockbar. Die Standardposition ist links neben der Bühne. Man verwendet die Werkzeugkiste hauptsächlich, um auf der Bühne zu zeichnen, aber auch um bereits Gezeichnetes zu bearbeiten. Wir werden noch sehen, dass sie sich in mehrere Sektionen unterteilt: Werkzeuge, Ansicht, Farben und Optionen (siehe Abbildung 1.7). Der Abschnitt Werkzeuge befähigt uns, Grafiken und Texte zu erstellen (Linien- und TextWerkzeug), Grafiken zu bearbeiten (Radiergummi- und Farbeimer-Werkzeuge) und Grafiken auszuwählen (Pfeil-, Lasso- und Unterauswahl-Werkzeuge). All diese Werkzeuge werden wir im nächsten Kapitel genauer besprechen. Im Ansicht-Abschnitt kann man die Ansicht der Bühne verändern (wie wir das schon in der letzten Übung durchgeführt haben). Im Abschnitt Farben kann man die Farbe bei gezeichneten Objekten beeinflussen. Und im Optionen-Feld erhält man bei gewissen Werkzeugen weiterführende Einstellmöglichkeiten. Je nach Werkzeug kann dieser Abschnitt auch leer bleiben. In den Kapiteln 2 und 4 werden wir noch genauer auf Einzelheiten der Werkzeuge eingehen. Zu diesem Zeitpunkt sollten Sie erst einmal weiterlesen und ein wenig mit den Werkzeugen spielen. Sie müssen aber sicher sein, dass Sie verstanden haben, wie man Symbolleisten verbindet und was in etwa das Einsatzgebiet jedes Werkzeuges ist.

32

Ein Überblick

Abbildung 1.7: Die Werkzeugkiste bietet Hilfsmittel zum Zeichnen, Editieren, Betrachten und Optionen, die je nach aktiviertem Werkzeug variieren.

Die Zeitleiste Wir werden uns mit der Zeitleiste im Detail in Kapitel 7 auseinandersetzen. Trotzdem möchte ich Ihnen einen kurzen Überblick geben. Die Zeitleiste beinhaltet eine Sequenz von Einzelbildern, welche die Animation ausmachen. Wenn der Anwender Ihre Animation betrachtet, sieht er Bild 1 gefolgt von Bild 2 und so weiter. Denken Sie sich einfach einen konventionellen Film, dessen einzelne Bilder Sie horizontal nebeneinander angeordnet auf den Bildschirm gelegt haben (der Anfang ist links und das Ende rechts). Wie viele andere Fenster ist auch die Zeitleiste ankoppelbar (siehe Abbildung 1.8). Das Ankoppeln ist eine weitere Art, den Arbeitsbereich zu organisieren. Wenn Sie wollen, können Sie die Zeitleiste unter der Bühne, oder wo immer Sie wollen, ankoppeln. Wenn Sie zwei Monitore an Ihrem Computer angeschlossen haben, können Sie noch flexibler mit Ihrem Arbeitsbereich umgehen. Ich persönlich kopple die Zeitleiste gerne oberhalb der Bühne und die Werkzeugkiste an der linken Seite an. Diese Anordnung werde ich bei den meisten Bildern dieses Buches verwenden. Wenn Sie die Zeitleiste schließen um mehr Platz zu schaffen (nur im abgekoppelten Modus verfügbar), können Sie diese unter FENSTER / ZEITLEISTE wieder sichtbar machen.

33

Grundlagen

Abbildung 1.8: Die Zeitleiste (und andere Bedienfelder) können ausgekoppelt und wie jedes andere Fenster verschoben werden. Sie können natürlich auch wieder an ihre originalen Positionen »angekoppelt« werden. So können Sie Ihre Arbeitsoberfläche ganz einfach organisieren.

Wenn Sie anfangen, Animationen zu entwerfen, zeigt Ihnen die Zeitleiste einige Hinweise an. Beispielsweise können Sie ganz einfach die Länge einer Animation bestimmen, indem Sie einen Blick auf die Zeitleiste werfen. Außerdem verwendet Flash in der Zeitleiste einige Icons und Farben, die Ihnen sofort verraten, wie die Animation ablaufen wird. Zusätzlich zu den Bildern stellt Ihnen Flash so viele Ebenen zur Verfügung, wie Sie wollen. Diese verhalten sich genau so wie in anderen Grafikprogrammen, denn alle Objekte, die in einer bestimmten Ebene gezeichnet wurden, erscheinen ober- oder unterhalb der Objekte anderer Ebenen (je nachdem wo die aktuelle Ebene angeordnet ist). Jede Ebene enthält eine unterschiedliche Animation (sicherlich haben Sie im Beispiel »Stiletto« schon gesehen, dass dort viele unterschiedliche Ebenen eingetragen sind). Auf diese Weise können mehrere verschiedene Animationen zur gleichen Zeit ablaufen. Sie können sehr komplexe Animationen erstellen, indem Sie die Ebenen benennen und gegebenenfalls Effekte (wie zum Beispiel die Maskierung) verwenden. Abbildung 1.9 zeigt die Zeitleiste und die Ebenen eines fertigen Filmes. Zu diesem Thema werden Sie aber in Kapitel 11 noch mehr erfahren.

34

Das Eigenschaften-Bedienfeld

Abbildung 1.9: Die meisten Animationen verwenden mehrere Ebenen. Jede Ebene ist unabhängig von den anderen.

1.3

Das Eigenschaften-Bedienfeld

Natürlich werden Sie es in Flash mit mehr Fenstern als der Bühne, den Symbolleisten und der Zeitleiste zu tun bekommen (obwohl dies die wichtigsten sind). In diesem Abschnitt werden wir uns deshalb mit dem Eigenschaften-Bedienfeld auseinandersetzen. Alle Bedienfelder ermöglichen es Ihnen, Eigenschaften von Objekten zu betrachten und zu verändern. Auch wenn Sie fast zwei Dutzend unterschiedliche Bedienfelder im FENSTER-Menü finden können, werden Sie hauptsächlich ein einziges verwenden – das Eigenschaften-Bedienfeld. Hier werden die Eigenschaften des aktuell ausgewählten Elements angezeigt, damit Sie Veränderungen vornehmen können. Wenn Sie beispielsweise einen Text auswählen, können Sie im Eigenschaften-Bedienfeld die Schriftart und -größe ansehen und verändern. Sollten Sie aber eine Form auswählen, können Sie z.B. die Füllfarbe dieses Objekts kontrollieren. Das Eigenschaften-Bedienfeld ist eine Neuerung in Flash MX. Früher gab es für jede Objekt-Art ein eigenes Bedienfeld. Mit diesem multifunktionellen Bedienfeld wird das Arbeiten allerdings viel einfacher und intuitiver. Obwohl wir in diesem Kapitel nur das Eigenschaften-Bedienfeld betrachten werden, kennen Sie sich am Ende bestimmt schon ganz gut mit den noch folgenden aus (im FENSTER-Menü finden Sie eine komplette Liste). Da es eine solche Vielzahl von Bedienfeldern gibt, werden Sie später noch erfahren, wie man sie so organisiert, dass Sie ordentlich auf die Arbeitsoberfläche passen.

35

Grundlagen

Sie werden sehen, dass die Bedienung dieser Komponenten sehr einfach ist. Bedienfelder funktionieren auf eine sehr spezielle Art und Weise. Wenn Sie ein Bedienfeld geöffnet haben, obwohl keine Objekte markiert sind, wirken sich Veränderungen in diesem Feld nicht aus. Wenn Sie also Objekte verändern wollen, müssen Sie diese zuerst auswählen. Soll beispielsweise die Schriftgröße eines Textes verändern werden, wählen Sie den Text aus und ändern Sie die Optionen im Eigenschaften-Bedienfeld. Wichtig ist, dass der Text ausgewählt bleibt, wenn Sie das Bedienfeld öffnen. Sie können auch mehrere Objekte gleichzeitig verändern, wenn Sie diese gleichzeitig auswählen und dann das entsprechende Bedienfeld öffnen. Dies werden wir in den folgenden Übungen näher betrachten. Abschließend sei gesagt, dass man auch Änderungen vornehmen kann, wenn man nichts ausgewählt hat. Auch wenn es auf den ersten Blick keine Auswirkung zu haben scheint, beeinflussen Sie das Erscheinungsbild eines Objekttyps, wenn Sie das nächste Mal ein entsprechendes Objekt zeichnen. Wenn Sie beispielsweise die Schriftart ändern, ohne Text ausgewählt zu haben, erhalten nachher alle neuen Texte in dieser Schriftart.

Übung: Verwenden Sie das Eigenschaften-Bedienfeld, um Farben zu betrachten und zu verändern Während dieser Übung werden Sie das Eigenschaften-Bedienfeld dazu verwenden, die Füllfarben von Objekten anzuzeigen und zu verändern. Folgen Sie einfach diesen Schritten: 1. Erstellen Sie eine neue Datei (DATEI / NEU). Stellen Sie sicher, dass das Eigenschaften-Bedienfeld geöffnet ist (die Standardposition ist unterhalb der Bühne). Sollte es nicht sichtbar sein, öffnen Sie es mit FENSTER / EIGENSCHAFTEN. Vergrößern Sie das Bedienfeld auf die volle Größe, indem Sie auf den Pfeil unten rechts in der Ecke des Eigenschaften-Bedienfeldes klicken (siehe Abbildung 1.10). Abbildung 1.10: Klicken Sie auf den Pfeil unten rechts, um das Eigenschaften-Bedienfeld in voller Größe anzuzeigen.

2. Betrachten Sie nun die Informationen, die Ihnen im Eigenschaften-Bedienfeld angezeigt werden (Größe, Hintergrund, Bildrate, usw.). Das Bedienfeld wird sich jetzt gleich verändern. 3. Wählen Sie das Pinselwerkzeug aus dem Werkzeug-Bedienfeld aus (falls das nicht sichtbar sein sollte, wählen Sie FENSTER / WERKZEUGE). Wie Sie sehen, reicht es aus, das Pinselwerkzeug zu wählen, um eine Änderung im Eigenschaften-Bedienfeld zu erzwingen. Zeichnen Sie nun eine geschwungene Linie auf die Bühne.

36

Das Eigenschaften-Bedienfeld

4. Bevor Sie nun fortfahren, wählen Sie mit dem Füllfarben-Feld im EigenschaftenBedienfeld eine neue Farbe aus (siehe Abbildung 1.11). Damit legen Sie fest, mit welcher Farbe Sie von nun an zeichnen möchten.

Abbildung 1.11: Bevor Sie erneut zeichnen, können Sie eine andere Farbe auswählen.

5. Zeichnen Sie nun eine weitere geschwungene Linie (in der neuen Farbe) auf einem freien Bereich der Bühne. Wählen Sie nun das Pfeilwerkzeug aus (indem Sie auf den schwarzen Pfeil im Werkzeugkasten klicken, oder einfach (V) drücken). 6. Klicken Sie nun einmal auf die erste Linie, um sie auszuwählen. Beachten Sie, dass sich das Eigenschaften-Bedienfeld erneut verändert. Es erscheinen zusätzliche Informationen über die Größe und die Koordinaten der Figur. Ändern Sie nun erneut die Füllfarbe, während die Linie noch ausgewählt ist. (Nebenbei bemerkt: Die Linienfarbe im Eigenschaften-Bedienfeld, die momentan ein weißes, durchgestrichenes Feld – keine Farbe – zeigt, wird für Figuren verwendet, die mit dem Stiftwerkzeug gezeichnet wurden.) Das Koordinatensystem besitzt in allen Multimedia-Werkzeugen (und so auch in Flash) die X-Achse (horizontal) und die Y-Achse (vertikal). Die Ecke oben links auf dem Bildschirm (oder der Bühne) hat die Werte 0x, 0y. Wenn man sich weiter nach rechts bewegt, steigt die X-Koordinate an. Geht man beispielsweise 100 Bildpunkte nach rechts, befindet man sich an der Position 100x, 0y. Bewegt man sich nach unten, erhöht sich die Y-Koordinate. Die Ecke unten links auf einem 800 x 600-Bildschirm hat die Position 0x, 600y. Merken Sie sich nur, dass die Y-Koordinate ansteigt, wenn man sich nach unten bewegt (nicht

37

Grundlagen

nach oben, wie man erwarten könnte). Eine interessante Frage, die dabei auftaucht, ist: Was passiert, wenn man die Position eines Objektes auf -1000x setzt? Das Objekt wird in den Außenbereich der Bühne um 1.000 Pixel nach links bewegt. 7. Abschließend können wir nun beiden Linien die gleiche Farbe zuordnen. Markieren Sie eine der beiden Linien und klicken Sie auf das Füllfarbenfeld im EigenschaftenBedienfeld. Während der Cursor wie eine Pipette aussieht, können Sie nun die Farbe der anderen Linie auswählen, indem Sie mit der Pipette darauf klicken. Dies ist eine von vielen Stellen, an denen sich der Cursor verändert, um uns einen Hinweis zu geben, was beim Klicken passiert.

Text-Optionen erkunden In Flash MX wurden einige wirklich mächtige Textoptionen neu hinzugefügt. Aktivieren Sie bitte das Textwerkzeug (Das A im Werkzeug-Bedienfeld), und klicken Sie dann irgendwo auf die Bühne. Schreiben Sie ein bisschen Text und wählen Sie das Pfeilwerkzeug, wenn Sie mit dem Schreiben fertig sind. Nun können Sie im EigenschaftenBedienfeld viele Texteigenschaften (Schriftart, -größe, -farbe, -format, usw.) verändern. Nebenbei: Die Format-Schaltfläche öffnet ein Fenster, in dem Sie weitere Angaben zu den Texträndern machen können. Wir werden uns mit diesen Optionen im nächsten Kapitel noch genauer beschäftigen.

Bedienfelder in Gruppen organisieren An dieser Stelle haben Sie wahrscheinlich viel ausprobiert. Deshalb sind Ihre Bedienfelder vielleicht kreuz und quer über den Bildschirm verteilt. Das bringt uns zu einem weiteren Punkt: Ihnen wird eine Menge Freiheit eingeräumt, wie Sie Ihre Bedienfelder organisieren dürfen. Sie können sie nach Belieben gruppieren und wieder trennen. Dahinter steckt die Idee, dass Sie Bedienfelder so anpassen können, wie Sie für Ihren Arbeitsstil am geeignetsten sind. Damit Sie einen Überblick bekommen, welche Zusammenstellungen möglich und sinnvoll sind, betrachten Sie doch einmal die vordefinierten Sätze unter FENSTER / BEDIENFELDSÄTZE. Je nachdem, welche Bildschirmauflösung Sie verwenden, kann es sein, dass Sie sich von den Bedienfeldern gestört fühlen, da sie zu viel von der Bühne verdecken. Drücken Sie einfach die Taste (ÿ), um alle Bedienfelder vorübergehend zu schließen. Drücken Sie erneut auf (ÿ), um diese wieder zu öffnen.

38

Das Eigenschaften-Bedienfeld

Sie können jederzeit die »Fabrik-Einstellungen« der Bedienfelder wiederherstellen, indem Sie auf FENSTER / BEDIENFELDSÄTZE / STANDARDLAYOUT klicken. Wenn Sie eine Zusammenstellung gefunden haben, mit der Sie sehr gut arbeiten können, speichern Sie diese ab. Positionieren Sie die Bedienfelder dafür ganz einfach so, wie Sie es wollen und wählen Sie FENSTER / BEDIENFELDER-LAYOUT SPEICHERN. Sie werden nun aufgefordert, einen Namen für diese Anordnung einzugeben. Der Name, den Sie wählen, erscheint im Menü FENSTER / BEDIENFELDSÄTZE. Das Anordnen von Bedienfeldern kann frustrierend werden, wenn man die Grundlagen nicht beherrscht, da es sich dabei nicht um einen üblichen Computerstandard handelt. In der folgenden Übersicht werden Ihnen die Elemente von Bedienfeldern (siehe Abbildung 1.12) nähergebracht.

Abbildung 1.12: Ein Bedienfeld mit seinen Komponenten

Zuerst einmal gibt es in jedem Bedienfeld ein Options-Menü oben rechts in der grauen Titelleiste. Hier findet man zusätzliche Optionen, die sich auf das jeweilige Bedienfeld beziehen. Jedes Bedienfeld lässt sich verkleinern und wieder vergrößern, indem man auf die graue Titelleiste klickt. Wenn mehrere Bedienfelder zusammengekoppelt sind, kann man so Platz für andere Bedienfelder schaffen. Wenn ein Bedienfeld »schwebt«, kann man es per Doppelklick auf die obere blaue Titelleiste komplett verkleinern. Abgekoppelte Bedienfelder kann man verschieben, indem man auf die obere (blaue) Titelleiste klickt und bei gedrückter Maustaste die Maus bewegt. Zum Abkoppeln eines Bedienfeldes ziehen Sie einfach am geriffelten Anfasser. Wenn Sie ein abgekoppeltes Bedienfeld wieder in die Nähe eines anderen Bedienfeldes lenken, wird es dort wieder angekoppelt. So kann man auch zwei abgekoppelte Bedienfelder untereinander verbinden, um eine schwebende Gruppe zu erzeugen. Dann gibt es für die gesamte Gruppe nur eine obere (blaue) Titelleiste, mit der man die Gruppe verschieben kann. Hier befindet sich übrigens auch ein Knopf, um das Bedienfeld (oder die Gruppe) zu schließen. Abschließend sei gesagt, dass

39

Grundlagen

das Farbmischer-Bedienfeld (genauso wie das Eigenschaften-Bedienfeld) über einen Pfeil in der unteren rechten Ecke verfügt, mit dem man weitere Optionen ein- und ausblenden kann. Sicherlich wird es ein wenig Zeit in Anspruch nehmen, um sich an das Verhalten von Bedienfeldern zu gewöhnen, aber mit ein wenig Übung werden Sie die Handhabung im Griff haben.

Die Bibliothek Die Bibliothek ist der beste Ablageplatz für alle Medienelemente, die Sie in Ihrer FlashDatei verwenden. Es gibt eine Menge Gründe, warum Sie die Bibliothek später wahrscheinlich lieben werden (weitere Details sehen wir in Kapitel 5). Medien, die in der Bibliothek platziert wurden, können Sie immer und immer wieder in Ihrer Datei verwenden. Unabhängig davon, wie oft Sie dieses Medium verwenden, wird die Dateigröße Ihrer Flash-Animation nicht steigen! Wenn Sie beispielsweise die Zeichnung einer Wolke in Ihrer Bibliothek ablegen, können Sie 100 Kopien dieser Wolke auf die Bühne bringen (um z.B. einen Himmel voller Wolken zu simulieren), aber in Ihrer Flash-Datei befindet sich in Wirklichkeit nur eine einzige Wolke. Die Verwendung der Bibliothek ist ein Grund, warum Flash-Filme so klein bleiben. In der Praxis wird die Bibliothek auf zwei Arten verwendet: Zum Editieren und zum Verwalten (bzw. Ansprechen) der Bibliotheksinhalte. Es kann sein, dass Sie den Inhalt eines Bibliothek-Objekts (Symbol genannt) editieren müssen, womit Sie den Inhalt der Bibliothek verändern werden. Es kann genauso gut sein, dass Sie die Bibliothek nur dazu verwenden, um die Instanzen Ihrer Symbole im Film zu ordnen. In diesem Fall verwalten Sie die Bibliothek lediglich (statt sie zu editieren). Ein Symbol ist der Name für ein Objekt, das Sie erschaffen und in Ihrer Bibliothek ablegen (meist ein sichtbares Objekt, wie zum Beispiel eine Grafik). Allerdings existieren verschiedene Arten von Symbolen. Dahinter steckt die Idee, dass Sie ein Symbol erschaffen und diese Grafik nur einmal in der Bibliothek ablegen. Nachdem es sich in der Bibliothek befindet, kann das Symbol mehrfach in Ihrem Film auftauchen, ohne die Dateigröße des Films gravierend zu erhöhen. Eine Instanz ist eine Kopie eines Symbols (das in Ihrem Film verwendet wird). Jedes Mal, wenn Sie ein Symbol aus der Bibliothek ziehen, erschaffen Sie eine neue Instanz. Es handelt sich dabei nicht um eine »Kopie« im herkömmlichen Sinne, da es in Wirklichkeit nur ein Symbol gibt und jede Instanz so gut wie keinen Speicher verbraucht. Wir werden noch sehen, dass Instanzen in vielen Belangen verändert werden können (z.B. in ihrer Größe).

40

Das Eigenschaften-Bedienfeld

Die Bibliothek verhält sich wie alle anderen Bedienfelder. Sie können sie über FENSTER / BIBLIOTHEK öffnen (oder über die Tastenkombination (Strg)+(L)). Es erscheinen nun alle Namen der Symbole, die in Ihrer Bibliothek zur Verfügung stehen (siehe Abbildung 1.13). Sie können diese Liste nach Namen, Änderungsdatum, Art usw. sortieren. Das geschieht auf die gleiche Weise, wie Sie auch eine Dateiliste in Ihrem Computer verwalten können. Wenn eine Zeile ausgewählt ist (mit einem einfachen Klick), erscheint eine Vorschau dieses Symbols und Sie können Veränderungen über das Optionsmenü vornehmen. Weitere Optionen, wie beispielsweise UMBENENNEN, EIGENSCHAFTEN und IN NEUEN ORDNER VERSCHIEBEN, fallen in die »Verwaltung« der Bibliothek. Um ein Symbol aus der Bibliothek in Ihrem Film zu verwenden, ziehen Sie es einfach aus dem Bibliotheksfenster auf die Bühne. Abschließend – und probieren Sie es bitte jetzt noch nicht aus – können Sie den Inhalt eines Symbols editieren, indem Sie entweder BEARBEITEN aus dem Optionsmenü wählen oder auf das Symbol in der Bibliothek doppelklicken (wenn Sie auf den Namen doppelklicken, können Sie ein Symbol umbenennen). Das würde in dieser Einführung allerdings zu weit führen und wird detailliert in Kapitel 5 besprochen.

Abbildung 1.13: Eine typische Bibliothek beinhaltet mehrere verschiedene Symbole. Die Bibliothek bietet sowohl Zugang zu allen Medien als auch weitere Optionen wie Sortieren, Löschen und Umbenennen der verschiedenen Symbole.

41

Grundlagen

1.4

Navigation

Ein wichtiger Aspekt in Flash ist, immer zu wissen, wo man sich gerade befindet. Wenn Sie zum Beispiel denken, dass Sie sich in der Bibliothek befinden und ein Symbol bearbeiten, sollten Sie besser hoffen, dass Sie wirklich dort sind. Da es immer möglich ist, herauszufinden, wo man sich in Flash befindet, könnte sich das für Sie jetzt ein wenig seltsam oder übernervös anhören. Allerdings sind die Hinweise oft sehr versteckt. Wir werden nun herausfinden, wie Sie immer anhand der versteckten Hinweise wissen, wo Sie sich in der Oberfläche befinden.

Die aktuelle Ebene Obwohl es nur eine Haupt-Zeitschiene gibt, haben wir bereits zuvor gesehen, dass man mehrere Ebenen verwalten kann. Öffnen Sie nun eine neue Datei und legen Sie eine neue Ebene an (EINFÜGEN / EBENE), damit Sie damit ein wenig experimentieren können. Ein wichtiger Aspekt ist, dass Sie sich immer nur in »einer« Ebene zugleich befinden können. Wenn Sie beispielsweise eine Grafik einfügen oder zeichnen, wird diese immer der aktuellen Ebene hinzugefügt. Diese aktuelle Ebene wird durch ein kleines Bleistift-Symbol gekennzeichnet (siehe Abbildung 1.14). Klicken Sie einfach auf eine andere Ebene, um diese zu aktivieren (haben Sie gesehen, wie sich der Bleistift zur neuen Ebene bewegt?). Das Geheimnis an dieser Stelle ist, dass Sie immer darauf achten müssen, welche Ebene Sie momentan bearbeiten. Wenn die aktuelle Ebene beispielsweise gesperrt ist, werden Sie nichts daran ändern können. Abbildung 1.14: Die aktuelle Ebene ist nicht immer schwarz unterlegt, sondern wird lediglich durch das Bleistift-Symbol gekennzeichnet.

Das aktuelle Bild Wenn Sie die Zeitleiste betrachten, werden Sie eine rote Markierung entdecken können, die das aktuelle Bild markiert, das momentan angezeigt wird (siehe Abbildung 1.15). Diese rote Markierung (auch Abspielkopf genannt) kann immer nur auf einem einzigen Bild zur gleichen Zeit stehen – und das ist das Bild, das Sie momentan editieren. An dieser Stelle werden Sie vielleicht denken, dass man diese Markierung nicht hinter Bild 1 verschieben kann, was allerdings nur daran liegt, dass bisher keine weiteren Bilder zur Verfügung ste-

42

Navigation

hen. In Zukunft werden Sie jedoch sehr oft die Gelegenheit haben, das nachzuholen. In diesem Moment reicht es allerdings, dass Sie wissen, wofür die rote Markierung steht. Wenn es ihnen hilft, stellen Sie sich eine Zeitmaschine vor. Sie können jeden Zeitpunkt besuchen, allerdings immer nur einen auf einmal.

Abbildung 1.15: Der rote Abspielkopf (hier bei Bild 11) kann immer nur auf ein Bild zur gleichen Zeit zeigen. Sie sollten immer im Hinterkopf haben, wo sich diese Markierung befindet.

Die aktuelle Szene bzw. das aktuelle Symbol Das mit Abstand am schwersten zu verstehende Konzept ist für neue Anwender dieses: In Flash gibt es mehr als eine Zeitlinie! Ein sehr großer oder komplizierter Film kann nämlich in verschiedene Szenen unterteilt werden. Sie können sich diese Szenen wie Kapitel in einem Roman vorstellen. Tief im Innern von Flash gibt es lediglich eine lange Zeitlinie (so wie unser Roman eine lange, zusammenhängende Geschichte erzählt). Wenn Sie aber Ihre Datei in Szenen aufteilen, können Sie diese einzeln ansprechen. Dabei handelt es sich um eine sehr nützliche Option, denn auf diese Weise können Sie sehr einfach die Reihenfolge der Szene verändern. Ohne weiter ins Detail zu gehen, sollten Sie schon an dieser Stelle wissen, dass Sie immer darauf achten müssen, in welcher Szene Sie gerade arbeiten. Sie finden den Namen der aktuellen Szene unterhalb der Zeitleiste (wenn diese angekoppelt wurde) oder oberhalb der Bühne (wenn die Zeitleiste nicht angekoppelt ist). Zu dieser Adressleiste sage ich aber später noch mehr. Der Standardname ist Szene 1. Außerdem wird neben dem Namen das Symbol für Szenen (eine Filmklappe) angezeigt (siehe Abbildung 1.16).

43

Grundlagen

Abbildung 1.16: In der Adressleiste sehen Sie normalerweise den Namen der aktuellen Szene. Das Symbol einer Filmklappe zeigt an, dass es sich bei diesem Namen um eine Szene handelt.

Die Adressleiste zeigt allerdings oft mehr Informationen an, als man in Abbildung 1.16 sieht. Wie wir im 4. Kapitel sehen werden (wenn wir mit dem Zeichnen beginnen), kann man Grafiken innerhalb anderer Grafiken gruppieren. Wenn wir uns in Kapitel 5 näher mit der Bibliothek beschäftigen, werden Sie außerdem sehen, wie man Symbole innerhalb anderer Symbole verwenden kann. Wenn Sie auf eine gruppierte Grafik oder auf die Instanz eines Symbols doppelklicken, um es zu bearbeiten, wird alles andere auf der Bühne abgeschwächt (um anzuzeigen, dass diese Inhalte nicht editierbar sind). Die beste Möglichkeit, um herauszubekommen, welche Grafik Sie momentan bearbeiten, ist der Blick auf die Adressleiste. Hier könnte beispielsweise Szene 1: Auto (siehe Abbildung 1.17) stehen. Das bedeutet, dass Sie sich in einer Gruppe namens Auto befinden, die ihrerseits sich wieder in Szene 1 befindet. Das klingt ganz schön haarig, oder? Nun ja, es ist nicht ganz so schrecklich, da die Adressleiste sehr klar strukturiert ist – Sie sollten halt ab und zu einen Blick darauf werfen.

Abbildung 1.17: Die Adressleiste zeigt an, dass Sie hier eine Gruppe bearbeiten, die sich in Szene 1 befindet.

44

Navigation

In der Benutzeroberfläche navigieren Wir haben also gesehen, dass die Benutzeroberfläche Hinweise anzeigt, die uns zu jeder Zeit verraten, wo wir uns befinden. Jetzt wäre es nur noch interessant zu wissen, wie man überhaupt an diese Stelle gelangt. Und wie kommt man wieder zurück? Es ist sehr einfach, durch eine Flash-Datei zu navigieren (vielleicht ist es auch gerade deshalb so einfach, sich zu »verlaufen«). Betrachten wir nun einige Arten des Navigierens. Die Adressleiste zeigt nicht nur die Hierarchien Ihrer aktuellen Position an, sie bietet Ihnen auch die Möglichkeit zur Navigation. Klicken Sie einmal auf die Adressleiste. Wenn Sie beispielsweise gerade ein Symbol bearbeiten, welches sich in Szene 1 befindet, sollte Szene 1: Symbolname angezeigt werden. Wenn Sie nun einfach auf Szene 1 klicken, werden Sie in diese Szene zurückgeführt (siehe Abbildung 1.18). Bei sichtbarer Adressleiste können Sie innerhalb der Hierarchien zu jeder Zeit zurücknavigieren. Merken Sie sich bitte, dass die Adressleiste Informationen über die aktuelle Position anzeigt und dass Sie darauf klicken können.

Abbildung 1.18: Die Adressleiste bietet mehr als nur Informationen – Sie können auf jeden angezeigten Namen klicken, um dorthin zurückzuspringen. Hier können Sie also auf Szene 1 klicken, um wieder bis an den Start zurückzuspringen.

Abschließend möchte ich noch auf zwei weitere Menüs verweisen, die sich am anderen Ende der Adressleiste befinden: SZENE BEARBEITEN und SYMBOLE BEARBEITEN (siehe Abbildung 1.19). Über diese Menüs können Sie zu jeder beliebigen Szene oder jedem Symbol springen, das sich in Ihrem aktuellen Film befindet. Natürlich ist es nicht sehr interessant, diese Menüs zu benutzen, wenn Sie nur ein einziges Symbol in lediglich einer Szene erstellt haben. Wenn Ihre Datei allerdings größer wird, bieten diese Menüs eine schnelle Möglichkeit der Navigation. Wenn Sie wollen, öffnen Sie doch einmal ein Beispiel oder eine Lektion aus dem HILFE-Menü und versuchen Sie durch die verschiedenen Szenen und Symbole zu navigieren, indem Sie diese Menüs benutzen. Es gibt noch viel mehr Möglichkeiten, sich in Flash zu bewegen (und wir werden Sie alle kennen lernen). An dieser Stelle haben Sie aber schon genug gelernt, um komfortabel durch eine Flash-Datei navigieren zu können. Denken Sie einfach daran, auf alle Hinweise zu achten, die Flash Ihnen gibt um herauszufinden, wo genau Sie sich gerade befinden.

45

Grundlagen

Abbildung 1.19: Die Menüs SZENE BEARBEITEN und SYMBOLE BEARBEITEN sind immer an der rechten Seite der Adressleiste erreichbar. Sie bieten die beste Möglichkeit, zwischen Szenen und Symbolen zu navigieren.

1.5

Dokumenteigenschaften

Wenn Sie einen Film erstellen, müssen Sie direkt zu Beginn einige Einstellungen vornehmen, deren Auswirkungen sehr weitreichend sind. Viele dieser Einstellungen finden Sie in der Dialogbox Dokumenteigenschaften (siehe Abbildung 1.20), die Sie unter MODIFIZIEREN / DOKUMENT oder per Doppelklick auf den unteren Rand der Zeitleiste (wo Sie 12 BPS1 sehen) öffnen können. Öffnen Sie nun das Dialogfeld Dokumenteigenschaften, damit Sie mit einigen Einstellungen experimentieren können.

Abbildung 1.20: Das Dialogfeld Dokumenteigenschaften bietet die Möglichkeit, einige übergreifende Einstellungen vorzunehmen, die Sie zu Beginn eines Projektes festlegen sollten. 1

46

Bilder pro Sekunde

Dokumenteigenschaften

Als Erstes sollten Sie sicherstellen, dass die Linealeinheit auf Bildpunkte (Pixel) eingestellt ist. Dabei handelt es sich um die Standardeinheit im Bereich Multimedia und Internetseiten. Es ist wichtig, dass Sie die Einheit auf Pixel einstellen, weil dies einige andere Dialogfelder (einschließlich dem bereits erwähnten Bedienfeld Info) beeinflussen wird. Neben Hintergrundfarbe sehen Sie ein weißes Feld, das es Ihnen erlaubt, die Farbe der Bühne zu verändern. Das ist unter Umständen nicht so nützlich, wie Sie vielleicht denken, da Sie zum Zeitpunkt der Veröffentlichung Ihres Filmes im Internet wieder eine andere Hintergrundfarbe wählen können – was diese Einstellung überschreiben wird. Sie können die Hintergrundfarbe also gerne zu jeder beliebigen Zeit verändern. Möglicherweise ist Grau ein wenig augenfreundlicher oder Schwarz macht das Auswählen von weißer Grafik einfacher. Machen Sie einfach was Sie wollen, da diese Einstellung jederzeit wieder zurückgestellt werden kann und sowieso nur die Bühnenfarbe verändert, während Sie zeichnen. Zwei weitere Eigenschaften sollten Sie schon zu Beginn Ihres Filmes festlegen: die Bildrate und das Format. Die Bildrate spezifiziert die Geschwindigkeit, in der Flash versuchen wird, Ihren Film abzuspielen – und zwar die Anzahl der Bilder pro Sekunde. Ich sage extra »versucht«, denn einige Betrachter verfügen nicht über einen so schnellen Rechner, um hier mithalten zu können. Flash wird dann wahrscheinlich nicht die Bildrate erreichen, die Sie eingestellt haben, sondern es wird stecken bleiben oder einfach nicht mehr mitkommen. Das Format ist nur insofern interessant, als es die Längen-Breiten-Relation der Bühne beeinflusst. Das haben wir zu einem früheren Zeitpunkt schon besprochen. Entscheiden Sie sich nun einfach, ob Sie eine quadratische Bühne (Entschuldigung, aber sie kann leider nicht rund sein), oder doch lieber ein Breitbild-Format wünschen. Vielleicht wollen Sie sogar ein vertikales Rechteck erzeugen (wenn Sie beispielsweise eine Menüleiste neben Ihre Internetseite legen wollen). Entscheiden Sie sich frühzeitig, da das Aussehen Ihrer Bühne die Anordnung von Bildern und Grafiken beeinflussen wird. Viele Leute verwechseln die Bildrate oft mit Geschwindigkeit, was mehr ein visueller Effekte ist. Animateure können einige Tricks verwenden, um etwas scheinbar sehr schnell über den Bildschirm zu bewegen, obwohl sie nur eine sehr geringe Bildrate verwenden. Wenn Sie zum Beispiel ein Auto am linken Rand des Bildschirms sehen und nur Bruchteile von Sekunden später befindet es sich schon auf der rechten Seite, könnte das Ihrem Gehirn vorspielen, dass sich das Auto sehr schnell bewegt hat. Obwohl so ein Trick nur zwei Bilder benötigt – und bei einer Bildrate von vier Bildern pro Sekunde erscheint das zweite Auto schon eine Viertelsekunde nach dem ersten! Die Bildrate kontrolliert also nur die visuelle Auflösung. Damit ist gemeint, in wie viele Stückchen eine jede Sekunde unterteilt wird. Vier Bilder pro Sekunde wird sehr »ruckelig«, da das Bild nur viermal in der Sekunde verändert wird. Dagegen werden 30 Bilder pro Sekunde (das entspricht der Bildrate des Fernsehens) in so kleine Stückchen zerlegt, dass man den Unterschied zwischen den einzelnen Bildern nicht mehr erkennen wird. Nebenbei gesagt: Man kann natürlich auch ein Auto über den Bildschirm bewegen, wenn man mit 60 Bildern pro Sekunde arbeitet – allerdings würde unsere Viertelsekunden-Bewegung dann ganze 15 Bilder benötigen. Wir werden uns mit diesem Thema in Kapitel 7 noch genauer beschäftigen.

47

Grundlagen

1.6

Dateitypen

Natürlich ist der übliche Einsatz von Flash die Erstellung interaktiver Animationen für das Internet. Wenn wir uns nun die verschiedenen Dateitypen ansehen, könnte das ein wenig verwirrend sein. Deshalb beschränken wir uns auf ein Minimum, denn Sie sollen zumindest drei Dateitypen verstehen: Quell-Dateien .fla, exportierte .swf-Dateien und HTMLDateien (.htm oder .html).

Quell-Dateien (.fla-Dateien) Einer der wichtigsten beiden Dateitypen in Flash ist die Quell-Datei eines Flash-Films, die Sie immer während Ihrer Arbeit abspeichern können. Diese Datei verwendet die Endung .fla. Sie können jede .fla-Datei öffnen und bearbeiten. Mit dieser Quell-Datei können Sie immer die anderen Dateitypen erzeugen – allerdings können Sie eine .fla-Datei mit keiner anderen Datei wiederherstellen (außer, Sie machen sich die ganze Arbeit noch einmal). Wenn Sie Dateien mit anderen Flash-Autoren austauschen wollen, die etwas am Film verändern sollen, tauschen Sie immer .fla-Dateien aus. Jeder, der Flash MX installiert hat (sei es auf dem Macintosh oder unter Windows), kann eine .fla-Datei, die Sie erzeugt haben, öffnen und bearbeiten. Obwohl Sie eine .fla-Datei nicht direkt ins Internet stellen können, damit andere Nutzer Ihren Film betrachten können, beinhaltet diese Datei alle Informationen über Ihren Film.

Exportierte .swf-Dateien Wenn Sie Ihre Arbeit abgeschlossen haben und bereit sind, Ihre Kreation zu veröffentlichen, exportieren Sie lediglich eine .swf »Flash Player«-Datei. Eine .swf-Datei kann von jedem im Internet betrachtet werden, der das Flash Player Plug-In installiert hat. Das Publikum kann eine .swf-Datei nicht bearbeiten, sondern nur betrachten. Die Vorgehensweise, um eine .swf-Datei zu erstellen, ist sehr einfach. Sie öffnen eine .fla-Datei, wählen DATEI / FILM EXPORTIEREN und geben die Position und den Namen der .swf-Datei an. Obwohl es noch eine Menge mehr Details gibt, ist es wichtig zu verstehen, dass Exportieren immer das Erzeugen einer neuen Datei (.swf-Datei) beinhaltet, die .fla-Datei aber weiterhin unverändert bleibt. Das Ganze ist vergleichbar mit der Funktion SPEICHERN UNTER, die Sie in vielen anderen Programmen finden. Sie sollten immer eine Kopie Ihrer .fla-Datei behalten, egal was Sie tun. Damit können Sie jederzeit .swfDateien erstellen oder Ihre Animation verändern und weitere .swf-Dateien erzeugen.

48

Dateitypen

Abbildung 1.21: Das Dialogfeld Film exportieren erlaubt Ihnen die Einstellung des Dateityps, den Sie exportieren wollen. In den meisten Fällen werden Sie eine .swf-Datei (Flash Player) erzeugen.

Es gibt noch eine letzte Sache, mit der wir uns jetzt beschäftigen sollten, wenn Sie beabsichtigen, mit mehreren Leuten im Team zu arbeiten oder auf andere Weise .fla-Dateien untereinander austauschen wollen (und zwar auf verschiedenen Rechnern): Jede .fla-Datei, die Sie erstellt haben, wird sowohl auf einem Macintosh als auch auf Windows-Rechnern ordentlich zu öffnen sein. Allerdings gibt es einen kleinen Nachteil: Die Schriftarten, die Sie in Ihrer Flash-Datei verwendet haben, müssen auf dem Rechner installiert sein, auf dem Sie eine .swf-Datei erstellen wollen. Es ist nicht so, dass Sie die Datei nicht austauschen könnten, wenn auf dem Zielrechner die betreffende Schriftart nicht installiert ist – allerdings kann man dann auf dem Rechner den Text nicht editieren und auch keine .swf-Dateien erstellen. Das kann man ganz einfach verhindern, indem man alle verwendeten Schriftarten auf allen Rechnern installiert, mit denen gearbeitet werden soll.

HTML-Dateien, die .swf-Dateien beherbergen Wenn Sie schon ein wenig Erfahrung mit HTML haben, werden Sie feststellen, dass es recht einfach ist, Ihre .swf-Dateien in eine Internetseite einzubinden. Wenn Sie noch keine HTML-Erfahrung besitzen, kann es nicht schaden, ein wenig HTML zu lernen, allerdings ist das keine Pflicht. Hier ein kleiner Einblick: Wenn Sie eine Internetseite besuchen, »gehen« Sie nicht wirklich irgendwohin. In Wirklichkeit lädt Ihre Browser-Software eine kleine Text-Datei herunter (für gewöhnlich mit einer .htm- oder .html-Dateiendung).

49

Grundlagen

Diese Datei beinhaltet nicht nur die Worte, die Sie auf einer Internetseite sehen, sondern zusätzliche Anweisungen, wie zum Beispiel die Schriftart und -größe auszusehen haben. Zusätzlich beinhaltet eine HTML-Datei Informationen über Bilder, die Sie im Internet sehen. Dazu gehören Details wie der Dateiname des Bildes oder dessen Format. Wenn Sie eine Flash Player-Datei (.swf) in eine Internetseite einbinden wollen, ist das nicht schwerer, als ein Bild in eine Internetseite einzufügen. Allerdings können Sie ein paar weitere Details (außer dem Dateinamen der .swf-Datei) hinzufügen, z.B. die Hintergrundfarbe oder ob Sie den Film stets wiederholen lassen wollen. Des Weiteren gibt es noch sehr viele andere interessante Einstellungen, die in Flash möglich sind. Um diesen Prozess ein wenig zu vereinfachen, gibt es in Flash eine Funktion namens Veröffentlichen (welche wir in einem späteren Kapitel noch genauer besprechen werden). Weitere Details kann man im Dialogfeld Einstellungen für Veröffentlichungen festlegen (siehe Abbildung 1.22).

Abbildung 1.22: Im Dialogfeld Einstellungen für Veröffentlichungen

können Sie alle Dateiformate auswählen, die Sie zur Verfügung stellen wollen. Weitere Einstellungen kann man über die Registerkarten vornehmen, die am oberen Rand des Fensters erscheinen.

1.7

Zusammenfassung

Wir haben in diesem Kapitel sehr viele Grundlagen besprochen, ohne eigentlich irgendetwas zu erstellen. Aber keine Angst, wir werden uns morgen noch »die Hände schmutzig machen«. Allerdings sind die Informationen, die Sie in diesem Kapitel erhalten haben, sehr wertvoll für Ihre weitere Flash-Karriere.

50

Workshop

Ich habe Sie in die Flash-Oberfläche eingeführt (inklusive Bühne, Zeitleiste und Werkzeugkiste). Sie haben gelernt, wie man die Größe der Bühne verändert und wie man die Ansicht vergrößern bzw. verkleinern kann. Wir haben die Werkzeugkiste kennen gelernt (die Sie morgen sehr häufig brauchen werden) und haben einige Bedienfelder besprochen, die es Ihnen ermöglichen, Grafiken zu bearbeiten. Obwohl wir nicht viel mit der Zeitleiste gearbeitet haben, haben Sie schon gelernt, auf kleine Hinweise zu achten (z.B. den Abspielkopf und das Bleistift-Symbol). Danach sind noch weitere Hinweise der Oberfläche und Werkzeuge für die Navigation eingeführt worden, damit Sie immer sehen, wo Sie sich gerade befinden. Die Adressleiste und die beiden Menüs oben rechts helfen Ihnen in diesem Bereich immer weiter. Abschließend haben wir die Dateiformate besprochen, die wir erstellen werden. Es ist wichtig, dass Sie sich mit diesen Dateien auskennen und sie strukturiert in verschiedenen Ordnern verwalten. Wer hastig arbeitet, wird Müll produzieren. Das bestätigt sich vor allem dann, wenn man viele Tausend oder Millionen Dateien zu verwalten hat. Tragen Sie es also mit Fassung, achten Sie darauf, wie sich die Flash-Oberfläche verändert und haben Sie eine Menge Spaß.

1.8

Workshop

F&A F

Wenn ich die Leertaste drücke, um das Hand-Werkzeug zu erhalten, und es dann nach oben oder links bewege, kann ich nicht nach links oder oben über die Bühne hinaus kommen. Warum ist das so? A

F

In den meisten Fällen ist ANSICHT / ARBEITSBEREICH nicht ausgewählt. Sie können nur den Bereich außerhalb der Bühne sehen, wenn diese Option eingeschaltet ist (ich empfehle Ihnen, diese Einstellung standardmäßig ausgewählt zu lassen).

Als ich ein paar der Beispieldateien, die mit Flash MX geliefert wurden, ausprobiert habe, habe ich festgestellt, dass es eine gute Methode ist, über den Link Szene 1 zurück zur Haupt-Zeitleiste zu gelangen. Irgendwie ist der Link aber aus der Adressleiste verschwunden. Wie komme ich nun zur Haupt-Zeitleiste zurück? A

Normalerweise enthält die Adressleiste immer den kompletten Pfad, egal wie tief Sie in ein Symbol oder eine Gruppe »eingedrungen« sind. Manchmal passiert es aber dennoch, dass der Name des Symbols, in dem Sie sich befinden, an erster Stelle steht. Wenn Sie nun wieder zurück zur Hauptszene gelangen möchten, verwenden Sie einfach die Schaltfläche Szene bearbeiten (oben links über der Bühne).

51

Grundlagen

Quiz Hier können Sie Ihr bereits gewonnenes Wissen testen. Die Antworten finden Sie in Anhang C. 1. Wie öffnet und bearbeitet man eine .swf-Datei? a.

Das kann man nicht, und wenn man keine Sicherheitskopie der .fla-Datei besitzt, hat man Pech gehabt.

b. Man benutzt einfach das Menü DATEI / ÖFFNEN. c. Man kann sie über das Menü DATEI / IMPORTIEREN importieren. 2. Wie kann man die Animation dazu bringen, wirklich schnell abzulaufen? a.

Man schraubt die Bildrate im Dialogfeld Dokumenteigenschaften auf 120 hoch.

b. Man trickst den Betrachter durch althergebrachte Animationstechniken aus. c. Man spielt den Film ganz einfach auf dem schnellsten Computer ab, den man finden kann. 3. Was ist die Standard-Maß-Einheit im Web- und Multimedia-Bereich? a.

Zoll

b. Zentimeter c. Bildpunkte

52

Malen und Zeichnen

2

Malen und Zeichnen

Ob Sie es glauben oder nicht: Flash erblickte das Licht der Welt als Zeichensoftware. Der Programmierer von Flash wollte eine »natürlichere« Zeichenumgebung entwickeln. Flash hat sich zu einem Animations-Werkzeug weiterentwickelt und die Bilder, die in Flash animiert werden, können auch direkt in Flash gezeichnet werden. In diesem Kapitel werden Sie in die grundlegenden Zeichentechniken von Flash eingeführt. Stellen Sie sich das als »Basis-Training« vor. Da es hier sehr viele Themen abzudecken gilt, werden Sie an diesem Kapitel wahrscheinlich etwas länger lesen, als an anderen. Auch wenn die Länge des Kapitels etwas anderes vermuten lässt, werden wir noch nicht praktisch arbeiten. Sie werden vielmehr die Chance haben, die Werkzeuge auszuprobieren. Wenn Sie bisher nur wenig oder gar keine Erfahrung im Erstellen von Computergrafiken haben, können Sie sich besonders glücklich schätzen! Flash ist so einzigartig, dass es umso besser ist, je weniger Sie wissen. Lassen Sie Ihr Gehirn einfach nur wie einen Schwamm arbeiten, der alle Informationen aufsaugt. Sollten Sie schon Erfahrung mit Computergrafik haben, versuchen Sie alles zu vergessen, was Sie bisher von anderen Zeichenprogrammen kennen, und fangen Sie bei Null an. In diesem Kapitel werden Sie lernen, wie Sie 쐽

in Flash malen und zeichnen,

쐽

Linien und Füllungen erstellen,

쐽

geometrisch perfekte Formen in Flash erzeugen. Bei den in Flash erzeugten Grafiken handelt es sich um so genannte Vektorgrafiken (im Gegensatz zu Rastergrafiken, auch Bitmaps genannt). Bei Rastergrafiken speichert der Computer Informationen für jeden einzelnen Bildpunkt ab. Vektorgrafiken enthalten lediglich mathematische Funktionen, mit denen man die Muster erzeugen kann. Als Vektorgrafik wird ein Kreis mit seiner mathematischen Formel beschrieben (mit dem Mittelpunkt und dem Radius), während der Kreis in der Rastergrafik Pixel für Pixel dargestellt werden muss. Aus diesem Grund sind Vektordateien sehr klein und können somit sehr schnell heruntergeladen werden. Außerdem kann man diese sehr einfach an eine neue Größe anpassen. (Der Radius eines Kreises könnte zum Beispiel geändert werden.). Meist erkennt man bei Vektorgrafiken, dass es sich um Computergrafiken handelt, da sehr klare Linien und feste Füllfarben verwendet werden. Nicht so in Flash. Wenn Sie erst einmal ein Gefühl für das Zeichnen mit Flash bekommen haben, werden Sie verstehen, warum Macromedia Flash »Vektor-Ton« genannt hat: Es handelt sich im Innern um ein Vektorformat. Jedoch können Sie es so natürlich modellieren, als ob es sich um Ton handelte.

54

Auf der Bühne malen

2.1

Auf der Bühne malen

Sicherlich wissen Sie noch aus dem letzten Kapitel, dass alles, was Ihr Publikum zu Gesicht bekommen soll, zuerst auf die Bühne gemalt werden muss. Manchmal soll eine Grafik außerhalb der Bühne starten und in diese hinein animieren. Wenn Sie außerhalb der Bühne zeichnen wollen, muss ANSICHT / ARBEITSBEREICH aktiviert sein. Diese Einstellungen sollten Sie auch unverändert lassen. Behalten Sie dabei aber immer im Hinterkopf, dass der graue Bereich für den Betrachter später nicht sichtbar sein wird.

2.2

Werkzeuge

Standardmäßig sollten die Zeichen-Werkzeuge auf der linken Seite des Bildschirms angezeigt werden (siehe Abbildung 2.1). Sollte das nicht der Fall sein, benutzen Sie bitte FENSTER / WERKZEUGE.

Abbildung 2.1: Die Zeichen-Werkzeuge von Flash scheinen auf den ersten Blick recht einfach zu sein. Da die meisten von ihnen aber mit zusätzlichen Funktionen versehen sind, trügt der Schein ein wenig.

55

Malen und Zeichnen

Wenn Sie auf ein Werkzeug klicken, wird dieses ausgewählt. Alternativ dazu können Sie auch die Shortcut- bzw. Kurztasten-Kombination drücken. Diese wird nach kurzer Zeit angezeigt, wenn Sie den Mauszeiger über ein Werkzeug setzen. Wenn Sie die Maus beispielsweise über das Pfeil-Werkzeug bewegen, wird »Pfeil-Werkzeug (V)« angezeigt. Wenn Sie also die Taste (V) betätigen, wird das Pfeil-Werkzeug ausgewählt. (Probieren Sie es aus, indem Sie zunächst ein anderes Werkzeug aktivieren und dann die Taste (V) drücken.)

Ansicht-Werkzeuge Die beiden Ansicht-Werkzeuge (Hand- und Vergrößerungs-Werkzeug) beeinflussen Ihre Zeichnung nicht. Sie werden lediglich dazu benötigt, um Ihnen bei der Ansicht Ihrer Zeichnung behilflich zu sein. In der folgenden Übung führe ich Sie durch ein Szenario, in dem Sie beide Werkzeuge verwenden können.

Übung: Benutzen Sie die Ansicht-Werkzeuge, um besser sehen zu können. In dieser Übung werden wir sowohl das Hand- als auch das Vergrößerungs-Werkzeug kennen lernen. Folgen Sie diesen Schritten: 1. Da wir bisher noch nichts gezeichnet haben, verwenden wir wieder eines der vielen Beispiele, die mit Flash MX ausgeliefert wurden. Bitte öffnen Sie die Datei clock.fla, indem Sie DATEI / ÖFFNEN wählen und dann die Datei clock.fla im Ordner C:\Programme\Macromedia\Flash MX\Samples\FLA auswählen. (Wenn Sie Flash an eine andere Stelle installiert haben, müssen Sie natürlich dort suchen). 2. Sie können das Bild vergrößern, um Ihre Zeichnung haargenau zu inspizieren oder zu verändern. Klicken Sie auf das Vergrößerungs-Werkzeug bzw. auf die Lupe. Beachten Sie, dass weitere Knöpfe im Bereich Optionen erscheinen, wenn Sie das Vergrößerungs-Werkzeug auswählen – wie bei vielen anderen Werkzeugen auch. Sie sollten nun zwei weitere Lupen im Optionsbereich sehen (siehe Abbildung 2.2). 3. Stellen Sie sicher, dass Vergrößern ausgewählt ist (der Knopf mit dem Plus-Zeichen) und klicken Sie dann auf die römische Drei (III) des Zifferblattes der Uhr. Klicken Sie einige Male und Sie werden die Ansicht immer mehr vergrößern. 4. Wenn Sie eine sehr starke Vergrößerung gewählt haben, wird wahrscheinlich der größte Teil der Bühne außerhalb des Sichtfeldes liegen. Selbstverständlich können Sie die Bildlaufleisten am unteren und rechten Rand verwenden, um einen anderen Teil der (nun sehr großen) Bühne zu betrachten. Sie können aber auch das Hand-Werkzeug verwenden. Wählen Sie bitte die Hand aus und halten Sie die linke Maustaste gedrückt, während Sie die Maus bewegen. Sie werden sehen, wie sich der sichtbare Ausschnitt bewegt.

56

Werkzeuge

Abbildung 2.2: Das VergrößerungsWerkzeug besitzt zwei Optionen: Vergrößern und Verkleinern.

5. Nun können wir die Ansicht wieder verkleinern. Wählen Sie wieder das Vergrößerungs-Werkzeug. Denken Sie aber daran, die Verkleinerungsoption auszuwählen (die Lupe mit dem Minuszeichen). Klicken Sie einfach und Sie werden die Ansicht verkleinern. Das war einfach, aber es gibt noch mehr, das Sie wissen sollten. Immer, wenn Sie ein Ansicht-Werkzeug verwenden, wird nichts an Ihrer Flash-Datei verändert. Sie betrachten Ihren Film nur aus einer anderen Perspektive. Im Menü ANSICHT stehen Ihnen die meisten dieser Funktionen auch zur Verfügung. Und auch hier wird Ihre Datei nicht verändert. Sie haben gerade die Vergrößerungsoption des Vergrößerungs-Werkzeugs verwendet und einfach auf die Bühne geklickt. Eine andere Möglichkeit einen Bildausschnitt zu vergrößern besteht darin, auf eine Stelle zu gehen, mit der Maus (bei gedrückter Maustaste) ein Rechteck aufzuspannen und somit den neuen Vergrößerungsausschnitt festzulegen. In unserer Beispiel-Datei könnten Sie beispielsweise einfach einen Rahmen um eine Zahl auf der Uhr aufspannen, um diese direkt als neuen Vergrößerungsausschnitt zu markieren. Sie sehen immer den aktuellen Vergrößerungsgrad oben rechts in der Vergrößerungsanzeige (siehe Abbildung 2.3); hier können Sie auch wieder zu einer hundertprozentigen Ansicht zurückkehren. Ein weiterer schneller Weg zu einer Ansicht von 100% ist ein Doppelklick auf das Vergrößerungs-Werkzeug (nicht die Vergrößerungs- oder Verkleinerungsoption, sondern das Haupt-Vergrößerungs-Werkzeug).

57

Malen und Zeichnen

Abbildung 2.3: Der exakte Vergrößerungswert wird stets oben rechts auf der Bühne angezeigt.

Da wir gerade von schnellen Techniken reden, sei erwähnt, dass sowohl das Vergrößerungs- als auch das Hand-Werkzeug eine »Schnellauswahlfunktion« besitzen. Das heißt, wenn Sie beispielsweise ein anderes Werkzeug benutzen, können Sie (____) drücken und gedrückt halten, um mit dem Hand-Werkzeug zu arbeiten. Wenn Sie die Taste dann loslassen, wird automatisch wieder zurück zum alten Werkzeug gewechselt. Wenn Sie (Strg)+(____) drücken, erhalten Sie die Vergrößerungsoption des Vergrößerungs-Werkzeugs. Wenn Sie (Strg)+(ª)+(____) drücken, wechseln Sie zur Verkleinerungsoption. Diese Vorgehensweise ermöglicht es Ihnen, sehr schnell und kurzfristig ein anderes Werkzeug zu wählen, ohne zur Werkzeugleiste wechseln zu müssen.

Zeichen-Werkzeuge Auch wenn sich die Ansichts-Werkzeuge als sehr nützlich erwiesen haben, verändern Sie Ihren Flash-Film nicht. Wenn Sie allerdings in Flash etwas darstellen wollen, wollen Sie wahrscheinlich ein Bild einfügen, etwas ändern, das Sie bereits gemalt haben, oder auch etwas ganz oder teilweise löschen, was Sie bisher gezeichnet haben. Schauen wir uns zuerst Möglichkeiten an, etwas einzufügen. Damit erzeugen wir etwas, das Sie später verändern oder auch löschen können. Betrachten wir zuerst alle Werkzeuge einzeln und analysieren später, wie sie zusammenarbeiten können.

58

Werkzeuge

Linien zeichnen Es gibt zwei Werkzeuge, die einzig und allein für das Zeichnen von Linien zuständig sind: das Linien-Werkzeug und das Bleistift-Werkzeug. Man kann die Linien mit einer Strichfarbe, einer Strichdicke und einer Strichart versehen. Das ist recht interessant, da die geometrische Definition einer Linie – der kürzeste Weg zwischen zwei Punkten – nichts über Farben, Dicke oder Stil enthält. Am besten stellen wir uns eine Linie so vor: Es handelt sich um eine unendlich lange, dünne Linie, der wir eine Farbe, Dicke (oder Breite) und einen Stil (wie zum Beispiel gestrichelt, gepunktet oder ausgefüllt) zuweisen. Man kann jedes der Linien-Attribute zu jeder Zeit verändern, ohne die zu Grunde liegende Linie anzutasten. Soviel zur Theorie von Linien! In der folgenden Übung werden Sie welche erstellen.

Übung: Zeichnen und verändern Sie Linien In dieser Übung werden Sie erstmals Linien zeichnen und manipulieren. Dies sind die einzelnen Schritte: 1. Erstellen Sie eine neue Datei. Zuerst sollten Sie das Eigenschaften-Bedienfeld in eine gut sichtbare Position bringen (siehe Abbildung 2.4), da die Linien verschiedene Attribute besitzen können. Sollte das Eigenschaften-Bedienfeld nicht sichtbar sein, wählen Sie FENSTER / EIGENSCHAFTEN.

Abbildung 2.4: Mit dem Bedienfeld Eigenschaften

können Sie die Attribute von Linien verändern.

59

Malen und Zeichnen

2. Das Linien-Werkzeug zeichnet gerade Linien. Wählen Sie es aus. Ihr Cursor verändert sich (auf der Bühne) zu einem Fadenkreuz. Klicken und bewegen Sie die Maus bei gedrückter Maustaste, um eine Linie zu erstellen. Vielleicht haben Sie schon bemerkt, dass manchmal ein dunkler Ring beim Ziehen erscheint. Dabei handelt es sich um eine Art Assistent, der Flash beim Linienziehen unterstützt, denn wenn die AUSRICHTEN-Option im Menü ANSICHT aktiviert ist, können Sie leichter absolut gerade Linien zeichnen. 3. Sobald Sie die Linienart, -farbe oder -dicke verändern, werden diese Einstellungen für alle Linien angewendet, die Sie danach zeichnen. Wählen Sie bitte eine andere Farbe. Ändern Sie nun die Dicke. Zeichnen Sie jetzt eine andere Linie. 4. Wenn Sie die Attribute einer Linie verändern wollen, die Sie bereits gezeichnet haben, wählen Sie zuerst das Pfeil-Werkzeug aus und klicken Sie auf die Linie. Sobald Sie eine oder mehrere Linien ausgewählt haben, werden alle Änderungen, die Sie im Bedienfeld Eigenschaften vornehmen, auf die markierten Linien angewandt. 5. Wählen Sie jetzt das Freihand-Werkzeug aus. Beachten Sie, dass dieses Tool über die Option Stiftart verfügt. Klicken Sie bitte auf den Knopf, der im Optionsbereich erscheint, um die Stiftart zu verändern (siehe Abbildung 2.5).

Abbildung 2.5: Die Stiftart ist eine Option, mit der Sie festlegen können, wie sich das Bleistift-Werkzeug verhalten wird.

6. Mit der Option Begradigen werden auch runde Linien zu geraden umgewandelt. Versuchen Sie einmal den Buchstaben »S« zu zeichnen. Er wird mit Sicherheit sehr kantig aussehen. Wenn Sie allerdings den Buchstaben »Z« zeichnen, wird dieser schon eher danach aussehen, was Sie sich vorgestellt haben. Im weiteren Verlauf dieses

60

Werkzeuge

Kapitels werden wir noch sehen, wie man die Sensibilität einstellt. Anhand dieser beiden Buchstaben kann man allerdings schon sehr gut sehen, wie der Stiftmodus Begradigen funktioniert. 7. Wählen Sie nun die Option Glätten. Zeichnen Sie bitte wieder ein »S« und ein »Z«. Das »S« sieht nun schon viel besser aus. Allerdings weist das »Z« nun Kurven auf, wo zuvor keine waren. Diese Optionen sind sehr nützlich, wenn Sie der Meinung sind, dass Ihre handgezeichneten Skizzen zu unklar aussehen. 8. Der Modus Tinte wird in den meisten Fällen genau das zeichnen, was Sie vorgeben. Flash wird Ihre Skizze geringfügig ausrichten, um die Dateigröße zu reduzieren. Eine gerade Linie verbraucht einfach weniger Speicher als eine Kurve und ist somit später bei der Übertragung schneller. Sämtliche Einstellungen, die Sie im Bedienfeld Eigenschaften vornehmen, beeinflussen sowohl Zeichnungen, die Sie mit dem Freihand-Werkzeug, als auch Linien, die Sie mit dem Linien-Werkzeug erstellen. Die einzige Option im Bedienfeld Eigenschaften, mit der wir noch nicht gearbeitet haben, ist der Linienstil. Das Auswahlmenü zeigt Ihnen für jeden Linienstil eine Vorschau an. Die Einstellung Massiv ist gleichbedeutend mit einer Haarlinie, wobei sie für die Haarlinie allerdings die kleinste mögliche Liniendicke erhält. Die anderen, sehr ausgefallenen Linienarten sollten mit extremer Vorsicht genossen werden. Der Grund dafür ist ganz einfach: Je zufälliger eine Struktur aussieht, desto stärker wächst die Dateigröße. Näheres zu diesem Thema lernen wir im Kapitel 20. Sie sollten nun allerdings schon einmal im Hinterkopf behalten, dass diese Arten von Linien eine wesentlich größere Datei erzeugen. Abschließend sei erwähnt, dass die Schaltfläche Benutzerdefiniert im EigenschaftenBedienfeld ein weiteres Fenster öffnet, in dem Sie Ihre eigenen Linienstile erzeugen können. Dabei stehen Ihnen verschiedene Attribute zur Verfügung (siehe Abbildung 2.6). Mit diesem Hilfsmittel kann man sicherlich sehr witzige Effekte erzielen, allerdings gilt es auch hier zu beachten, dass die Dateigröße dadurch überproportional anschwillt.

Abbildung 2.6: Im Dialogfeld Strichstil können Sie alle Eigenschaften eines Linienstils einstellen.

61

Malen und Zeichnen

Füllungen In Flash gibt es nur zwei Arten von Komponenten, aus denen sämtliche Zeichnungen bestehen: Linien und Füllungen. Manche Zeichnungen bestehen nur aus Linien (wie wir sie bisher kennen gelernt haben). Allerdings gibt es auch solche, die nur aus Füllungen bestehen oder eine Kombination aus beidem sind. Füllungen und Linien sind unterschiedlich. Linien haben eigentlich keine Dicke (die Liniendicke, die wir bereits kennen gelernt haben, ist nur ein Attribut des Linientyps). Auf der anderen Seite haben Füllungen einen linken, rechten, oberen und unteren Rand. Stellen Sie sich also Linien als das vor, was Sie mit einem spitzen Bleistift zeichnen können, und Füllungen als das Ergebnis eines Textmarker-Einsatzes. Diese Unterschiede gewinnen mehr an Bedeutung, wenn Sie lernen, wie man bereits erstellte Zeichnungen bearbeitet. Es gibt zwei Werkzeuge, mit denen man Füllungen erstellen kann: das Pinsel-Werkzeug und das Farbeimer-Werkzeug. In der nächsten Übung werden wir mit diesen Werkzeugen ein wenig experimentieren.

Übung: Erstellen Sie Füllungen In dieser Übung werden wir uns mit den Grundlagen und später mit einigen fortgeschrittenen Techniken von Füllungen beschäftigen. Folgen Sie einfach diesen Schritten: 1. Öffnen Sie eine neue Datei und benutzen Sie das Freihand-Werkzeug, um einige große Kreise zu erzeugen. Stellen Sie sicher, dass zumindest einer vollkommen geschlossen, ein anderer beinahe geschlossen und ein dritter offensichtlich nicht geschlossen ist (siehe Abbildung 2.7).

Abbildung 2.7: Drei handgezeichnete Kreise, die wir ausfüllen werden

2. Wählen Sie das Farbeimer-Werkzeug aus. Beachten Sie, dass zwei Knöpfe im Optionsbereich erscheinen: Lückengröße und Füllung transformieren (siehe Abbildung 2.8). Zu diesem Zeitpunkt werden wir lediglich den Knopf Lückengröße kennen lernen und die anderen erst in Kapitel 4 betrachten.

62

Werkzeuge

Abbildung 2.8: Das FarbeimerWerkzeug besitzt mehrere Optionen. Unter anderem kann man mit Lückengröße die Toleranzgrenze dieses Werkzeugs verändern.

3. Wenn Sie mit dem Farbeimer-Werkzeug auf einen leeren Bereich der Bühne klicken, passiert gar nichts. Man kann mit diesem Hilfsmittel geschlossene Figuren mit der ausgewählten Farbe ausfüllen (die Füllfarbe sehen Sie im Abschnitt Farben in der Werkzeugkiste). Außerdem kann dieses Werkzeug die Füllung bereits ausgefüllter Objekte verändern. Stellen Sie bitte große Lücken schließen mit dem Knopf Lückengröße ein. Nun sollten Sie alle Kreise ausfüllen können, auch wenn diese nicht komplett geschlossen sind. Wählen Sie nun das Pinsel-Werkzeug aus und zeichnen Sie damit einen Strich. Da Sie mit dem Pinsel gearbeitet haben, haben Sie nun eine Füllung (keine Linie) erstellt, obwohl sie wie eine dicke Linie aussehen mag. 4. Wählen Sie nun eine andere Füllfarbe. Klicken Sie auf den Farbeimer und füllen Sie die Figur, die Sie mit dem Pinsel erstellt haben, mit einer neuen Farbe aus. Sie sehen, dass man mit dem Farbeimer-Werkzeug nicht nur geschlossene Figuren ausfüllen, sondern auch die Farbe bereits erstellter Füllungen verändern kann. 5. Wenden wir uns nun den Optionen des Pinsel-Werkzeuges zu. Die beiden Auswahlfelder in der Mitte scheinen sich auf den ersten Blick kaum zu unterscheiden, bewirken in Wirklichkeit aber sehr Unterschiedliches. Die obere Auswahl (Pinselgröße) verändert – wie der Name schon sagt – die Größe des Pinsels. Auf der anderen Seite verändert das Menü Pinselform die Kontur der Pinselspitze. Wenn Sie beispielsweise eine abgewinkelte Pinselspitze verwenden, können Sie sehr einfach Schriften mit einem besonders künstlerischen Aussehen erzeugen (siehe Abbildung 2.9). Der Knopf Füllung sperren wird im 4. Kapitel behandelt. Somit bleibt uns noch die Option Pinselart, die wir im nächsten Schritt genauer betrachten.

63

Malen und Zeichnen

Abbildung 2.9: Mit der Option Pinselform lassen sich sehr künstlerische Zeichnungen erstellen.

6. Die Abbildung 2.10 demonstriert jede Pinselart. Lassen Sie uns eine ausprobieren. Wählen Sie den Modus Innen malen, um damit ein wenig zu experimentieren. Verwenden Sie dazu entweder die geschlossenen Kreise, die Sie zuvor gezeichnet haben, oder malen Sie ein paar neue mit dem Freihand-Werkzeug. Stellen Sie nun sicher, dass Sie wieder das Pinsel-Werkzeug ausgewählt haben (beachten Sie, dass die Pinseleinstellungen so geblieben sind, wie Sie sie verlassen haben). Zeichnen Sie nun innerhalb eines Ihrer Kreise. Versuchen Sie danach, außerhalb der Kreise zu malen. Wenn Sie innerhalb einer geschlossenen Fläche starten, wird im Modus Innen malen keine Farbe außerhalb der Fläche aufgetragen. Wenn Sie Innen malen gewählt haben und versuchen, außerhalb einer solchen Fläche mit dem Malen zu beginnen, wird nichts passieren. Abbildung 2.10: Das Pinsel-Werkzeug hat viele verschiedene Modi. Im Beispiel in Auswahl malen habe ich zuvor die Fenster ausgewählt. Das Beispiel innen malen funktioniert nur, wenn man innerhalb des Hauses mit dem Zeichnen beginnt.

Lassen Sie mich noch ein paar Worte über wichtige Eigenschaften verlieren, die sämtliche Werkzeuge betreffen. Zuerst einmal haben verschiedene Hilfsmittel zusätzliche »Optionen«, die im unteren Teil des Werkzeugkastens sichtbar werden. Sollten Sie eine zuvor genutzte Option einmal nicht wiederfinden, ist es gut, wenn Sie sich entsinnen können, für welches Werkzeug diese Option zur Verfügung stand. Diese Angelegenheit ist allerdings nicht so frustrierend, wie Sie vielleicht vermuten, da sämtliche Attribute, die Sie nach dem Zeichenvorgang verändern würden, zusätzlich in verschiedenen Bedienfeldern zur Verfügung stünden. Sie finden lediglich die Optionen, die Sie vor dem Zeichnen auswählen sollen, im Optionsbereich der Werkzeugkiste.

64

Werkzeuge

Eine weitere Eigenschaft, die ich anmerken möchte, ist: Nicht selten lassen sich die gleichen Ergebnisse auf verschiedenen Wegen erzeugen. Wir haben beispielsweise schon das Kommando VERGRÖßERN im Menü ANSICHT, das Vergrößerung-Werkzeug, und die Vergrößerungs-Anzeige auf der Bühne kennen gelernt. Genauso kann man die Füllfarbe über die Werkzeugkiste, über das Bedienfeld Eigenschaften, das Bedienfeld Farbmischer und zusätzlich über verschiedene andere Stellen verändern. Dass Sie bestimmte Funktionen verschieden ausführen können, unterstützt Sie darin Ihren eigenen Arbeitsstil zu finden.

Mit Linien und Füllungen Figuren zeichnen und verändern Wenn Sie entweder das Ellipsen- oder Rechteck-Werkzeug benutzen, erstellen Sie eine Figur, die sowohl Linien als auch Füllungen enthält. Dabei hat die Füllung die aktuell eingestellte Füllfarbe und die Linien besitzen alle Eigenschaften des Linien-Bedienfeldes. Sie können auch Rechtecke oder Ellipsen ohne Füllungen erzeugen, indem Sie Keine Farbe einstellen (siehe Abbildung 2.11). Auf die gleiche Weise können Sie eine Figur ohne Linie erzeugen, wenn Sie Keine Farbe in den Linieneinstellungen als Linienfarbe verwenden. Beachten Sie aber, dass Sie gar nichts zeichnen werden, wenn Sie sowohl die Füll- als auch die Linienfarbe auf Keine Farbe gestellt haben. Diese Werkzeuge sind wirklich selbsterklärend. Allerdings gibt es im Rechteck-Werkzeug eine Option, die wir etwas genauer betrachten sollten: den Eckradius. Damit kann man einem Rechteck abgerundete Ecken zuweisen.

Abbildung 2.11: Wenn man das Ellipsenoder Rechteck-Werkzeug ausgewählt hat, ist eine Option der Füllfarbe keine Farbe (die als roter Schrägstrich angezeigt wird).

Ellipsen oder Rechtecke zu erzeugen ist sehr einfach. In der folgenden Übung werden wir solche Figuren auf verschiedenen Wegen zeichnen und verändern.

65

Malen und Zeichnen

Übung: Zeichnen und bearbeiten Sie Figuren Diese Übung fasst Ihr bislang gewonnenes Wissen über Füllungen und Linien zusammen. Allerdings werden Sie noch einige weitere Tricks dazulernen. Folgen Sie einfach diesen Schritten: 1. Setzen Sie die Liniendicke auf einen hohen Wert (5 oder höher). 2. Wählen Sie eine beliebige Farbe sowohl für die Linie als auch für die Füllung – allerdings nicht keine Farbe. 3. Verwenden Sie das Ellipsen-Werkzeug, um einen Kreis zu zeichnen. Ein Kreis ist nichts anderes als eine Ellipse, welche die gleiche Breite und Höhe hat. Wenn Sie einen Kreis zeichnen wollen, halten Sie einfach (ª) gedrückt, während Sie mit dem Ellipsen-Werkzeug arbeiten. 4. Verändern Sie nun die Füllfarbe und zeichnen Sie ein Quadrat (indem Sie (ª) drücken, während Sie das Rechteck-Werkzeug verwenden). 5. Wählen Sie nun den Farbeimer aus und klicken Sie in den Kreis, den Sie gezeichnet haben. Wie Sie sehen, wird die Füllfarbe des Kreises auf die aktuell eingestellte Farbe gesetzt. Der Farbeimer ist sehr einfach zu verstehen – er erstellt entweder Füllungen oder verändert sie. 6. Betrachten wir ein anderes Werkzeug – das Tintenfass-Werkzeug. Wählen Sie es aus und verändern Sie die Linienfarbe. Klicken Sie nun erneut auf den von Ihnen gezeichneten Kreis. Wie Sie sehen, verändert sich die Linienfarbe. Das ist wirklich bemerkenswert, denn mit dem Tintenfass-Werkzeug werden lediglich Linien verändert. Sie müssen also nicht extrem vorsichtig vorgehen und auch nicht darauf achten, wohin Sie klicken. Normalerweise können Sie irgendwo auf eine Figur klicken, wobei Sie dann aber nur die Linien verändern werden. 7. Das Tintenfass-Werkzeug verändert nicht nur die Farbe einer Linie. Wählen Sie im Eigenschaften-Bedienfeld eine andere Liniendicke aus – sagen wir einmal 10. Da Sie nun schon an Ort und Stelle sind, wählen Sie doch auch gleich direkt einen anderen Linienstil aus. Klicken Sie erneut auf den Kreis. Wie Sie sehen, werden sämtliche Linieneigenschaften auf die Kreislinie angewandt. 8. Genauso wie Füllungen mit dem Farbeimer-Werkzeug, kann man mit dem Tintenfass-Werkzeug Linien erzeugen, wo zu Anfang noch keine waren. Verwenden Sie das Pinsel-Werkzeug, um schnell eine Figur zu zeichnen. Aktivieren Sie es nun erneut und klicken Sie auf die Füllung, die Sie soeben erstellt haben. Sie haben nun eine Linie hinzugefügt, welche die Füllung umgibt. Diese Übung hat noch einmal gezeigt, dass es zwei fundamentale Komponenten von Figuren gibt, die Sie erstellen können (die Linien und Füllungen), wobei jede über einen anderen Werkzeugsatz verfügt. Sowohl das Ellipsen- als auch das Rechteck-Werkzeug können

66

Werkzeuge

zur gleichen Zeit Füllungen und Linien erstellen. Um eine neue Füllung zu erstellen oder bereits auf dem Bildschirm befindliche Füllungen zu verändern, verwenden Sie das Pinselund das Farbeimer-Werkzeug. Linien erzeugen Sie mit dem Freihand- oder dem LinienWerkzeug. Die Charakteristika ändern Sie mit dem Tintenfass-Werkzeug. Mit dem Stift-Werkzeug werden in erster Linie Linien erzeugt. Allerdings werden von Ihnen gezeichnete, geschlossene Figuren automatisch mit der eingestellten Füllfarbe ausgefüllt. Im weiteren Verlauf dieses Kapitels werden wir noch sehen, wie man diese Figuren verändert (und, wie man die Füllungen entfernt). Wenn Sie das Stift-Werkzeug verwenden, können Sie Ankerpunkte und gerade Linien erstellen. Allerdings können Sie damit auch Kurven erzeugen. Wenn Sie anstatt eines normalen Klicks die Maustaste danach gedrückt halten und dann die Maus bewegen, erzeugen Sie eine Kurve. Dabei erstellen Sie in der Richtung, in der Sie die Maus bewegen, eine Tangente zu Ihrer Kurve. Die Distanz zu der Linie sagt dabei aus, wie stark Ihre Kurve ausschlagen wird. Sollte Ihnen das jetzt schon einleuchten, wäre ich sehr überrascht. Sie sollten ganz einfach ein wenig damit experimentieren, um dieses Verhalten besser zu verstehen. In der nächsten Übung werden Sie dazu ausreichend Gelegenheit bekommen.

Übung: Verwenden Sie das Stift-Werkzeug In dieser Übung werden Sie kontrollierte Kurven erzeugen. Folgen Sie wie gewohnt den folgenden Schritten: 1. Zu Beginn werden wir einen Diamanten zeichnen. Wählen Sie dazu das Stift-Werkzeug aus. Klicken Sie am unteren Rand der Bühne (das wird die untere Spitze des Diamanten), danach weiter oben und weiter links (linke Ecke des Diamanten) und genauso für die obere und rechte Spitze des Diamanten. Danach klicken Sie wieder in der Nähe des unteren Startpunktes, um die Figur zu schließen. Dabei sehen Sie einen kleinen Kreis am Cursor (siehe Abbildung 2.12). Wir werden die verschiedenen Veränderungen des Cursors im Verlauf dieses Kapitels noch genauer besprechen. In diesem Moment reicht es, wenn Sie wissen, dass ein kleiner Kreis im Cursor andeutet, dass die von Ihnen begonnene Figur geschlossen wird, wenn Sie an dieser Stelle klicken. Klicken Sie also, um die Figur zu schließen. Sie wird nun mit der aktuellen Füllfarbe ausgemalt. 2. Sie können ebenso eine »V«-Kurve erzeugen. Klicken Sie dazu einmal, um die obere linke Ecke festzulegen, dann einmal für die untere Spitze und erneut für die rechte Ecke. Doppelklicken Sie, um die Figur abzuschließen (auch wenn sie nicht geschlossen ist). Wenn Sie nun woanders auf die Bühne klicken, beginnen Sie eine neue Figur. Sie können die Zeichnung auch abschließen, indem Sie einfach ein anderes Werkzeug auswählen.

67

Malen und Zeichnen

Abbildung 2.12: Wenn der Cursor einen Kreis enthält, wird damit angedeutet, dass die Figur bei einem Klick geschlossen wird.

3. Nun werden wir versuchen, eine gebogene Linie zu zeichnen. Klicken Sie erneut auf das Stift-Werkzeug (um sicherzustellen, dass Sie eine neue Figur zeichnen), klicken Sie dann einmal, halten dabei aber die Maustaste gedrückt und bewegen Sie die Maus nach links. 4. Sie sind gerade dabei, einen Ankerpunkt für die Kurve festzulegen, die Sie erzeugen wollen. Klicken Sie dazu und halten Sie die Maustaste gedrückt, während Sie sie bewegen. Jetzt können Sie die Maustaste wieder loslassen. Klicken Sie nun etwas oberhalb und rechts vom ersten Punkt und halten Sie die Maustaste gedrückt. Wenn Sie nun (immer noch bei gedrückter Maustaste) die Maus nach rechts bewegen, sehen Sie, wie Ihre horizontale Tangente eine Kurve erzeugt (siehe Abbildung 2.13).

Abbildung 2.13: Wenn Sie klicken, um einen Ankerpunkt zu erzeugen, und dabei (mit gedrückter Maustaste) die Maus bewegen (hier nach rechts), erzeugen Sie eine Tangente für die Kurve.

5. Wenn Sie die Maustaste weiterhin gedrückt halten und den Cursor direkt über den zweiten Punkt bewegen, werden Sie feststellen, dass die Kurve anders verläuft. Sie erzeugen ja auch eine andere Tangente (siehe Abbildung 2.14).

68

Werkzeuge

Abbildung 2.14: Die Kurve verändert sich in Abhängigkeit von der Ausrichtung der Tangente (hier vertikal).

6. Abschließend können Sie (immer noch bei gedrückter Maustaste) den Abstand zum Ankerpunkt vergrößern oder verkleinern. Dabei wird der Winkel der Kurvenkrümmung verändert. Damit Ihre Hand nicht übermüdet, sollten Sie nun weiter rechts (etwa auf der gleichen Höhe des zweiten Punktes) doppelklicken, um die Kurve fertig zu stellen. Auch wenn diese Linie drei Punkte enthält, ist nur die Verbindung zwischen dem ersten und dem zweiten Punkt gebogen. Das ist so, weil Sie nur beim zweiten Punkt die Maus bei gedrückter Maustaste bewegt haben. Sie werden im weiteren Verlauf dieses Kapitels, wenn wir bestehende Zeichnungen verändern werden, noch viel mehr über das Stift- (und das verwandte Unterauswahl-Werkzeug) kennen lernen.

Texte erstellen Damit Sie auch noch Grafikelemente kennen lernen, die weder Linien noch Füllungen enthalten, will ich Texte einführen. Wenn Sie einen Text erstellen wollen, klicken Sie einfach auf das Text-Werkzeug. Klicken Sie nun auf die Bühne und beginnen Sie zu tippen. Sie können die Schriftart, den Schriftstil und die Textfarbe verändern, wenn Sie den Text bereits erzeugt haben. Es macht Sinn, wenn Sie Formatierungen erst nach der Texteingabe vornehmen, weil Sie nur so sehen können, wie der Text später aussehen wird. Das erleichtert die Ausrichtung ungemein. Die Texterstellung war in Flash noch nie so einfach oder besser ausgeklügelt. In der folgenden Übung werden Sie die wichtigsten Manöver ausführen.

Übung: Erstellen und formatieren Sie Text In dieser Übung werden Sie die Texterstellung in Flash erkunden. Es folgen die Schritte: 1. Wählen Sie das Text-Werkzeug aus, klicken Sie dann auf die Bühne und tippen Sie das Wort Hallo ein.

69

Malen und Zeichnen

2. Diese »Klick-und-Tippen«-Technik erweitert den Rahmen des Textblocks automatisch so weit, wie Sie ihn für den eingegebenen Text benötigen. Dieser Modus wird durch einen Kreis an der oberen rechten Ecke des Textblocks angezeigt (siehe Abbildung 2.15). Wenn Sie den Kreis anklicken und mit der Maus bewegen, wird er sich in ein Quadrat verwandeln, das anzeigt, dass der Rahmen festgestellt ist. Sie können auf das Quadrat doppelklicken, um zum ursprünglichen Modus zurückzukehren.

Abbildung 2.15: Mit dem Kreis oben rechts kann man den Rahmen verändern.

3. Während Sie den Text editieren, können Sie den Rahmen verändern. (Stellen Sie sicher, dass der »I«-Cursor im Textfenster blinkt. Klicken Sie gegebenenfalls hinein.) Klicken Sie den Kreis an und bewegen Sie ihn, um den Textblock breiter oder schmaler zu gestalten. Wie versprochen, verwandelt sich der Rahmen-Einsteller in ein Quadrat, das anzeigt, dass der Text nun bei einer Überlänge umbrochen wird. Probieren Sie es aus und schreiben Sie einige Zeilen. Sie werden sehen, dass der Text automatisch umbrochen wird, ohne dass Sie (Enter) drücken müssen. Nebenbei bemerkt: Wenn Sie beim Erstellen des Textfensters nicht nur geklickt, sondern die Maus bei gedrückter Maustaste bewegt hätten, wäre direkt ein festgestellter Textrahmen aufgespannt worden. Es ist völlig egal, welche Technik Sie verwenden. Sie sollten allerdings immer im Hinterkopf behalten, was die unterschiedlichen Rahmen-Einsteller bedeuten. 4. Da Sie nun Text eingegeben und seine Begrenzungen festgelegt haben, ist es an der Zeit, den Text zu formatieren. Aktivieren Sie das Pfeil-Werkzeug, um die Texteingabe zu beenden. Nun sollte der Textblock ausgewählt sein. (Ist das nicht der Fall, klicken Sie einmal auf den Text. Es erscheint ein Rechteck um den Text herum.) 5. Bitte betrachten Sie das Eigenschaften-Bedienfeld, während ein Textblock ausgewählt ist. Ändern Sie vorerst nur die Textfarbe, Schriftart und Schriftgröße (siehe Abbildung 2.16). Sie werden sehen, dass diese Optionen ganz einfach zu handhaben sind. Die Vorschau ist besonders interessant, wenn Sie sich die verschiedenen Schriftarten schnell ansehen wollen. 6. Ändern Sie nun den Stil eines Abschnittes im Textfenster in Fettdruck oder Kursiv. Dazu wählen Sie zuerst ein paar Wörter oder Buchstaben aus, die Sie verändern wollen. Wenn Sie im Textblock doppelklicken, wird automatisch das Text-Werkzeug aktiviert. Sie können die gewünschten Buchstaben genau wie in jeder Textverarbeitung auswählen (nur klicken und ziehen). Während ein Textabschnitt ausgewählt ist, können Sie Einstellungen im Eigenschaften-Bedienfeld vornehmen, um nur diesen Text

70

Werkzeuge

Abbildung 2.16: Mit dem Eigenschaften-Bedienfeld können Sie gängige Texteinstellungen (wie zum Beispiel Schriftgröße und -farbe) vornehmen.

zu formatieren. Wenn Sie die Schriftart ändern wollen, wird die Vorschau den ausgewählten Text in der neuen Schrift anzeigen. Auf diese Weise können Sie die Formatierung des Textes in jedem Textblock sogar buchstabenweise durchführen. 7. Aktivieren Sie nun das Pfeil-Werkzeug und wählen Sie den Textblock aus. Im AbsatzBedienfeld können Sie nun die Textausrichtung zentrieren (siehe Abbildung 2.17). Experimentieren Sie ein wenig mit den anderen Einstellungen wie Rändern, Einrückungen und Zeilenabständen (Format-Schaltfläche). Die letzte textbezogene Eigenschaften-Bedienfeldoption wird im 15. Kapitel ausführlicher besprochen. Im Moment sollten Sie die Option immer auf Statischer Text eingestellt lassen. Der von Ihnen eingegebene Text wird sich nicht verändern und der Betrachter wird ihn immer in der von Ihnen eingestellten Schriftart sehen (auch wenn diese Schriftart auf seinem Rechner nicht installiert ist). Die Schaltfläche Auswählbar ermöglicht es dem Anwender, den Text zu markieren und zu kopieren. In der vorangegangenen Übung haben Sie gelernt, wie man einen Textblock erzeugt und ihn (oder auch nur Teile von ihm) formatiert. Ebenso wichtig ist die Verwendung des kleinen Kreises oder Quadrates in der oberen rechten Ecke des Textblocks. Im weiteren Verlauf dieses Kapitels werden Sie lernen, wie man bei Objekten die Breite, die Höhe oder beides verändert. Wenn Sie einen Textblock verbreitern, wird er zwar breiter aussehen, aber die Ränder werden sich nicht verändert haben. Wenn Sie allerdings die Ränder (wie in der letzten Übung) verändern, wird festgelegt, an welcher Stelle die Zeilen umbrochen werden.

71

Malen und Zeichnen

Abbildung 2.17: Wenn Sie einen Textblock ausgewählt haben, können Sie im Eigenschaften-Bedienfeld die Ausrichtung des Textes verändern (in diesem Fall zentrieren).

2.3

Objekte auswählen und bearbeiten

Da Sie jetzt wissen, wie man Linien, Füllungen, Figuren (mit Linien und Füllungen) und Text erzeugt, ist es an der Zeit herauszufinden, wie man diese Objekte bearbeitet. Die Vorgehensweise ist ganz einfach: Wählen Sie das Objekt aus, das Sie bearbeiten wollen und bearbeiten Sie es dann. Die größte Herausforderung dürfte im Moment aber darin liegen, genau das auszuwählen, was Sie verändern wollen. Dieser Abschnitt wird sich mit den Grundlagen beschäftigen, mehr zum Thema finden Sie in Kapitel 4.

Auswahl-Werkzeuge Die beiden Basis-Auswahl-Werkzeuge sind das Pfeil- und das Lasso-Werkzeug. Das Unterauswahl-Werkzeug (der weiße Pfeil) wird nur dazu benötigt, einzelne Ankerpunkte (wie sie unter anderem vom Stift-Werkzeug erzeugt werden) auszuwählen. Wenn Sie sich bereits mit dem Stift-Werkzeug vertraut gemacht haben, wird Ihnen auch die Arbeit mit dem Unterauswahl-Werkzeug leicht von der Hand gehen. Andernfalls sollten Sie die Grundlagen noch weiter vertiefen, bevor Sie mit dem Unterauswahl-Werkzeug experimentieren. Sie sollten sich also zuerst auf das Pfeil- und das Lasso-Werkzeug konzentrieren.

72

Objekte auswählen und bearbeiten

Das Pfeil-Werkzeug scheint simpel und damit nicht der Rede wert zu sein, allerdings ist es in Wirklichkeit sehr mächtig. Sie haben dieses Werkzeug bereits eingesetzt, indem Sie durch einfaches Klicken ein Objekt ausgewählt haben. Das Geheimnis des Pfeil-Werkzeuges ist, dass der Cursor sich verändert und Ihnen so verrät, was passieren wird, wenn Sie klicken. Sie werden in der nächsten Übung anhand einiger einfacher Figuren dieses Werkzeug ausprobieren.

Übung: Verwenden Sie das Pfeil-Werkzeug, um Figuren auszuwählen und zu bearbeiten In dieser Übung werden Sie erfahren, wie sich der Cursor zu Ihrer Information, was passieren wird, wenn Sie klicken. Folgen Sie wie gewohnt diesen Schritten: 1. Verwenden Sie zuerst das Eigenschaften-Bedienfeld, um eine sehr große Liniendicke (etwa 5) auszuwählen. Zeichnen Sie dann mit dem Ellipsen-Werkzeug einen Kreis und mit dem Rechteck-Werkzeug ein Quadrat. 2. Aktivieren Sie nun das Pfeil-Werkzeug und bewegen Sie den Cursor in die Mitte des Quadrates. Der Cursor wird nun das Bewegungssymbol (vier Pfeile) anzeigen, um Ihnen mitzuteilen, dass Sie nun klicken und bei gedrückter Maustaste die Füllung verschieben können (siehe Abbildung 2.18).

Abbildung 2.18: Der Bewegungs-Cursor erscheint, wenn man sich über einer Füllung befindet. Er zeigt an, dass man bei einem Klick die Füllung bewegen wird.

3. Klicken und bewegen Sie die Maus bei gedrückter Maustaste. Sie werden feststellen, dass tatsächlich nur die Füllung des Quadrates bewegt wird. Wählen Sie nun BEARBEITEN / RÜCKGÄNGIG beziehungsweise drücken Sie (Strg)+(Z), um die Füllung wiederherzustellen. Stellen Sie zudem sicher, dass nichts mehr ausgewählt ist, indem Sie irgendwo auf eine freie Stelle der Bühne klicken. 4. Bewegen Sie den Cursor an eine äußere Kante des Quadrates. Der Cursor enthält nun eine Kurve (siehe Abbildung 2.19). Wenn Sie jetzt klicken und die Maus bei gedrückter Maustaste bewegen, werden Sie die Linie verbiegen. Probieren Sie es aus und verbiegen Sie die rechte Kante des Quadrates nach links. Beachten Sie, dass sich die Füllung der gebogenen Linie anpasst. (Achten Sie darauf, dass Sie die Maustaste für

73

Malen und Zeichnen

diesen Effekt sofort mit dem ersten Klick gedrückt halten müssen. Wenn Sie zuvor schon einmal geklickt haben, wird das eine andere Auswirkung haben.)

Abbildung 2.19: Wenn sich der Cursor in der Nähe einer Linie befindet, zeigt er an, dass Sie beim nächsten Klick die Linie verbiegen werden.

5. Stellen Sie wieder sicher, dass nichts ausgewählt ist und bewegen Sie den Cursor in die Nähe der unteren linken Ecke des Quadrates. Wir stellen fest, dass ein Ecksymbol im Cursor erscheint, was bedeutet, dass ein Klick (mit direkt anschließendem Bewegen der Maus bei gedrückter Maustaste) den Eckpunkt verschieben wird (siehe Abbildung 2.20). Probieren Sie es aus.

Abbildung 2.20: Wenn sich der Cursor in der Nähe einer Ecke befindet, zeigt er wieder ein ganz anderes Symbol. Hier wird angezeigt, dass man den Eckpunkt verschieben kann.

6. Wir haben gesehen, was passiert, wenn man an verschiedenen Stellen klickt und wie der Cursor uns eine Vorschau darauf gibt. Jetzt werden wir das Pfeil-Werkzeug dazu verwenden, etwas auszuwählen. Wählen Sie ganz einfach die Kreislinie aus, indem Sie darauf klicken. Beachten Sie dabei nicht, was der Cursor anzeigt, denn das bezieht sich nur darauf, welchen Effekt das Ziehen der Maus bei gedrückter Maustaste hätte. Klicken Sie also einfach auf die Linie, um diese auszuwählen. 7. Sobald Sie die Kreislinie ausgewählt haben, werden Sie feststellen, dass der Cursor nun das Bewegungssymbol anzeigt (wenn er sich in der Nähe der Kreislinie befindet). Wenn Sie jetzt erneut klicken und bei gedrückter Maustaste die Maus bewegen, werden Sie die Kreislinie verschieben. Sie können auch einfach (Entf) drücken, um die Linie zu löschen. Probieren Sie es aus.

74

Objekte auswählen und bearbeiten

8. Stellen Sie erneut sicher, dass nichts ausgewählt ist und versuchen Sie, die Umrandung des Quadrates auszuwählen. Wenn Sie einmal auf eine Kante klicken, wird nur diese eine Kante ausgewählt. Doppelklicken Sie aber, wird die komplette Umrandung selektiert. Auch hier können Sie wieder die Linien verschieben oder löschen. Im Moment können wir die Linien aber noch gebrauchen. Lassen Sie diese also unverändert. 9. Versuchen Sie, das gesamte Quadrat auszuwählen. Wenn Sie einmal auf die Füllung klicken, wird nur die Füllung ausgewählt. Ein Doppelklick dort erfasst jedoch das gesamte Quadrat, so dass Sie es als Ganzes verschieben oder löschen können. 10. Eine weitere Möglichkeit, das Quadrat auszuwählen, ist es »einzufangen«. Klicken Sie (immer noch mit aktiviertem Pfeil-Werkzeug) außerhalb des Quadrates und bewegen Sie die Maus bei gedrückter Maustaste so, dass das Quadrat von dem aufgespannten Rechteck (auch Gummiband genannt) umschlossen wird. Lassen Sie dann die Maustaste los. Das Quadrat ist nun ausgewählt. 11. Allerdings ist es manchmal (wie in Abbildung 2.21) nicht möglich, die gewünschte Figur allein auszuwählen, denn im Beispiel würde immer auch ein Teil des Kreises selektiert werden. Hier können Sie nun per Doppelklick auf die Füllung zum Ziel kommen. Für solche Situationen gibt es allerdings noch ein weiteres Hilfsmittel: Das Lasso-Werkzeug.

Abbildung 2.21: Manchmal wird mit dieser Auswahlmethode mehr selektiert, als man will.

12. Wählen Sie das Lasso-Werkzeug aus. Klicken Sie nun außerhalb des Quadrates und fahren Sie bei gedrückter Maustaste eine Kurve um das gewünschte Objekt ab. Wenn Sie das Lasso in den Polygon-Modus stellen, verhält es sich fast so wie das Stift-Werkzeug. Wählen Sie also bitte diesen Modus aus und klicken Sie die Eckpunkte Ihrer Auswahl an (siehe Abbildung 2.22). Doppelklicken Sie, um die Auswahl zu akzeptieren. (Noch einmal: In diesem Fall wäre ein Doppelklick auf die Füllung einfacher gewesen. Allerdings werden Sie dieses Werkzeug oft verwenden, beispielsweise wenn es darum geht, mehrere Objekte auszuwählen.)

75

Malen und Zeichnen

Abbildung 2.22: Im Polygon-Modus müssen Sie für jede Ecke Ihrer Auswahl einmal klicken.

13. Abschließend sei gesagt, dass Sie auch Teile einer Figur ausschneiden können. Stellen Sie sich vor, Sie wollen den oberen Teil des Kreises abtrennen. Verwenden Sie dann einfach das Pfeil-Werkzeug wie in Abbildung 2.23 demonstriert.

Abbildung 2.23: Sie können das Pfeil-Werkzeug auch verwenden, um Teile einer Figur auszuwählen.

Als Nächstes werden Sie lernen, wie man ausgewählte Objekte verändert. Allerdings haben Sie vorerst nur die Grundlagen für das Auswählen von Objekten kennen gelernt. Weitere Details erfahren Sie in Kapitel 4. Achten Sie jedoch immer darauf, was der Cursor Ihnen mitteilt.

Die Pipette Eine ganz einfache Möglichkeit, Zeichnungen zu verändern, ist die Farbe zu wechseln. Der Farbeimer kann beispielsweise die Füllfarbe verändern und das Tintenfass-Werkzeug die Linienattribute (Farbe, Dicke und so weiter ...). Das geht immer dann gut, wenn Sie zuerst eine Füllfarbe wählen, dann beispielsweise das Farbeimer-Werkzeug aktivieren und anschließend auf die Füllung klicken, die Sie einfärben wollen. Manchmal werden Sie allerdings eine Füllfarbe eines anderen Objekts zuweisen wollen. Die Pipette lässt Sie die Farbe eines bereits auf dem Bildschirm befindlichen Objekts auswählen. Es werden sogar noch mehr Informationen als nur die Farbe aufgenommen, wie Sie in der folgenden Übung feststellen werden.

76

Objekte auswählen und bearbeiten

Übung: Wählen Sie Attribute mit der Pipette aus In dieser Übung werden Sie mit der Pipette weit mehr Informationen als nur die Farbe sammeln. Hier sind die Schritte dazu: 1. Stellen Sie die Liniendicke auf 10 ein und zeichnen Sie einen Kreis. Verändern Sie nun die Liniendicke, die Linienfarbe und die Füllfarbe. Zeichnen Sie einen zweiten Kreis. Ändern Sie die Einstellungen noch einmal und zeichnen Sie einen dritten Kreis. 2. Wenn Sie an dieser Stelle die Füllfarbe des zweiten Kreises an die des ersten anpassen wollen, können Sie einfach die Füllfarbe verändern. Wenn Sie die genaue Farbe des ersten Kreises noch im Kopf haben, sind Sie ein Glückspilz. Allerdings ist es besser die Pipette zu verwenden, als sich auf die eigenen grauen Zellen zu verlassen. Beobachten Sie, wie der Cursor einen Pinsel anzeigt, während Sie sich über der Füllung des ersten Kreises befinden (siehe Abbildung 2.24). Das bedeutet, dass bei einem Klick die Füllungseinstellungen des Kreises zwischengespeichert werden.

Abbildung 2.24: Der Cursor zeigt an, dass er die Füllungseinstellungen übernehmen wird, wenn Sie klicken.

3. Klicken Sie nun mit der Pipette in die Mitte des ersten Kreises. Sie werden feststellen, dass sich nicht nur die Füllfarbe an die des ersten Kreises angleicht, sondern zusätzlich das Farbeimer-Werkzeug aktiv wird. Sie können nun schnell zum zweiten Kreis gehen und diesen mit der neuen Füllfarbe ausfüllen. Auf geht’s! 4. Wenn Sie die Linien beider Kreise angleichen wollen, können Sie das TintenfassWerkzeug verwenden, um die Linie des zweiten Kreises auszuwählen. Allerdings müssten Sie dann alle Einstellungen von Hand vornehmen. Die bessere Möglichkeit ist an dieser Stelle die Pipette, mit der Sie alle Linieneigenschaften des ersten Kreises übernehmen können. Aktivieren Sie also die Pipette und bewegen Sie diese in die Nähe der Kreislinie des ersten Kreises. Beachten Sie, dass der Cursor einen Bleistift anzeigt (siehe Abbildung 2.25). Das bedeutet, dass bei einem Klick die Linieneigenschaften zwischengespeichert werden.

77

Malen und Zeichnen

Abbildung 2.25: Dieser Cursor zeigt an, dass bei einem Klick die Linieneigenschaften gespeichert werden.

5. Klicken Sie also, um die Linieneigenschaften auszuwählen. Es werden nun nicht nur die Einstellungen im Eigenschaften-Bedienfeld aktualisiert, sondern gleichzeitig wird das Tintenfass-Werkzeug aktiviert. Sie können nun sofort in den zweiten Kreis klicken, um die Linieneigenschaften anzugleichen. Behalten Sie also im Hinterkopf, dass die Pipette viele Eigenschaften speichern kann (nicht nur die Farbe).

Vergrößerungsgrad, Rotation, Verzerren und Umhüllen Sie haben anhand des Pfeil-Werkzeuges gelernt, wie man Figuren biegen, verformen und verschieben kann. Außerdem haben Sie gesehen, dass man das Tintenfass- und das Farbeimer-Werkzeug nutzen kann, um bereits auf dem Bildschirm befindliche Figuren zu verändern. Allerdings gibt es noch mehr Wege, ein ausgewähltes Objekt zu editieren. Zwei übliche Modifikationen sind Vergrößerung und Rotation. Im Großen und Ganzen brauchen Sie dazu nur ein Objekt zu markieren und dann die Option Drehen oder Skalieren des Pfeil-Werkzeuges zu wählen. Diese Optionen stehen immer dann unter dem Pfeil-Werkzeug zur Verfügung, wenn Sie ein Objekt ausgewählt haben. Sie finden die beiden Optionen auch im Menü MODIFIZIEREN / TRANSFORMIEREN. Probieren wir diese Optionen doch ein wenig aus:

Übung: Vergrößern und drehen Sie gezeichnete Objekte In dieser Übung erkunden wir die Optionen Skalieren und Drehen. Folgen Sie dazu einfach diesen Schritten: 1. Verwenden Sie das Rechteck-Werkzeug, um ein Quadrat zu zeichnen. Wählen Sie dann das Frei transformieren-Werkzeug aus und doppelklicken Sie in die Mitte des Quadrates, um es auszuwählen. 2. An dieser Stelle sollte noch keine der vier Optionen ausgewählt sein (siehe Abbildung 2.26). Das bedeutet, dass sie sich im Frei transformieren-Modus befinden und sowohl vergrößern, verkleinern, drehen und kippen können.

78

Objekte auswählen und bearbeiten

Abbildung 2.26: Wenn ein Objekt ausgewählt wurde, können Sie die Option Skalieren (oben rechts im Optionsbereich des Werkzeugkastens) aktivieren.

3. Das ausgewählte Objekt verfügt nun über quadratische Markierungen an den Ecken und Kanten. Beachten Sie, dass der Cursor sich verändert, wenn Sie sich damit über einer solchen Marke befinden. Mit den Markierungen an den Ecken können Sie gleichzeitig die Höhe und die Breite verändern, aber auch eine Rotation oder ein Kippen bewirken (siehe Abbildung 2.27). Wenn Sie (Strg) gedrückt halten, während sich die Maus auf einem der acht Anfasser befindet, können Sie das markierte Objekt verzerren.

Abbildung 2.27: Je nachdem, welchen Anfasser Sie verschieben, können Sie mehrere Transformationen erzeugen. Behalten Sie dabei auch den Cursor im Auge!

79

Malen und Zeichnen

4. Probieren Sie die in Abbildung 2.27 dargestellten Transformationsmöglichkeiten einmal durch, um ein Gefühl für das Potential des Werkzeuges zu bekommen. 5. Stellen Sie sicher, dass Sie das Quadrat immer noch ausgewählt haben und wählen Sie nun die Option Rotieren. Die Markierungen werden nun zu kleinen Kreisen. Mit den Markierungen an den Ecken lässt sich das Objekt drehen und mit den Seitenmarkierungen können Sie es verzerren. Bewegen Sie den Cursor über eine solche Marke und achten Sie auf die Veränderung des Cursors. 6. Klicken Sie nun auf eine Eckmarkierung und bewegen Sie die Maus bei gedrückter Maustaste. Wie Sie sehen, dreht sich das Quadrat. Wenn die Option An Objekten ausrichten (der Magnet, der als Option des Pfeil-Werkzeuges zu finden ist) aktiviert ist, werden Sie feststellen, dass sich das Quadrat alle 45° von selbst justiert (siehe Abbildung 2.28). Darüber lernen wir im Verlauf dieses Kapitels noch mehr.

Abbildung 2.28: Wenn An Objekten ausrichten aktiv ist, haben Sie es einfacher, logische Drehwinkel (wie 45°) einzustellen.

7. Wählen Sie nun die Option Verzerren (unten links) aus. Wenn Sie nun die Anfasser bewegen, können Sie das Quadrat kippen und verzerren. Wenn Sie (ª) gedrückt halten, während Sie einen Anfasser in den Ecken bewegen, verschieben Sie den gegenüberliegenden Anfasser passend mit. Probieren Sie das einfach aus. 8. Kommen wir abschließend zur wildesten Transformationsart: Umhüllen (unten rechts). Den acht eckigen Anfassern werden jeweils zwei Kreise hinzugefügt, die Sie bewegen können, um das gesamte Objekt an der entsprechenden Stelle zu verbiegen. Auch hier macht ein wenig Übung den Meister.

80

Objekte auswählen und bearbeiten

Unter Anfassern (oft auch Markierungen genannt) versteht man im Zusammenhang mit den Optionen Drehen und Skalieren die kleinen Quadrate oder Kreise, auf die man klicken muss, um die Funktion auszuführen. Wenn Sie ein Objekt auswählen, wird es entweder schraffiert dargestellt oder mit einem Rechteck eingerahmt. In jedem Fall erscheinen die Markierungen aber am äußeren Rand dieser Kennzeichnung. Eines sei noch gesagt: Verschiedene Markierungen haben auch verschiedene Funktionen. So stehen Kreise beispielsweise für die Rotation und Quadrate für die Skalierung. Übrigens kann man auch mehrere Objekte gleichzeitig markieren und dann das Frei transformieren-Werkzeug einsetzen. So werden alle Objekte gleichzeitig verformt. Das Transformieren-Bedienfeld, das Sie wie gewohnt im FENSTER-Menü einschalten können, erlaubt es, konkrete Werte für die Standard-Transformationen einzugeben. Hier befindet sich in der unteren rechten Ecke ein interessanter Knopf (der linke der beiden). Er heißt Kopieren und Transformierung anwenden. Dieser Knopf kopiert bei jedem Klick das ausgewählte Objekt und wendet dabei die eingestellte Transformation an.

Figuren glätten und begradigen Wir haben nun schon einige Möglichkeiten kennen gelernt, wie man die Form von Objekten verändern kann. Wenn Sie mit dem Freihand-Werkzeug arbeiten, passt Flash das Ergebnis je nach Stiftart an. Beim Pfeil-Werkzeug haben Sie das Biegen von Linien und das Herausziehen von Ecken kennen gelernt. Zum Schluss haben wir uns dann mit der Rotation und der Skalierung beschäftigt. Natürlich gibt es noch mehr Möglichkeiten. Man kann beispielsweise eine Zeichnung auch noch nach der Fertigstellung glätten oder begradigen. Diese beiden Optionen stehen unter dem Pfeil-Werkzeug zur Verfügung. Die Vorgehensweise ist denkbar einfach: Wählen Sie ein Objekt aus und klicken Sie dann auf eine der Optionen Glätten oder Begradigen (siehe Abbildung 2.29). Sie können auch mehrfach klicken, um den Effekt zu verstärken. In Abbildung 2.30 sehen Sie ein paar »Vorher/Nachher«-Beispiele. Nehmen Sie sich einen Moment Zeit, um mit diesen Funktionen zu experimentieren. Manchmal wird das Ergebnis sicher nicht so sein, wie Sie sich das vorgestellt haben, aber Flash erzeugt zuerst immer möglichst unkomplizierte Figuren, die dadurch auch weniger Speicherplatz belegen.

81

Malen und Zeichnen

Abbildung 2.29: Die Optionen Glätten und Begradigen beeinflussen alles, was gerade ausgewählt ist.

Abbildung 2.30: Die obere Form wurde begradigt und die untere geglättet.

Objekte über das Andocken verbinden Eines der tiefgründigsten Konzepte von Flash ist die Art, wie Ihnen das Ausrichten an Objekten beim Zeichnen hilft. Wenn Sie ANSICHT / AUSRICHTEN aktivieren oder ganz einfach auf die Schaltfläche An Objekten ausrichten (der Magnet) klicken, sind Sie in der Lage, exakte Kreise, Quadrate oder perfekt horizontale Linien zu erzeugen. Auf das »Aktivwerden« dieser Funktion werden Sie durch einen dunklen Ring aufmerksam gemacht, der

82

Objekte auswählen und bearbeiten

im Cursor erscheint, wenn Sie ein neues Objekt zeichnen. Wenn Sie diesen Ring sehen, wissen Sie, dass Flash Sie beim Zeichnen unterstützt. Vielleicht wissen Sie schon (aus anderen Grafikanwendungen), dass Sie bei gedrückter (ª)-Taste mit einer ähnlichen Funktion unterstützt werden, aber das Andocken von Flash

kann noch viel mehr: Zusätzlich zum perfekten Zeichnen von Figuren hilft es Ihnen, zwei Figuren miteinander zu verbinden. Das ist viel mehr, als sich Figuren einfach berühren zu lassen – Sie werden sogar wirklich verbunden. Allerdings kann es in Flash manchmal so aussehen, als ob zwei Figuren verbunden wären, obwohl das gar nicht der Fall ist. Hier ein Beispiel: In der folgenden Übung werden Sie einen Pfeil zeichnen. Solange der Pfeilkopf nicht mit dem Pfeilkörper verbunden ist, werden Sie beim Skalieren feststellen, dass nicht alles vergrößert wird. Wenn die beiden Teile aber zusammengefügt werden, sind sie für immer verbunden.

Übung: Zeichnen und verbinden Sie perfekte Figuren über das Andocken In dieser Übung werden Sie einige interessante Arten kennen lernen, mit denen Flash Sie beim Zeichnen unterstützt: 1. Stellen Sie zuerst sicher, dass AUSRICHTEN im Menü ANSICHT aktiviert ist. Wählen Sie nun das Rechteck-Werkzeug aus und zeichnen Sie ein Quadrat. Sie werden durch den dunklen Ring im Cursor dabei unterstützt (siehe Abbildung 2.31).

Abbildung 2.31: Wenn Sie mit dem Rechteck-Werkzeug arbeiten und das AUSRICHTEN eingeschaltet ist, macht ein dunkler Ring Sie darauf aufmerksam, dass Sie ein perfektes Quadrat zeichnen.

2. Wählen Sie nun das Linien-Werkzeug, um eine Linie mit 45° zu zeichnen. Dieses Mal müssen Sie (ª) gedrückt halten, damit Sie unterstützt werden. 3. Nun wollen wir die Linie mit einer Ecke des Quadrates verbinden. Wählen Sie dazu das Pfeil-Werkzeug. Stellen Sie sicher, dass der Cursor das Kantensymbol anzeigt, bevor Sie die Linie bewegen. Ziehen Sie nun das obere Ende der Linie an die obere

83

Malen und Zeichnen

rechte Ecke des Quadrates. Sie werden feststellen, dass Sie dabei wieder unterstützt werden. 4. Im letzten Schritt wurde der Winkel unserer Linie verändert. Deshalb machen Sie ihn bitte mit (Strg)+(Z) wieder rückgängig. Versuchen Sie es etwas anders: Klicken Sie zuerst auf die Linie, um diese auszuwählen. Gehen Sie dann wie im Punkt drei vor, um das Ende der Linie mit der Ecke des Quadrates zu verbinden. Diesmal wird der Winkel nicht verändert. Das einzige Hindernis in diesem Schritt ist, dass Sie den dunklen Ring nur sehen, wenn Sie die Linie an einer Ecke oder genau in der Mitte »aufgehoben« haben. Sollten Sie den Ring also nicht sehen, lassen Sie die Linie los und versuchen Sie es noch einmal. 5. Zeichnen Sie nun zwei Linien in der Nähe der ersten Linie, die etwa parallel dazu verlaufen. 6. Verlängern Sie die Linien nun wie in Abbildung 2.32 angezeigt. Ziehen Sie dabei die Endpunkte der Linien an die Ecken des Quadrates und an den Endpunkt der ersten Linie.

Abbildung 2.32: Man kann Linien verbinden, indem man die Endpunkte verschiebt.

7. Jetzt prüfen wir, ob alle Linien wirklich verbunden sind: Verwenden Sie das PfeilWerkzeug, um den Punkt zu bewegen, an dem sich die drei Linien treffen. Wenn die Linien richtig verbunden sind, werden sich alle drei Linien gleichzeitig bewegen und sich nicht vom Quadrat ablösen. Diese Übung hat Ihnen einen kleinen Vorgeschmack von der Unterstützung durch Flash beim Zeichnen gegeben. Gehen wir doch einmal von horizontalen und vertikalen Linien aus. Wenn Sie die vertikale Linie in der Mitte aufheben und mit einem Ende der horizontalen Linie verbinden, können Sie danach den Verbindungspunkt nach außen ziehen, um

84

Zusammenfassung

so einen perfekten Pfeil zu erzeugen. Im Anhang D werden Sie weitere Figuren kennen lernen, die man ganz einfach erzeugen kann. Nebenbei: Wenn Sie ANSICHT / LINEALE aktivieren, können Sie Hilfslinien auf die Bühne ziehen (in ein Lineal klicken und bei gedrückter Maustaste auf die Bühne ziehen). Vorausgesetzt, ANSICHT / HILFSLINIEN / AN HILFSLINIEN AUSRICHTEN ist aktiviert, können Sie diese Hilfslinien genauso wie echte Linien verwenden, um Objekte daran auszurichten. Allerdings dienen die Hilfslinien nur zur Unterstützung. Für das Publikum sind sie unsichtbar. Abschließend sei gesagt, dass man das Andocken auch kurzzeitig ausschalten kann, wenn es störend ist. Das ist z.B. sinnvoll, wenn man zwei Linien wirklich eng nebeneinander zeichnen will, diese sich aber nicht berühren sollen. Außerdem können Sie die »Klickgenauigkeit« des Andockens unter BEARBEITEN / VOREINSTELLUNGEN in der Registerkarte Bearbeitung verändern.

2.4

Zusammenfassung

Dieses lange Kapitel hat praktisch jedes Zeichen-Werkzeug in Flash betrachtet. Wir haben Linien, Füllungen, kombinierte Figuren und Text kennen gelernt. Nachdem Sie einige Objekte gezeichnet haben, konnten Sie sogar die Farben, Ränder, die Position, Skalierung und die Rotation verändern. Außerdem wissen Sie jetzt, wie man Figuren zusammenfügt.Auch wenn Sie denken, dass Sie keine Kunst erstellen (vielleicht arbeiten Sie mit jemandem zusammen, der sich für einen »Künstler« hält), sollten Sie zwei wichtige Konzepte verstanden haben: Erstens ist die Datei umso kleiner, je einfacher die Figuren sind. Zweitens sind nur Figuren zusammengefügt, die wirklich angedockt wurden. Damit Sie kreativ werden können, hat Ihnen dieses Kapitel die Grundlagen des Zeichnens mit Flash vermittelt.

85

Malen und Zeichnen

2.5

Workshop

F&A F

Was ist das für ein eigenartiger Anfasser in der Mitte des ausgewählten Objektes, wenn das Frei transformieren-Werkzeug aktiv ist? A

F

Warum scheint mein Pinsel-Werkzeug zuerst zu funktionieren, wenn ich zeichne. Wenn ich dann aber fertig bin, erscheint nichts auf der Bühne? A

F

Wir werden im vierten Kapitel noch auf einige dieser Optionen und Werkzeuge eingehen. Auch wenn Sie in diesem Kapitel erst die Grundlagen gelernt haben, dürfen Sie gerne schon weitere Werkzeuge und Optionen ausprobieren.

Warum haben meine Linien immer so abgerundete Enden, egal, wie kurz ich sie mache? A

86

Wahrscheinlich haben Sie in der Option Pinselart die Einstellung In Auswahl malen aktiviert. Wenn Sie dann nichts ausgewählt haben, wird auch nichts gezeichnet.

Anscheinend gibt es noch viel mehr Werkzeugoptionen, die wir noch nicht besprochen haben. Werden diese später noch behandelt? A

F

Dabei handelt es sich um den Drehmittelpunkt, um den das Objekt rotiert wird.

Der Endpunkt einer Linie ist wirklich nur ein Punkt. Außerdem ist die Dicke der Linie als doppelter Radius um jeden Linienpunkt definiert. Eine 8-Punkt-Linie hat also immer eine 4-Punkt-Kappe an jedem Ende. Wenn Sie dies vermeiden wollen, können Sie die Linie in eine Füllung umwandeln (MODIFIZIEREN / FORM / LINIEN IN FÜLLUNGEN KONVERTIEREN) und danach die Enden stutzen.

Workshop

Quiz Bitte versuchen Sie zuerst selbst eine Antwort auf die Übungsfragen zu erarbeiten, bevor Sie die Lösung nachschlagen. 1. Was passiert, wenn Sie sowohl die Füllfarbe als auch die Linienfarbe auf KEINE FARBE setzen und dann ein Rechteck zeichnen? a.

Es wird ein schwarzes Rechteck gezeichnet, Farben fehlen.

b. Man kann versuchen zu zeichnen, aber es erscheint nichts auf dem Bildschirm. c. Flash wird abstürzen und Sie werden so etwas nie wieder zu tun. 2. Die Schnelltaste für das Pfeil-Werkzeug ist (A), für das Freihand-Werkzeug (Y) und für den Pinsel (B). Wo kann man die Schnelltasten der anderen Werkzeuge am besten nachschlagen? a.

Am Anfang dieses Buches

b. Auf der Macromedia-Homepage c. Bewegen Sie einfach den Cursor über das Werkzeug und warten Sie einen Moment. Nach kurzer Zeit haben Sie die Antwort direkt vor Ihrer Nase. 3. Gibt es mehr als eine Möglichkeit, die Füllfarbe zu verändern? a.

Ja, man kann die Füllfarbe an jeder Stelle, an der man ein Farbfeld sieht, einstellen.

b. Ja, es gibt viele Stellen, an denen man die Füllfarbe einstellen kann. Alle anderen Füllfarben-Farbfelder werden angeglichen, egal wo man sie verändert. c. Nein, man muss die Füllfarbe immer in der Werkzeugleiste am Farbfeld mit dem Eimer daneben einstellen.

Übung Versuchen Sie selbst, perfekte geometrische Figuren (zum Beispiel eine Röhre) zu erzeugen. Wenn Sie ein paar Beispiele suchen, finden Sie einige in Anhang A.

87

Grafiken in Flash importieren

3

Grafiken in Flash importieren

In den ersten beiden Lektionen haben wir gesehen, wie man in Flash einfache Grafiken mit recht wenig Aufwand erstellen kann. Unabhängig davon, wie mächtig die Flash-Werkzeuge sind, kann es manchmal wichtig sein, Grafiken zu importieren, die woanders erzeugt wurden. Zwei wichtige Gründe wären das Verwenden eines Fotos oder einer bestehenden Grafik (anstatt sie neu zu erstellen). Selbstverständlich kann man solche Grafiken auch in Flash verwenden – und genau das lernen wir in diesem Kapitel. Dieses Kapitel wird sich besonders mit folgenden Punkten befassen: 쐽

Vektorgrafiken in Flash importieren

쐽

Rastergrafiken importieren

쐽

Wege kennen lernen, wie man Grafikimporte vermeidet

쐽

Optimieren und die beste Qualität beim Import sicherstellen

3.1

Vektor- versus Rastergrafiken

Vektorgrafiken verfügen über bestimmte Eigenschaften, die sich daraus ergeben, wie sie im Computer gespeichert werden. Eine Vektorgrafik enthält die mathematischen Formeln, um das Bild auf den Bildschirm zu zeichnen. Beispielsweise enthält ein Kreis Informationen wie Radius, Liniendicke und Farbe. Alle Grafiken, die Sie in Flash erstellen, sind vektorbasiert. Solche Grafiken haben zwei Vorteile: Die Dateigröße bleibt klein (deshalb lässt sie sich schnell herunterladen) und das Bild lässt sich beliebig vergrößern, ohne dass die Qualität dabei leidet (ein Kreis bleibt immer ein Kreis, auch wenn es ein großer Kreis ist). Vektorgrafiken sind sehr gut, aber es ist wichtig, auch deren Nachteile zu kennen. Bei solchen Grafiken muss der Computer des Anwenders mehr arbeiten als bei der Anzeige eines anderen Bildes (es gibt halt viel zu rechnen). Außerdem sehen Vektorgrafiken oft schlichter aus als andere, da sie aus geometrischen Figuren zusammengesetzt sind. Beide Nachteile lassen sich auf ein Minimum reduzieren, allerdings sollte man sie immer im Hinterkopf behalten. Rastergrafiken unterscheiden sich grundlegend von Vektorgrafiken. Eine Rastergrafik enthält die Farbinformation für jeden einzelnen Bildpunkt. Wenn das Bild 100x100 Bildpunkte groß ist, gilt es 10.000 Bildpunkte mit einer eigenen Farbe zu versehen. Deshalb sind Rastergrafiken immer relativ große Dateien. Außerdem kann man Rastergrafiken nicht gut vergrößern. Sie tendieren dazu, eine sehr grobe Körnung zu erhalten. Das kennen Sie sicher von Vergrößerungen bei Fotos. Ein Vorteil solcher Grafiken ist allerdings, dass sie auf dem Bildschirm sehr schnell angezeigt werden können. Es mag so aussehen, als ob Vektorgrafiken grundsätzlich die bessere Wahl seien. Allerdings sollte man die Entscheidung, ob man eine Vektor- oder eine Rastergrafik verwendet, davon abhängig machen, welche Art von Bild dargestellt werden soll. Wenn das Bild sehr geome-

90

Gute Gründe, warum man den Grafikimport vermeiden sollte

trisch aufgebaut ist und noch dazu klare Farbdefinitionen aufweist, ist eine Vektorgrafik die bessere Wahl. Handelt es sich aber um die Fotografie einer Person oder aber eine Landschaft, lässt sich eine Rastergrafik nicht umgehen. Die Entscheidung, welches Format man nutzen sollte, ist recht einfach; allerdings hat jedes seine Eigenheiten.

3.2

Gute Gründe, warum man den Grafikimport vermeiden sollte

Die Möglichkeit, sehr schöne Vektorgrafiken in Flash zu erstellen, ist wahrscheinlich die beste Rechtfertigung dieser Warnung: Importieren Sie keine Grafiken in Flash, ohne es wirklich zu müssen! Das ist es, was wir in diesem Kapitel lernen werden – allerdings heißt es nicht immer, dass es eine gute Idee ist. Wenn es einen Weg gibt, um Flash-Dateien im Download zu verzögern oder langsamer abspielen zu lassen, ist es der, unnötigerweise Grafiken zu importieren. Es ist also absolut wichtig, Wege zu finden, den Grafikimport zu vermeiden. Wahrscheinlich ist es ein natürlicher Instinkt, dass man Grafiken importieren will. Wenn man einem Grafikdesigner (der Experte in Illustrator oder Freehand ist) zeigt, wie man mit Flash arbeitet, wird seine erste Frage sein, wie man Illustrator- oder Freehand-Dateien in Flash importiert. In diesem Kapitel lernen Sie die Antwort. Wenn man genau betrachtet, warum der Grafik-Profi überhaupt fragt, stellt sich ein Problem: Manche Leute können sehr anspruchsvolle oder auch komplizierte Grafiken mit anderen Hilfsmitteln erzeugen. Solche Grafiken in Flash einzubinden, verursacht zwei Probleme. Manchmal kommt Flash nicht mit sehr großen und komplizierten Dateien zurecht. Auf der anderen Seite wird eine komplizierte Datei mehr Zeit für den Download benötigen und darüber hinaus auch noch langsamer abgespielt werden. Warum sollte man eine solche Datei also in seinem Flash-Film verwenden? Die erste Überlegung bei der Entscheidung, eine Grafik in Flash zu importieren, sollte die sein, ob man eine einfache Version in Flash neu erstellen kann oder ob die Grafik wenigstens vereinfacht werden kann, bevor man sie importiert. Wenn man dem Grafiker vorschlägt, die Datei in Flash neu zu erzeugen, kann es sein, dass er antwortet, dass Flash ihm nicht die Möglichkeiten für seine Arbeit bietet. Wenn das so ist, liegt die Lösung darin, die Grafik vor dem Import zu vereinfachen – und nicht, sie in Flash hineinzuquetschen. Allerdings werden Sie in einigen anderen Fällen einen Grafikimport nicht vermeiden können. Angenommen, Sie haben eine Fotografie, die Sie in Flash verwenden wollen, oder Sie besitzen eine einfache Vektorgrafik, die Sie nicht in Flash neu zeichnen wollen. Wir werden Rastergrafiken noch im weiteren Verlauf dieses Kapitels besprechen, uns aber zuerst mit Vektorgrafiken befassen.

91

Grafiken in Flash importieren

3.3

Vektorgrafiken importieren

Es kann durchaus vorkommen, dass Sie eine bereits existierende Vektorgrafik in Ihrem Flash-Film verwenden wollen. Typischerweise ist so eine Grafik relativ geometrisch – obwohl das nicht immer so sein muss. Unabhängig von der exakten Form der Grafik – es sei denn, sie ist extrem kompliziert – können Sie diese in Flash importieren.

Aus einer Datei Ein Weg, Grafiken aus anderen Anwendungen in Flash einzubinden, ist das Importieren einer Datei. Das ist so einfach, wie DATEI / IMPORTIEREN zu wählen und dann auf die entsprechende Datei zu klicken (siehe Abbildung 3.1). Wie Sie sehen, gibt es eine große Anzahl von Dateitypen, was aber nicht heißt, dass sie alle gleich gut importiert werden können. Außerdem sind nicht nur Raster- und Vektorgrafikformate aufgelistet, sondern es stehen noch zusätzliche Video- und Audioformate zur Verfügung. Betrachten wir zuerst die Vektorgrafikformate.

Abbildung 3.1: Grafik-, Audio- und Video-Dateien in Flash zu importieren ist sehr einfach.

Obwohl sehr viele Dateitypen zur Verfügung stehen, gibt es nur vier Vektorgrafikformate, die der Rede wert sind: Freehand (.fh7 bis .fh9), Illustrator (.ai), Illustrator EPS und Flash Player (.swf). Generell ist Freehand die beste Option. Die einzigen Illustrator-Versionen, die unterstützt werden, sind 3.0, 4.0, 5.0, 6.0 und 8.0. Künstler, die mit Illustrator in der Version 8 oder höher arbeiten, brauchen lediglich beim Abspeichern die Version 8 oder niedri-

92

Vektorgrafiken importieren

ger (aber nicht 7, keine Ahnung wieso) anzugeben. Leider gehen dabei eventuell einige sichtbare Elemente verloren. Deshalb ist es wohl die bessere Wahl, die .swf-Exportfunktion von Illustrator zu nutzen. (Damit werden wir uns später noch beschäftigen). Wenn Sie eine .ai-Datei besitzen, können Sie versuchen, diese Datei in Flash zu importieren. Allerdings kann es zu einer sehr schmerzvollen Erfahrung führen, wenn das nicht richtig funktioniert. Das Ergebnis wird nicht so aussehen, wie Sie es erwarten. Sie können es in Abbildung 3.2 sehen. Zu einem schlechten Ergebnis führt es, wenn eine IllustratorVersion verwendet wird, die größer als 6 ist und Flash die Datei nicht interpretieren kann. Um das zu vermeiden, müssen Sie die Datei lediglich in einer aktuellen Illustrator-Version öffnen und die Prozedur mit der gespeicherten Kopie durchführen. Abbildung 3.2: Wenn Sie eine zu neue IllustratorDatei importieren wollen, kann dies zu verheerenden Ergebnissen führen.

Freehand-Dateien importieren Flash kann anstandslos Freehand-Dateien importieren. Wenn Sie mit Freehand vertraut sind, wird dies wahrscheinlich die beste Möglichkeit sein, Vektorgrafiken in Flash zu importieren. Klicken Sie dazu in Flash einfach DATEI / IMPORTIEREN und wählen Sie die Freehand-Datei aus, die Sie importieren wollen. Jetzt werden Sie mit dem FreehandImport-Dialog (siehe Abbildung 3.3) konfrontiert.

Abbildung 3.3: Nachdem eine Freehand-Datei importiert wurde, zeigt Flash diesen Dialog an.

93

Grafiken in Flash importieren

Flash stellt eine Vielzahl von Optionen zur Verfügung, wenn man eine Freehand-Datei importieren will. Die Zuordnung-Auswahlen geben Ihnen die Möglichkeit, zu bestimmen, wie in Flash mit bestimmten Eigenheiten von Freehand umgegangen werden soll. Beispielsweise hat eine Freehand-Datei »Seiten«, von denen Flash wissen muss, wie diese zu handhaben sind. Die Optionen sind im Einzelnen leicht verständlich und Sie müssen wissen, wofür sie stehen. Allerdings gibt es einige Punkte, die Sie beachten sollten, wenn Sie in Freehand Dateien erzeugen, um einen späteren Import nach Flash reibungslos ablaufen zu lassen. Es folgen ein paar Tipps, die Ihnen dabei helfen sollen, Ihre Zeichnungen nach Flash zu importieren. Zuerst einmal sollten Sie die Symbole von Freehand benutzen, da diese direkt in die Symbole von Flash transformiert werden und somit Grafiken wiederverwendet werden können. Wir werden Symbole in Flash noch genauer in Kapitel 5 behandeln. Außerdem sollte jedes Objekt in Freehand in einige Ebenen unterteilt werden. Die Datei lässt sich später besser importieren, wenn Sie mehrere Ebenen verwenden. Es gibt einige Texteffekte, die man in Freehand verwenden kann, die allerdings nicht nach Flash übersetzt werden können. Wenn Sie beispielsweise einen Text mit einem Pfad verknüpft haben, wird er in Flash nicht mehr editierbar sein. Außerdem unterstützt lediglich Freehand verschiedene Stricharten für Text, sodass dieser Effekt von Flash ignoriert wird. In Freehand kann man die Schriftgröße sehr fein abstimmen, was in Flash nicht so gut funktioniert. Das hat zur Folge, dass die Schriftgröße in Flash leicht abweichen kann. Manchmal passiert es, dass Texte aus Freehand in Flash direkt zu Vektoren konvertiert werden (was wiederum bedeutet, dass der Text nicht mehr editierbar ist). Dies sind nur ein paar grundlegende Tipps. Wenn Sie wirklich Dateien erstellen wollen, die reibungslos nach Flash konvertiert werden können, sollten Sie zusätzlich noch ein wenig mit Freehand experimentieren.

EPS-Dateien importieren Ein anderes Vektorformat ist EPS (Encapsulated PostScript). Leider gibt es viele Variationen dieses Formats (wie beispielsweise PhotoShop EPS). Allerdings ist die einzige EPSVariante, die Flash unterstützt, das so genannte Illustrator-EPS. Die beste Möglichkeit, herauszufinden, ob Ihre Datei importiert werden kann, ist es, es einfach auszuprobieren. Wenn der Import fehlschlägt, kann es passieren, dass die Anzeige in Flash nicht wie erwartet aussieht oder dass sogar eine Fehlermeldung (siehe wiederum Abbildung 3.3) erscheint, die Ihnen mitteilt, dass es ein Problem gibt. Von allen Optionen, die man für den Import von Vektorgrafiken einstellen kann, ist EPS wahrscheinlich die schlechteste Wahl, denn es arbeitet nicht immer verlässlich. Der Import mag unter bestimmten Umständen erfolgreich sein, dann aber unter leicht veränderten Umständen wieder fehlschlagen. Wenn Sie festlegen können, unter welchen Umständen der Import funktioniert, haben Sie Glück – aber das ist leichter gesagt als getan.

94

Vektorgrafiken importieren

Flash-Player-Dateien importieren Die wohl verlässlichste Methode (mal abgesehen von Freehand-Dateien) ist der Import von Flash-Player-Dateien. Viele Grafikdesigner denken gar nicht über .swf-Dateien als Dateiformat nach, allerdings sind sie inzwischen schon ein Standard geworden. Natürlich ist eine .swf-Datei nicht mit einer Freehand- oder Illustrator-Datei vergleichbar, da sie nicht voll editierbar ist. Freehand 9 und Illustrator 9 erlauben es Ihnen, funktionsfähige Dateien als .swf-Dateien abzuspeichern. Das Ergebnis ist erstaunlich gut. Das kann man an zwei Eigenschaften beweisen: Die endgültige Datei ist kleiner und das Bild enthält immer noch alle Details und die Qualität des Originals. Wenn Sie Probleme beim Export von .swf-Dateien haben, sollten Sie ein wenig mit den Optionen experimentieren, die von den jeweiligen Programmen zur Verfügung gestellt werden. Einige dieser Dialoge werden in Abbildung 3.4 gezeigt. Natürlich kann ich nicht auf jede einzelne Option eingehen, allerdings werden Sie feststellen, dass es Parallelen zwischen allen Dialogfenstern gibt.

Freehand 10 (Schaltfläche Einrichten)

95

Grafiken in Flash importieren

Illustrator 10

Illustrator 8 mit dem »Flash Writer«-Plugin (englische Version) Abbildung 3.4: Hier sehen Sie einige Dialoge, die erscheinen, wenn man mit Freehand oder Illustrator eine .swf-Datei exportieren will.

Zusätzlich zu der Möglichkeit, .swf-Dateien zu exportieren, gibt es einige spezielle Techniken, die man ausprobieren kann. Diese werden im späteren Verlauf dieses Kapitels noch besprochen. Im besten Fall kann man dadurch die Grafik weniger komplex gestalten, was den Import wiederum vereinfacht.

96

Vektorgrafiken importieren

Aus anderen Programmen Die nachfolgende Technik erfüllt ihren Zweck – allerdings nicht wirklich gut. Ich will sie dennoch vorstellen, da sie für einfache Grafiken sehr schnell ist. Öffnen Sie dazu Ihre Grafik in einem beliebigen Grafikprogramm, während Flash geöffnet ist. Wählen Sie nun den Inhalt aus und kopieren Sie ihn. Wechseln Sie zu der geöffneten Flash-Datei und fügen Sie den Inhalt wieder ein. Wenn Sie diese Technik verwenden möchten, sollten Sie sich die Registerkarte Zwischenablage (siehe Abbildung 3.5) aus dem Menü BEARBEITEN / VOREINSTELLUNGEN etwas genauer ansehen.

Abbildung 3.5: In den Eigenschaften der Zwischenablage wird eine Option zur Verfügung gestellt, mit der man festlegen kann, wie FreehandText gehandhabt werden soll.

Diese Vorgehensweise hört sich im Gegensatz zum letzten Absatz sehr einfach an. Lassen Sie sich aber nicht täuschen, denn sie arbeitet nicht immer perfekt. Was eigentlich passiert, ist Folgendes: Der Inhalt in einem globalen Dateiformat wird in die Zwischenablage gelegt. Die Umwandlung hängt vom jeweiligen Format ab, ist aber vergleichbar mit dem Export und anschließenden Import einer EPS-Datei (nur funktioniert es vollautomatisch). Wenn das klappt, haben Sie Glück. Falls nicht, sollten Sie auf die bereits besprochenen Import-Methoden zurückgreifen oder noch besser: die Datei in Flash neu erstellen.

97

Grafiken in Flash importieren

So stellen Sie die Bild-Integrität sicher So leicht sich die Export/Import-Funktionalität anhören mag, so frustrierend kann es sein, wenn sie nicht funktioniert! Die beste Möglichkeit, qualitativ hochwertige Bilder zu erzeugen, ist tatsächlich, alle in Flash zu zeichnen. Für die Ausnahmen, bei denen Sie bereits existierende Bilder importieren müssen, gibt es einige Punkte zu beachten, damit die BildIntegrität auch nach dem Export erhalten bleibt. Einige dieser Tipps sind überflüssig, wenn man .swf-Dateien entweder von Illustrator oder Freehand importieren will. Als erstes Beispiel wären Schrifteffekte zu nennen. Einige Programme bieten eine fast unerschöpfliche Auswahl an Effekten, die sich auf Schriftarten anwenden lassen. Leider ist das bei Flash nicht der Fall. Die erste Überlegung bei Text sollte sein, ob dieser später in Flash noch editiert werden muss. Falls Sie den Text in Flash nicht mehr bearbeiten müssen, entstehen die besten Ergebnisse, wenn Sie ihn zuerst in Vektoren umwandeln. Dazu finden Sie in Freehand eine Option, die es Ihnen ermöglicht, die Konvertierung beim Export in eine .swf-Datei automatisch durchzuführen. Natürlich werden Sie nicht mehr in der Lage sein, den Text zu bearbeiten, nachdem Sie diesen Vorgang durchgeführt haben. Deshalb sollten Sie immer zuerst eine Sicherheitskopie erstellen. Zusätzlich könnte es nämlich passieren, dass die Dateigröße anschwillt. Wir werden uns in Kapitel 20 noch genauer mit der Dateigröße beschäftigen.

Abbildung 3.6: Nicht selten ist eine importierte Datei viel größer, als sie eigentlich sein müsste. Dieser Farbverlauf besteht beispielsweise aus vielen konzentrischen Kreisen.

Wenn Sie allerdings Farbverläufe benutzen, sollten Sie auf den Export von .swf-Dateien verzichten. Ein einfacher Farbverlauf kann beispielsweise eine Vielzahl von Kreisen für jede Farbstufe enthalten. Stellen Sie sich aber vor, Sie würden Hunderte von konzentri-

98

Vektorgrafiken importieren

schen Kreisen importieren, die sich nur durch eine unterschiedliche Größe und eine leicht andere Farbe unterscheiden. Diesen Effekt können Sie beispielsweise in Abbildung 3.6 sehen, wenn Sie versuchen, ein Quadrat zu verschieben, welches mit einem Farbverlauf gefüllt ist. Daran kann man sehr gut erkennen, dass ein solcher Farbverlauf eine viel größere Datei erzeugt und noch dazu den Film verlangsamt. Mit anderen Worten: Dieser Farbverlauf ist viel komplizierter, als er eigentlich sein müsste (im nächsten Kapitel werden wir uns mit Farbverläufen in Flash beschäftigt).

Das Zusammenspiel zwischen Flash und anderen Vektorprogrammen Nehmen wir einmal an, Sie importieren eine Grafik, die Sie woanders erstellt haben. Danach bearbeiten Sie sie in Flash und stellen fest, dass die Grafik noch einmal im Originalprogramm bearbeitet werden muss. Diese Vorgehensweise ist durchaus denkbar, funktioniert in den meisten Fällen aber nicht zufrieden stellend. Gerade weil es dabei sehr oft Fehler gibt, ist die Frage berechtigt, ob so etwas wirklich nötig ist. Natürlich können Sie diese Situation vermeiden, wenn Sie die Grafiken direkt in Flash erstellen. Allerdings kann es durchaus sein, dass Sie ein anderes Grafikprogramm gewählt haben, weil dort mehr Funktionen zur Verfügung stehen. Wenn das andere Programm aber so großartig ist, warum nehmen Sie dann nicht auch die Änderungen, die Sie zuerst mit Flash durchführen wollten, direkt in diesem Programm vor – anstatt zu versuchen, die mit Flash bearbeitete Datei wieder einzulesen? Die beste Möglichkeit, ein editierbares Vektorgrafikformat aus Flash zu exportieren, ist das Format Adobe Illustrator (.ai). Im einfachsten Fall werden Sie wahrscheinlich ein einzelnes Bild exportieren. Dazu können Sie einfach das Menü DATEI / BILD EXPORTIEREN und dann das Illustrator-Format auswählen. Diese Datei können Sie nun mit jedem Grafikprogramm finden, das .ai-Dateien lesen kann. Leider kann Ihnen niemand versprechen, dass diese Vorgehensweise immer ohne Fehler funktionieren wird. Es scheint aber so, als sei dies die beste Möglichkeit. Wenn es sich um eine einfache Grafik handelt, können Sie versuchen, die Technik des Kopierens und Einfügens zu verwenden. Normalerweise funktioniert das bei kleinen Grafiken, allerdings kann es passieren, dass sich die Grafik unterscheidet, wenn Sie sie wieder nach Flash zurückbringen. Sie werden beispielsweise Linien nicht mehr so verbiegen können, wie Sie es vorher konnten, bevor Sie die Grafik in ein anderes Programm exportiert hatten. Ich habe schon sehr viele Techniken ausprobiert und das einzige, was ich definitiv festgestellt habe, ist, dass man sehr viele verschiedene Optionen ausprobieren muss, bevor man die Einstellung findet, die gut funktioniert. Im Folgenden fasse ich die Hauptpunkte dieses Abschnitts zusammen:

99

Grafiken in Flash importieren

쐽

Versuchen Sie, alle Grafiken in Flash zu erstellen.

쐽

Wenn Sie auf andere Programme ausweichen, um Grafiken zu erstellen, versuchen Sie, diese nicht zu kompliziert zu machen.

쐽

Wenn Sie Dateien von anderen Vektorprogrammen importieren müssen, ist es meist die beste Möglichkeit, das .swf-Format zu verwenden, da sich dieses problemlos nach Flash importieren lässt.

쐽

Eine Alternative zum .swf-Format ist, Grafiken in Freehand zu erstellen und Flash diese Datei importieren zu lassen. Für diese Vorgehensweise sollten Sie jedoch mit Freehand gut vertraut sein. Der große Vorteil bei dieser Methode ist, dass die BildBestandteile auch in Flash noch editierbar bleiben.

쐽

Wenn Sie eine Datei aus Flash exportieren, in einem anderen Programm bearbeiten und dann nach Flash zurückholen (was eigentlich schon nach Ärger riecht), sollten Sie das Illustrator-Format .ai wählen.

쐽

Abschließend sei gesagt, dass Sie immer mehrere Einstellungen ausprobieren und dabei die Dateigröße im Auge behalten sollten (was wir in Kapitel 20 noch genauer besprechen werden).

3.4

Bitmaps verwenden

In diesem Abschnitt werden wir lernen, wie man Bitmaps (Rastergrafiken) in Flash verwenden kann. Es gibt einige Charakteristika von Rastergrafiken, die so nicht mit Flash erzeugt werden können. Die einzige Warnung, die man beachten sollte, wenn man Rastergrafiken verwendet, ist: Stellen Sie fest, ob Sie wirklich Rastergrafiken benötigen. Es folgt eine Zusammenfassung von Einsatzgebieten, in denen Rastergrafiken nicht wegzudenken sind: 쐽

Eine Fotografie. Der einzige Zeitpunkt, an dem man über ein Vektorbild als Alternative zu einem Foto nachdenken kann, ist, wenn das Bild ein deutlich geometrisches Objekt zeigt.

쐽

Eine Serie von Standbildern, die aus einem Video stammt

쐽

Ein Bild mit Spezialeffekten, die nicht mit Vektoren erzeugt werden können (z.B. Wolken, Feuer, Wasser oder sonstige Natureffekte)

Wenn Sie noch nicht so vertraut mit dem Unterschied von Vektor- und Rastergrafiken sind, kann es einige Zeit dauern, bis Sie gelernt haben, die richtige Wahl zu treffen. Die Dateiformate .gif, .jpg, .png, .bmp und .pct sind allesamt Rasterformate. Das soll allerdings nicht heißen, dass jedes Bild in einem solchen Format nicht auch in einem Vektor-

100

Bitmaps verwenden

format denkbar wäre. Was in Wirklichkeit zählt, ist der Inhalt des Bildes. Wenn Sie also eine GIF-Datei vorliegen haben, sollten Sie sich diese zuerst ansehen, um zu entscheiden, ob hier eine Rastergrafik sinnvoll ist. Ich will Ihnen hier eine kleine Entscheidungsregel an die Hand geben: Wenn Sie sehen, dass Sie den Inhalt der Grafik auch in Flash erzeugen können, sind Sie besser beraten, das Bild auch in Flash zu erzeugen. Sollte es sich um ein Foto handeln, werden Sie wahrscheinlich nicht dazu in der Lage sein. In diesem Falle sollten Sie die Rastergrafik importieren. Wenn es sich allerdings um das Bild einer Schachtel handelt, können Sie diese wahrscheinlich genauso gut zeichnen und dabei die Vorteile einer Vektorgrafik nutzen, ohne die Rastergrafik-Bremse zu ziehen.

Rastergrafiken importieren Der Import eine Rastergrafik gestaltet sich sehr einfach. Wählen Sie das Menü DATEI / IMPORTIEREN, dann ein Rastergrafikformat und schließlich die Datei, die importiert werden soll. Das war's. Jedes Mal, wenn Sie eine Rastergrafik importieren, wird diese nicht nur auf die Bühne gelegt, sondern gleichzeitig als Objekt in die Bibliothek verschoben. Wenn Sie die Grafik auf der Bühne also löschen, bleibt das Objekt immer noch in der Bibliothek bestehen (siehe Abbildung 3.7).

Abbildung 3.7: Nachdem Sie eine Rastergrafik importiert haben, wird ein Grafikobjekt in die Bibliothek eingefügt.

Nachdem Sie eine Rastergrafik importiert haben, müssen Sie diese in der Bibliothek belassen. Hier können Sie übrigens festlegen, wie das Bild exportiert werden soll, wenn Sie

101

Grafiken in Flash importieren

einen Film für das Internet erstellen. Wenn Sie die Einstellungen unverändert lassen, wird das Bild mit den Standardeinstellungen exportiert. Sie können natürlich spezielle Einstellungen für jedes einzelne Bild festlegen. Lassen Sie uns eine Rastergrafik importieren und die einzelnen Optionen kennen lernen.

Übung: Importieren Sie eine Rastergrafik 1. Legen Sie einen neuen Film an und wählen Sie DATEI / IMPORTIEREN. Wählen Sie dann eine Rastergrafik aus (C:\Windows ist ein guter Ort zum Nachschlagen). 2. Klicken Sie auf die Grafik auf der Bühne und löschen Sie diese. Da es sich um eine Rastergrafik handelt, ist sie immer noch in der Bibliothek gespeichert. 3. Öffnen Sie die Bibliothek über FENSTER / BIBLIOTHEK bzw. (Strg)+(L). 4. Klicken Sie auf die Zeile in der Bibliothek, die mit dem Baumsymbol beginnt und den Namen der Datei enthält, die Sie importiert haben. 5. Im Bibliotheks-Options-Menü EIGENSCHAFTEN sollten Sie die Bitmap-Eigenschaften sehen (siehe Abbildung 3.8).

Abbildung 3.8: In diesem Fenster können Sie für jedes einzelne Bild einstellen, wie es später mit dem gesamten Film exportiert werden soll.

6. In diesem Fenster können Sie die Exporteigenschaften für die soeben importierte Grafik einstellen. Schließen Sie dieses Fenster bitte noch nicht, während Sie die nächsten Absätze lesen.

102

Bitmaps verwenden

Bitmap-Einstellungen verändern Flash kann alle möglichen Rastergrafikformate importieren, benutzt beim Export eines Films selbst aber lediglich die Formate JPG, GIF oder PNG. Da eine Grafik auch dann als Bitmap bezeichnet wird, wenn sie sich in der Flash-Bibliothek befindet, müssen Sie die Eigenschaften eines Bildes immer im Dialogfeld Bitmap-Eigenschaften verändern. Experimentieren Sie ein wenig mit den Bitmap-Eigenschaften, indem Sie auf die Schaltfläche Testen klicken, nachdem Sie die Einstellungen geändert haben. Beobachten Sie dabei sowohl das Bildfenster als auch die angegebene Dateigröße (siehe Abbildung 3.9).

Abbildung 3.9: Wenn Sie eine niedrige Grafikqualität (10) einstellen und danach den Knopf Testen drücken, sehen Sie sowohl einen Ausschnitt des Ergebnisbildes als auch die neue Dateigröße.

JPEG-Komprimierung ist normalerweise die effizienteste Option. Wenn Sie nicht gerade eine PNG- oder GIF-Datei importieren, wird Flash die Komprimierung automatisch auf JPG einstellen. Wenn Sie eine JPEG-Datei importieren, wird Flash zusätzlich die Optionen Importierte JPEG-Daten verwenden aktivieren (siehe Abbildung 3.10). In diesem Fall sollten Sie diese Einstellung unverändert lassen. Es gibt drei sinnvolle Vorgehensweisen, wenn Sie eine Rastergrafik nach Flash importieren wollen. Bei der ersten importieren Sie eine Datei mit der höchsten Qualität, die Sie aufbringen können (z.B. eine BMP-Datei) und experimentieren dann mit den Bitmap-Kompressions-Einstellungen von Flash, um den besten Kompromiss herauszufinden. Als zweites könnte man ein Dateiformat

103

Grafiken in Flash importieren

wählen, dass für die entsprechende Grafik eine hohe Qualität liefert und diese unkomprimiert in Flash übernehmen (was aber für eine große Datenmenge sorgt). Im dritten Fall können Sie eine andere Bildbearbeitungssoftware verwenden – wie zum Beispiel Paint Shop Pro – um eine JPEG-Datei mit dem besten Kompromiss zwischen Dateigröße und Qualität herzustellen. Diese Datei werden Sie direkt nach Flash importieren und mit der Original-Komprimierung abspeichern. Ich rate davon ab, eine bereits komprimierte Datei weiter zu komprimieren. Das Ergebnis wäre eine extrem schlechte Qualität.

Abbildung 3.10: Wenn Sie JPEG-Dateien importieren, können Sie die Original-Komprimierung beibehalten.

Auch wenn Sie andere gängige Formate, wie zum Beispiel BMP und PCT importieren, wird Flash mit der JPEG-Komprimierung arbeiten. Allerdings wird im Fenster BitmapEinstellungen die Option Standardqualität des Dokuments verwenden eingeblendet (siehe Abbildung 3.11). Auf den ersten Blick sieht diese Option ähnlich aus wie Importierte JPEG-Daten verwenden. In Wirklichkeit handelt es sich aber um eine ganz andere Option. Wenn Sie diesen Punkt ausgewählt lassen, wird das Bild mit den globalen Dokumenteinstellungen komprimiert. Dazu können Sie im Kapitel 20 und im Anhang C mehr lesen. Sollten Sie die soeben besprochene Option ausschalten, können Sie für dieses Bild individuelle Einstellungen angeben. In diesem Fall erscheint ein Feld, in dem Sie die JPEGQualität einstellen können. Wenn Sie hier eine kleine Zahl eingeben, wird die Dateigröße stark vermindert und die Qualität wird extrem nachlassen. Sollten Sie eine bessere Qualität wünschen, stellen Sie einen Wert ein, der in Richtung 100 geht (das ist gleichzeitig der Maximalwert). Betätigen Sie einfach die Schaltfläche Testen, um den besten Kompromiss zwischen Bildqualität und Dateigröße zu finden (siehe Abbildung 3.12).

104

Bitmaps verwenden

Abbildung 3.11: Wenn Sie andere als JPEG-Dateien importieren, wird die Option Standardqualität des Dokuments verwenden ein-

geblendet.

Abbildung 3.12: Wenn man bei diesem Bild die Qualität auf 8 stellt, ist die Dateigröße um 99% geschrumpft. Allerdings leidet die Qualität sehr stark.

Im Vorschaufenster oben links können Sie genau erkennen, wie das Bild aussehen wird, wenn es mit den angegebenen Einstellungen exportiert wird. Ein kleiner Tipp am Rande: Sie können das Bild mit der Maus bewegen. Außerdem stehen Ihnen einige Ansichtsoptionen zur Verfügung, wenn Sie auf das Vorschaubild rechtsklicken. In Abbildung 3.13 sehen Sie den Unterschied verschiedener Qualitätsstufen am gleichen Bild. Bitte beachten Sie, dass die Bilder JPEG 80 und JPEG 100 nahezu die gleiche Qualität haben, aber die Dateigröße von JPEG 80 weniger als ein Viertel der JPEG 100 Dateigröße ist.

105

Grafiken in Flash importieren

JPEG 10, 15 kb

JPEG 20, 24 kb

106

Bitmaps verwenden

JPEG 80, 87 kb

JPEG 100, 355 kb Abbildung 3.13: Die Ergebnisse verschiedener Kompressions-Raten beim gleichen Bild

Abschließend will ich noch die letzte Qualitätsstufe beschreiben: Sie heißt Verlustfrei (GIF/PNG). Sollten Sie also eine Datei in diesem Format importieren, wird die verlustfreie Komprimierung automatisch eingestellt. Allerdings können Sie diese Einstellung auch bei anderen Dateiformaten von Hand vornehmen. Sollte diese Option aktiv sein, wird Flash sozusagen die Original-Datei verwenden. Damit ist immer die beste Qualität sichergestellt.

107

Grafiken in Flash importieren

Allerdings müssen Sie dafür einen recht hohen Preis bezahlen: Die Dateigröße wird sehr stark anschwellen und das bedeutet eine lange Downloadzeit aus dem Internet. Diese Option lohnt sich eigentlich nur, wenn Sie eine Präsentation erstellen, die Sie beispielsweise auf CD oder in Ihrem lokalen Netzwerk verteilen wollen. Wenn das nicht der Fall ist, sollten Sie nur dann mit dem Gedanken spielen, diese Option zu benutzen, wenn die höchste Qualität des importierten Bildes absolut höchste Priorität hat.

Rastergrafiken in Vektorgrafiken konvertieren Es gibt zwei Standardsituationen, die förmlich danach schreien, eine Rastergrafik in eine Vektorgrafik zu konvertieren. Die erste Situation betrifft Grafiken, die im Vektorformat besser zu handhaben sind. Im zweiten Fall bringen Sie vielleicht Ihre künstlerische Ader zur Geltung, indem Sie Spezialeffekte über die Konvertierung erzeugen. Lassen Sie uns einmal eine solche Konvertierung durchspielen:

Übung: Wandeln Sie eine Rastergrafik in eine Vektorgrafik um 1. Erstellen Sie eine neue Datei und wählen Sie DATEI / IMPORTIEREN. Danach wählen Sie eine Grafik-Datei aus, die möglichst wenig Farbverläufe enthält (auf der CD-ROM habe ich im Verzeichnis Grafik/Raster einige Beispiele abgelegt).

Abbildung 3.14: Eine Rastergrafik sieht bei einer starken Vergrößerung eher wie eine »Klötzchengrafik« aus.

2. Vergrößern Sie die Ansicht der Grafik, um zu sehen, wie bei Rastergrafiken jeder einzelne Bildpunkt einzeln dargestellt wird. In hohen Vergrößerungen erhalten Sie eine »Klötzchengrafik« (siehe Abbildung 3.14), deshalb sollte man bei Rastergrafiken lieber die Finger von Vergrößerungen lassen.

108

Bitmaps verwenden

3. Wählen Sie das Bild aus und aktivieren Sie den Menüpunkt MODIFIZIEREN / BITMAP NACHZEICHNEN. Es erscheint ein Fenster mit einigen Einstellmöglichkeiten (siehe Abbildung 3.15). Tragen Sie bitte bei Farbschwelle den Wert 1 ein. Damit wird ausgedrückt, wie dicht zwei Farben beieinander liegen müssen, um als gleiche Farbe zu gelten. Kleinste Fläche gibt an, wie groß die kleinste Vektorfläche sein darf. Stellen Sie hier eine 10 ein. Lassen Sie Kurvenanpassung und Kantenschwelle auf dem Wert Normal. Klicken Sie nun auf OK.

Abbildung 3.15: Im Fenster Bitmap nachzeichnen können Sie festlegen, wie die Konvertierung in Vektoren vonstatten gehen soll.

4. Die Grafik besteht nun nur noch aus Vektoren. Vergrößern Sie die Ansicht wieder und Sie werden feststellen, dass Sie zwischen den einzelnen Farbbereichen klare Trennlinien haben, was für ein schärferes Bild sorgt. Ein Artefakt ist jedes ungewollte oder obskure Ergebnis eines Prozesses. Beispielsweise ist das Rauschen in einer Radiosendung ein Artefakt der Übertragung. Moiré-Effekte in Bildern von Magazinen, Farbverschiebungen im Fernsehen, Regentropfen auf der Kameralinse und Druckfehler in Büchern sind allesamt Beispiele für Artefakte. Genauso bringt der Vorgang Bitmap nachzeichnen in Flash fast immer solche Artefakte hervor. Ebenso erzeugt die JPEG-Komprimierung Artefakte, die am meisten auffallen, wenn Sie die Qualität auf einen sehr niedrigen Wert stellen. Je nachdem, welches Bild Sie ausgewählt haben, werden Sie mit dem Ergebnis mehr oder weniger zufrieden sein. Deshalb will ich Ihnen an dieser Stelle nicht vorenthalten, dass es für diese Zwecke spezielle Programme (z.B. Adobe Streamline) gibt. Bevor Sie sich allerdings teure Software zulegen, sollten Sie sich ein wenig mit den Einstellungen im zuvor besprochenen Fenster vertraut machen. 쐽

Während der Umwandlung wird Flash versuchen, Farbflächen voneinander zu trennen und in geometrische Figuren umzuwandeln. Farbschwelle gibt dabei an, wie stark die Farben voneinander abweichen dürfen, um noch als gleiche Farbfläche zu gelten. Wenn Sie den Wert sehr hoch ansetzen, wird das Ergebnis nur noch aus wenigen geometrischen Figuren bestehen.

쐽

Kleinste Fläche gibt an, wie groß die kleinste Fläche sein darf, die Flash erzeugen wird. Wenn Sie ein sehr detailliertes Bild haben, sollten Sie diesen Wert sehr klein halten (es sei denn, Sie wünschen einen Mosaik-Effekt).

109

Grafiken in Flash importieren

쐽

Kurvenanpassung gibt an, wie stark die Geraden und Kurven kopiert werden.

쐽

Kantenschwelle gibt an, ob Ecken bestehen bleiben oder entfernt werden sollen.

쐽

Man kann das Vektorisieren von Bildern auch für künstlerische Zwecke verwenden. Bitte behalten Sie dabei aber immer die Dateigröße im Auge.

Die Abbildungen 3.16 bis 3.19 sind verschiedene Beispiele von Rastergrafiken, die in Vektorgrafiken umgewandelt wurden....

Rechts: Farbschwelle 100, kleinste Fläche: 100 Abbildung 3.16: Hier wurden große, weiche Vektorflächen erstellt, die mit jeder beliebigen Farbe ausgefüllt werden können.

Mitte: Farbschwelle 10, kleinste Fläche: 100 Rechts: Farbschwelle 100, kleinste Fläche: 100 Abbildung 3.17: Bitte beachten Sie, dass im rechten Bild bei einer hohen Farbschwelle sogar die Fenster zusammengefasst werden

110

Bitmaps verwenden

Rechts: Farbschwelle 40, kleinste Fläche: 40 Abbildung 3.18: Ein besonders künstlerischer Effekt lässt sich erzielen, wenn man einen relativ kleinen Wert als Farbschwelle angibt und die kleinste Fläche an die Bildgröße anpasst

Unten links: Farbschwelle 110, kleinste Fläche: 10 Unten rechts: Farbschwelle 30, kleinste Fläche: 10 Abbildung 3.19: Die hohe Farbschwelle beim Bild unten links verursacht die Streifen am Himmel.

Bitmap-Sequenzen Obwohl Flash nun auch mit Videos umgehen kann (siehe Kapitel 17), wurde auch an die nächstbeste Möglichkeit gedacht – Bildsequenzen. Dabei handelt es sich um eine Serie von Standbildern. Sie mögen vielleicht denken, dass Sie ein echtes Video ansehen, was einige Leute bei einem Projekt, das ich vor kurzem in Flash erstellt habe, auch dachten (siehe Abbildung 3.20). Der Betrachter kann dabei Bildsequenzen betrachten, die zuvor einem Video entnommen wurden. Dabei handelt es sich aber nicht wirklich um »Video«,

111

Grafiken in Flash importieren

denn es fehlt am synchronisierten Ton. Der Prozess war eigentlich ganz einfach, denn man benötigt dazu nur eine Video-Bearbeitungssoftware, mit der man die einzelnen Bilder exportiert, um sie danach in Flash einzubinden. Das ist eine großartige Lösung, wenn man keinen Ton benötigt.

Abbildung 3.20: Auf der Homepage www.m-three.com finden Sie einige Actionsequenzen, die ein Video simulieren.

Vielleicht denken Sie jetzt, dass es recht lange dauern mag, die ganze Sequenz von Bildern zu importieren. Im Normalfall werden Sie von Flash dabei gut unterstützt. Wenn Sie eine Serie von Bildern erzeugt haben, die in ihren Dateinamen fortlaufende Nummern enthalten, und wenn sich dazu noch alle Bilder im gleichen Ordner befinden, importieren Sie lediglich das erste Bild und Flash wird automatisch nachfragen, ob Sie die restlichen Bilder auch noch einbinden wollen (siehe Abbildung 3.21). In diesem Fall wird Flash die restlichen Arbeiten für Sie erledigen, damit eine Bild-für-Bild-Animation entsteht. Dazu erhalten Sie weitere Informationen, wenn Sie das Kapitel 7 lesen. Abbildung 3.21: In den meisten Fällen wird Flash Sie unterstützen, wenn Sie eine Serie von Bildern importieren.

112

Zusammenfassung

3.5

Zusammenfassung

Erstellen Sie so viele Grafiken wie möglich direkt in Flash. Sollten Sie in diesem Kapitel auch nichts anderes gelernt haben, sollten Sie diesen Punkt doch immer im Hinterkopf behalten: Vermeiden Sie Grafikimporte, wann immer es geht. Allerdings mag es immer noch Ausnahmesituationen geben, in denen Sie Grafiken importieren wollen. Das kann zum Beispiel der Fall sein, wenn Sie eine Grafik besitzen, die man unmöglich in Flash neu zeichnen kann. Auch wenn es sich um ein Foto handelt, besteht so ein Ausnahmefall. Wenn kein Weg an einem Import vorbeiführt, sollten Sie jedoch versuchen, die Datei vor dem Import zu optimieren. Bei Rastergrafiken stehen Ihnen verschiedene Möglichkeiten zur Verfügung, die Dateigröße zu reduzieren. Außerdem können Sie solche Grafiken in Vektoren umwandeln.

3.6

Workshop

F&A F

Ich habe ein Foto, das ich als Rastergrafik in Flash einbinden will. Ich habe dieses Foto schon gescannt und will es nun abspeichern. Welches Dateiformat soll ich wählen? Es gibt einfach so viele. A

F

Wie kann ich herausbekommen, wie viel Speicherplatz eine Grafik im fertigen Film einnehmen wird? A

F

Normalerweise sollten Sie alle Grafiken im bestmöglichen Dateiformat abspeichern, bevor Sie diese nach Flash importieren. Wenn die Grafik dann einmal in Flash vorhanden ist, können Sie diese immer noch komprimieren. In diesem Falle empfehle ich Ihnen beispielsweise eine BMP-Datei. JPEG-Dateien sind bereits komprimiert und können 1:1 nach Flash übernommen werden.

Wenn es sich um eine Rastergrafik handelt, können Sie dieses im Fenster BitmapEinstellungen auslesen. Bei Vektorgrafiken ist das etwas schwieriger. Hier können Sie beispielsweise die einzelne Grafik herauskopieren und getrennt als SWF-Datei abspeichern. Betrachten Sie dann die Dateigröße. Damit haben Sie einen Richtwert, wie viel Speicherplatz diese einzelne Grafik im Gesamtfilm einnehmen wird.

Ich habe eine Rastergrafik importiert und in Vektoren umgewandelt. Das Ergebnis sieht sehr gut aus. Allerdings ist die Dateigröße angestiegen. Wie kann das sein? Vektorgrafiken sollten doch eigentlich kleiner sein als Rastergrafiken, oder?

113

Grafiken in Flash importieren

A

F

Nicht notwendigerweise. Hier handelt es sich um ein weit verbreitetes Missverständnis. Wahrscheinlich haben Sie die Einstellungen so gewählt, dass jeder einzelne Bildpunkt als Vektorfläche definiert wurde. Somit muss für jeden Bildpunkt nicht nur die Farbe, sondern auch eine mathematische Funktion, welche die Fläche angibt, festgehalten werden. Die Lösung des Problems liegt einfach darin, die Farbschwelle drastisch abzusenken, um größere Flächen zu erzeugen. Nur wenn die Grafik weniger kompliziert wird, kann man auch von kleineren Dateigrößen ausgehen.

Ich besitze eine Grafik, die eigentlich recht einfach ist. Allerdings kann man diese nicht in Flash erzeugen. Die einzige Lösung ist doch nun, sie zu importieren, richtig? A

Das klingt für mich wie ein Widerspruch: Die Grafik soll recht einfach sein, lässt sich aber nicht in Flash rekonstruieren? Wenn es sich gar nicht anders lösen lässt, importieren Sie diese Grafik ruhig. Sie sollten Sie aber möglichst zuvor als SWFDatei abspeichern.

Quiz Das Quiz soll Ihnen helfen, das gerade erworbene Wissen zu festigen. Bitte versuchen Sie zuerst selbst zu antworten, bevor Sie die Lösung nachschlagen. 1. Welches Grafikformat wird typischerweise nach Flash importiert? a.

Raster

b. Vektor 3. Das hängt vom Inhalt des Bildes ab. 2. Wenn Sie eine .gif-Datei nach Flash importiert haben und den gesamten Film speichern: Welche Kompressionsrate verwendet Flash dann für dieses Bild? a.

Das hängt von der Einstellung Komprimierung im Dialog Bitmap-Eigenschaften ab.

b. Flash verwendet immer eine JPEG-Komprimierung. Lediglich der Komprimierungsgrad hängt von den Einstellungen ab. c. GIFs werden als GIFs exportiert. 3. Wenn Sie eine Illustrator-Datei importiert haben, das Ergebnis aber nur einen Haufen undefinierbarer Skizzen anzeigt, was haben Sie dann wahrscheinlich falsch gemacht? a.

Sie haben die »Einfachheits«-Regel gebrochen.

b. Sie haben irrtümlicherweise eine Rastergrafik importiert. c. Sie haben versucht, eine Illustrator-Datei mit einer höheren Versionsnummer als 6 zu importieren.

114

Fortgeschrittene Zeichentechniken

7 4

Fortgeschrittene Zeichentechniken

Wir haben die letzten beiden Kapitel damit verbracht, grundlegende Zeichen- und Grafikimport-Fähigkeiten zu erlernen. In diesem Kapitel werden Sie Ihr Wissen vertiefen und weiterführende Techniken kennen lernen. Wenn Sie ein erfahrener Illustrator- oder Freehand-Anwender wären, wäre es ungewöhnlich, wenn Sie diese Programme nach der Lektüre dieses Kapitels nicht mehr benutzen würden. Allerdings werden Sie jetzt die Macht der einzelnen Flash-Zeichen-Werkzeuge kennen lernen und feststellen, dass diese ganz leicht zu bedienen sind. Wahrscheinlich kann Flash Ihre anderen Zeichenprogramme nicht ersetzen, allerdings ist es definitiv das beste Programm, um die Zeichnungen für Ihre animierte Internetseite zu erstellen. In diesem Kapitel lernen Sie, 쐽

selbstdefinierte Farbtöne und Farbverläufe zu erstellen,

쐽

gezeichnete Objekte auszuwählen und zu isolieren

쐽

und Gruppen zu verwenden und zu bearbeiten.

4.1

Benutzerdefinierte Farben und Farbverläufe

Wie Sie in Flash Farben verwenden, ist einzig und allein Ihre Entscheidung. Allerdings sollten Sie dabei einige technische Gegebenheiten berücksichtigen, wenn Sie einen FlashFilm im Web veröffentlichen wollen. Generell können Sie aber jede Farbe verwenden. In diesem Abschnitt werden Sie lernen, wie Sie benutzerdefinierte Farbtöne erstellen und eine neu definierte Farbpalette für Ihren Film abspeichern. Außerdem werden Sie sehen, wie man Farbverläufe herstellt und mit ihnen arbeitet.

Farbtöne und Farbverlaufsfelder erstellen Im zweiten Kapitel haben wir jedes Mal, wenn wir eine neue Farbe für Linien oder Füllungen verwendet haben, ein Farbfeld ausgewählt, das in der Werkzeugleiste angezeigt wurde. Wenn Sie auf die Füllfarbe geklickt haben, wurden alle aktuell verfügbaren Farbtöne angezeigt. Standardmäßig sind nur 216 »Internetfarben« verfügbar. Es wird für Anwender, die nur 256 Farben (8 Bit) zur Verfügung haben, empfohlen, nur diese 216 von Flash zur Verfügung gestellten Farben zu verwenden. Die restlichen 40 Farben werden vom Browser (in den Schaltflächen und in Menüs) je nach Betriebssystem unterschiedlich belegt und können gegebenenfalls falsch angezeigt werden. Im Normalfall wird der Betrachter allerdings nicht an 256 Farben gebunden sein, sodass Sie Ihre eigenen Farben erstellen können.

116

Benutzerdefinierte Farben und Farbverläufe

Wenn man seinen eigenen Farbton erstellen will, muss man zwei Schritte durchführen: Zuerst muss man die neue Farbe im Farbmischer definieren und danach als Farbton abspeichern. In diesen Prozess können bis zu drei Bedienfelder einbezogen werden: Farbmischer, Farbtöne und Füllung. Wenn Sie die Übungsaufgaben in diesem Kapitel durchführen, sollten Sie diese Bedienfelder eingeschaltet haben. In der ersten Übung werden Sie eine benutzerdefinierte Farbe erstellen.

Übung: Erstellen Sie einen benutzerdefinierten Farbton In dieser Übung werden Sie verschiedene Wege kennen lernen, wie man Farbtöne erstellt und so abspeichert, dass man sie später weiterverwenden kann. Folgen Sie wie gewohnt diesen Schritten: 1. Stellen Sie sicher, dass sowohl das Bedienfeld Farbmischer als auch das Bedienfeld Farbtöne sichtbar ist. Sie können die beiden auseinander ziehen, indem Sie die Registerkarten verschieben. 2. Klicken Sie nun im Farbmischer auf die Farbleiste (siehe Abbildung 4.1) und bewegen Sie die Maus bei gedrückter linker Maustaste, um zu sehen, wie sich die Farbe verändert. Auch wenn die Auswahl an Farben nicht unendlich ist, gibt es doch viel mehr als 216 Kombinationen.

Abbildung 4.1: Wenn Sie eine Farbe mit dem Farbmischer erstellen wollen, müssen Sie auf die Farbleiste klicken.

117

Fortgeschrittene Zeichentechniken

3. Sie sollten bei dieser Aktion feststellen, ob sich die Zahlen in den RGB-Feldern (für Rot, Grün und Blau) verändern. Farben werden aus 256 »Schattierungen« der additiven Grundfarben Rot, Grün und Blau (mit den Werten 0 bis 255) dargestellt. Diese numerischen Werte können mitunter sehr hilfreich sein. Eine Firma, die ihr Logo immer in einer festen Farbe angezeigt haben will, kann beispielsweise spezielle RGBWerte angeben. 4. Eine andere Art, eine Farbe auszuwählen, ist, sie von einem anderen Ort zu kopieren. Das funktioniert sogar außerhalb von Flash. Nehmen wir einmal an, Sie wollen genau die Farbe verwenden, die im Flash-Logo verwendet wird. Öffnen Sie dazu irgendeine Internetdatei (zum Beispiel die Macromedia-Homepage) und positionieren Sie Flash und den Browser so, dass Sie beide sehen können. 5. Klicken Sie nun im Farbmischer auf die Füllfarbe und halten Sie die Maustaste gedrückt, während Sie den Mauszeiger beispielsweise auf das »f« im Flash-Logo ziehen (siehe Abbildung 4.2). Die aktuell eingestellte Füllfarbe wird sich genau der Farbe des Logos anpassen.

Abbildung 4.2: Es ist möglich, eine Farbe zu kopieren, die außerhalb von Flash angezeigt wird. Auf der linken Seite des Bildschirms befindet sich eine Internetseite, aus der eine Farbe kopiert wird.

6. Da Sie nun eine neue Farbe erstellt haben, können Sie diese direkt einsetzen (wählen Sie doch den Pinsel aus, um das direkt auszuprobieren). Trotzdem sollten Sie diese Farbe als Farbton abspeichern, um sie später einfach wieder auswählen zu können, ohne den Farbmischer erneut verwenden zu müssen. Wählen Sie das Optionsmenü im Farbmischer-Bedienfeld aus. Wählen Sie nun Füllmuster hinzufügen. Dadurch wird die aktuelle Farbe ausgewählt und am unteren Rand des Bedienfeldes Farbtöne eingefügt.

118

Benutzerdefinierte Farben und Farbverläufe

7. Scrollen Sie zu den unteren Farben im Bedienfeld Farbtöne und Sie werden die neue Farbe entdecken. Außerdem wird diese Farbe immer dann angezeigt, wenn Sie die Füllfarbe oder Linienfarbe verändern wollen (siehe Abbildung 4.3).

Abbildung 4.3: Wenn erst einmal ein neuer Farbton hinzugefügt wurde, wird dieser eigentlich überall wieder auftauchen (wie z.B. in der Füllfarbe, der Linienfarbe und der Textfarbe).

Sie haben nun einige Wege kennen gelernt, wie man Farben auswählen kann, und eine Möglichkeit, einen Farbton abzuspeichern. Selbstverständlich gibt es noch zusätzliche Methoden. Wenn Sie beispielsweise ein anderes Farbsystem bevorzugen (anstelle von RGB), werden Sie es im Optionsmenü des Farbmischer-Bedienfeldes finden. Vielleicht haben Sie auch schon festgestellt, dass es für jede Farbe die Möglichkeit gibt, die Transparenz (Alpha) in Prozent anzugeben. Je niedriger dieser Wert ist, umso durchsichtiger wird die Farbe sein. Im nächsten Kapitel werden Sie noch lernen, dass es weitere Möglichkeiten gibt, um die Transparenz zu kontrollieren. Allerdings ist es im Normalfall nicht nötig, die Transparenz festzulegen, während Sie eine Farbe erstellen. Eine Farbe kann man in drei Grundfarben zerlegen. Da der Monitor Licht ausstrahlt, handelt es sich hier um die Grundfarben der additiven Farbmischung. Diese sind Rot, Grün und Blau. Wenn man zum Beispiel eine rote, eine grüne und eine blaue Lampe auf einen Punkt richten würde, wäre das Licht, das ankommt, weiß. Wenn man nun die Lampen unterschiedlich hell einstellen könnte, ließen sich fast alle Farben erzeugen. Man kann also eine Farbe anhand der Helligkeit der Anteile Rot, Grün und Blau eindeutig definieren und spricht von der RGB-Codierung. Jeder Farbanteil kann einen Wert zwischen 0 und 255 haben. Man gibt diese Zahl in der hexadezimalen Schreibweise, also im Sechzehnersystem, an. Hier sind also Werte zwischen 00 und FF möglich.

119

Fortgeschrittene Zeichentechniken

Der Prozess, den Sie soeben kennen gelernt haben, um Farbtöne zu erstellen, ist im ersten Moment relativ zeitaufwändig. Dennoch kann man damit im späteren Verlauf eines Projektes viel Zeit einsparen. Auch wenn die selbst erstellten Farbtöne standardmäßig nur mit der aktuellen Flash-Datei abgespeichert werden, können Sie diese (nach der zeitaufwändigen Prozedur der Festlegung) als Farbtabelle abspeichern, um sie in späteren Projekten erneut zu öffnen. Dazu können Sie im Bedienfeld Farbtöne das Optionsmenü aufrufen und Farben speichern anklicken. Die so erzeugte Datei kann wie gesagt in anderen Dateien, aber auch von weiteren Teammitgliedern verwendet werden. Um diese Farben zu verwenden, müssen diese dann nur im soeben genannten Optionsmenü den Punkt FARBEN ERSETZEN auswählen. (Beachten Sie bitte, dass diese Funktion »ersetzen« und nicht »hinzufügen« heißt. Deshalb werden alle Farben gelöscht, die Sie zuvor erstellt haben.) Es gibt zwei weitere Optionen, die auf den ersten Blick gleich aussehen – Standardfarben laden und Web 216. Die Standardfarben, die mit Flash ausgeliefert werden, sind Web 216. Allerdings können Sie eigene Farben erzeugen und Als Standard speichern, wenn Sie das wünschen. Von dem Moment an werden alle neuen Dateien mit diesen Farben initialisiert. Allerdings können Sie dann mit dem Punkt Web 216 wieder zu den Original-Standardfarben von Flash wechseln. Ich will noch eine weitere Bemerkung zum Speichern von Farben anbringen: Das Standard-Dateiformat für Farbtabellen ist .act. Solche Farbtabellen können in Programmen wie PhotoShop und so weiter eingelesen werden. Selbstverständlich können diese Programme dann auch wieder .act-Dateien abspeichern, um sie im Gegenzug in Flash einzubinden. Die Idee, die dahinter steckt, ist es Teammitgliedern zu vereinfachen, Farbtabellen auszutauschen. Ohne Zweifel werden Sie festgestellt haben, dass Füllfarben auch aus Farbverläufen bestehen können. Sie können sowohl gerade Farbverläufe als auch kreisförmige definieren, um sie als Farbton abzuspeichern. In der folgenden Übung werden wir unseren eigenen Farbverlauf erstellen.

Übung: Erstellen Sie einen benutzerdefinierten Farbverlauf In dieser Übung werden Sie einen benutzerdefinierten Farbverlauf erstellen. Folgen Sie wie gewohnt diesen Schritten: 1. Für diese Übung werden die Bedienfelder Farbmischer und Farbtöne benötigt. Ordnen Sie diese so an, dass sie nicht untereinander liegen und Sie alles auf einen Blick sehen können. 2. Wählen Sie Linear als Füllstil im Farbmischer-Bedienfeld. Wie Sie sehen, verändert sich das Farbmischer-Bedienfeld in einigen Punkten (siehe Abbildung 4.4).

120

Benutzerdefinierte Farben und Farbverläufe

Abbildung 4.4: Das Farbmischer-Bedienfeld verändert sich, wenn man einen Farbverlauf erstellt.

3. Es erscheinen nun zwei Zeiger, die sich an den äußeren Enden des Farbverlauf-Definitionsbalkens befinden. Klicken Sie auf den Zeiger an der linken Seite (die helle Farbe) und der Zeigerkopf wird schwarz. Das zeigt an, dass Sie nun die Farbe dieses Teils des Farbverlaufs bearbeiten. Im Bedienfeld Farbmischer wird nun ebenfalls ein Zeiger erscheinen, der als Farbenstellvertreter dient. Verwenden Sie nun den Farbmischer, um ein helles Gelb aus der Farbleiste auszuwählen. Wie Sie sehen, haben Sie nun einen Farbverlauf erstellt, der von Gelb nach Schwarz läuft. In der Abbildung 4.5 sehen Sie die soeben besprochenen Zeiger.

Abbildung 4.5: Wenn Sie die linke Seite Ihres Farbverlaufs ausgewählt haben, können Sie im Bedienfeld Farbmischer eine neue Farbe einstellen.

121

Fortgeschrittene Zeichentechniken

4. Wenn Sie als Farbverlaufsstil Radial auswählen, werden Sie sehen, dass sich das Farbfeld erneut verändert. 5. Klicken Sie auf den Zeiger an der rechten Seite des Farbverlaufs und verwenden Sie dann den Farbmischer, um eine hellblaue Farbe auszuwählen. Nun sollten Sie einen kreisförmigen Farbverlauf erzeugt haben, der von Gelb nach Blau geht. 6. Wenn Sie noch weitere Farben in den Farbverlauf einfügen wollen, klicken Sie einfach unterhalb des Farbverlauf-Definitionsbalkens. Es erscheinen sofort neue Zeiger, die Sie sowohl bewegen als auch mit neuen Farben versehen können. Wenn Sie eine Farbe entfernen wollen, ziehen Sie den entsprechenden Zeiger einfach nach unten. 7. Sie können den Farbverlauf genauso wie eine benutzerdefinierte Farbe abspeichern (Farbe hinzufügen im Optionsmenü). Nachdem Sie einen benutzerdefinierten Farbverlauf erstellt haben, werden Sie nun lernen, wie man ihn in einem Film verwendet.

Farbverläufe verwenden und bearbeiten Egal, ob Sie die Standard-Farbverläufe verwenden oder benutzerdefinierte Farbverläufe erstellen: Es gibt immer noch etwas mehr, das Sie zum Thema Farbverlauf wissen sollten. Es genügt nicht, einfach den Farbverlauf als Füllfarbe auszuwählen. Es ist nämlich wichtig, dass Sie eine weitere Option des Farbeimer-Werkzeuges verstehen: Füllung sperren. Außerdem sollten Sie das Füllungstransformations-Werkzeug verstehen. Wenn Füllung sperren aktiviert ist, wird ein Farbverlauf von Weiß auf Schwarz über mehrere Formen als einziger Farbverlauf zu erkennen sein. Sollte diese Funktion nicht ausgewählt sein, erhält jede Füllung ihren eigenen Farbverlauf von Weiß nach Schwarz. Das Füllung transformieren-Werkzeug stellt Ihnen die Möglichkeit zur Verfügung, die Eigenschaft eines Farbverlaufs auch dann noch zu verändern, wenn er bereits einer Füllung zugeordnet wurde. Dabei handelt es sich um den Dimmer-Effekt, den Mittelpunkt, die Rotation und die Form. In der folgenden Übung werden diese Optionen verwendet.

Übung: Verändern Sie die Attribute eines Farbverlaufs, den Sie in Ihrem Film verwenden In dieser Übung werden Sie die Optionen Füllung sperren und das Füllungstransformations-Werkzeug erkunden, um Farbverläufe komplett kontrollieren zu können. Die einzelnen Schritte sind: 1. Wählen Sie eine einfache Farbe aus und zeichnen Sie zwei nahe beieinander liegende Quadrate.

122

Benutzerdefinierte Farben und Farbverläufe

2. Wählen Sie das Farbeimer-Werkzeug aus und stellen Sie außerdem einen kreisförmigen Farbverlauf ein (der standardmäßige Farbverlauf Weiß nach Schwarz ist nicht schlecht). 3. Stellen Sie sicher, dass die Option Füllung sperren nicht aktiviert ist (siehe Abbildung 4.6). Klicken Sie nun einmal in jedes Quadrat, um beide mit dem kreisförmigen Farbverlauf auszufüllen. Dies ist der normale Modus. Beachten Sie, dass der Mittelpunkt des Farbverlaufs sich genau da befindet, wo Sie geklickt haben. Klicken Sie an verschiedenen Stellen innerhalb eines Quadrates, um den Mittelpunkt des Farbverlaufs zu verschieben.

Abbildung 4.6: Die Option Füllung sperren ist nicht aktiviert.

4. Klicken Sie nun einmal in die Nähe einer Kante, die sich nahe dem anderen Quadrat befindet. Danach klicken Sie auf Füllung sperren. Die letzte Füllung, die Sie erzeugt haben, definiert nun den Mittelpunkt des Farbverlaufs für alle weiteren Füllungen, da Sie Füllung sperren aktiviert haben. 5. Klicken Sie nun in das andere Quadrat und Sie werden sehen, dass sich der Farbverlauf aus dem ersten Quadrat fortführt. Genau das ist der Effekt, der mit Füllung sperren erzielt werden soll. Auch wenn Sie ein zweites Mal in das erste Quadrat klicken, wird der Mittelpunkt des Farbverlaufs gesperrt bleiben. 6. Aktivieren Sie das Füllungstransformations-Werkzeug, um die erstellten Füllungen bearbeiten zu können.

123

Fortgeschrittene Zeichentechniken

7. Klicken Sie auf die Füllung eines der beiden Quadrate und es werden einige Anfasser erscheinen (siehe Abbildung 4.7). Nun können Sie den Mittelpunkt des Farbverlaufs verschieben. An weiteren Markierungen können Sie die Form, die Drehung und den Dimmer-Effekt des Farbverlaufs verändern.

Abbildung 4.7: Sie können das Füllungstransformations-Werkzeug auf diesen Farbverlauf anwenden (auch wenn er sich über mehrere Figuren erstreckt, da Füllung sperren

aktiviert ist).

8. Möglicherweise werden Sie die Handhabung dieser Anfasser sehr intuitiv finden. Trotzdem sollten wir damit ein wenig experimentieren. 9. Klicken Sie auf die Mittelpunkt-Verschiebungsmarkierung und bewegen Sie die Maus bei gedrückter Maustaste. Sie werden sehen, dass Sie so den Mittelpunkt des Farbverlaufs bewegen. Beachten Sie, dass sich der Cursor in den Verschiebe-Cursor verwandelt, wenn Sie sich über dieser Markierung befinden (siehe Abbildung 4.8). 10. Klicken Sie auf die Verformungs-Markierung und bewegen Sie bei gedrückter Maustaste erneut die Maus. Wie Sie feststellen werden, verformt sich der Kreis zu einer Ellipse. Auch hier verwandelt sich der Cursor in ein anderes Symbol. Es ist der Verformungs-Cursor (siehe Abbildung 4.8). 11. Wenn Sie auf die gleiche Weise die Dimmer-Markierung (Radius vergrößern/verkleinern) verwenden, wird sich auch der Cursor (Sie haben es sicher schon geahnt) in den Dimmer-Cursor verwandeln (siehe Abbildung 4.8).

124

Benutzerdefinierte Farben und Farbverläufe

Abbildung 4.8: Die verschiedenen Cursors des Füllungstransformations-Werkzeuges

12. Nun können Sie den Drehwinkel des Farbverlaufs verändern. Es erscheint der gleiche Rotations-Cursor, den wir schon von der traditionellen Rotation kennen (siehe Abbildung 4.8). Bitte beachten Sie, dass die Drehung nur dann einen Effekt hat, wenn der Farbverlauf zuvor verformt wurde. Abschließend sei gesagt, dass der Cursor ein kleines Farbverlaufssymbol enthält, während das Füllungstransformations-Werkzeug aktiv ist (siehe Abbildung 4.8).

Mit einer Rastergrafik füllen Da Sie nun die Verwendung und Bearbeitung von Farbverläufen verstanden haben, können wir uns einer speziellen Funktion zuwenden – Rastergrafiken als Füllung zu verwenden. Grundsätzlich können Sie das mit jeder zuvor importierten Rastergrafik tun. In der folgenden Übung werden Sie mit diesem Spezialeffekt vertraut gemacht.

Übung: Verwenden Sie eine Rastergrafik als Füllung In dieser Übung werden Sie das Füllen mit Rastergrafiken kennen lernen. Die einzelnen Schritte sehen so aus: 1. Importieren Sie eine beliebige Rastergrafik, wie Sie das im letzten Kapitel schon durchgeführt haben. 2. Löschen Sie die Kopie auf der Bühne (keine Panik, die Grafik ist noch in der Bibliothek gespeichert). 3. Wählen Sie im Bedienfeld Farbmischer den Punkt Bitmap als Füllstil aus. Sie sehen eine kleine Vorschau Ihrer importierten Grafik. Klicken Sie darauf, um diese Grafik auszuwählen.

125

Fortgeschrittene Zeichentechniken

4. In der Füllfarbe wird eine sehr kleine Version Ihrer Grafik als aktuelle Füllfarbe angezeigt. Verwenden Sie das Pinsel-Werkzeug, um einige Formen auf die Bühne zu zeichnen. 5. Auch hier können Sie das Füllungstransformations-Werkzeug verwenden, um Ihre Füllung genauer auszurichten.

Texteffekte Im zweiten Kapitel haben Sie gelernt, wie man Text erstellt und Schriftart, Farbe, Stil und so weiter verändert. Nun werden Sie einige geistreiche Möglichkeiten kennen lernen, um Farbverläufe und Bilder als Füllung zu verwenden. Sie werden allerdings schnell herausfinden, dass man Farbverläufe und Rastergrafiken nur Füllungen zuweisen kann – nicht aber Linien oder Texten. Allerdings kann man Texte in Füllungen konvertieren. Wenn der Text dann einmal als Füllung existiert, können Sie alle Techniken verwenden, die bereits in diesem Kapitel besprochen wurden. Die Technik, die verwendet wird, um Texte in Füllungen zu verwandeln, ist recht einfach. Erstellen Sie dazu einfach einen Textblock und versichern Sie sich, dass die Schriftart, die Größe und der Stil richtig eingestellt sind. Wählen Sie nun den gesamten Textblock aus und dann MODIFIZIEREN / TEILEN. Der Text wird nun in seine Buchstaben zerlegt. Lassen Sie alle Buchstaben markiert und wählen Sie erneut MODIFIZIEREN / TEILEN. Wenn der Text erst einmal so weit geteilt wurde, kann er als Füllung behandelt werden. Seien Sie aber gewarnt, denn wenn der Text erst einmal in eine Füllung konvertiert wurde, werden Sie nie wieder die Worte bearbeiten können! Deshalb sollten Sie zuvor alle Textattribute festlegen. Wenn Sie Text erst einmal in Füllungen transformiert haben, können Sie ihn ganz leicht mit Farbverläufen ausfüllen und so sehr schöne Effekte erzielen.

4.2

Objekte isolieren

Bisher haben wir eine Menge Zeit damit verbracht, irgend etwas zu zeichnen und das dann zu bearbeiten. Nun werden Sie lernen, wie man einzelne Objekte auswählt, um sie zu verschieben oder zu entfernen. Allerdings ist das Zeichnen in Flash so einfach, dass es manchmal schneller geht, eine fehlerhafte Grafik neu zu erstellen, als sie zu reparieren. Nichtsdestotrotz werden Sie in diesem Abschnitt die Macht kennen lernen, die Ihnen die Fähigkeit verleiht, Objekte auszuwählen. Die typische Isolationstechnik ist, einfach eine Auswahl zu treffen. Bisher wissen Sie, dass Sie eine Linie bewegen können, indem Sie einmal darauf klicken (um sie auszuwählen) und dann bei gedrückter Maustaste die Maus bewegen, um die Linie zu verschieben. Viel-

126

Objekte isolieren

leicht haben Sie schon gemerkt, dass nur ein Teil der Linie ausgewählt wird, wenn diese über Knicke oder Kanten verfügt. Zeichnen Sie beispielsweise ein Rechteck mit einem Strich (Stift-Werkzeug) und klicken Sie auf diesen Strich. Sie werden feststellen, dass nur eine einzige Seite des Rechtecks ausgewählt wird. Wenn Sie allerdings doppelt klicken, wird der komplette Rahmen des Rechtecks ausgewählt. Das wird natürlich nicht mit einem Oval funktionieren, da es da keine Knicke gibt – Sie werden dabei also mit einem einzigen Klick den kompletten Rahmen selektieren. Genauso verhält es sich auch mit Füllungen, denn wenn Sie einmal auf die Füllung klicken, wird diese ausgewählt. Bei einem Doppelklick auf dieselbe wird allerdings zusätzlich zur Füllung auch die Rahmenlinie in die Auswahl mit aufgenommen. Wenn Sie das bisher schon für sehr hilfreich halten, sollten Sie erst einmal abwarten, bis Sie die weiteren Möglichkeiten kennen gelernt haben, wie man in Flash Objekte auswählen kann.

Wenn Sie es sehen können, können Sie es auswählen Als ich zum ersten Mal eine Flash-Demonstration sah, hat der Mitarbeiter von Macromedia es wie ein Marktschreier präsentiert, der etwas »wie warme Semmeln« verkauft. Er sagte etwas, das sich sofort einprägte: Was man in Flash sehen kann, kann man auch auswählen. Das ist wirklich wahr. Wenn Sie dieses Konzept verstanden haben, wird es für Sie sehr einfach werden, Abschnitte Ihrer Zeichnungen auszuwählen, um sie zu verändern, zu verschieben oder zu löschen. Das sollte man in Aktion sehen. Zeichnen Sie dazu ein Oval und wählen Sie dann das Pinsel-Werkzeug aus, um eine dicke Füllung (in einer anderen Farbe) direkt durch die Mitte zu zeichnen (siehe Abbildung 4.9). Da Sie die linke Seite der Ellipse »sehen« können, können Sie diese auch auswählen.

Abbildung 4.9: Alles was Sie sehen können, können Sie auch auswählen. Da dieses Oval durch den Pinsel in zwei Teile geteilt wurde, können Sie die beiden Abschnitte getrennt voneinander auswählen, da sie ja sichtbar getrennt wurden.

127

Fortgeschrittene Zeichentechniken

Die Leinwand-Ebene verwenden Ein verwandtes Konzept zu »was Sie sehen können, können Sie auch auswählen« ist die Tatsache, dass alles was man zeichnet, in der gleichen »Ebene« erscheint. In Wirklichkeit ist nichts über oder hinter etwas anderem. Wenn Sie also die Füllung auswählen, die das Oval getrennt hat, (siehe Abbildung 4.8) und diese Füllung verschieben, werden Sie feststellen, dass plötzlich die Mittelsektion des Ovals fehlt (so als ob das Pinsel-Werkzeug etwas »herausgebissen« hätte). Um in der Terminologie von Flash zu bleiben, befindet sich alles, was Sie zeichnen, auf der Leinwand-Ebene. (Das Wort »Ebene« ist hier nicht mit den später besprochenen Ebenen zu verwechseln, die in der Zeitleiste eingestellt werden können). Im späteren Verlauf dieses Kapitels werden Sie sehen, wie man Zeichnungen über- oder untereinander positionieren kann. Für den Moment genügt es aber, wenn Sie Folgendes verstanden haben: Es gibt einen Unterschied zwischen den hier besprochenen Ebenen und den Ebenen in der Zeitleiste. Wahrscheinlich sind Sie zu diesem Zeitpunkt ein wenig frustriert darüber, dass alles, was Sie zeichnen, alles andere »auffrisst«. Allerdings können Sie damit sehr kreativ umgehen, da Sie sehr komplexe Formen erstellen können. In der folgenden Übung werden wir das noch einmal ausprobieren, indem wir einen Halbmond erzeugen.

Übung: Verwenden Sie Figuren auf der Leinwand-Ebene, um einen Halbmond zu erzeugen In dieser Übung werden wir aus der einzigen Leinwand-Ebene in Flash unseren Vorteil ziehen. Das geht wie immer Schritt für Schritt: 1. Stellen Sie sicher, dass die Linienfarbe eine normale Farbe und kein Farbverlauf ist. Zeichnen Sie einen perfekten Kreis. 2. Doppelklicken Sie nun auf die Füllung des Kreises, um die Füllung und die Rahmenlinie auszuwählen. 3. Wählen Sie BEARBEITEN / KOPIEREN ((Strg)+(C)) und BEARBEITEN / AN POSITION EINFÜGEN ((Strg)+(ª)+(V)). 4. Solange das Duplikat immer noch ausgewählt ist, können Sie die Pfeiltasten verwenden, um es nach rechts zu bewegen (siehe Abbildung 4.10). 5. Heben Sie die Auswahl auf, indem Sie irgendwo auf den freien Bereich der Bühne klicken, und die Formen werden sich gegenseitig »auffressen«. 6. Nun können Sie den zweiten Kreis erneut auswählen und entfernen. Jetzt sollte eine Halbmond-Form auf dem Bildschirm zurückbleiben.

128

Objekte gruppieren

Abbildung 4.10: Wenn Sie den duplizierten Kreis über den anderen bewegen, können Sie jeden Bereich, den Sie sehen, auswählen und entfernen.

Weitere Beispiele dieser Art finden Sie im Anhang D. Es ist erstaunlich, wie man mit ein paar grundlegenden Geometriekenntnissen alle möglichen Arten von Formen erstellen kann.

4.3

Objekte gruppieren

Auch wenn ich Ihnen versprochen habe, dass Sie die Art, wie man mit der LeinwandEbene umgehen kann, lieben werden, kann es vorkommen, dass Sie Grafiken zusammenfügen müssen, ohne dass Sie sich gegenseitig beschädigen. Stellen Sie sich vor, dass Sie ein Firmenlogo über einer anderen Grafik anordnen müssen (siehe Abbildung 4.11). Solange Sie das Logo mit den Kreisen als Zweites zeichnen und es beim ersten Versuch richtig positionieren, sieht alles gut aus.

Abbildung 4.11: Solange Sie das Logo mit den Kreisen als Zweites zeichnen und es beim ersten Versuch richtig positionieren, sieht alles gut aus.

Vielleicht gefällt Ihnen das Logo dann aber in einer anderen Position besser (siehe Abbildung 4.12). Wie Sie dort aber auch sehen können, kommt es zu Problemen bei der anderen Grafik.

129

Fortgeschrittene Zeichentechniken

Abbildung 4.12: Versuchen Sie das Logo mit den drei Kreisen auszuwählen und zu verschieben. In diesem Fall werden Sie schmerzvoll erfahren, dass alles auf der gleichen Leinwand-Ebene gezeichnet wird.

Abschließend sei gesagt, dass verschachtelte Grafiken (siehe Abbildung 4.13) nahezu unmöglich zu erstellen sind – zumindest mit den Möglichkeiten, die Sie bisher kennen gelernt haben. Das ist aber nur so, weil Sie noch nicht gelernt haben, wie man Objekte gruppiert.

Abbildung 4.13: Ohne die Technologie des Gruppierens zu kennen, sind solche Effekte nahezu unmöglich.

Effekte von Gruppierungen Das Gruppieren hat zwei Effekte: 쐽

130

Der wohl nützlichste Effekt ist, dass gruppierte Objekte in eine eigene Ebene über die Leinwand gelegt werden (Achtung: Auch hier sind nicht die Ebenen in der Zeitleiste gemeint). Dadurch kann man die Gruppe ober- oder unterhalb anderer Gruppen platzieren, ohne dass sie sich gegenseitig »auffressen«.

Objekte gruppieren

쐽

Die Bilder werden zusammengeschlossen. Dadurch wird es ermöglicht, dass man sie als Gruppe bewegen, rotieren und skalieren kann. Dabei wird vermieden, dass man irrtümlicherweise Farben oder Linien der einzelnen Objekte bearbeitet.

Wir werden nun einen kleinen Blick auf beide Effekte werfen. Zuerst will ich ein Beispiel bringen, das zeigt, wie der Effekt des Zusammenschließens funktioniert. Zeichnen Sie ein Rechteck und danach ein Oval direkt darüber. Wählen Sie beide Objekte aus und gruppieren Sie diese, indem Sie MODIFIZIEREN / GRUPPIEREN ((Strg)+(G)) wählen. Zeichnen Sie nun ein weiteres Rechteck. Wählen Sie dessen Füllung und Rahmenlinien aus (denken Sie daran, dass Flash diese als separate Objekte betrachtet) und kopieren Sie diese. Nun besitzen Sie zwei Gruppen, die an der gleichen Stelle angeordnet werden können – ohne sich gegenseitig zu beschädigen. Beachten Sie ebenfalls, dass die zweite Gruppe oberhalb der ersten angeordnet wird. Jede Gruppe besitzt eine effektive Ebene, in der sie angeordnet ist – Sie werden niemals irgendwo »Ebene 1« oder »Ebene 2« lesen können, aber diese Ebenen existieren halt. Sie können die Stapelreihenfolge verändern, indem Sie MODIFIZIEREN / ANORDNEN / IN DEN HINTERGRUND auswählen. Wenn Sie über drei oder mehr Gruppen verfügen, macht der Rest des Menüs ANORDNEN mehr Sinn. NACH VORNE und NACH HINTEN werden die ausgewählten Gruppen eine Ebene weiter bewegen. IN DEN HINTERGRUND wird eine Gruppe hinter alle anderen legen und IN DEN VORDERGRUND wird diese Gruppe vor allen anderen anzeigen. Der andere Effekt der Gruppierung ist, dass alle Objekte zusammengeschlossen werden. Wenn Sie die Gruppe mit dem Oval und dem Quadrat bewegen, können Sie davon ausgehen, dass sie relativ zueinander immer den gleichen Abstand halten. Das ändert sich nur, wenn Sie die Gruppierung aufheben oder bearbeiten (was wir als Nächstes besprechen werden). Das Verschieben, Skalieren und Rotieren betrifft immer die Gruppe als Ganzes. Es gibt eine Ausnahme zu der Regel, dass sich alles in der Leinwand-Ebene befindet (es sei denn, es ist gruppiert): Diese Ausnahme betrifft Text. Solange Sie Text nicht in eine Füllung umwandeln, besteht Text weder aus Linien noch aus Füllung. Als solches bildet Text wie gesagt die Ausnahme zur Leinwand-Ebenen-Regel und wird immer oberhalb aller anderen Objekte angezeigt. Wenn Sie Text allerdings in eine Füllung umwandeln, wird er sich verhalten, als sei er direkt zu Beginn gruppiert worden.

Gruppen bearbeiten Man kann Gruppen mit sehr wenig Aufwand bewegen, rotieren und skalieren. Außerdem kann man die Anordnung von Gruppen über das Menü MODIFIZIEREN / ANORDNEN verändern. Aber wie ändert man beispielsweise die Füllfarbe eines Objektes in einer Gruppe? Wenn man mit dem Farbeimer-Werkzeug darauf klickt, passiert gar nichts. Um zwei Objekte innerhalb einer Gruppe mehr zusammenzurücken, ist die einzig sichtbare Mög-

131

Fortgeschrittene Zeichentechniken

lichkeit, die Gruppierung zuerst aufzuheben (MODIFIZIEREN / GRUPPIERUNG AUFHEBEN), die Veränderung vorzunehmen und daraufhin die Objekte erneut zu gruppieren. Allerdings können die Objekte, während Sie nicht gruppiert sind, versehentlich andere Objekte auf der Leinwand-Ebene »auffressen«. Die Lösung für dieses Dilemma ist, sich in die Gruppe hineinzubewegen. In der folgenden Übung werden wir genau das tun.

Übung: Verändern Sie den Inhalt eines gruppierten Objekts In dieser Übung werden Sie lernen, wie man für kurze Zeit zum Inhalt einer Gruppe wechselt, um deren Inhalt zu bearbeiten. Folgen Sie wie üblich diesen Schritten: 1. Stellen Sie sicher, dass ANSICHT / AUSRICHTEN aktiviert ist. Zeichnen Sie nun ein Quadrat. Wählen Sie sowohl die Füllung als auch die Rahmenlinien aus und kopieren Sie diese über MODIFIZIEREN / GRUPPIEREN oder (Strg)+(C). 2. Drehen Sie das Quadrat um exakt 45°. 3. Verändern Sie die Füllfarbe und zeichnen Sie einen Kreis. 4. Wählen Sie den kompletten Kreis aus (indem Sie auf die Füllung doppelklicken) und ziehen Sie die Mitte des Kreises auf die obere Ecke des Quadrates (siehe Abbildung 4.14). Da es sich bei dem Quadrat um eine Gruppe handelt, wird kein Objekt das andere »auffressen«. Beachten Sie, dass der Kreis sich hinter der Quadrat-Gruppe befindet. Erinnern Sie sich noch einmal daran, dass Gruppen automatisch auf einer höheren Leinwand-Ebene angeordnet werden.

Abbildung 4.14: Wenn Sie den Kreis auswählen und den Mittelpunkt auf das Quadrat zubewegen, erhalten Sie die Möglichkeit, diesen Kreis am Quadrat auszurichten.

5. An dieser Stelle werden Sie eine gravierende Änderung am Quadrat vornehmen. Allerdings wollen Sie es dazu nicht aus der Gruppierung nehmen, da es sonst den Kreis »auffressen« würde. Stattdessen gehen Sie einfach für kurze Zeit in die Gruppe hinein. Doppelklicken Sie dazu auf das Quadrat und schon können Sie den Inhalt der Gruppe bearbeiten.

132

Objekte gruppieren

6. Beachten Sie, dass in der Adressleiste Szene 1: Gruppe steht (siehe Abbildung 4.15). Es wird Ihnen außerdem auffallen, dass der Rest der Bühne ein wenig schwächer dargestellt wird. Das sind Ihre Hinweise darauf, dass Sie sich in der Gruppe befinden. Alles was Sie nun verändern, wird sich lediglich auf die Quadrat-Gruppe auswirken.

Abbildung 4.15: Während Sie sich in einer Gruppe befinden, werden Sie feststellen, dass sich die Adressleiste verändert.

7. Heben Sie nun in der Gruppe die Auswahl auf, indem Sie auf eine freie Stelle der Bühne klicken. Verbiegen Sie dann die beiden unteren Kanten des Quadrates nach innen, um eine flügelähnliche Form zu erzeugen (siehe Abbildung 4.16).

Abbildung 4.16: Wenn Sie sich innerhalb der Gruppe des Quadrates befinden, können Sie auch grundlegende Veränderungen an der Form vornehmen.

8. Sie können auch andere Veränderungen vornehmen (wie zum Beispiel an der Fülloder Linienfarbe). Wenn Sie damit fertig sind, können Sie wieder zurück zur Hauptszene wechseln. Sie kommen auf zwei Wegen wieder zurück: Der am meisten ein-

133

Fortgeschrittene Zeichentechniken

leuchtende ist, auf das Wort Szene 1 in der Adressleiste zu klicken. Allerdings hat ein Doppelklick auf eine freie Stelle der Bühne denselben Effekt. Speichern Sie diese Datei oder lassen Sie Flash einfach geöffnet, denn Sie werden mit diesem Beispiel noch weiterarbeiten können. Wenn sich die Adressleiste ändert und der Inhalt auf der Bühne schwächer dargestellt wird (siehe Schritt 6), handelt es sich um ein wichtiges Moment. Das sind nämlich Hinweise darauf, dass Sie sich in einer Gruppe befinden. Wenn Sie beispielsweise Formen verändern und dann zurück in die Hauptszene wechseln, werden sich die in die Gruppe eingefügten Formen mit allem anderen in der Gruppe bewegen. Es gibt sicherlich Momente, in denen man Gruppen anlegen muss, allerdings sollten Sie das dann immer bewusst erledigen. Das Übersehen einer geänderten Adressleiste ist der häufigste Fehler, den man in Flash begehen kann. Also seien Sie bitte immer dann aufmerksam, wenn Sie eine Veränderung in der Adressleiste bemerken.

Abbildung 4.17: Sowohl der Kreis als auch das Quadrat sind gruppiert und danach noch zusammengruppiert worden.

Lassen Sie mich noch eine Sache über Gruppen loswerden: Es gibt keine Regel die besagt, dass man nicht auch Gruppen in Gruppen anlegen dürfte. Wählen Sie beispielsweise den gesamten Kreis aus der vorherigen Übung und gruppieren Sie diesen. Wählen Sie dann die Kreis- und Quadrat-Gruppe und bilden Sie daraus eine neue Gruppe. Die interessante Sache an solchen »Gruppen von Gruppen« ist, dass man in jede Ebene der Gruppe direkt eintauchen kann. Doppelklicken Sie auf die Quadrat-Kreis-Gruppe und Sie befinden sich in dieser Gruppe. Doppelklicken Sie nun auf die Quadrat-Gruppe und Sie sind innerhalb der Gruppe in der Gruppe. Auch diese wird in der Adressleiste angezeigt, damit sie nicht verloren geht. In Abbildung 4.17 sehen Sie ein solches Beispiel.

134

Zusammenfassung

4.4

Zusammenfassung

In diesem Kapitel haben Sie Farbtöne und benutzerdefinierte Farbverläufe erstellt. Sie haben gesehen, wie man Füllungen – sowohl Farbverläufe als auch Rastergrafiken – transformieren kann, indem man die Optionen des Farbeimer-Werkzeugs verwendet. Die Gruppierung von Formen hat zwei Vorteile: Zum einen werden Objekte von anderen Formen isoliert, sodass sie sich nicht gegenseitig »auffressen«. Zum anderen erlaubt es Ihnen, mehrere Formen zusammenzuschließen. Abschließend kann Ihnen das Wissen, dass ungruppierte Objekte immer auf der gleichen Leinwand-Ebene gezeichnet werden, dabei behilflich sein, komplexe Formen zu entwickeln.

4.5

Workshop

F&A F

Ich habe in den Farbeimer-Werkzeug-Einstellungen die Option Füllung sperren aktiviert. Wenn ich aber eine Form mit einem Farbverlauf füllen will, sehe ich lediglich eine normale Farbe. Was ist passiert? A

F

Wenn Sie meinen, dass Sie eine normale Farbe sehen, ist es möglich, dass Sie in Wirklichkeit das Ende eines Farbverlaufs betrachten. Die beste Möglichkeit, Füllung sperren zu verwenden ist, zuerst eine Form mit ausgeschalteter Option Füllung sperren zu füllen, dann die Option einzuschalten und daraufhin weitere Formen auszufüllen. Andererseits kann es oft passieren, dass die Transformation des Farbverlaufes zu groß eingestellt ist.

Soll ich lieber RGB, HSB oder HEX als Farbspezifikation verwenden? A

Wie Sie möchten. Keines dieser Systeme ist besser als ein anderes. Jeden Farbwert können Sie auch in jedem anderen System darstellen. Wenn Ihnen jemand einen Farbwert in RGB vorgibt, sollten Sie dieses System verwenden. Wenn Sie die Information in HEX erhalten, nehmen Sie doch einfach dieses System. Das Ergebnis ist immer gleich.

135

Fortgeschrittene Zeichentechniken

Quiz Wie auch in den letzten Kapiteln will ich Sie hier wieder aufmuntern, zuerst die Frage selbst zu beantworten, bevor Sie die abgedruckte Antwort lesen. 1. Woher weiß man, dass man eine Gruppe bearbeitet? a.

Alles andere auf der Bühne ist abgeschwächt dargestellt und man sieht das Wort Gruppe in der Adressleiste.

b. Man sollte immer zuerst MODIFIZIEREN / GRUPPIERUNG AUFHEBEN wählen. c. Man hat (Strg)+(ª) gedrückt, während man doppelt auf ein Objekt geklickt hat. 2. Welches Bedienfeld verwendet man, wenn man einen Farbverlauf erstellen will? a.

Die Bedienfelder Farbton und Gradient

b. Nur das Eigenschaften-Bedienfeld c. Nur das Farbmischer-Bedienfeld 3. Wie viele Objekte braucht man, um eine Gruppe erstellen zu können? a.

Eins

b. Zwei oder mehr c. Null, denn man kann nur Farbverläufe gruppieren

Übungsaufgaben Da Sie nun über einige grundlegende Zeichenkenntnisse verfügen, versuchen Sie sich doch einmal an folgenden Aktivitäten: 1. Erkunden Sie den Umgang mit Text. Normaler Text kann beispielsweise gekippt werden, wenn man die seitlichen Markierungen beim Rotieren bewegt. Damit sollten Sie in der Lage sein, einen Schatteneffekt zu erzeugen, indem Sie einen Textblock duplizieren und die Kopie kippen. Ändern Sie die Farbe der Kopie und stellen Sie diese in den Hintergrund. Sie werden staunen, wie glaubhaft dieser Effekt ist. 2. Man kann weitere Effekte erstellen, wenn man den Text trennt (denken Sie aber daran, dass Sie den Text danach nicht mehr bearbeiten können). Als Füllung kann man einem Text auch einen Rahmen hinzufügen. Wenn Sie dann verschiedene Linienstärken und -formen ausprobieren, werden Sie interessante Effekte erzielen. 3. Versuchen Sie, geometrische Figuren zu erzeugen, indem Sie die Leinwand-Ebene und das Andocken verwenden. Dazu gibt es jede Menge Beispiele im Anhang D.

136

Die Bibliothek produktiv einsetzen

5

Die Bibliothek produktiv einsetzen

Die Bibliothek ist in Flash von so grundlegender Bedeutung, dass es fast unmöglich ist, einen Film zu produzieren, ohne die Bibliothek zu verwenden. Wenn Sie die Bibliothek nicht benutzen, kann man ohne schlechtes Gewissen sagen, dass Sie irgendetwas falsch machen. Wenn Sie effektiv und produktiv arbeiten wollen, sollten Sie diese lieber so oft wie möglich in den Arbeitsprozess einbeziehen. Die Produktivität wird dabei durch die Technologie der Symbole unterstützt, denn wenn Sie das Symbol selbst verändern, werden alle Instanzen automatisch aktualisiert. Effizienz wird dagegen insofern bereitgestellt, als Grafiken und alle sonstigen importierten Medien nur einmal in der Bibliothek abgelegt werden müssen und nicht bei jedem Erscheinen erneut den kompletten Speicherplatz belegen. In diesem Kapitel werden wir uns mit der Bibliothek beschäftigen und sie tiefergehend erkunden. Da es sich bei diesem Hilfsmittel um ein wichtiges Werkzeug handelt, sollten Sie sich am Ende dieses Kapitels unbedingt sicher sein, dass Sie die Bibliothek vollkommen verstanden haben. In diesem Kapitel lernen Sie: 쐽

Symbole zu erstellen,

쐽

die Bibliothek zu verwenden, um die Arbeit zu minimieren,

쐽

Hinweise aufzufinden, die uns von der Arbeitsoberfläche gegeben werden, um den Überblick zu behalten,

쐽

mehrere Kopien eines Symbols zu verwenden, ohne die Dateigröße des Flash-Films gravierend zu vergrößern. Symbole sind genau die Daten, die Sie in der Bibliothek ablegen. Man kann eigentlich alles, was man in Flash erzeugt (Formen, Gruppen, andere Symbole und sogar Animationen) in die Bibliothek legen und es dann als Symbol bezeichnen. Es gibt mehrere Arten von Symbolen, die jeweils unterschiedliche Charakteristika haben. Außerdem gibt es zwei Datentypen, die nicht in Flash erstellt werden, aber trotzdem in der Bibliothek auftauchen können: Rastergrafiken und Audio-Dateien. Allerdings werden Sie in Zukunft wohl am meisten mit den Symbolen zu tun haben, die direkt in Flash erstellt werden. Jede Kopie eines Symbols, das sich außerhalb der Bibliothek befindet, nennt man Instanz. Wie Sie noch sehen werden, gibt es jeweils nur einen so genannten Master für jedes Symbol (und das ist genau das Symbol in der Bibliothek). Sie können allerdings so viele Instanzen aus der Bibliothek auf die Bühne ziehen, wie Sie wollen. Dabei ist jede Instanz mit einer Kopie des Originals vergleichbar. Das heißt aber nicht, dass es sich hier wirklich um Kopien handelt, denn die Dateigröße wird nicht stark erhöht (und das müsste bei echten Kopien geschehen).

138

Das Konzept der Bibliothek

5.1

Das Konzept der Bibliothek

Wenn Sie die Bibliothek verwenden, werden Sie in diesem Prozess Symbole erstellen und davon Instanzen erzeugen, die Sie in Ihrem Film nutzen werden. Diese Symbole können sogar in anderen Symbolen verwendet werden.

5.2

Wie man Symbole erstellt und verwendet

Man kann Symbole auf zwei Arten erzeugen. Einerseits kann man ein bestimmtes Objekt in ein Symbol konvertieren und auf der anderen Seite ein solches Symbol auch von Grund auf neu anlegen. Schauen wir uns diese beiden Methoden an.

Übung: Erstellen Sie ein Symbol, indem Sie ausgewählte Objekte umwandeln In dieser Übung werden Sie meine bevorzugte Art und Weise kennen lernen, wie man Symbole erstellt – dabei handelt es sich um die Funktion IN SYMBOL KONVERTIEREN. 1. Öffnen Sie eine neue Datei und zeichnen Sie einen Kreis. Wählen Sie nun mit dem Pfeil-Werkzeug den gesamten Kreis (Füllungen und Linien) aus. 2. Wählen Sie EINFÜGEN / IN SYMBOL KONVERTIEREN oder drücken Sie (F8). Daraufhin werden Sie von Flash aufgefordert, einen Namen für dieses Symbol und das Standard-Verhalten anzugeben (siehe Abbildung 5.1). 3. Die Erfahrung zeigt, dass man Symbole möglichst logisch benennen sollte (der Standardname Symbol 1 wird im ersten Moment logisch erscheinen, ist es aber nicht mehr, wenn Sie 35 Symbole verwalten). Aus diesem Grund sollten wir dieses Symbol Kreis nennen. Wenden wir uns nun dem Verhalten zu. Die unterschiedlichen Möglichkeiten werden wir noch im weiteren Verlauf dieses Buches besprechen. Für diesen Moment sollten Sie einfach die Standardeinstellung Filmsequenz beibehalten. Klicken Sie nun auf OK. 4. Jetzt ist es an der Zeit, die Bibliothek zu öffnen. Am schnellsten geht das über FENSTER / BIBLIOTHEK bzw. (F11). Sie werden feststellen, dass jetzt ein Symbol in der Bibliothek existiert, das Kreis heißt. Sie haben also zwei Fliegen mit einer Klappe geschlagen, denn Sie haben ein Symbol für die Bibliothek erstellt und gleichzeitig eine Instanz auf der Bühne (denn der Originalkreis ist als Instanz des Symbols auf der Bühne verblieben). Wenn Sie weitere Instanzen auf die Bühne bringen (indem Sie auf das Symbol in der Bibliothek klicken und bei gedrückter Maustaste auf die Bühne ziehen) werden alle Instanzen zunächst gleich aussehen. Sollten Sie einmal versehentlich auf eine Instanz

139

Die Bibliothek produktiv einsetzen

doppelklicken, erscheint Szene 1; Kreis in der Adressleiste, was anzeigt, dass Sie nun den Master des Symbols bearbeiten können. In diesem Fall können Sie auf das Wort Szene 1 klicken, um wieder in den Normalmodus zurückzukehren.

Abbildung 5.1: Wenn Sie etwas in ein Symbol konvertieren, müssen Sie den Namen und das Verhalten angeben.

5. Da Sie nun einige Instanzen des Kreises auf die Bühne gebracht haben, mag es so aussehen, als hätten Sie mehrere Kopien des Masters erzeugt. In Wirklichkeit handelt es sich aber um Instanzen des Masters. Sollten Sie eine Veränderung am Master in der Bibliothek vornehmen, werden damit sämtliche Instanzen geändert. 6. Es gibt mehrere Möglichkeiten, den Master des Kreis-Symbols zu bearbeiten. Die eine ist, das Symbol in der Bibliothek auszuwählen und im Optionsmenü den Punkt BEARBEITEN auszuwählen (siehe Abbildung 5.2). 7. Es mag zuerst so aussehen, als sei nichts passiert. Allerdings hat sich hinter dem Bibliotheksfenster etwas auf der Bühne getan – der beste Hinweis dafür ist die Adresszeile. Außerdem sehen Sie nur noch eine einzige Version des Kreises (das Original) in der Mitte der Bühne, welche anscheinend keinen Rand mehr hat. Sie befinden sich nun in der Masterversion des Kreis-Symbols und können dieses nun bearbeiten. 8. Bevor wir das in Angriff nehmen, lassen Sie uns das Symbol noch einmal verlassen, um auf einem anderen Weg erneut an diese Stelle zurückzukehren. Klicken Sie also auf Szene 1 in der Adressleiste und Sie befinden sich wieder in der Hauptszene (mit mehreren Instanzen des Kreises). Kehren Sie nun zur Masterversion des Symbols zurück, indem Sie auf eine beliebige Instanz des Symbols doppelklicken. Wenn das passiert ist, wird sich die Adressleiste wieder ändern und die anderen Instanzen werden etwas schwächer dargestellt. Diese Vorgehensweise ist vergleichbar mit der Bearbeitung von Gruppen aus dem letzten Kapitel. Allerdings werden wir hier den Kreis bearbeiten.

140

Wie man Symbole erstellt und verwendet

Abbildung 5.2: Das Optionsmenü der Bibliothek enthält mehrere Optionen. Unter anderem ist auch BEARBEITEN verfügbar.

Abbildung 5.3: Man kann an der Adressleiste erkennen, dass im Moment ein Master-Symbol bearbeitet wird.

9. Schneiden Sie nun ein Stück aus dem Master-Kreis heraus, indem Sie das Pfeil-Werkzeug verwenden (siehe Abbildung 5.4). Dabei handelt es sich um eine gravierende Bearbeitung und nicht so etwas Einfaches wie die Veränderung der Farbe.

141

Die Bibliothek produktiv einsetzen

Abbildung 5.4: Jede Veränderung, die wir an diesem Symbol vornehmen, wird sich auf jede Instanz auswirken.

10. Kehren Sie nun in die Hauptszene zurück, indem Sie Szene 1 aus der Adressleiste anklicken. Sie werden sehen, dass jetzt alle Instanzen des Kreises die Verformung angenommen haben. Auch wenn Sie neue Instanzen aus der Bibliothek auf die Bühne ziehen, werden diese nun genauso aussehen. In der vorausgegangenen Übung haben wir etwas ausgewählt und in ein Symbol konvertiert. Dabei wurde eine Instanz des neuen Symbols auf der Bühne zurückgelassen. Der andere Weg, der zu einem Symbol führt, ist dieser hier: Entscheiden Sie sich ganz einfach, ein Symbol erstellen zu wollen und erstellen Sie es dann. Die eine Methode ist nicht besser als die andere und Sie werden immer das gleiche Ergebnis erhalten.

Übung: Erstellen Sie ein Symbol von Anfang an In dieser Übung werden wir die Funktion NEUES SYMBOL verwenden. 1. Erstellen Sie eine neue Datei (oder bleiben Sie in der mit dem Kreis-Symbol) und wählen Sie EINFÜGEN / NEUES SYMBOL. Wie Sie sehen, ist der Punkt IN SYMBOL KONVERTIEREN nicht aktiv, da nichts ausgewählt ist. 2. Nun erscheint das gleiche Fenster, das Sie schon aus der letzten Übung kennen. Benennen Sie das Symbol mit Quadrat und lassen Sie das Verhalten auf Filmsequenz eingestellt. Wenn Sie an dieser Stelle OK klicken, werden Sie in den Bearbeitungsmodus des Symbol-Masters gelangen (siehe Abbildung 5.5). Natürlich ändert sich auch die Adressleiste entsprechend.

142

Wie man Symbole erstellt und verwendet

Abbildung 5.5: Wenn Sie NEUES SYMBOL auswählen, werden Sie direkt in den Bearbeitungsmodus des neuen Symbols gelangen, um es anschließend zu zeichnen.

3. Da wir uns im Innern des Master-Symbols befinden, können Sie jetzt das Quadrat zeichnen. Wahrscheinlich werden Sie es genau in die Mitte zeichnen wollen, die durch ein kleines Plus-Zeichen in der Mitte der Bühne angezeigt wird (siehe Abbildung 5.5). Dieses Zeichen markiert gleichzeitig die Achse, um die beispielsweise rotiert oder skaliert wird, wenn man dieses Symbol verwendet. Wie trifft man mit dem Quadrat aber genau die Mitte? Dazu gibt es einen kleinen Trick: Wählen Sie das Quadrat aus und verschieben Sie es in den Zwischenspeicher, indem Sie BEARBEITEN / AUSSCHNEIDEN wählen. Nun sollten Sie sicherstellen, dass die Bühne wirklich mittig ausgerichtet ist. Das geschieht über ANSICHT / SKALIERUNG / BILD EINBLENDEN. Jetzt reicht dann einfach BEARBEITEN / EINFÜGEN, um das Quadrat exakt mittig einzufügen. Ich verwende diese Technik recht häufig, wenn ich Symbole zentrieren will. 4. Wenn Sie das Quadrat fertig gezeichnet haben, kehren Sie in die Hauptszene zurück (indem Sie auf Szene 1 in der Adressleiste klicken). Wo ist jetzt das Quadrat geblieben? Nun ja, Sie haben zwar ein neues Symbol erstellt, aber mit der Funktion NEUES SYMBOL wird es nur in der Bibliothek angelegt. Ziehen Sie also einige Instanzen des Quadrates auf die Bühne.

Wie Ihnen Symbole helfen können Wahrscheinlich haben Sie schon die eine oder andere Idee, wie Ihnen Symbole helfen können. Es gibt aber noch viele andere Möglichkeiten, an die Sie nicht einmal im Traum denken würden. Gehen wir doch einmal zu zwei fundamentalen Vorteilen beim Speichern in einer Bibliothek: die Dateigröße reduzieren und den Arbeitsaufwand minimieren.

143

Die Bibliothek produktiv einsetzen

Die Dateigröße reduzieren Sie können es glauben oder nicht: Wenn Sie eine Grafik in der Bibliothek gespeichert und 100 Instanzen auf die Bühne gezogen haben, ist die Datei nicht viel größer, als wenn Sie nur eine Instanz erzeugt hätten. Das funktioniert auf folgende Weise: Das Master-Symbol schlägt in Sachen Dateigröße 1:1 zu Buche. Wenn eine Grafik also 1 kb groß ist, wird die Flash-Datei auch um 1 kb größer. Eine Grafik von 100 kb erhöht den Speicherbedarf um 100 kb. Das hängt also nur davon ab, was sich in dem Symbol befindet. Egal, wie oft Sie das Symbol verwenden, es ist immer nur einmal als Ganzes in der Datei abgespeichert. Es werden eigentlich nur ein paar Details pro Instanz abgespeichert (Position, Farbe, Skalierung ...), aber die Dateimenge lässt sich auf ein paar Bytes reduzieren und ist mit einer Kopie des Symbols nicht vergleichbar. Stellen wir uns vor, wir hätten eine Grafik von 100 kb. Diese soll zehnmal auf der Bühne erscheinen. Wenn wir mit Kopien arbeiten würden, hätten wir ein ganzes Megabyte (!) an Speicherbedarf. Nach dem Instanzmodell kommen wir vielleicht gerade einmal auf 101 kb (wenn überhaupt). Symbole scheinen also hervorragend für die Verwendung mehrerer Instanzen der gleichen Form geeignet zu sein. Allerdings ist diese Technik noch weitaus mächtiger, da jede Instanz sehr unterschiedlich aussehen kann. Bisher haben wir ausschließlich gleich aussehende Instanzen des Masters erzeugt, die sich nur durch die Position am Bildschirm unterscheiden. Die Zusatzdaten, die eine Instanz ausmachen, können neben der Position aber (wie gesagt) auch den Drehwinkel und die Skalierung enthalten. Auf diese Art kann jede Instanz unterschiedlich aussehen. Darüber werden Sie später noch mehr erfahren. Merken Sie sich im Moment, dass Sie auch bei vielen Instanzen auf der Bühne (die auch noch unterschiedlich skaliert, gedreht, gefärbt usw. sein können) keine gravierende Erhöhung der Dateigröße verursacht haben.

Den Arbeitsaufwand minimieren Zusätzlich zum Einsparen des Speicherplatzes kann die Bibliothek auch Arbeit ersparen. Nehmen wir an, Sie benötigen einen Textblock, der immer wieder im Film auftaucht (ein Titel zum Beispiel). Wenn Sie diesen Text in die Bibliothek einfügen, können Sie jedes Mal, wenn der Text gebraucht wird, eine Instanz aus der Bibliothek ziehen. Wenn Sie den Text später ändern müssen, brauchen Sie nicht alle Stellen wieder zu suchen, bei denen der Text erscheint, sondern lediglich den Master zu ändern und der Text wird überall korrigiert. Dafür ist nur ein klein wenig Zeit für die Planung notwendig.

144

Die Bibliothek im Detail

5.3

Die Bibliothek im Detail

Sie haben die Bibliothek bereits in den vorangegangenen Beispielen eingesetzt. Allerdings haben wir uns damals nicht die Zeit genommen, auf die Details einzugehen. Das sollten wir nun nachholen, damit Sie alle Vorteile der Bibliothek nutzen können.

Den Überblick behalten Im ersten Kapitel haben wir gesehen, wie wichtig es ist, zu wissen, wo man sich befindet. Im Zusammenhang mit der Bibliothek gewinnt dieser Punkt noch mehr an Bedeutung. Es wird sehr verwirrend, wenn Sie die kleinen Hinweise nicht beachten. Bevor Sie also ein Werkzeug auswählen, sollten Sie sich immer fragen: »Wo bin ich und was will ich hier?« Hier sind einige Tipps, die Ihnen helfen sollen, den Überblick zu behalten: 쐽

Die Adressleiste, die Adressleiste, die Adressleiste! Dies ist das wichtigste Indiz, ob und in welchem Symbol Sie gerade arbeiten. Also behalten Sie die Adressleiste immer im Auge.

쐽

Jedes Mal, wenn Sie sich in der Bibliothek befinden, wird ein Plus-Zeichen auf der Bühne angezeigt, das die Achse angibt, um die beispielsweise rotiert wird. Das werden Sie in einer normalen Szene nicht sehen.

쐽

Außerdem werden Sie nie die Bühnenränder sehen, wenn Sie ein Symbol bearbeiten, denn da gibt es keine Bühne. Wenn Sie Instanzen auf die Bühne ziehen, müssen Sie diese innerhalb des Bühnenrahmens platzieren, damit der Anwender sie auch zu sehen bekommt. Symbole haben dagegen einfach keine Bühne.

쐽

Es gibt mehrere Wege, den Inhalt eines Master-Symbols zu erreichen: 왘

Zuerst sei das Optionsmenü der Bibliothek genannt. Klicken Sie ein Symbol an und wählen Sie dann OPTIONEN / BEARBEITEN. Alternativ dazu können Sie auf das Symbol doppelklicken. Ein Doppelklick auf den Namen des Symbols lässt Sie das Symbol umbenennen.

왘

Als Zweites können Sie jede beliebige Instanz des Symbols auf der Bühne doppelt anklicken, um das Master-Symbol bearbeiten zu können. Der Unterschied zur ersten Variante besteht darin, dass Sie nun noch den Inhalt der Bühne sehen (zwar ein wenig schwächer, aber dennoch in Position).

왘

Drittens lassen sich Symbole auch über die Schaltfläche Symbole bearbeiten (oben rechts) editieren (siehe Abbildung 5.6). Hier finden Sie eine Liste aller Symbole in Ihrem Film. Außerdem stellt Szene bearbeiten (die Schaltfläche daneben) eine schnelle Möglichkeit dar, zur Szene zurückzukehren.

145

Die Bibliothek produktiv einsetzen

Abbildung 5.6: Über die Schaltfläche Symbole bearbeiten erhalten Sie schnellen Zugang zu allen Symbolen in der aktuellen Datei.

Namen, Sortierung und Ordner verwalten Die Bibliothek ist so großartig, dass Sie sie immer verwenden werden. Sobald die Anzahl der Symbole in der Bibliothek allerdings ansteigt, werden Sie nach Wegen suchen, um etwas Ordnung zu schaffen. Sie können die Bibliothek auf verschiedene Weisen strukturieren, allerdings werden wir hier auf drei Punkte gezielt eingehen: Namen, Sortieren und Ordner erzeugen. Da jedes Symbol einen Namen braucht und man den dazu noch sehr schnell ändern kann, macht es Sinn, die Namen selbst zu organisieren. Jeder wird seine eigene Vorstellung von einer guten Bezeichnung haben, aber es gibt inzwischen einige Standards, die ich hier vorstellen will: Zunächst einmal sollten Sie präzise und beständig sein. Wenn Sie ein Symbol eines Kreises haben, nennen Sie es doch einfach Kreis. Es besteht kein Grund für kryptische Abkürzungen (wie zum Beispiel Kre). Allerdings mag eine Bezeichnung Roter Kreis ohne Kreislinie dann doch etwas zuviel des Guten sein. Sagen Sie, was sein muss, aber nicht mehr. Denken Sie daran, dass man die Bibliothek alphabetisch nach Symbolnamen sortieren kann. Da macht auch ein Plan für die Benennung von Symbolen Sinn. Wenn Ihr Film beispielsweise aus mehreren Teilen besteht, kann man diese dem Symbolnamen voranstellen, um mehr Ordnung zu schaffen. Nehmen wir an, Ihr Film enthält ein Spiel. Dann verwenden Sie doch einfach das Präfix spiel_ und erzeugen Symbolnamen, wie spiel_hintergund, spiel_figur, spiel_karte und so weiter. Eine solche Vorgehens-

146

Die Bibliothek im Detail

weise ist auch dann denkbar, wenn mehrere Personen an einer Datei arbeiten. Wenn jede Person einem Symbolnamen die Initialen voranstellt, ist es einfacher, herauszufinden, wer welches Symbol erstellt hat. Im Anhang A werden Sie weitere solcher Namenskonventionen kennen lernen. Wie ich bereits erwähnt habe, sortiert die Bibliothek die Symbole alphabetisch. Wenn Sie das Bibliotheksfenster vergrößern, werden Sie weitere Sortiermöglichkeiten finden. Klicken Sie dazu einfach auf die Schaltfläche Breite Ansicht (siehe Abbildung 5.7). Schauen Sie sich dieses Bild genau an, um sich ein wenig mit der Bibliothek vertraut zu machen. Sie können also nach dem Namen, der Art (alle Audio-Dateien stehen hintereinander usw.), der Anzahl der Zugriffe (gemeint ist die Anzahl der im Film verwendeten Instanzen) und dem Änderungsdatum sortieren.

Abbildung 5.7: Es gibt in der Bibliothek eine Vielzahl von Werkzeugen.

Das Bibliotheksfenster besitzt einige nützliche Werkzeuge: 쐽

Das Vorschaufenster zeigt eine verkleinerte Version des Symbols an.

쐽

Die Spaltenüberschriften können mehr als nur den Namen der Spalte angeben. Klicken Sie auf eine solche Überschrift und die Symbole werden nach diesem Kriterium sortiert.

147

Die Bibliothek produktiv einsetzen

쐽

Der kleine Pfeil verändert die Sortierreihenfolge.

쐽

Die Schaltfläche Neues Symbol bewirkt das Gleiche wie EINFÜGEN / NEUES SYMBOL.

쐽

Mit der Schaltfläche Neuer Ordner kann man (Sie ahnen es) einen neuen Ordner anlegen, in dem man dann mehrere Bibliotheksinhalte ablegen kann.

쐽

Wenn Sie auf Eigenschaften klicken, öffnet sich das Fenster, das Sie vom Erstellen eines Symbols kennen.

쐽

Breite Ansicht und Schmale Ansicht verändern die Fenstergröße der Bibliothek.

쐽

Im Options-Menü finden Sie alle soeben genannten Einstellungen in schriftlicher Form. Vergessen Sie dieses Menü also nicht, wenn Sie etwas an Bibliotheksfunktionalität suchen.

Zu guter Letzt kann man die Bibliothek auch mit Ordnern organisieren. Das kennen Sie ja schon vom Umgang mit den Daten auf Ihrer Festplatte. Sie können einfach einen neuen Ordner erstellen, indem Sie auf die Schaltfläche Neuer Ordner klicken. Dann können Sie dem Ordner direkt einen Namen zuweisen oder ihn später auf die gleiche Weise wie bei den Symbolen umbenennen. Die Organisation der Ordner ist sehr intuitiv. Lassen Sie mich dennoch ein paar Manöver erläutern. Sie können Symbole ganz einfach in einen Ordner verschieben, indem Sie das Icon des Symbols in den Ordner ziehen. Wenn Sie in einen Ordner hineinsehen wollen, können Sie diesen mit einem Doppelklick öffnen. Außerdem können Sie sogar Ordner in Ordnern anlegen.

5.4

Symbole aus der Bibliothek verwenden

Das Konzept, Symbole einfach aus der Bibliothek auf die Bühne zu ziehen, um eine Instanz zu erzeugen, ist recht einleuchtend. Das ist sehr vielseitig und dennoch einfach zu handhaben.

Instanzen von Symbolen auf der Bühne platzieren Da wir dieses Thema schon einmal besprochen haben, werde ich mich kurz fassen. Man kann also Symbole auf die Bühne ziehen, um eine Instanz zu erzeugen. Wenn man auf diese Art eine Instanz auf der Bühne kopiert, wird in Wirklichkeit eine neue Instanz (mit den Eigenschaften der kopierten Instanz) erzeugt. Es gibt aber noch eine weitere Möglichkeit, eine Instanz auf die Bühne zu bekommen. Das passiert nämlich immer dann, wenn Sie eine Form in ein Symbol konvertieren. Erinnern Sie sich?

148

Symbole aus der Bibliothek verwenden

Instanzen von Symbolen bearbeiten Wir haben schon erwähnt, dass sich die Instanzen durch die Positionen unterscheiden. Diese werden ja für jede Instanz getrennt abgespeichert. Ich habe auch schon anklingen lassen, dass man für jede einzelne Instanz auch andere Eigenschaften (Rotation, Skalierung usw.) verändern kann. In der folgenden Übung werden wir genau diese unterschiedlichen Eigenschaften unter die Lupe nehmen.

Übung: Ändern Sie die Position, die Vergrößerung und die Drehung von Instanzen 1. Erstellen Sie in einer neuen Datei ein Rechteck und legen Sie mit dem Text-Werkzeug Ihren Namen darüber. Versuchen Sie, diese beiden Objekte von der Größe her halbwegs anzupassen. Verändern Sie gegebenenfalls die Textfarbe, damit er sich gut sichtbar vom Rechteck abhebt. 2. Wählen Sie nun alles aus, was Sie soeben gezeichnet haben, und wählen Sie dann BEARBEITEN / IN SYMBOL KONVERTIEREN. Nennen Sie das Symbol Mein Name und lassen Sie die Standardeinstellung für das Verhalten bestehen. 3. Auf der Bühne befindet sich nun eine Instanz des soeben erstellten Symbols Mein Name. Erzeugen Sie nun weitere Instanzen dieses Symbols (dazu haben Sie oben verschiedene Möglichkeiten kennen gelernt).

Abbildung 5.8: Hier sieht man verschiedene Instanzen desselben Symbols, die sich nur durch die Position, Skalierung und Rotation unterscheiden.

149

Die Bibliothek produktiv einsetzen

4. Bewegen Sie nun jede Instanz an eine andere Position auf der Bühne. Verändern Sie die Größe oder den Drehwinkel der einzelnen Instanzen oder auch beides. Wenn Sie wollen, können Sie die eine oder andere Instanz auch kippen. Sie können ruhig »wilde Sachen« damit machen (siehe Abbildung 5.8) und trotzdem ist die Dateigröße im Prinzip nur so groß wie das Master-Symbol.

Farb-Effekte von Instanzen Vielleicht denken Sie jetzt, dass das Zuordnen von verschiedenen Positionen, Skalierungen und Rotationen eine Menge Möglichkeiten bietet – und Sie haben Recht. Allerdings ist das noch nicht alles. Man kann jeder Instanz auf der Bühne einen Effekt zuordnen.

Das Eigenschaften-Bedienfeld Wenn Sie eine Instanz mit einem Effekt belegen wollen, wählen Sie einfach die Instanz auf der Bühne und den gewünschten Effekt im Bedienfeld Eigenschaften aus. Wenn Sie dieses Bedienfeld nicht finden, öffnen Sie es über das Kontextmenü der Instanz (Rechtsklick auf die Instanz wie in Abbildung 5.9). Im Eigenschaften-Bedienfeld befindet sich ein Auswahlfeld, in dem Sie den gewünschten Farbeffekt einstellen können. Schauen Sie sich Abbildung 5.10 und die nun folgende Liste ein wenig genauer an, damit Sie mit den einzelnen Effekten vertrauter werden.

Abbildung 5.9: Über das Kontextmenü kann man alle relevanten Funktionen zu einem Objekt auf der Bühne ausführen.

150

Symbole aus der Bibliothek verwenden

쐽

Die Helligkeit fügt Weiß oder Schwarz zur Instanz hinzu. Sie wirkt dadurch heller oder dunkler.

쐽

Über Farbton erzielen Sie den gleichen Effekt wie mit Helligkeit, allerdings können Sie hier auch andere Farben als Schwarz und Weiß einstellen.

쐽

Mit Alpha lässt sich die Transparenz der Instanz verändern.

쐽

Außerdem steht Ihnen noch die Option Erweitert zur Verfügung, mit der Sie Farbton und Alpha kombinieren können.

Übung: Ändern Sie Effekte mehrerer Instanzen 1. Öffnen Sie die Datei, die Sie in der letzten Übung erstellt haben. Das war die mit den ganzen Symbolen und Ihrem Namen darin. Wenn Sie diese nicht mehr gespeichert haben, erstellen Sie einfach vier neue Instanzen. 2. Wählen Sie nun eine dieser Instanzen aus, indem Sie einmal darauf klicken. Öffnen Sie das Bedienfeld Eigenschaften, während die Instanz noch ausgewählt ist. 3. Wählen Sie hier aus dem Auswahlfenster die Option Helligkeit. Rechts daneben soll ein Feld mit einer Prozentzahl erscheinen (siehe Abbildung 5.10). Klicken Sie auf den Pfeil rechts daneben und halten Sie die Maustaste gedrückt. Es erscheint ein Schieberegler. Stellen Sie damit 80% ein. Alternativ dazu können Sie auch die Zahl 80 in das Prozentfeld eintragen.

Abbildung 5.10: Hier fügen wir einer Instanz gerade die 80% Helligkeit hinzu.

151

Die Bibliothek produktiv einsetzen

4. Lassen Sie das Eigenschaften-Bedienfeld geöffnet und wählen Sie eine andere Instanz aus. Stellen Sie nun im Auswahlfeld den Wert Farbton ein. Die Bedienung erfolgt ganz intuitiv. Stellen Sie eine Farbe ein und geben Sie wieder eine Prozentzahl für die Stärke des Farbeffekts an (siehe Abbildung 5.11). Wenn Sie hier 100% eintragen, wird das Symbol nur noch in der neu eingestellten Farbe erscheinen, auch wenn es zuvor mehrere Farben enthielt.

Abbildung 5.11: Der Effekt Farbton kann eine Instanz einfärben.

5. Jetzt versuchen wir das gleiche für Alpha. Setzen Sie den Alpha-Wert einer Instanz auf 40% und schieben Sie die so veränderte Instanz über etwas anderes, denn wenn nichts unter der Instanz liegt, kann auch nichts durchscheinen. 6. Betrachten wir abschließend noch die Einstellung Erweitert. Damit kann man die Alpha- und Farbtonfunktionen kombinieren. Es ist sehr schwierig, die acht Schieberegler zu bedienen, um genau das zu bekommen, was man erreichen will. Deshalb sollten Sie besser zu folgendem Trick greifen. Angenommen, Sie wollen etwas gelb einfärben und zusätzlich leicht transparent machen. Dazu sollten Sie zuerst den Effekt Farbton ausnutzen, um eine gelbe Färbung einzustellen. Nun wechseln Sie in die Einstellung Erweitert und stellen fest, dass bei den RGB-Werten bereits Zahlen eingetragen sind (siehe Abbildung 5.12). Jetzt brauchen Sie nur noch den gewünschten Wert für Alpha einzustellen und schon haben Sie es geschafft. Der Trick ist also, zuerst die Färbung einzustellen und dann den Effekt zu wechseln, da man so nicht den RGBWert von Hand einzustellen braucht.

152

Symbole aus der Bibliothek verwenden

Abbildung 5.12: Wenn Sie zuerst den Farbton verändert haben und danach die Option Erweitert aufrufen, wird die Farbe schon voreingestellt.

7. Probieren Sie es aus und bringen Sie viele Instanzen auf die Bühne. Verändern Sie jeweils die Effekte. Machen Sie, wonach Ihnen ist. Noch einmal: Die Dateigröße ist immer noch (fast) die gleiche, als wenn Sie nur eine Instanz auf dem Bildschirm hätten.

Wie sich jede Instanz verschieden verhält Sie haben jetzt schon eine Menge Unterschiede erforscht, die man den einzelnen Instanzen beibringen kann. Es gibt aber noch mehr: Erinnern Sie sich an die Einstellung Verhalten, als wir ein Symbol erzeugt haben? Man konnte dort festlegen, ob ein Symbol beispielsweise als Schaltfläche oder Filmsequenz (Movieclip) angesehen werden soll. Diese Einstellung kann man für jede Instanz getrennt vornehmen. Machen Sie sich keine Gedanken über die genaue Bedienung von Schaltflächen oder Filmsequenzen. Dazu gibt es später eigene Kapitel. Wenn wir das Verhalten einer Instanz verändern wollen, brauchen wir nur die Eigenschaften aufzurufen (das geht über das blaue Symbol mit dem Buchstaben »i« in der Bibliothek). Es erscheint wieder das Fenster, das Sie schon beim Erstellen eines Symbols kennen gelernt haben. Allerdings ist es um die Schaltfläche Bearbeiten erweitert worden (siehe Abbildung 5.13). Angenommen, Sie haben bereits zehn Instanzen als Filmsequenz auf die Bühne gezogen und ändern nun im Master das Verhalten des Symbols auf Schaltfläche, dann werden diesmal nicht alle anderen Instanzen umgewandelt. Die Einstellung bezieht sich nur auf neue Instanzen. Die alten bleiben alle Filmsequenzen.

153

Die Bibliothek produktiv einsetzen

Abbildung 5.13: Über diesen Dialog kann man das Standardverhalten eines Symbols verändern.

Selbstverständlich hat nicht nur der Master ein Standardverhalten, sondern jede einzelne Instanz ist mit ihrem eigenen Verhalten ausgestattet. Im Bedienfeld Eigenschaften kann man das Verhalten für jede einzelne Instanz nachlesen und verändern (siehe Abbildung 5.14).

Abbildung 5.14: Mit diesem Bedienfeld lässt sich das Verhalten einzelner Instanzen verändern.

Instanzen von Symbolen in Symbolen verwenden Man kann nicht nur Instanzen eines Symbols auf die Bühne ziehen, sondern Instanzen auch für die Erstellung neuer Symbole verwenden. Auf diese Weise kann man beispielsweise ein Haus-Symbol erstellen und ein neues Symbol aus Instanzen des Haus-Symbols erzeugen, das eine ganze Häuserreihe darstellt (siehe Abbildung 5.15). Man kann also ohne weiteres Instanzen von Symbolen dazu verwenden, neue Symbole zu erzeugen.

154

Symbole aus der Bibliothek verwenden

Abbildung 5.15: Die Häuserreihen bestehen aus Instanzen des Symbols Haus.

Übung: Erstellen Sie ein Symbol, das Instanzen eines anderen Symbols verwendet 1. Erstellen Sie in einer neuen Datei einen Kreis, den Sie grau füllen. 2. Wählen Sie den gesamten Kreis aus und dann EINFÜGEN / IN SYMBOL REN. Nennen Sie das neue Symbol Kreis und klicken Sie auf OK.

KONVERTIE-

3. Nun wollen wir ein einfaches Auge erstellen. Sicher: Sie könnten zwei neue Kreise zeichnen und wieder ein Symbol daraus erzeugen. Das ist aber nicht Sinn und Zweck dieser Übung. Wir gehen also etwas anders vor. 4. Sie haben bereits eine Instanz des Symbols Kreis auf der Bühne. Vergrößern Sie diese und stellen Sie den Helligkeitseffekt auf 100%. Nun ziehen Sie eine weitere Instanz auf die Bühne und ändern deren Helligkeit auf -100%. Sie haben jetzt einen großen weißen und einen kleinen schwarzen Kreis auf der Bühne. 5. Richten Sie die beiden Instanzen so aus, dass die schwarze Instanz über der weißen liegt und das »Auge« nach unten schaut (siehe Abbildung 5.16). 6. Wählen Sie die beiden Kreise aus und dann EINFÜGEN / IN SYMBOL KONVERTIEREN. Nun haben Sie ein Symbol erzeugt, das aus zwei Instanzen besteht. Nennen Sie das neue Symbol Auge und klicken Sie auf OK. 7. Ziehen Sie eine zweite Instanz des Augen-Symbols auf die Bühne und drehen Sie sie.

155

Die Bibliothek produktiv einsetzen

Abbildung 5.16: Hier sehen Sie zwei Instanzen desselben Symbols. Sie unterscheiden sich nur durch Position, Helligkeit und Skalierung.

8. Ziehen Sie eine weitere Instanz des Kreises auf die Bühne und vergrößern Sie die Instanz. Stellen Sie diesen Kreis in den Hintergrund (weil er sonst die Augen verdecken würde). Färben Sie die Instanz hellgelb ein. 9. Sie haben nun ein Gesicht erstellt, das aus einem Kopf und zwei Augen besteht. Naja. Es fehlt noch der Mund. Also zeichnen Sie mit dem Pinsel-Werkzeug einen Mund. Wenn Sie jetzt denken, das hat nicht so ganz funktioniert, liegen Sie falsch, denn Sie haben ja auf der Leinwand-Ebene gezeichnet. Instanzen von Symbolen verdecken die Ebene allerdings. Wenn Sie den Mund nicht neben dem Gesicht neu zeichnen wollen, um ihn dort zu gruppieren, können Sie wie in Abbildung 5.17 versuchen, den Mund, den Sie nicht sehen, auszuwählen und danach zu gruppieren. 10. Nun sieht das Gesicht wie in Abbildung 5.18 aus. Wählen Sie erneut alles aus und konvertieren Sie das gesamte Gesicht in ein Symbol mit genau diesem Namen. Jetzt können Sie ganz einfach so viele Gesichter erzeugen wie Sie wollen. Sie bestehen alle aus »recycelten« Kreisen und einem Lächeln. Nebenbei: Sie brauchen den Mund nicht gesondert in die Bibliothek einzubinden, da er im Gesicht automatisch mitgespeichert wurde.

156

Symbole aus der Bibliothek verwenden

Abbildung 5.17: Sie können versuchen, den Mund mit dem Pfeil-Werkzeug auszuwählen, auch wenn er sich noch hinter dem Gesicht befindet.

Abbildung 5.18: Das fertige Gesicht

157

Die Bibliothek produktiv einsetzen

5.5

Zusammenfassung

Mit der Bibliothek ann man also viel mehr anstellen, als Sie zuerst vielleicht vermutet haben. Sie haben die Grundlagen der Bibliotheksorganisation erlernt und wissen, wie man Symbole erzeugt und anwendet. Wenn ein Symbol erst einmal in der Bibliothek ist, kann man es immer wieder im Film verwenden. Die so erzeugten Instanzen können mit eigenen Eigenschaften und Effekten versehen werden. Außerdem haben Sie zum Schluss gesehen, wie man aus Instanzen wieder neue Symbole erzeugt.

5.6

Workshop

F&A F

Wenn ich versuche, ein Symbol aus der Bibliothek auf die Bühne zu ziehen, wechselt der Cursor zum internationalen »Nein«-Symbol. Vorher hat es funktioniert. Warum jetzt nicht mehr? A

F

Symbole halten die Dateigröße schön klein und sparen auch viel Zeit. Es wäre aber noch besser, wenn man Sie unter mehreren Dateien austauschen könnte. Ist das möglich? A

F

Das ist tatsächlich vorgesehen und Sie können zu diesem Thema mehr in Anhang A erfahren. Bitte haben Sie bis dahin noch etwas Geduld.

Ich habe ein Symbol aus der Bibliothek auf die Bühne gezogen. Danach habe ich das Mastersymbol verändert. Als ich zur Hauptszene zurückgekehrt bin, befand ich mich in einer neuen Datei! Also wählte ich den ursprünglichen Film über das Fenster-Menü aus. Allerdings war das Symbol auf der Bühne noch das ursprünglich unveränderte. Was läuft da falsch? A

158

Man kann Symbole nur dann auf die Bühne ziehen, wenn man über eine geöffnete Ebene verfügt, in der man auch zeichnen kann. Das setzt voraus, dass sie nicht gesperrt oder versteckt ist. Außerdem darf sich der Abspielkopf nicht in einem interpolierten Bild befinden (wie wir in den Kapiteln 8 und 9 noch sehen werden).

Die Bibliothek kann Sie manchmal an der Nase herum führen. In diesem Fall haben Sie ein Symbol aus der Bibliothek einer anderen Datei in eine weitere Datei gezogen. Wenn Sie die Bibliothek geöffnet haben und danach eine neue Datei erzeugen, wird die Bibliothek weiterhin auf der Bühne bleiben (und dunkelgrau eingefärbt). Allerdings ist sie dann immer noch die Bibliothek des ersten

Workshop

Films, denn jeder Film besitzt seine eigene Bibliothek. Wenn Sie ein Symbol aus einer Bibliothek in einen anderen Film ziehen, wird Flash dieses Symbol in die Bibliothek des anderen Filmes kopieren. Wenn Sie die Bibliothek immer geschlossen halten, werden Sie damit keine Probleme haben. Außerdem sollten Sie jeden Film, mit dem Sie arbeiten, abspeichern. Dann wird nämlich der Dateiname in der Titelleiste der Bibliothek eingeblendet. F

Wenn ich das Transformationswerkzeug verwende, um mehrere Symbole zu drehen, werden diese um die gemeinsame Mitte gedreht. Was ich vorhabe, ist aber, alle Symbole um die jeweils obere linke Ecke zu drehen. Gibt es da eine Möglichkeit? A

Ja. Wenn man ein Symbol anlegt, kann man die Registrierung verändern und so den Drehmittelpunkt nach oben links verschieben. Nun muss man allerdings jedes Symbol einzeln drehen.

Quiz Erst überlegen – Lösungen stehen in Anhang C. 1. Sie finden ein Symbol nicht in der Bibliothek, obwohl Sie wissen, dass Sie es erstellt haben. Was ist normalerweise der Grund dafür? a.

Ihre Flash-Version ist abgelaufen. Kaufen Sie sich ein Update.

b. Die Bibliothek gehört nicht zu der aktuellen Datei oder das Symbol versteckt sich in einem Unterordner. c. Sie haben den Namen des Symbols vergessen. Deshalb wird es nicht mehr aufgelistet. 2. Woran erkennen Sie, dass Sie im Moment ein Master-Symbol bearbeiten? a.

Die Adressleiste enthält den Namen des Symbols und in der Mitte der Bühne ist ein Plus-Zeichen zu sehen.

b. Das Eigenschaften-Bedienfeld ist deaktiviert. c. Das Symbol wird im Bibliotheks-Vorschaufenster angezeigt. 3. Sollten Sie einen anderen Effekt als Alpha verwenden, wenn Sie eine Instanz farblich abschwächen wollen? a.

Nein, nichts schlägt Alpha.

b. Ja, denn man sollte niemals Alpha verwenden. c. Wenn die Instanz nicht über etwas anderem liegt, sollte man sich mit der Helligkeit begnügen oder eventuell einen Farbton festlegen.

159

Animationen verstehen

6

Animationen verstehen

Es gibt nichts, was man mit einer Animation vergleichen kann. Sie kann inspirieren, lehren und unterhalten. Außerdem bleibt sie im Gedächtnis – es besteht doch kein Zweifel, dass Sie beim Namen »Disney« direkt an gewisse Bilder denken. Sie stehen gerade am Fuß des Berges, auf dessen Gipfel die Macht der Animation auf Sie wartet. Bevor wir aber »losklettern«, gibt es einige Konzepte, die wir genauer betrachten sollten. Deshalb werden wir in diesem Kapitel die Animation im Allgemeinen und deren Umsetzung in Flash im Besonderen diskutieren, damit Sie genau wissen, worauf ich hinaus will. Wenn Sie das Ziel vor Augen haben, fällt es Ihen nämlich leichter, in den folgenden Kapiteln die technischen Grundlagen für die Animationsentwicklung zu legen. In diesem Kapitel werden Sie 쐽

die Grundlagen der Animation erlernen,

쐽

die wichtigsten Grundbegriffe im Zusammenhang mit Animationen kennen lernen,

쐽

sich mit den elementaren Flash-Komponenten für die Animationsentwicklung vertraut machen

쐽

und herausfinden, wo das Animationskonzept versagt und wie man trotzdem zu einem ansehnlichen Ergebnis kommt.

6.1

Wie Animationen arbeiten

Eine Animation wird aus einzelnen Bildern hergestellt. Stellen Sie sich vor, Sie sehen ein Auto vorbeifahren. Sie sehen das Auto dann die ganze Zeit, solange es in Sichtweite ist. Allerdings werden Sie irgendwann blinzeln. Ihr Gehirn wird aber die Tatsache vertuschen, dass Sie einen Teil des Geschehens verpasst haben. Wenn Sie Fernsehen oder einen Film anschauen, blinkt der Bildschirm (oder die Leinwand) sehr schnell (manchmal erscheint ein Bild und manchmal bleibt alles schwarz). Die Tatsache, dass die schwarzen Pausen extrem kurz sind, lässt Sie denken, Sie sähen eine lückenlose Bewegung. Dieser Effekt kommt über das menschliche Auge im Zusammenspiel mit dem Gehirn zustande. Wenn Licht Ihre Netzhaut trifft, wird ein Signal an das Gehirn gesendet. Dieser Effekt stoppt aber nicht so schnell, wie auf der Leinwand die schwarze Stelle schon überwunden wurde und das nächste Bild erscheint (vorausgesetzt, die Pause ist nicht zu lang).

6.2

Die Komponenten einer Animation

Da wir nun einige grundlegende Dinge über Animationen wissen, können wir uns damit befassen, wie man sie in Flash umsetzt. Es gibt viele Grundbegriffe für Animationen, deren Bedeutung Sie direkt mit der Umsetzung in Flash kennen lernen.

162

Die Komponenten einer Animation

Bilder und Bildrate Wie ich schon gesagt habe, besteht eine Animation aus einer Reihe von Standbildern. Jedes Standbild wird kurz auch Bild genannt. Beim Kinofilm ist die Bedeutung klar. Ein Bild ist ein kleines Foto auf dem Filmstreifen. Das entspricht einem kleinen Rechteck in der Zeitleiste von Flash. Die Bilder in Flash sind sogar durchnummeriert. Jedes fünfte Bild ist grau unterlegt. Der rote Abspielkopf kann nur auf ein Bild gleichzeitig zeigen – das ist dann exakt das Bild, das Sie sehen und bearbeiten können. Sie zeichnen aber nicht in einem Bild in der Zeitleiste, sondern auf der Bühne. Der Abspielkopf in der Zeitleiste gibt lediglich an, welches Bild sich gerade auf der Bühne befindet. In Abbildung 6.1 sehen Sie die Zeitleiste in ihrem Urzustand. Solange man die Filmdauer nicht erweitert, kann man den Abspielkopf nicht hinter das erste Bild bewegen. Nur das erste Bild ist weiß mit einem schwarzen Rahmen.

Abbildung 6.1: Die Zeitleiste mit ihren vielen Zellen ist zu Anfang nur mit einem einzigen Bild ausgestattet.

Standardmäßig wird Ihre Zeitleiste nur ein Bild lang sein. Der Abspielkopf ist noch unbeweglich, weil er sich nur in einem Bild einer Animation befinden kann (und momentan haben wir nur ein Bild). Schauen wir uns also eine Animation mit mehreren Bildern an. Ich möchte jetzt aber nicht, dass Sie sofort eine Animation erstellen, sondern es reicht vorerst, wenn Sie eine bestehende Animation öffnen. Es gibt eine Datei namens Import_video.fla, die sich im FLA-Ordnere des Samples-Ordners Ihrer Flash MX-Installation befindet (unter Windows üblicherweise: C:\Programme\Macromedia\Flash MX\Samples\FLA). Öffnen Sie diese Datei, um mir folgen zu können. Jetzt können Sie in der Zeitleiste den Abspielkopf beispielsweise auf das Bild 15 zeigen lassen. Klicken Sie dazu nicht in das Bild (also auf das Rechteck), sondern auf die Zahl 15 oberhalb der Rechtecke (siehe Abbildung 6.2).

163

Animationen verstehen

Abbildung 6.2: Es wird eine Zeitleiste mit 48 Bildern angezeigt, wobei sich der Abspielkopf auf Bild 15 befindet. Sie können den Abspielkopf auf jedes der 48 Bilder stellen, indem Sie auf die Nummernleiste klicken.

An dieser Beispiel-Datei kann man mehrere wichtige Konzepte erklären. Als Erstes will ich Ihnen das so genannte Schrubben vorstellen. Dazu klicken Sie beispielsweise auf die Zahl 25 in der Zeitleiste und halten die Maustaste gedrückt. Dann bewegen Sie die Maus nach links und rechts (immer noch bei gedrückter Maustaste) und Sie erhalten einen kurzen Einblick, wie die Animation ablaufen wird. Die Animationsgeschwindigkeit hängt natürlich in diesem Moment davon ab, wie schnell Sie schrubben. Der Anwender wird später eine feste Bildrate zu Gesicht bekommen. Wählen Sie STEUERUNG / ABSPIELEN oder drücken Sie einfach (Enter), um zu sehen, wie die Animation mit der richtigen Bildrate aussieht. Wenn Sie die Animation wieder anhalten möchten, drücken Sie einfach erneut auf (Enter). Sie sollten auch einen kurzen Blick auf die Statuszeile in der Zeitleiste werfen, denn dort werden die aktuelle Bildnummer, die Bildrate und die bereits verstrichene Zeit angezeigt (siehe Abbildung 6.3). Abbildung 6.3: Die Statuszeile der Zeitleiste enthält drei wichtige Zahlen, die in Zusammenhang mit dem Animationstiming stehen.

164

Die Komponenten einer Animation

Schrubben ist ein Ausdruck, der in allen Animationsbereichen angewendet wird. Dabei handelt es sich um eine Verfahren, eine Vorschau der Animation zu erhalten. Halten Sie dazu einfach den roten Abspielkopf fest und bewegen Sie ihn vor und zurück (über alle Bilder der Animation). Dabei bewegen Sie die Maus in einer schrubbenden Weise (daher der Name). Die Bildrate gibt an, wie schnell der Film für den Betrachter wiedergegeben wird und wird in Bildern pro Sekunde (bps) gemessen. Eine Bildrate von 30 bps gibt an, dass dreißig Bilder in jeder Sekunde wiedergegeben werden. Man kann die Bildrate leicht mit der Geschwindigkeit verwechseln, aber das ist nicht wirklich das Gleiche. Wenn eine Animation aus zehn Bildern bei 10 bps besteht, sieht sie eigentlich aus wie eine Animation, die zwanzig Bilder mit 20 bps durchläuft, denn beide benötigen eine Sekunde. Letztere Animation wirkt allerdings flüssiger. Die aktuelle Bildnummer (links) gibt die Position des Abspielkopfes wieder. Sie verändert sich beim Abspielen und beim Schrubben, da Sie ja immer nur ein Bild zugleich sehen können. Die Bildrate steht normalerweise auf der zuletzt von Ihnen unter MODIFIZIEREN / DOKUMENT eingestellten Bildrate. Allerdings wird Flash die Bildrate selbstständig reduzieren, wenn es merkt, dass es bei Ihrer Animation in der von Ihnen gewählten Bildrate nicht mithalten kann. Lassen Sie uns die Bildrate zu Testzwecken einmal sehr hoch einstellen, um zu sehen, was passiert. Stellen Sie sicher, dass Sie die Datei Import_video.fla geöffnet haben und öffnen Sie dort das Menü MODIFIZIEREN / DOKUMENT. Sie erreichen dieses Fenster auch über (Strg)+(J) oder per Doppelklick auf die Bildrate (in der Zeitleiste). Stellen Sie für die Bildrate den Wert 60 ein und klicken Sie auf OK. Spielen Sie nun den Film ab. Im Normalfall wird Ihr Computer versuchen, mit 60 bps abzuspielen, aber nicht mithalten können. Die Bildrate wird beim Abspielen laufend aktualisiert. Die hier angegebene Bildrate ist aber nicht ganz richtig, da Flash momentan im Bearbeitungsmodus läuft. Wenn der Film exportiert wurde, sieht die Bildrate im Normalfall noch niedriger aus. Die letzte Ziffer gibt an, wie viel Zeit Flash benötigen wird, um das aktuell angezeigte Bild zu erreichen. Wenn Sie eine Animation mit 50 Bildern haben, wird das letzte Bild bei einer Bildrate von 24 bps nach etwa zwei Sekunden und bei einer Bildrate von zwölf bps nach etwa vier Sekunden erreicht sein. Die Abspiellänge des Films hängt also von der Bildrate ab.

Die Bildrate gegenüber der Anzahl der Bilder Die Zahlen im Statusbereich sind von großer Wichtigkeit. Wenn Sie einen Film erstellen, werden Sie wahrscheinlich eine Bildrate auswählen wollen, um diese fest einzustellen. Wenn Sie dann später die Bildrate verändern, passiert das für den gesamten Film. Ange-

165

Animationen verstehen

nommen, Sie haben eine Animation eines Sportlers, der erst geht, dann läuft, später rennt und zwischendurch für einen Moment stillsteht. Wenn Sie ihn etwas schneller gehen lassen wollen, indem Sie die Bildrate erhöhen, wird er aber auch extra schnell rennen. Seine Pause wird auch kürzer ausfallen – alles geschieht einfach schneller. Am besten lassen Sie die Bildrate unverändert und finden einen anderen Weg, den Charakter zu beschleunigen. Tatsächlich gibt es ein paar Möglichkeiten, die effektive Geschwindigkeit zu verändern. Stellen Sie sich vor, dass Sie eine Animation eines Flugzeuges erstellen wollen, das sich am Himmel bewegen soll. Dazu müssen Sie sich entscheiden, wie schnell das passieren soll. Wenn die Animation über 36 Bilder erfolgt, stellen Sie sich vielleicht eine Flugzeit von drei Sekunden vor. Dann stellen Sie die Bildrate einfach fest auf 12 bps ein. Die effektive Geschwindigkeit gibt an, wie schnell sich etwas scheinbar bewegt. Dagegen steht die tatsächliche Geschwindigkeit, die gemessen werden kann. Wenn 12 Bilder mit 12 bps durchlaufen, dauert das eine Sekunde. Was dabei passiert, ist aber der Schlüssel zur effektiven Geschwindigkeit. Daher kann man eine Illusion erzeugen, indem man die effektive Geschwindigkeit einer Animation beschleunigt oder verlangsamt. Wenn sich binnen 12 Bildern viel verändert, ist das effektiv schnell. Bei lediglich kleinen Veränderungen ist die effektive Geschwindigkeit langsam. Wenn ein Flugzeug in 3 Sekunden über den Bildschirm fliegt, ist es scheinbar sehr nah. Wenn es allerdings in 8.000 Metern Höhe fliegt, braucht es etwa 15 Sekunden (oder länger), um den Bildschirm zu überqueren. Wenn Ihr Flugzeug also zu schnell ist, gibt es zwei Möglichkeiten, es zu verlangsamen: Entweder Sie setzen die Bildrate herunter, oder Sie gönnen der Animation mehr Bilder. Wenn Sie die Bildrate auf 2 bps senken, braucht man 18 Sekunden für 36 Bilder, allerdings wird die Animation sehr ruckelig ablaufen (und wir verlangsamen die gesamte restliche Animation). Wenn Sie die Animation stattdessen auf 240 Bilder erweitern, wird das Flugzeug 20 Sekunden benötigen, um die Bewegung abzuschließen. Wie man so etwas macht, lernen wir in den nächsten Kapiteln. Im Augenblick ist es nur wichtig, den Unterschied zwischen der Bildrate und der Anzahl der Bilder zu verstehen.

Die Bildrate verschiedener Animationstypen Wir haben uns bisher über die Bildrate bei verschiedenen Perspektiven unterhalten. Wenden wir uns einmal den unterschiedlichen Medien zu. Ein Kinofilm spielt mit einer Bildrate von 24 bps. Auch bei dieser eher geringen Rate scheint der Film doch sehr flüssig zu sein und man bemerkt die schwarzen Pausen zwischen den Bildern nicht. Das Fernsehen arbeitet mit 30 bps. Bei Computeranimationen müssen wir anders an die Bildratenfrage herangehen. Der Monitor selbst wird viel mehr Bilder in der Sekunde anzeigen, als unsere Animation liefern kann. Deshalb kommt es bei Animationen auf dem Computer darauf an, wie oft sich ein

166

Die Komponenten einer Animation

Bild in der Animation verändert. In der Praxis sieht das dann so aus: Wenn Sie weit unter die Standardeinstellung von 12 bps gehen, wird der Betrachter ein »Springen« der Animation ausmachen. Wenn Sie aber schneller werden, wird er denken, dass es viel flüssiger läuft und Bewegungen fast wie im echten Leben ablaufen. Denken Sie noch einmal an den Kinofilm: Er läuft mit 24 bps sehr flüssig. Auf den ersten Blick sieht es so aus, als ob Sie die Bildrate immer so hoch wie möglich ansetzen sollten, damit der »Ruckeleffekt« vermindert wird. In Wirklichkeit ist das aber nicht so einfach. Zuerst einmal werden die Dateien von Animationen mit hohen Bildraten oft viel größer. Außerdem braucht man dann auch einen Computer, der diese Bildrate flüssig anzeigen kann. Ein älterer Computer macht eine Animation daraus, die nicht nur ruckelnd abläuft, sondern auch noch viel langsamer wird. Abschließend sei gesagt, dass man den Betrachter auch ein wenig an der Nase herumführen kann, denn mit bestimmten Tricks kann man eine schnellere Bewegung vortäuschen. In Kapitel 7 werden Sie eine Animation erstellen, die nur aus drei Bildern besteht. Im 21. Kapitel lernen Sie dann noch weitere Techniken kennen. Im Moment reicht es, wenn Sie im Hinterkopf behalten, dass die Bildrate zwar sehr wichtig, aber bei weitem nicht das Wichtigste ist.

Schlüsselbilder und leere Schlüsselbilder In einem Schlüsselbild definieren Sie genau, was zu diesem Zeitpunkt wie und wo auf der Bühne erscheinen soll. Dabei können also Objekte auf der Bühne sein oder diese kann auch leer bleiben. Ein solches leeres Schlüsselbild ist immer noch ein Schlüsselbild, bei dem halt nur nichts auf der Bühne erscheint. In einem traditionellen Film ist jedes Bild ein Schlüsselbild, da immer etwas Neues auf dem Bildschirm erscheint. Genauso können Sie in Flash jedes Bild als Schlüsselbild definieren, Sie können aber auch eine Abkürzung nehmen. Wenn das erste Schlüsselbild im Bild 1 erscheint und das nächste erst in Bild 10, passiert in den Bildern 2 bis 9 nichts Neues. Das Schlüsselbild 1 gibt an, was bis zum nächsten Schlüsselbild (10) auf der Bühne zu sehen sein soll. Das ist genau richtig, wenn sich etwas nicht jeden Sekundenbruchteil verändern soll. Wenn Sie also ein Schlüsselbild erzeugen, machen Sie eigentlich nichts anderes, als Flash zu sagen: »Zeige diese Sachen auf der Bühne an und lass sie dort, bis das nächste Schlüsselbild erreicht wird.« Das nächste Schlüsselbild bedeutet wieder das Gleiche: »Zeige diese Sachen auf der Bühne...« Man muss sich bei Schlüsselbildern also nur zwei Sachen überlegen: Wann soll es in der Zeitleiste erscheinen, und was soll in dem Moment auf der Bühne erscheinen? Man erstellt ein Schlüsselbild, indem man das Bild, das zum Schlüsselbild werden soll, anklickt und dann EINFÜGEN / SCHLÜSSELBILD wählt oder direkt (F6) drückt. Wenn Sie diese Funktion ausführen, passieren einige Dinge. Zuerst wird das Bild nun durch einen

167

Animationen verstehen

Punkt oder Kreis in der Zeitleiste gekennzeichnet und der Inhalt des letzten Schlüsselbildes auf die Bühne kopiert. Wenn sich im letzten Schlüsselbild nichts auf der Bühne befunden hat, wird ein leeres Schlüsselbild eingefügt. Wenn im Schlüsselbild zuvor aber etwas angezeigt wurde, wird das wie gesagt kopiert. Das mag sich etwas eigenartig anhören, da ein Schlüsselbild ja eine Veränderung zum vorherigen Schlüsselbild bringen soll. In den meisten Fällen wird aber nur eine kleine Veränderung nötig sein. Deshalb kann man leichter mit einer Kopie starten und dort die Kleinigkeiten bearbeiten. Was auch immer Sie in ein Schlüsselbild zeichnen, wird auf der Bühne bleiben, bis das nächste Schlüsselbild erreicht wird (sei es nun ein leeres oder ein ausgefülltes Schlüsselbild). Wenn man ein Schlüsselbild nach dem nächsten platziert, ändert sich die Bühne bei jedem Bild (bei einer Bildrate von 10 bps also zehn Mal in der Sekunde). Allerdings brauchen Sie Schlüsselbilder nicht in Serie anordnen. Wenn Sie beispielsweise Bilder und Schlüsselbilder abwechselnd anfügen, werden (immer noch bei 10 bps) Änderungen fünf Mal in der Sekunde angezeigt: zwischen den Schlüsselbildern jeweils das vorherige Schlüsselbild. Wenn Sie also ein Rechteck zeichnen möchten, das nach einer Sekunde irgendwohin springt, erstellen Sie ein Schlüsselbild und verschieben Sie das Rechteck (bei 10 bps) zehn Bilder später auf seine neue Position.

Übung: Analysieren Sie eine fertig gestellte Animation In dieser Übung werden wir eine Beispielanimation betrachten und kleine Änderungen daran vornehmen, um Schlüsselbilder besser verstehen zu können. 1. Öffnen Sie die Datei keyframing.fla. Diese Datei befindet sich auf der CD-ROM im Verzeichnis Beispiele/6. Drücken Sie (Enter), um zu sehen, wie die Animation abläuft (siehe Abbildung 6.4). 2. Wie Sie sehen, gibt es verschiedene Ebenen (Sparkle = Funkeln, X, M, Flash und Background = Hintergrund). Wir werden diese Ebenen einzeln betrachten. Gegebenenfalls müssen Sie die Höhe der Zeitleiste verändern (siehe Abbildung 6.5), wenn nicht alle Ebenen sofort sichtbar sind. Wir werden uns in Kapitel 11 noch genauer mit den Ebenen auseinander setzen. 3. Ich persönlich finde das Editieren in der Zeitleiste am Einfachsten, wenn die Option BEREICHSBASIERTE AUSWAHL im Menü BEARBEITEN / VOREINSTELLUNGEN aktiviert ist. Stellen Sie diese Option bitte wie in Abbildung 6.6 ein. 4. Die Ebene Hintergrund befindet sich von Anfang an (Bild 1) auf der Bühne und bleibt bis zum Ende der Animation unverändert. Wie Sie sehen, gibt es nur in Bild 1 ein Schlüsselbild, das von vielen normalen Bildern gefolgt wird. Man kann die Anzahl dieser Bilder verändern, indem man das Rechteck in Bild 60 verschiebt (bitte führen Sie das jetzt noch nicht aus). In Abbildung 6.7 sehen Sie mehr Details zur Zeitleiste .

168

Die Komponenten einer Animation

Abbildung 6.4: In dieser Zeitleiste verbergen sich eine Menge Hinweise darüber, wie die Animation aussehen wird.

Abbildung 6.5: Man kann die Größe der Zeitleiste verändern, um alle Ebenen zu sehen.

169

Animationen verstehen

Abbildung 6.6: Die Option Bereichsbasierte Auswahl ist meiner Meinung nach sinnvoll und macht obendrein diese Übung einfacher.

Abbildung 6.7: Hier sehen Sie weitere Informationen zur Zeitleiste, falls Sie die Datei nicht herunter laden können.

5. Schrubben Sie in den Bildern 31 bis 60, indem Sie den Abspielkopf zwischen diesen Bildern hin und her bewegen. Sie sehen die Animation des »Glitzers«. Wenn Sie die dazugehörige Ebene Sparkle betrachten, werden Sie sehen, dass jedes Bild von Num-

170

Die Komponenten einer Animation

mer 31 bis 54 ein Schlüsselbild ist. Deshalb verändert sich etwas von Bild zu Bild. Wenn Sie den Abspielkopf hinter Bild 54 bewegen, ist der Glitzer verschwunden, denn in der Ebene Sparkle gibt es keine weiteren Bilder nach der Nummer 54. 6. Die Flash-Ebene ist wahrscheinlich interessanter. Im ersten Bild erscheint das Wort »Flash«, das erst im vierten Bild verändert wird. Die Schlüsselbilder 4 bis 15 bringen jeweils Veränderungen, die sich das Wort scheinbar drehen lassen. Sie können die Tasten (,) und (.) verwenden, um den Abspielkopf zu bewegen, falls Ihnen das Schrubben zu ungenau ist. 7. Die Ebenen X und M haben als Erstes ein leeres Schlüsselbild (an Position 1). Das wird durch den Kreis angezeigt. Es ist nicht so, dass das »M« und das »X« am Anfang nicht auf der Bühne sind — sie existieren einfach noch gar nicht (genau das ist die Idee hinter einem leeren Schlüsselbild). Das »M« erscheint in Bild 10 und das »X« erst in Bild 15. Genau dort entdecken Sie auch das erste gefüllte Schlüsselbild für beide Ebenen. Wenn die beiden Buchstaben erst einmal auf der Bühne sind, verändern sie sich jedes Mal per Schlüsselbild. Naja: Das »M« macht zwischen Bild 13 und 17 eine kleine Pause. In Bild 29 endet dann für die Buchstaben die Lebenszeit, da sich in den beiden Ebenen keine weiteren Bilder befinden. 8. Schauen wir, was passiert, wenn wir weitere Bilder in die Ebene M hinter Bild 29 einfügen. Klicken Sie dazu auf Bild 60 in der Ebene M. Drücken Sie nun (F5), um ein neues Bild einzufügen oder wählen Sie EINFÜGEN / BILD. Wenn Sie die Animation nun abspielen lassen, wird das »M« nicht verschwinden. Die Erscheinung des Schlüsselbildes 29 wird bis Bild 60 beibehalten. Man kann die Dauer dieses Zustandes (das Erscheinen des »M«'s) verkürzen, indem man das Quadrat aus Bild 60 nach links verschiebt (siehe Abbildung 6.8). (Bitte beachten Sie, dass dieser Effekt nur zusammen mit der Taste (Alt) funktioniert, wenn Sie die Einstellung in Schritt 3 nicht getätigt haben.) Abbildung 6.8: Wenn wir Bilder am Ende einer Ebene eingefügt haben, können wir die Dauer verkürzen, indem wir das Rechteck nach links bewegen.

9. Sie können mit dieser Datei später noch experimentieren. Schließen Sie die Datei aber vorerst, ohne sie zu speichern. In diesem Beispiel hatten Sie also die Chance, Bilder, Schlüsselbilder und leere Schlüsselbilder in einer funktionsfähigen Datei zu erleben. (Nebenbei: Ich habe diese Datei erzeugt, um die eben gelernten Punkte zu verdeutlichen. Je mehr Sie über Flash lernen, desto mehr Möglichkeiten werden Sie kennen, diese Datei zu optimieren.)

171

Animationen verstehen

Tweening Man kann alles Mögliche in ein Schlüsselbild legen, um es bis zum Erscheinen eines weiteren Schlüsselbildes anzuzeigen. Alternativ dazu können Sie Flash zwingen, einen Übergang zu generieren. Stellen Sie sich vor, dass ein Flugzeug im ersten Schlüsselbild auf der linken Seite der Bühne ist und im nächsten Schlüsselbild (einige Bilder später) auf der rechten Seite erscheint. Flash kann nun berechnen, wie sich das Flugzeug von der einen Position zur anderen bewegen muss. Diesen Vorgang nennt man Tweening. Unter Tweening versteht man den Prozess, über Verformungen oder Verschiebungen von einem Schlüsselbild auf ein anderes überzuleiten. Wenn ein Kreis in Bild 1 am unteren Rand der Bühne ist und dann in Bild 10 am oberen Rand der Bühne auftaucht, ist der Übergang sehr abrupt. Wenn die beiden Bilder per Tweening verbunden werden, sieht man, wie der Kreis 10 Mal 1/10 der Strecke zurücklegt. Flash übernimmt die Berechnung für Sie, sodass Sie nicht zehn neue Schlüsselbilder erstellen müssen, um den Kreis »von Hand« zu verschieben. Das Wort »Tweening« stammt vom englischen Wort »between« (zwischen) und wird auch in konventionellen Animationen verwendet. Wenn Sie einmal den Abspann eines voll animierten Filmes sehen, werden Sie neben den Zeichnern auch die so genannten Tweener finden. Die Zeichner erstellen sozusagen die Schlüsselbilder und die Tweener füllen die Lücken bis zum nächsten Schlüsselbild auf.

Abbildung 6.9: Wenn man zwei durch einige Bilder getrennte, verschiedene Schlüsselbilder erstellt hat, kann man Flash beauftragen, den Übergang zu generieren.

172

Zusammenfassung

Damit Sie eine Vorstellung von diesem Vorgang bekommen, können Sie sich die Abbildung 6.9 ansehen. Es ist wirklich sehr einfach, das erste Bild (hier den Kreis) zu zeichnen, dann das letzte Bild (das Quadrat) zu erstellen und Flash den Rest machen zu lassen. In den Kapiteln 8 und 9 werden wir dieses Thema noch vertiefen. Denken Sie im Moment nur daran, dass Flash uns bei solchen Arbeiten unterstützt.

6.3

Zusammenfassung

Auch wenn wir in diesem Kapitel keine Animationen erstellt haben, so haben wir doch einige betrachtet. Wir haben einige Konzepte kennen gelernt, mit denen wir für die nächsten Kapitel gut gerüstet sind. Wir haben Medien wie Film und Fernsehen besprochen und herausgefunden, wie Animationen entstehen. Dieses Wissen haben wir auf Flash angewendet. Dann haben wir die Bildrate, Schlüsselbilder und das Tweening kennen gelernt. Die Bildrate ist die Geschwindigkeit, in der Flash versuchen wird, den Inhalt jedes einzelnen Bildes wiederzugeben. In Schlüsselbildern geben Sie an, was zu dieser Zeit auf der Bühne zu sehen sein soll. Und schließlich ist »Tweening« die Vorgehensweise, mit der Flash die Lücken zwischen Schlüsselbildern schließt, um eine gleichmäßige Bewegung zu erzeugen. Diese drei Konzepte werden wir in den nächsten Kapiteln noch sehr oft einsetzen und somit vertiefen.

6.4

Workshop

F&A F

Was ist die beste Bildrate, die man verwenden sollte? A

F

Das kann man leider nicht so pauschal beantworten. Bei der von Ihnen angegebenen Bildrate handelt es sich um das Maximum, was bei vielen Computern aber nicht erreicht werden kann. Experimentieren Sie ein wenig. Folgendes sollten Sie aber beachten: Entscheiden Sie sich einmal für eine Bildrate und bleiben Sie dann möglichst dabei. Wenn etwas sich sehr schnell bewegen soll, kann man auch einfach weniger Bilder verwenden, anstatt die Bildrate anzuheben.

Die Bildwiederholfrequenz meines Monitors ist 75 Hz. Er zeigt also 75 Bilder in der Sekunde an. Allerdings kann ich in Flash sogar Bildraten von 120 Bildern in der Sekunde einstellen. Was macht das für einen Sinn?

173

Animationen verstehen

A

F

Antwort: Zuerst einmal werden Sie feststellen, dass Flash bei einer Bildrate von 120 Bildern in der Sekunden nicht mithalten kann. Wenn man nur wenige Bilder abspielt, kann man sicherlich mehr als 30 bps abspielen. Dennoch werden 120 bps nur in der Theorie erreicht.

Ich habe die Bildrate auf 24 bps eingestellt. Irgendwie hat sie sich aber auf 18,2 reduziert. Wie mache ich das wieder rückgängig? A

Das ist ein Zeichen, dass Ihr Computer die Animation nicht mit 24 bps abspielen kann. Die 18,2 ist die letzte Bildrate, die Ihr Computer geschafft hat, als Sie die Animation abgespielt haben. Wenn Sie die Bildrate wirklich wieder ändern wollen, können Sie darauf doppelklicken. Bedenken Sie aber, dass Flash die 24 bps nicht schaffen wird. Es wird nur versuchen, so schnell wie möglich abzuspielen.

Quiz 1. Was ist der visuelle Effekt eines Filmes, der nur aus einzelnen Schlüsselbildern besteht? a.

Er sieht sehr flüssig aus.

b. Er wird »ruckelig« aussehen. c. Das hat keinen Einfluss auf die Erscheinung. 2. Wie wird die Animation erscheinen, wenn Sie die Bildrate auf 2 bps einstellen? a.

Die Animation sieht »ruckelig« aus.

b. Man sieht eine schwarze Pause zwischen den Bildern. c. Es erscheinen unterschwellige Botschaften zwischen den Bildern. 3. Wie lang dauert eine Animation mit 90 Bildern, wenn Sie die Bildrate auf 60 bps stellen? a.

Genau 1,5 Sekunden

b. 1,5 Sekunden oder länger c. Nichts von den oben genannten

174

Animationen im herkömmlichen Stil

7

Animationen im herkömmlichen Stil

Es wird nun endlich Zeit, selbst zu animieren! Sie wissen nun, wie man Grafiken erstellt, und somit haben Sie auch schon etwas, was Sie animieren können. Im letzten Kapitel haben Sie außerdem andere Grundlagen für die bewegten Bilder (Schlüsselbilder, Bildrate und Tweening) erlernt. Damit wären Sie jetzt bereit, Ihre erste Animation zu erstellen. Wir werden nicht sofort mit den Methoden beginnen, bei denen Flash Sie unterstützt (Bewegungs- und Formtweening), sondern zuerst eine Animation erstellen, die wir Bild für Bild verändern werden, um eine Bewegung zu simulieren. Mit Tweening werden wir uns in den nächsten beiden Kapiteln noch sehr genau auseinander setzen. Wenden wir uns also zuerst der »altmodischen Weise« (Bild für Bild) zu. In diesem Kapitel werden Sie: 쐽

lernen, wie man eine Bild-für-Bild-Animation erstellt,

쐽

das Zwiebelschalen-Werkzeug kennen lernen,

쐽

einige Tricks ausprobieren, die diese altmodische Technik etwas effizienter nutzbar machen.

7.1

Die »Rohe-Gewalt«-Technik verstehen

Wenn Sie schon einmal ein Daumenkino erstellt haben, wissen Sie, wie man eine Bild-fürBild-Animation erstellt. Jedes Bild ist ein wenig anders als das Bild zuvor. Wenn Sie dann das Daumenkino durchlaufen lassen, wird eine Animation entstehen. Genau das wollen wir in diesem Kapitel besprechen. Allerdings werden wir nicht unterschiedliche Zeichnungen in ein Buch malen, sondern viele Schlüsselbilder in Flash erstellen, die wir dann jeweils leicht abändern.

Übung: Wie man eine Bild-für-Bild-Animation erstellt Genug geredet! Lassen Sie uns eine Animation erstellen und dann später darüber reden, was wir gemacht haben. Unsere Animation heißt: »Twistendes Strichmännchen«. 1. Erstellen Sie in einer neuen Datei ein Strichmännchen, das nur aus Linien (ohne Füllungen) besteht. 2. Klicken Sie nun in der Zeitleiste direkt neben das Schlüsselbild mit dem Punkt – das ist die zweite Zelle in Ebene 1. 3. Klicken Sie EINFÜGEN / SCHLÜSSELBILD oder drücken Sie (F6), um ein Schlüsselbild in das zweite Bild einzufügen.

176

Die »Rohe-Gewalt«-Technik verstehen

Abbildung 7.1: Ein Strichmännchen, das nur aus Linien besteht (damit man es leichter bearbeiten kann)

4. Jetzt wollen wir eine kleine Änderung im zweiten Bild vornehmen. Dazu sollten wir sicher stellen, dass wir uns auch im zweiten Bild befinden. Der Abspielkopf muss demnach auf das zweite Bild zeigen. Wenn das nicht so ist, klicken Sie einfach in das zweite Rechteck in der Zeitleiste. 5. Nun kommt die versprochene Änderung: Biegen Sie das rechte Bein ein wenig und verändern Sie den Endpunkt eines Armes, sodass er winkend aussieht (siehe Abbildung 7.2).

Abbildung 7.2: Im zweiten Schlüsselbild wird das Bein ein wenig gebogen sowie der Arm bewegt.

177

Animationen im herkömmlichen Stil

6. Wenn Sie eine kleine Vorschau auf das haben wollen, was Sie bisher animiert haben, verwenden Sie einfach die Schrubbertechnik. Halten Sie den Abspielkopf fest und bewegen Sie ihn nach links und rechts. Es gibt noch nicht sehr viel zu sehen, aber das Strichmännchen schwingt schon lässig das Knie. 7. Weiter geht es mit dem dritten Bild. Klicken Sie in Ebene 1 auf das Bild 3 und erzeugen Sie ein neues Schlüsselbild. Der Inhalt von Bild 2 wird in das neue Schlüsselbild kopiert. 8. Ändern Sie wieder eine Kleinigkeit (das Bein weiter beugen und den Arm mehr bewegen). 9. Fügen Sie Schlüsselbild für Schlüsselbild weiter ein und nehmen Sie dazwischen immer wieder Änderungen vor.

Eine Animation als Test-Film betrachten Es gibt drei Wege, die komplette Animation zu betrachten: Schrubben, Abspielen und Testen. Während der Arbeit kann man die Schrubbertechnik sehr gut anwenden, denn der Abspielkopf ist immer recht schnell erreichbar. Das Problem dabei ist nur, dass die Geschwindigkeit nicht sehr konstant ist (genauer gesagt: nur in dem Maß konstant, in dem Sie schrubben). Die zweite Möglichkeit verbirgt sich hinter dem Menüpunkt STEUERUNG / ABSPIELEN. Da Sie hier nicht genau das sehen werden, was der Betrachter später auf dem Bildschirm hat, will ich Ihnen sofort nahe legen, einen Film nicht mit dieser Funktion zu testen oder darauf abzustimmen, denn die letzte Möglichkeit gibt immer noch am meisten Aufschluss über das echte Verhalten und Aussehen des Films. Ich rede von STEUERUNG / FILM TESTEN oder (Strg)+(Enter). Diese Option exportiert eine .swf-Datei in den Ordner, in dem die Datei gespeichert wurde. Danach wird der Flash-Player geöffnet und spielt das Ergebnis ab. Wenn Sie nach einem Test mit dem Ergebnis schon zufrieden sein sollten, können Sie die .swf-Datei direkt einsetzen, ohne den Film exportieren zu müssen. Im ersten Kapitel haben Sie schon gelesen, dass .swf-Dateien (sprich: »swiff«) exportierte Flash-Filme sind. Diesen Datentyp können Sie in Internetseiten einbinden. Solche Dateien unterscheiden sich von den Flash-Quelldateien (.fla) dadurch, dass sie nicht editierbar sind. Es gibt nur eine kritische Angelegenheit bei diesem Konzept: Sie müssen immer die .fla-Datei behalten, um später Änderungen an Ihrem Film vorzunehmen. Sie werden sicherlich gemerkt haben, dass sich die Menüleiste verändert, wenn man einen Film testet. Das liegt daran, dass Sie in dem Moment nicht mehr in Flash, sondern im Flash-Player (also in einem ganz anderen Programm) sind. Der einzige Nachteil an dieser Konstruktion ist, dass man den Flash-Player schließen muss, um nach Flash zurückzukehren. Der Vorteil ist dagegen, dass Sie genau das sehen werden, was der Betrachter später auch auf dem Bildschirm hat.

178

Die »Rohe-Gewalt«-Technik verstehen

Ein Schlüsselbild zur gleichen Zeit bearbeiten Die Bild-für-Bild-Technik ist recht einfach. Sie erzeugen für jedes Bild ein Schlüsselbild. Deshalb ist in jedem Bild etwas ganz anderes auf der Bühne – manchmal ist der Unterschied eher minimal und manchmal doch eher drastisch. Das Schöne an der Sache ist, dass Sie alles in einem Schlüsselbild unterbringen können, ohne darauf zu achten, was in den anderen Schlüsselbildern passiert. Auch wenn es sich bei diesem Animationstyp um einen recht simplen handelt, entsteht doch eine Menge Arbeit. Stellen Sie sich einmal vor, Sie würden jedes Bild neu zeichnen müssen, auch wenn es sich nur um eine kleine Änderung handelt. Andererseits haben Sie bei keiner anderen Technik eine so detaillierte Kontrolle, was in jedem einzelnen Bild passieren soll.

Die Bilddarstellung ändern Auch wenn es sich bei der Bild-für-Bild-Technik um eine Menge Arbeit handelt, heißt das nicht, dass Sie keine Hilfe annehmen dürfen. Ein Weg, den Prozess ein wenig einfacher zu gestalten, ist, die Bilddarstellung zu verändern. In Abbildung 7.3 sehen Sie die Schaltfläche, die dafür zuständig ist. Wenn Sie hier Vorschau anklicken, werden Sie alle Bilder der Animation sehen, ohne diese durchlaufen zu müssen. Wenn Sie Vorschau im Kontext auswählen, werden auch Abstände und leere Bühnenabschnitte angezeigt. Das Strichmännchen wird in der Vorschau also kleiner dargestellt.

Abbildung 7.3: Man kann im Menü BILDDARSTELLUNG einstellen, ob und wie eine Vorschau in der Zeitleiste angezeigt werden soll.

179

Animationen im herkömmlichen Stil

In der Abbildung 7.4 sieht man die Strichmännchen-Animation im Vorschau-Modus.

Abbildung 7.4: Hier wurde in der Bilddarstellung der Vorschau-Modus aktiviert.

Durch diese Einstellungen wird Ihre Animation nicht beeinflusst. Auch wenn Sie eine noch so große Darstellung der Vorschau in der Zeitleiste einstellen, wird das Ergebnis für den Betrachter später immer noch gleich sein.

Die Zwiebelschalen-Werkzeuge verwenden Die wohl besten Hilfsmittel für Bild-für-Bild-Animationen in Flash sind ohne Frage die Zwiebelschalen-Werkzeuge. Diese Technik stammt aus konventionellen Animationen. Wenn ein Zeichner ein neues Bild erstellen sollte, das sich nur minimal vom vorherigen unterscheiden sollte, hat er Pauspapier verwendet, das so transparent war, dass man das vorherige Bild hindurch sehen konnte. Dieser Effekt ist so auch in Flash anwendbar. Sie können so viele Bilder vor oder nach dem aktuellen Bild anzeigen, wie Sie wollen. Öffnen Sie die Datei mit dem Strichmännchen. Klicken Sie auf die Schaltfläche der Zwiebelschalen-Werkzeuge links außen (wie in Abbildung 7.5). Stellen Sie die Zeitleistenansicht im Bilddarstellungsmenü auf GROß. Nun können Sie den Abspielkopf auf einem beliebiges Bild in der Zeitleiste positionieren und Sie sehen zusätzlich eine abgeschwächte Version der anderen Bilder auf der Bühne.

180

Die »Rohe-Gewalt«-Technik verstehen

Abbildung 7.5: Der ZwiebelschalenModus ist aktiv. Wir können deshalb die anderen Bilder der Animation auf der Bühne erkennen.

Wie viele Bilder man zusätzlich auf der Bühne sieht, hängt vom Zwiebelschalen-Anfang und -Ende ab. Da man diese Markierungen nur sehr schwer zu fassen bekommt (ich erfahre das immer wieder selbst), empfiehlt es sich, die Bilddarstellung zu vergrößern (das haben wir ja schon erledigt). Damit Sie ein wenig Übung mit diesem Werkzeug bekommen, können wir die Strichmännchen-Animation erneut erstellen (nur jetzt mit dem Zwiebelschalen-Werkzeug).

Übung: Verwenden Sie die Zwiebelschalen, um bei der Animationsgestaltung unterstützt zu werden 1. Öffnen Sie eine neue Datei und stellen Sie die Bildansicht auf GROß. 2. Schalten Sie den Zwiebelschalen-Modus ein. Beachten Sie, dass man die Anfangsund Endmarkierung (siehe Abbildung 7.6) nicht über die Animation hinausbewegen kann. Wir besitzen im Moment nämlich nur ein Bild.

Abbildung 7.6: Die Markierungen der Zwiebelschale geben an, wie viele Bilder im Zwiebelschalen-Modus angezeigt werden sollen.

181

Animationen im herkömmlichen Stil

3. Zeichnen Sie wieder ein Strichmännchen ohne Füllungen. 4. Erstellen Sie ein Schlüsselbild an der Bildposition 2 (EINFÜGEN / SCHLÜSSELBILD). 5. Verändern Sie in Bild 2 die Position des Beines. Nun werden Sie das alte Bein in einer abgeschwächten Form wiedererkennen. 6. Erstellen Sie ein Schlüsselbild in Bild Nummer 3. Wenn Sie nun das Bein verändern, können Sie sehr gut ausmachen, wie weit Sie es bewegen müssen, um eine gleichmäßige Animation zu bekommen. 7. Erstellen Sie weitere Schlüsselbilder und denken Sie daran, immer eine Veränderung vorzunehmen, bevor Sie das nächste Schlüsselbild einfügen. 8. Wenn Sie einige Schlüsselbilder erzeugt haben, testen Sie das Zwiebelschalen-Werkzeug aus, indem Sie die Anfangs- und Endmarkierungen verschieben. Außerdem können Sie einige voreingestellte Optionen erhalten, wenn Sie die rechte Schaltfläche der Zwiebelschalen-Werkzeuge anklicken (siehe Abbildung 7.7).

Abbildung 7.7: Das Menü ZWIEBELSCHALENMARKIERUNG ÄNDERN

hat mehrere Optionen.

Das Menü ZWIEBELSCHALENMARKIERUNG ÄNDERN hat mehrere Optionen: 쐽

MARKIERUNGEN IMMER EINBLENDEN: Die Markierungen bleiben immer sichtbar, auch wenn Sie den Zwiebelschalen-Modus ausgeschaltet haben.

쐽

MARKIERUNGEN VERANKERN: Die Markierungen bleiben fest an dieser Stelle (egal wo der Abspielkopf ist).

182

Die Bild-für-Bild-Animation erweitern

쐽

2 ZWIEBELSCHALEN: Es werden immer zwei Bilder vor und nach dem Abspielkopf angezeigt.

쐽

5 ZWIEBELSCHALEN: Es werden immer fünf Bilder vor und nach dem Abspielkopf angezeigt.

쐽

ALLE ZWIEBELSCHALEN: Es werden alle Bilder angezeigt.

Bevor wir dieses Werkzeug abschließen, will ich noch die letzten beiden Optionen besprechen: ZWIEBELSCHALENKONTUREN und MEHRERE BILDER BEARBEITEN. Sie können entweder Zwiebelschalen oder Zwiebelschalenkonturen einschalten, aber nicht beides. Bei letzterer Option werden die Zwiebelschalen ohne Füllungen dargestellt. Das ist besonders bei langsameren Rechnern interessant oder wenn Sie den Überblick verlieren. Der letzte Punkt (MEHRERE BILDER BEARBEITEN) ist auch sehr interessant. Wenn man diese Option einschaltet, kann man alle Bilder innerhalb der Zwiebelschalen-Markierungen bearbeiten (also auch die abgeschwächt angezeigten). Auf diese Weise kann man beispielsweise sehr schnell den gesamten Inhalt einer Animation verschieben. Wählen Sie dazu ALLE ZWIEBELSCHALEN, markieren Sie dann alles und schieben Sie es, wohin Sie wollen.

7.2

Die Bild-für-Bild-Animation erweitern

Eine Bild-für-Bild-Animation kann eine Menge Arbeit bedeuten. Das heißt aber nicht, dass es immer viel Arbeit sein muss. Manchmal kann man mit ein Paar Tricks denselben Effekt mit dem Bruchteil des Arbeitsaufwandes erstellen. Dieser Abschnitt soll Ihnen ein paar Ideen dazu geben. In Kapitel 21 finden Sie noch mehr zu diesem Thema.

Pausen integrieren Angenommen, Sie haben eine Animation mit zwölf Bildern. Wenn Sie hier für jedes Bild ein Schlüsselbild einfügen, haben Sie eine echte Bild-für-Bild-Animation. Manchmal soll sich der Inhalt der Bühne aber nicht bei jedem Bild ändern. Dann sind die ungeänderten Schlüsselbilder schon zu viel Arbeit. Dafür kann man dann auch Pausen einsetzen. Man kann Pausen auf zwei Arten erzeugen. Einerseits kann man während der Animationserstellung einfach ein paar Bilder überspringen, wenn man das nächste Schlüsselbild einfügt (siehe Abbildung 7.8). Andererseits ist auch nach der Fertigstellung der Animation das Einbinden von Pausen möglich. Wenn Sie auf das Schlüsselbild klicken, das länger erscheinen soll und dann EINFÜGEN / BILD auswählen, wird der gesamte Inhalt der Ebene, der nach diesem Schlüsselbild erscheint, ein Bild weiter nach rechts verschoben.

183

Animationen im herkömmlichen Stil

Abbildung 7.8: Diese Bild-für-BildAnimation enthält eine Pause nach dem fünften Schlüsselbild, da das nächste Schlüsselbild erst in Bild 13 auftaucht und somit dazwischen der Inhalt der Bühne unverändert bleibt.

Pausen sind ein sehr wichtiges kreatives Mittel. Stellen Sie sich vor, Ihr Strichmännchen läuft über die Bühne und soll danach wieder zurückgehen. Was passiert in dem Moment, in dem es umkehrt? Na klar! Damit die Bewegung wirklich glaubhaft ist, muss das Männchen eine kurze Pause einlegen.

Bewegung vorgaukeln Eigentlich braucht man für eine Animation nur zwei Bilder. Wenn Sie beispielsweise in Bild 1 das Strichmännchen links auf der Bühne anordnen und dann im zweiten Bild auf der rechten Seite, haben Sie eine solche Animation. Wenn Sie so etwas einigen Leuten zeigen, werden Sie immer welche finden, die darauf schwören würden, dass sich unser Strichmännchen von links nach rechts bewegt. Im echten Leben gibt es keine Möglichkeit, von einem Punkt zum anderen zu kommen, ohne über alle Punkte dazwischen gewandert zu sein, aber in Animationen brauchen Sie nicht jeden Zwischenschritt zu zeichnen. Probieren wir das doch einmal aus. Erzeugen Sie ein Strichmännchen, das in Bild 1 einen Fußball vor dem rechten Bein liegen hat. Im Bild 10 erzeugen Sie ein neues Schlüsselbild, in dem sich der Ball in der Luft befindet und das Bein des Strichmännchens gestreckt ist. Die Animation ist gar nicht mal schlecht. Wenn Sie jetzt noch in Bild 4 ein weiteres Schlüsselbild ergänzen, in dem die Figur mit dem Bein ausholt, haben Sie schon eine recht gute Animation. Das Strichmännchen steht neben dem Ball, holt aus und schießt. Stellen Sie sich einmal vor, wie viel Arbeit es wäre, alle zehn Bilder voll auszumalen.

184

Die Bild-für-Bild-Animation erweitern

Abbildung 7.9: Mit nur drei Bildern kann man schon eine Animation erstellen, die viel mehr Bewegung vorgaukelt, als wirklich in ihr steckt.

Das Vorgaukeln von Bewegung ist ein großartiges Feature. Man kann damit eine Menge Zeit einsparen, die man besser für andere Sachen einsetzen kann.

Der Flimmer-Effekt Wie stellt man einen Blinkeffekt her? Ganz einfach: Sie benötigen nur ein Schlüsselbild mit Ihrem Objekt, danach ein Bild, in dem sich nichts auf der Bühne befindet und danach sofort wieder ein Bild mit dem Objekt. Es gibt mehrere Möglichkeiten, wie man so etwas löst. Eine davon wird in der nächsten Übung besprochen.

Übung: Erstellen Sie eine flimmernde Sonne 1. Zeichnen Sie in Bild 1 einer neuen Datei eine Sonne, die etwa wie in Abbildung 7.10 aussieht. 2. Wählen Sie die Sonne aus und wandeln Sie diese in ein Filmsequenz-Symbol namens Sonne um. 3. Nun wählen Sie die Bilder 1 bis 10 aus. Dazu klicken Sie auf Bild 10 und halten die Maustaste gedrückt, währen Sie die Maus auf Bild 1 bewegen. 4. Wählen Sie nun MODIFIZIEREN / BILDER / IN SCHLÜSSELBILDER KONVERTIEREN. Sie haben nun zehn Schlüsselbilder mit einem Klick erzeugt. 5. Klicken Sie nun auf das Bild 2 und der Inhalt wird automatisch ausgewählt. 6. Drücken Sie nun (Entf), um die Sonne zu löschen. In diesem Moment haben Sie ein Schlüsselbild ohne Inhalt erzeugt, ,das auch leeres Schlüsselbild genannt wird. Man erkennt es an dem leeren umrahmten Rechteck in der Zeitleiste (siehe Abbildung 7.11).

185

Animationen im herkömmlichen Stil

Abbildung 7.10: Das Bild der Sonne, die wir nun flimmern lassen wollen

Abbildung 7.11: Wir löschen gerade den Inhalt des zweiten Bildes. Genauso verfahren wir auch mit jedem weiteren zweiten Bild.

7. Fahren Sie fort, indem Sie bei jedem Bild mit gerader Nummer den Inhalt löschen. Testen Sie den Film und Sie werden feststellen, dass er genau den Effekt bringt, den wir uns erhofft hatten.

186

Zusammenfassung

7.3

Zusammenfassung

In diesem Kapitel haben wir die Bild-für-Bild-Animation kennen gelernt. In späteren Kapiteln werden wir uns mit weiterführenden Techniken auseinander setzen. Sie haben aber jetzt schon eine Menge Grundlagen in Sachen Animationsdesign erlernt (Schlüsselbilder, Zwiebelschalen-Werkzeug und Pausen). Außerdem haben Sie Ihre ersten Animationen selbst erstellt.

7.4

Workshop

F&A F

Wann macht es Sinn, ein Schlüsselbild nach dem anderen einzufügen, anstatt eine ganze Serie per MODIFIZIEREN / BILDER / IN SCHLÜSSELBILDER KONVERTIEREN umzuwandeln? A

F

Was ist der Unterschied zwischen dem Einfügen eines Schlüsselbildes mit dem direkt darauf folgenden Löschen des Bühneninhaltes und dem Einfügen eines leeren Schlüsselbildes? A

F

Wenn man eine permanente Weiterentwicklung verwirklichen möchte, macht es Sinn, ein Schlüsselbild einzufügen und danach die Veränderung vorzunehmen, um dann wiederum ein weiteres Schlüsselbild einzufügen, in dem die Veränderung dann schon enthalten ist. Deshalb ist auf diese Weise jedes Schlüsselbild genauso wie das vorherige, bevor Sie eine leichte Veränderung vornehmen. Wenn Sie allerdings in jedes Schlüsselbild eine ganz neue Zeichnung einfügen möchten, sollten Sie leere Schlüsselbilder per MODIFIZIEREN / BILDER / IN LEERE SCHLÜSSELBILDER KONVERTIEREN verwenden. Auf diese Weise können Sie bei jedem Schlüsselbild mit einer leeren Bühne beginnen.

Ganz einfach, es gibt keinen. Es ist nur ein wenig einfacher zu verstehen, wenn man zuerst ein Schlüsselbild einfügt und dann den Inhalt löscht. In dem Moment braucht man nicht über leere Schlüsselbilder nachzudenken, sondern man hat einfach ein Schlüsselbild ohne Inhalt.

Ist die Bild-für-Bild-Animation der beste Animationstyp? A

Nein, in den meisten Fällen verursacht sie mehr Arbeit als andere Animationstechniken. Das werden Sie aber noch mitbekommen.

187

Animationen im herkömmlichen Stil

Quiz 1. Wenn Sie ein Schlüsselbild erzeugen – wie lange bleibt es auf der Bühne? a.

Nur das eine Bild lang, in dem Sie es gezeichnet haben

b. Bis ein anderes Schlüsselbild mit anderem Inhalt auftaucht c. Für die gesamte Animation 2. Wie viele Bilder sind für eine Animation erforderlich? a.

Eins

b. Zwei oder mehr c. Nicht weniger als drei 3. In welchem Teil des Buches werden wir animieren? a.

In den nächsten zwei Kapiteln

b. In den letzten zwei Kapiteln c. In diesem Kapitel – wir haben schon die ganze Zeit Animationen erstellt

Übung Ich habe eine schöne Übung für Sie: Versuchen Sie eine Animation zu erstellen, in der Sie nicht immer den Inhalt des vorherigen Bildes kopieren, sondern wirklich in jedem Schlüsselbild neu zeichnen. Wählen Sie die Bilder 1 bis 100 aus und fügen Sie per MODIFIZIEREN / BILDER / IN SCHLÜSSELBILDER KONVERTIEREN in jedem Bild ein leeres Schlüsselbild ein. Schalten Sie in den Modus 2 ZWIEBELSCHALEN. Nun zeichnen Sie im ersten Bild mit dem PinselWerkzeug ein kleines »V«, das einen Vogel darstellen soll. Gehen Sie nun zum nächsten Bild (die Kurztaste dafür ist (.)). Zeichnen Sie hier den Vogel an einer etwas anderen Stelle. Fahren Sie so fort: V, nächstes Bild, V, nächstes Bild, V ... . Das geht eigentlich recht schnell. Wenn der Vogel langsam fliegen soll, malen Sie das V nahe am vorherigen. Soll der Vogel schneller fliegen, vergrößern Sie einfach den Abstand.

188

T ag 1

Grundlagen

23

T ag 2

Malen und Zeichnen

53

T ag 3

Grafiken in Flash importieren

89

T ag 4

Fortgeschrittene Zeichentechniken

115

T ag 5

Die Bibliothek produktiv einsetzen

137

T ag 6

Animationen verstehen

161

T ag 7

Animationen im herkömmlichen Stil

175

T ag 8

Animationen mit Bewegungstweening

191

T ag 9

Morphing mit Formtweening

205

Tag 10

Sound einbinden

219

Tag 11

Effektiv mit Ebenen

239

Tag 12

Filmsequenzen und Grafik-Symbole

259

Tag 13

Schaltflächen zum Anklicken für den Anwender erstellen

271

AktionScript verwenden, um nichtlineare Filme zu erzeugen

289

Tag 14

Tag 15

ActionScript für mehr Interaktivität

315

Tag 16

Komponenten verwenden

333

Tag 17

Videos einsetzen

349

Tag 18

Filme ins Internet bringen

363

Tag 19

Modulare Internetseiten entwerfen

373

Tag 20

Optimierung Ihrer Flash-Site

389

Tag 21

Animationstechniken für Fortgeschrittene

417

W O C H E

W O C H E

W O C H E

Animationen mit Bewegungstweening

8

Animationen mit Bewegungstweening

Wenn man (wie im letzten Kapitel) eine Bild-für-Bild-Animation erstellt, bedeutet das eine Menge Arbeit, da man jedes Bild selbst zeichnen muss. Über das Tweening werden Sie von Flash unterstützt. Es generiert nämlich die Bilder zwischen zwei Schlüsselbildern. Sie können in Flash zwei Formen des Tweenings verwenden: Bewegungs- und Formtweening. In diesem Kapitel wenden wir uns zuerst dem Bewegungstweening zu. In diesem Kapitel werden Sie 쐽

einen Bewegungstween erstellen,

쐽

die vier Grundeigenschaften eines Bewegungstweens kennen lernen,

쐽

mit den Effekten »abbremsen« und »beschleunigen« experimentieren,

쐽

Tricks ausprobieren, mit denen Ihre Bewegungstweens natürlicher und realistischer aussehen.

8.1

Einen Bewegungstween erstellen

Man kann einen Bewegungstween recht schnell und einfach erzeugen. Probieren wir es einfach mal aus. Danach können wir immer noch zur Analyse kommen.

Übung: Erstellen Sie einen einfachen Bewegungstween 1. Zeichnen Sie in einer neuen Datei einen Kreis auf die Bühne. 2. Wählen Sie den ganzen Kreis aus und wandeln Sie ihn in ein Symbol um, das eine Filmsequenz namens Kreis sein soll. 3. Erzeugen Sie in Bild 30 ein Schlüsselbild. 4. Wählen Sie das Schlüsselbild 1 aus und bewegen Sie den Kreis zur Startposition (sagen wir, zur linken Seite der Bühne). 5. Klicken Sie auf das letzte Schlüsselbild (Bild 30). Bewegen Sie nun den Kreis nach rechts. 6. Probieren Sie die Animation mit der Schrubbertechnik aus. Wie Sie sehen, lässt die Animation noch zu wünschen übrig, denn bis Bild 29 bleibt der Kreis links stehen und springt dann in Bild 30 nach rechts. Damit wir die Bewegung etwas flüssiger simulieren können, wird sich Flash um die Bilder 2 bis 29 kümmern. 7. Man muss das Tweening im ersten Schlüsselbild definieren, das zum Tweening-Vorgang gehört. In unserem Fall ist das Bild 1. Klicken Sie also darauf und betrachten Sie das Eigenschaften-Bedienfeld. 8. In diesem Bedienfeld finden Sie ein Auswahlfeld namens Tween.

192

Einen Bewegungstween erstellen

9. Wählen Sie hier die Option Bewegung aus und lassen Sie die anderen Einstellungen unverändert (siehe Abbildung 8.1).

Abbildung 8.1: Das EigenschaftenBedienfeld mit unserem ersten Schlüsselbild im Hintergrund

10. Das war's! Beachten Sie, dass von Flash ein Pfeil wie in Abbildung 8.2 erzeugt wird, der die beiden Schlüsselbilder verbindet. Testen Sie nun Ihren Film (mit (Strg)+(Enter)), um zu sehen, was Flash daraus gemacht hat.

Abbildung 8.2: Die Zeitleiste enthält nun einen schwarzen Pfeil auf blauem Grund, um anzuzeigen, dass die beiden Schlüsselbilder per Bewegungstween verbunden (interpoliert) werden.

193

Animationen mit Bewegungstweening

Die Regeln eines Bewegungstweens befolgen Die Übungsaufgabe hat funktioniert, weil die Regeln eines Bewegungstweens genau befolgt wurden (auch wenn Sie diese noch nicht kannten): Man darf in den Schlüsselbildern nicht mehrere Objekte haben und das eine Objekt, das Sie verwenden, muss ein Symbol sein. Flash ist an dieser Stelle sehr eigen und wird Ihnen eine Zuwiderhandlung nicht verzeihen. Die gute Nachricht ist, dass Flash Ihnen verschiedene Hinweise geben wird, falls Sie diese Regel nicht befolgen. Im Eigenschaften-Bedienfeld wird dann ein Warnsymbol mit Ausrufzeichen angezeigt. Wenn man darauf klickt, erhält man diese Meldung: Auf Ebenen mit nicht gruppierten Formen oder auf Ebenen mit mehr als einer Gruppe bzw. mehr als einem Symbol findet kein Bewegungstweening statt.

Sie brauchen den Knopf aber nicht einmal zu drücken, um zu wissen, dass etwas falsch läuft – das Ausrufezeichen ist schon genug. Zusätzlich dazu wird die Zeitleiste ein wenig anders aussehen. Wo der Pfeil erscheinen sollte, ist dann eine gestrichelte Linie (siehe Abbildung 8.3).

Abbildung 8.3: Wenn Sie die Regeln eines Bewegungstweens nicht befolgen, werden Sie von Flash gewarnt.

Wie Sie dem Hinweistext von Flash entnehmen können, ist es prinzipiell auch möglich, einen Bewegungstween auf Gruppen anzuwenden. Davon will ich Ihnen aber abraten, da Flash daraus zuerst einmal ein Symbol namens »Tween 1« erstellen würde, um damit weiterzuarbeiten. In diesem Fall würde Ihnen Flash sozusagen das Denken abnehmen. Es ist aber von Vorteil, wenn Sie selbst das Symbol zum Tweening anlegen, da Sie dann die freie Namenswahl haben und für mehr Überblick in der Bibliothek sorgen.

194

Einen Bewegungstween erstellen

Techniken und Tipps Sie können stolz darauf sein, dass Sie den Kreis von links nach rechts bewegt haben. Allerdings hat in Wirklichkeit Flash die Arbeit erledigt. Wie wir noch sehen werden, kann Flash alle beliebigen zwei (der Regel entsprechenden) Schlüsselbilder ineinander übergehen lassen. Dabei spielt es keine Rolle, wie verschieden diese sind. Zusätzlich dazu gibt es noch Optionen, die Ihnen die Arbeit mit Tweens noch weiter vereinfachen.

Mehr als nur die Position tweenen Wie Sie am fünften Tag gesehen haben, können verschiedene Instanzen desselben Symbols unterschiedliche Eigenschaften wie Farbe und Skalierung haben. Insgesamt gibt es sieben derartige Eigenschaften: Position, Skalierung, Drehung, Kippwinkel, Helligkeit, Farbton und Alpha. Diese sieben Attribute können auch für das Tweening eingesetzt werden. Versuchen wir doch einfach einmal ein wenig mehr als nur die Position per Tweening zu verändern. Das Ergebnis wird nicht unbedingt ganz perfekt sein, aber dazu kommen wir später noch.

Übung: Tweenen Sie Position, Vergrößerung, Rotation und Farbe 1. Erstellen Sie in einer neuen Datei einen Textblock mit Ihrem Namen. Die Größe ist dabei nicht so wichtig, der Name sollte allerdings groß genug sein, damit Sie später die Effekte gut sehen können. 2. Wählen Sie nun mit dem Pfeil-Werkzeug den Textblock (nicht den Text selbst) aus und wandeln Sie ihn in ein Symbol namens Mein Name um. 3. Fügen Sie nun in Bild 30 ein Schlüsselbild ein ((F6)). 4. Klicken Sie wieder auf das Schlüsselbild 1 und positionieren Sie den Namen unten links (das ist dann die Startposition). 5. Wählen Sie im Eigenschaften-Bedienfeld für Tweening den Wert Bewegung aus. 6. Nun wechseln Sie zum Bild 30 (also zum zweiten Schlüsselbild) und bestimmen die Endposition des Textes. Vergrößern Sie diesen so, dass er die gesamte Bühne einnimmt und positionieren Sie ihn gegebenenfalls etwas weiter in der Mitte. 7. Verschaffen Sie sich einen Überblick über die Animation, indem Sie die Schrubbertechnik anwenden. Sie können nun nur noch den Start- und Endpunkt der Animation festlegen. Flash kümmert sich selbst um die Bilder zwischen den Schlüsselbildern.

195

Animationen mit Bewegungstweening

8. Bewegen Sie den Abspielkopf wieder auf Bild 30. Nun wenden wir uns dem Farbeffekt der Instanz zu. Wählen Sie die Instanz aus und öffnen Sie das EigenschaftenBedienfeld (siehe Abbildung 8.4). Wählen Sie dort den Effekt Farbton aus, stellen Sie eine helle Farbe ein und gehen Sie sicher, dass der Prozentwert daneben 100% beträgt. Schrubben Sie erneut, um eine kurze Vorschau zu erhalten.

Abbildung 8.4: Der Effekt Farbton wurde in Bild 30 angewendet.

9. Gehen Sie zum ersten Bild und vergrößern Sie den Namen um einiges. (Eventuell müssen Sie die Position anpassen.) 10. Lassen Sie den Namen um wenige Grad gegen den Uhrzeigersinn rotieren und kippen Sie ihn etwas (siehe Abbildung 8.5). 11. Testen Sie nun die Animation. Sie haben zwei ganz unterschiedliche Schlüsselbilder erzeugt, aber Flash führt diese genau ineinander über. Auch wenn man viele Eigenschaften von Instanzen tweenen kann, sollten Sie nicht in die Versuchung kommen, zu viel auf einmal zu verändern. Ein besonders rechenintensiver Faktor ist das Tweening von Alpha. Ich will es Ihnen nicht komplett verbieten, da es oft sehr gute Effekte erzielt, aber denken Sie daran, dass gerade langsamere Rechner ihre Probleme haben werden, wenn sich der Alpha-Wert eines Objekts schnell verändert. Wenn nichts durch ein Objekt hindurchscheint, sollten Sie lieber die Helligkeit regeln, da dies nicht so viele Geschwindigkeitseinbußen bringt.

196

Einen Bewegungstween erstellen

Abbildung 8.5: Wir können jede Eigenschaft der Instanz verändern und Flash wird sie entsprechend tweenen.

Halten Sie sich aus dem Territorium von Flash heraus Sie sind für die Erstellung von Schlüsselbildern verantwortlich und Flash für den Übergang dazwischen. Betrachten Sie also den Bereich zwischen zwei Schlüsselbildern (die per Tweening verbunden sind) als »Niemandsland«. Wenn Sie versuchen, etwas in einem Tweening-Bereich zu bearbeiten (siehe Abbildung 8.6), werden Sie wahrscheinlich unerwartete Ergebnisse erhalten. Wenn Sie an einer solchen Stelle etwas ändern wollen, sollten Sie ein Schlüsselbild einfügen. Allerdings nehmen Sie dann Flash die Kontrolle über den gesamten Bewegungstween. Im späteren Verlauf des Kapitels werden wir noch Möglichkeiten kennen lernen, wann ein Eingriff in einen Bewegungstween sinnvoll sein kann.

Wissen Sie immer, wo Sie sind? Aus den oben genannten Gründen sollten Sie also immer den Abspielkopf im Auge behalten. Wenn Sie eine Bewegung von links nach rechts simulieren wollen, sollten Sie das Objekt im Start-Schlüsselbild auf der linken Seite der Bühne anordnen. Wenn der Abspielkopf allerdings irrtümlich noch im letzten Schlüsselbild steht, werden Sie die Endposition bearbeiten und ein ganz anderes Ergebnis erzielen. Bevor Sie also etwas bearbeiten, schauen Sie zuerst auf den Abspielkopf (siehe Abbildung 8.7)!

197

Animationen mit Bewegungstweening

Abbildung 8.6: Der Abspielkopf befindet sich zwischen den Schlüsselbildern. Hier sollten Sie den Film nicht bearbeiten! Abbildung 8.7: Der Abspielkopf zeigt an, welches Bild Sie gerade bearbeiten.

Halten Sie sich an dieses Muster! Hoffentlich beginnen Sie schon ein Muster in der Vorgehensweise zu erkennen. Ich will das noch einmal zusammenfassen: Ein Bewegungstween bezieht sich immer nur auf ein Objekt (und zwar ein Symbol). Wandeln Sie das Objekt also in ein Symbol um, bevor Sie das End-Schlüsselbild erstellen, da dort sonst eventuell noch eine Form und kein Symbol existiert. Wenn Sie sowohl das Anfangs- als auch das End-Schlüsselbild erstellt haben, können Sie bei beiden das Objekt positionieren und die sieben tweeningfähigen Attribute anpassen (wobei Alpha nicht empfehlenswert ist). Wenn Sie dabei noch den Abspielkopf im Auge behalten, kann eigentlich kaum noch etwas schief gehen.

198

Feintuning eines Bewegungstweens

8.2

Feintuning eines Bewegungstweens

Einen Bewegungstween zu erstellen ist recht einfach. Wenn er allerdings auch noch gut aussehen soll, ist das wiederum eine ganz andere Sache. Es gibt einige Techniken, um eine Art Feintuning an einem Tween vorzunehmen. Wir werden uns hier auf grundlegende Dinge beschränken und weitere Möglichkeiten am 21. Tag ansprechen.

Mehrere Schlüsselbilder Ein Tween verwendet immer nur zwei Schlüsselbilder. Eines am Anfang und eines am Ende. Was aber ist, wenn man eine Bogenbewegung darstellen will? Ganz einfach: Man teilt diese Bewegung in zwei Tweens auf: eine Aufwärts- und dann eine Abwärtsbewegung. Hier haben wir dann in Wirklichkeit zwei Bewegungstweens, die durch drei Schlüsselbilder koordiniert werden, da das mittlere Schlüsselbild die Endposition für den ersten und die Startposition für den zweiten Tween definiert. Eine solche Animation (nur mit vertauschten Richtungen) ist zum Beispiel die Bewegung eines Jo-Jo. Versuchen wir das jetzt.

Übung: Lassen Sie eine Animation da enden, wo sie startet 1. Zeichnen Sie in einer neuen Datei einen Kreis. 2. Wandeln Sie ihn in ein Symbol namens Jo-Jo um. 3. Bringen Sie das Jo-Jo in der Nähe der oberen Bühnenkante in Position. 4. Erzeugen Sie in Bild 10 ein Schlüsselbild. 5. Bevor Sie etwas bewegen, sollten Sie an Position 20 ein Schlüsselbild einfügen. Zu diesem Zeitpunkt haben Sie dann drei identische Schlüsselbilder. 6. Wechseln Sie nun wieder zu Bild 10 und bewegen das Jo-Jo gerade nach unten. 7. Jetzt fügen Sie in den Bildern 1 und 10 je einen Bewegungstween ein (über das Eigenschaften-Bedienfeld). Sie können das sogar gleichzeitig erledigen, indem Sie alle erstellten Bilder markieren und erst dann die Änderung im Bedienfeld vornehmen (siehe Abbildung 8.8). 8. Testen Sie nun den Film und speichern Sie ihn ab. Wir werden in Kürze darauf zurückkommen.

199

Animationen mit Bewegungstweening

Abbildung 8.8: Änderungen im EigenschaftenBedienfeld wirken sich auf alle ausgewählten Schlüsselbilder aus.

Denken wir noch einmal zurück: Eine Sache war von großem Vorteil. Ich spreche von den drei identischen Schlüsselbildern. Wenn man in einer Animation den Ausgangspunkt wieder erreichen will, kann man eine Feinjustierung umgehen, indem man die Endposition direkt von der Anfangsposition übernimmt. Genau das haben wir ja gemacht, da wir das zweite Schlüsselbild (das anfangs ja eine exakte Kopie des ersten war) erst verändert haben, nachdem das dritte erzeugt war.

Abbremsen und beschleunigen Ein Problem bei Animationen, die per Tweening von Flash unterstützt wurden, ist, dass man meist erkennt, ob ein Computer die Finger im Spiel hatte: Die Animationen sehen zu perfekt aus. Beim Jo-Jo-Beispiel sieht man, dass sich das Jo-Jo mit der gleichen Geschwindigkeit hoch und runter bewegt. Auch die Geschwindigkeit ist dabei konstant. In Flash gibt es daher die Möglichkeit, eine Bewegung zu beschleunigen oder abzubremsen. Bei einem Bewegungstween wären also Start- und Endgeschwindigkeit unterschiedlich. Sie können das in der Datei des letzten Beispiels ausprobieren. Wählen Sie das erste Schlüsselbild aus und stellen Sie Abbremsen im Eigenschaften-Bedienfeld auf den Wert -40. Hinter dem Wert steht nun Am Ende. Das bedeutet, dass die Abwärtsbewegung des Jo-Jos am Ende abgebremst wird (siehe Abbildung 8.9).

200

Feintuning eines Bewegungstweens

Abbildung 8.9: Im EigenschaftenBedienfeld kann man eine Bewegung abbremsen oder beschleunigen.

Den zweiten Tween (zwischen 10 und 20) sollten Sie langsamer starten lassen. Das erreichen Sie durch den Wert 80 im Feld Abbremsen, worauf ein Am Anfang neben dem Wert erscheint. Testen Sie die Animation erneut und Sie werden sehen, dass sie einem Jo-Jo wesentlich näher kommt. Was ist aber, wenn man eine Bewegung langsam beginnen, dann beschleunigen und danach wieder abbremsen will? Das ist möglich – allerdings nicht mit zwei Schlüsselbildern, da nur ein Wert für Abbremsen pro Tween erlaubt ist. Auch hier müssen wir die Bewegung also in zwei Teile auftrennen und mit drei Schlüsselbildern arbeiten.

Übung: Erstellen Sie eine Animation, die abgebremst und beschleunigt wird 1. Zeichnen Sie in einer neuen Datei irgendeine Form und wandeln Sie diese in ein Symbol um, welches Sie am linken Bühnenrand positionieren. 2. Fügen Sie in Bild 50 ein Schlüsselbild ein. 3. Bewegen Sie (immer noch in Bild 50) das Symbol an den rechten Bildschirmrand. 4. Erzeugen Sie nun in Bild 1 einen Bewegungstween. 5. Testen Sie den Film und prägen Sie sich ein, wie er aussieht. 6. Positionieren Sie den Abspielkopf in der Mitte (Bild 25). 7. Erzeugen Sie dort ein Schlüsselbild. Testen Sie den Film erneut. Es sollte sich nichts geändert haben. Sie haben ja auch nur ein Schlüsselbild in einen bestehenden Bewegungstween eingefügt, in den dann die aktuelle Position Ihres Objektes kopiert wurde. 8. Stellen Sie für das Schlüsselbild 1 bei Abbremsen den Wert -100 und bei Bild 25 den Wert 100 ein. Testen Sie die Animation und Sie werden sehen, dass das Objekt zuerst beschleunigt und dann am anderen Ende der Bühne wieder abbremst. Ein Vorgang ist dabei besonders interessant: Wir haben ein Schlüsselbild in einen bestehenden Tween eingefügt. Dadurch bekamen wir das Objekt direkt an der richtigen Position in unser Schlüsselbild kopiert.

201

Animationen mit Bewegungstweening

In einem Bewegungstween rotieren Sie wissen ja bereits, dass Flash einen Drehwinkel per Bewegungstween anpassen kann. Es ist aber noch mehr möglich, denn Sie können eine Anzahl von Drehungen festlegen, die Flash während des Tweens ausführen soll. Die Einstellmöglichkeit finden Sie wieder im Eigenschaften-Bedienfeld. Dort können Sie bei Drehen die Werte UZS (im Uhrzeigersinn) und gegen UZS (gegen den Uhrzeigersinn) sowie die Anzahl der Umdrehungen eingeben (siehe Abbildung 8.10). Wenn Sie hier Keiner einstellen, werden auch manuell gedrehte Objekte im gesamten Tween nicht weiter gedreht. Abbildung 8.10: Hier kann man die Anzahl der Umdrehungen eines Objekts im Bewegungstween angeben.

Bitte bedenken Sie, dass weniger oft mehr ist. Sie haben nun einige Effekte (wie zum Beispiel auch das mehrfache Drehen) kennen gelernt, die in Maßen recht effektiv sind. Wenn man den Bogen aber überspannt, erkennt man die wichtigen Details Ihrer Animation nicht mehr. Sie sollten sich also immer überlegen, ob ein weiterer Effekt Ihre Intention noch unterstützt oder ob er eher ablenkt.

8.3

Zusammenfassung

Gratuliere! Sie haben die Grundlagen des Bewegungstweenings erlernt. Es ist doch von Vorteil, wenn man Flash die ganze Arbeit erledigen lassen kann, oder? Der Vorgang ist ganz einfach: Sie erstellen zwei Schlüsselbilder, die beide ein Symbol enthalten und bringen diese im ersten Schlüsselbild in den Startzustand und im zweiten in den Endzustand. Nun brauchen Sie nur noch das Tweening einzuschalten und schon geht es los. Auch wenn die Beispiele sehr einfach ausgesehen haben, heißt das nicht, dass ein Bewegungstween unterschätzt werden sollte. Wir werden im nächsten Kapitel noch sehen, dass man ihn sogar dem Formtween vorziehen sollte.

202

Workshop

8.4

Workshop

F&A F

Ich habe ein Schlüsselbild eingefügt und Flash hat automatisch einen Bewegungstween zwischen dem Schlüsselbild davor und meinem neuen Schlüsselbild erstellt. Wie kann das passieren? A

F

Wie kann ich mehrere Symbole tweenen? A

F

Jedes Symbol rotiert um seinen Mittelpunkt. Sie sollten das Master-Symbol bearbeiten und mittig ausrichten. Wenn Sie mehr dazu wissen möchten, sollten Sie Kapitel 5 wiederholen.

Wieso folgt mein Bewegungstween keinem sinnvollen Pfad? A

F

Die Regel sagt nur, dass man maximal ein Symbol pro Ebene tweenen kann. Wir werden am elften Tag auf die Ebenen eingehen. Dann werden Sie auch mehrere Ebenen zum Tweenen verwenden können.

Wenn ich die Drehen-Einstellung in meinem Schlüsselbild verwende, dreht sich das Symbol zwar, allerdings ist die Drehung sehr schief. Wieso? A

F

Wenn Sie ein Schlüsselbild einfügen, kopiert Flash den Inhalt und die Bildeigenschaften des Schlüsselbildes davor. Wenn das Schlüsselbild vor einem neuen Schlüsselbild schon auf Tweening gestellt war, wird auch das neue Schlüsselbild diese Einstellung übernehmen.

Normalerweise wird bei einem Bewegungstween die kürzeste Strecke zurückgelegt. Allerdings kann man mehr als nur die Position tweenen und noch dazu den Tween an einen Pfad binden. Darüber lernen Sie in Kapitel 11 mehr.

Die Wiedergabe meines Bewegungstweens ist sehr ruckelnd und nicht gleichmäßig. Woran liegt das? A

Wenn Sie einen Alpha-Effekt beim Symbol verwenden, sollten Sie gegebenenfalls einen anderen Effekt (zum Beispiel Helligkeit) in Betracht ziehen, da Alpha sehr viel Leistung vom Computer fordert. Wenn es nicht das ist, was für die Verzögerung verantwortlich ist, sollten Sie sich mit der Bildrate (siehe Kapitel 6) auseinander setzen und gegebenenfalls Ihre Animation über mehr Bilder verteilen. Damit werden die Abstände zwischen den einzelnen Bewegungen kürzer.

203

Animationen mit Bewegungstweening

Quiz Falls Sie es wieder vergessen haben sollten: Bitte beantworten Sie die Fragen selbst, bevor Sie die Lösungen nachschlagen. 1. Was sollten Sie bei der Erstellung eines Bewegungstweens noch vor dem Erzeugen eines Schlüsselbildes tun? a.

Die Datei speichern, da Flash an dieser Stelle gerne abstürzt

b. Sicher stellen, dass es sich bei dem Objekt im ersten Schlüsselbild um ein Symbol handelt c. Die Farbton-Eigenschaft der Instanz im ersten Schlüsselbild einstellen 2. Was sollten Sie beachten, wenn Sie eine Instanz in einem bestimmten Bild verschieben wollen? a.

Der Abspielkopf muss auf das richtige Bild zeigen.

b. Man muss sich auf die Nummer des Bildes konzentrieren und erst dann das Symbol bewegen. c. Das Symbol darf nicht rot sein. 3. Man benötigt zwei Schlüsselbilder für einen Bewegungstween. Wenn Sie nun zwischen diesen beiden Schlüsselbildern einen Bewegungstween erzeugen wollen, wo genau müssen Sie das einstellen? a.

Im Eigenschaften-Bedienfeld, wenn das Symbol im Schlüsselbild 1 ausgewählt ist.

b. Im Eigenschaften-Bedienfeld, wenn das zweite Schlüsselbild ausgewählt ist. c. Im Eigenschaften-Bedienfeld, wenn das erste Schlüsselbild ausgewählt ist.

Übungen Bisher haben wir in den meisten Übungen die Position per Bewegungstweening verändert. Ich will diese Gelegenheit dazu nutzen, Sie ein wenig zum Ausprobieren der anderen Attribute zu motivieren. 1. Versuchen Sie beispielsweise einen Ball zu animieren, der zu Boden fällt und sich ein wenig zusammendrückt, bevor er zurückspringt. Außerdem können Sie noch versuchen, einen Text vom transparenten Zustand in einen undurchsichtigen Zustand gleiten zu lassen. Verwenden Sie dazu kein Alpha. Wenn Sie möchten, können Sie bei dieser Übung auch mit dem Abbremsen und Beschleunigen experimentieren. Viel Spaß! 2. Erstellen Sie einen einfachen Tween, der einen Text vom unsichtbaren zum sichtbaren Zustand einblenden soll. Versuchen Sie einen anderen Weg als die Verwendung von Alpha zu finden. Stellen Sie sicher, dass Sie aus dem Text ein Symbol erzeugen, bevor Sie Schlüsselbilder hinzufügen.

204

Morphing mit Formtweening

9

Morphing mit Formtweening

Es gibt mehrere Möglichkeiten, einen Flash-Film klein und schnell zu halten. Die Wiederverwendung von Symbolen aus der Bibliothek und die Verwendung von Bewegungstweens sind zwei der besten Möglichkeiten. Leider ist die Verwendung von Formtweens (die wir in diesem Kapitel kennen lernen werden) eine nicht so effiziente Methode, da die Dateigröße ansteigen wird. Allerdings sehen Formtweens einfach genial aus! Es gibt keine andere Möglichkeit, den Morph-Effekt in Flash zu erzeugen. In diesem Kapitel werden Sie 쐽

Formtweens erstellen,

쐽

Alternativen zu Formtweens kennen lernen und

쐽

Formmarken für mehr Kontrolle hinzufügen. Ein Morph ist eine Art von Animation, die eine Form auf sehr natürlich aussehende Weise in eine andere Form umwandelt. Es handelt sich hierbei um einen allgemeinen Ausdruck, der die Art, wie das Formtweening in Flash arbeitet, am besten bezeichnet.

9.1

Einen Formtween erstellen

Formtweens machen Spaß, da sie gut aussehen und leicht zu erzeugen sind. Alles was Sie dazu tun müssen ist, eine oder mehrere Formen in zwei Schlüsselbildern zu erstellen und das Tweening im ersten Schlüsselbild auf Form zu stellen. Versuchen wir es einmal: Wir werden die Vorgehensweise später analysieren.

Übung: Erstellen Sie einen einfachen Formtween 1. Zeichnen Sie in einer neuen Datei einen Kreis auf die Bühne. (Gruppieren Sie nichts und konvertieren Sie auch nichts in ein Symbol.) 2. Fügen Sie in Bild 30 ein Schlüsselbild ein. Das wird das Ende unseres Tweens sein und wie der Anfang aussehen. 3. Erstellen Sie ein weiteres Schlüsselbild in Bild 15. Verbiegen Sie die Kreislinie ein wenig, während der Abspielkopf auf Bild 15 zeigt (siehe Abbildung 9.1). 4. Halten Sie nun (ª) gedrückt, während Sie erst auf Bild 1 und dann auf Bild 15 klicken. Stellen Sie dann im Eigenschaften-Bedienfeld den Wert Tweening auf Form um. 5. Testen Sie den Film.

206

Einen Formtween erstellen

Abbildung 9.1: Wir verbiegen die Kreislinie in einem Schlüsselbild und überlassen es später Flash, die Formen anzugleichen.

Formtween-Regeln Bei der Arbeit mit Flash wird Ihnen nichts geschenkt, wenn Sie die Programmeigenheiten nicht kennen. Glücklicherweise sind die Regeln für Formtweens sehr einfach: keine Gruppen und keine Symbole. Das war’s! Wenn Sie sich das merken, werden Formtweens ein Kinderspiel für Sie sein. Wenn Sie sich kurz an das zweite Kapitel erinnern, werden Sie wissen, dass Text automatisch gruppiert wird. Das bedeutet, dass man keinen Text in einem Formtween verwenden kann, es sei denn, man teilt ihn (MODIFIZIEREN / TEILEN). Bedenken Sie aber, dass Sie den Text dann nicht mehr bearbeiten können! Auch wenn kein Weg um die »Keine Gruppen und keine Symbole«-Regel herum führt, kann man dennoch die Vorteile von Gruppen und Symbolen ausnutzen. Gruppen beispielsweise sind oft nötig, um Teile einer Zeichnung zu isolieren. Sie können bei der Erstellung von Formtweens so viele Gruppen verwenden, wie Sie wollen. Denken Sie aber daran, alle Gruppierungen aufzuheben, bevor Sie den Formtween definieren. Das Gleiche gilt für Symbole aus der Bibliothek. Wenn Sie z.B. einen Formtween auf ein Bild in der Bibliothek anwenden wollen, können Sie das tun. Denken Sie nur daran, es zu trennen, bevor Sie den Formtween aktivieren. Sie können die Regeln also nicht umgehen, aber Sie können sie kurzzeitig brechen, während Sie arbeiten.

207

Morphing mit Formtweening

Techniken und Tipps Auch wenn die Regeln für Formtweens recht einfach sind, ist es das Erstellen eines gut aussehenden Formtweens noch lange nicht. Es gibt aber viele Techniken, um sich die Arbeit zu erleichtern und bessere Ergebnisse zu erzielen.

Die Einfachheit ist der Schlüssel zum Erfolg Auch wenn Sie allen anderen Tipps keine Beachtung schenken sollten. Dieser ist von besonderer Wichtigkeit: Halten Sie Ihren Formtween einfach! Und wenn es außer dem Verbot von Gruppen und Symbolen keine Regeln in Bezug auf Formtweens gibt, sollten Sie beachten, dass ein Formtweening vieler Formen sehr zufällig aussieht. Unerwartete Ergebnisse können zwei Symptome sein: Die Animation ist nicht einfach genug oder Sie erhalten den »Schachbretteffekt«, den wir gleich sehen werden. Stellen Sie sich vor, Sie wollen Ihren Namen in einen Kreis überführen. Sie erhalten allerdings nur »Müll« oder einen »Schachbretteffekt« (siehe Abbildung 9.2) auf dem Bildschirm. Das sind Anzeichen dafür, dass Sie etwas erstellt haben, das für Flash zu kompliziert ist. Flash berechnet die interpolierten Bilder eigentlich sehr genau, allerdings kann es schwierig werden von etwas sehr Komplexem (wie Namen) zu etwas Einfachem (wie Kreise) zu gelangen. Flash wird Sie vom einen Bild zum anderen führen, allerdings kann der Weg dorthin recht schlecht aussehen.

Abbildung 9.2: Der »Schachbretteffekt« – für gewöhlich das Ergebnis eines zu komplexen Formtweens

208

Einen Formtween erstellen

Die Lösung ist, die Einfachheit beizubehalten. Gehen Sie Schritt für Schritt vor. Versuchen Sie beispielsweise nur einen Buchstaben Ihres Namens in einen Kreis zu verwandeln. In Kapitel 11 werden Sie sehen, dass es recht einfach ist, mehrere Tweens simultan auszuführen (in unterschiedlichen Ebenen). Außerdem werden wir in diesem Kapitel noch Formmarken kennen lernen, die es Flash erleichtern, zu wissen, was Sie meinen. Allerdings gilt auch dann noch, dass es umso besser ist, je einfacher die Animation aufgebaut ist.

Mischen Sie keine Linien und Füllungen Am besten ist es, das Tweening zwischen Schlüsselbildern, die nicht die gleiche Kombination von Füllungen und Linien aufweisen, zu vermeiden. Das Ergebnis ist meist unvorhersehbar. Wenn Sie eine gerade Linie in eine gebogene umformen, wird das sehr gut aussehen. Wenn Sie aber eine Linie in eine Füllung überführen wollen, wird das einige höchst merkwürdige Ergebnisse zur Folge haben. Flash kann beides tweenen: Linien und Füllungen. Wenn Sie aber in einem Schlüsselbild eine Linie und im anderen eine Füllung haben (oder wenn in einem Schlüsselbild sowohl Linien als auch Füllungen enthalten sind und im anderen nur eines dieser Elemente), bekommen Sie Probleme. Um so etwas zu verhindern, sollten Sie vorher alle Linien in Füllungen umformen (MODIFIZIEREN / FORM / LINIEN IN FÜLLUNGEN KONVERTIEREN). Damit Sie es einfacher haben, sollten Sie bei Formtweens sicherstellen, dass Sie in beiden Schlüsselbildern nur Füllungen, nur Linien oder beides in gleicher Kombination haben.

Halten Sie sich aus dem Territorium von Flash heraus Wenn Flash eine Bildfolge per Tweening bearbeitet, färbt es die getweenten Bilder in der Zeitleiste blau (Bewegungstween) oder grün (Formtween) ein. Diese interpolierten Bilder (wie sie in Flash genannt werden) nenne ich das »Territorium von Flash« (siehe Abbildung 9.3). Sie sollten sich grundsätzlich von diesem Bereich fern halten. Sie können in interpolierten Formtween-Bildern nichts zerstören. Allerdings kann es sehr frustrierend sein, wenn Sie versuchen sollten, darin etwas zu verändern. Sie können darin weder zeichnen noch Objekte auswählen. Die beste Möglichkeit ist, diese Bilder als das Territorium von Flash und Schlüsselbilder als Ihr eigenes anzuerkennen.

209

Morphing mit Formtweening

Abbildung 9.3: Die interpolierten Bilder (in denen Flash für das Tweening zuständig ist) sind entweder grün (Formtween) oder blau (Bewegungstween) eingefärbt.

Wissen, wann ein Bewegungstween genügen wird Es ist sehr einfach, sich in Formtweens zu verlieben, da es nichts Vergleichbares gibt. Sie können sie verwenden, wann immer Sie es für nötig halten. Allerdings sind Formtweens nicht so effizient wie Bewegungstweens (die Datei wird größer und das Abspielen langsamer). Deshalb sollten Sie Bewegungstweens vorziehen, gerade in Fällen, in denen Sie mit beiden Techniken den gleichen Effekt erreichen können.

Abbildung 9.4: Verschiedene Instanzen desselben Quadrates können stark verformt, aber immer noch in einem Bewegungstween verwendet werden. (Beachten Sie das Originalquadrat in der Bibliothek.)

210

Feintuning eines Formtweens

Manchmal ist es offensichtlich, welche Art von Tween man verwenden soll. Wenn sich beispielsweise nur die Farbe oder die Position verändert, reicht ein Bewegungstween völlig aus. Bei gravierenden Veränderungen der Form ist allerdings ein Formtween angebracht. Manchmal ist es jedoch nicht so klar, welche Tweening-Variante man verwenden sollte. Man kann beispielsweise extreme Formveränderungen mit den bereits bekannten Veränderungen Rotation, Skalierung und besonders dem Kippen von Objekten bewirken. In Abbildung 9.4 sehen Sie viele verschiedene Instanzen desselben Symbols, bei denen diese Werte verändert wurden. Hier reicht für ein Tweening immer der Bewegungstween aus.

9.2

Feintuning eines Formtweens

Formtweens sehen meist nicht so aus, wie man es erwarten würde. Die Tipps, die ich Ihnen bisher gegeben habe, sind meist als Regeln oder Warnungen zu verstehen. Allerdings kann es immer noch zu unerwarteten Ergebnissen führen, auch wenn Sie alle diese Hinweise beachtet haben. Deshalb verfügt Flash über ein besonderes Hilfsmittel, das speziell für Formtweens eingeführt wurde: Formmarken. Diese Helfer können entscheidend sein, ob ihr Tweening zum Chaos führt oder aber zu dem, was Sie sich vorstellen.

Formmarken verwenden Durch Formmarken haben Sie die Möglichkeit festzulegen, wie ein Punkt vom ersten Schlüsselbild zum zweiten während des Tweenings umgeformt werden soll. Sie sollten Formmarken immer dann einsetzen, wenn Flash einen Formtween erstellt hat, der nicht so aussieht, wie Sie ihn im Kopf hatten. Gehen wir das doch einmal durch:

Übung: Verwenden Sie Formmarken für einen besseren Formtween 1. Zeichnen Sie in einer neuen Datei ein Quadrat. 2. Fügen Sie in Bild 25 ein Schlüsselbild ein. 3. Verändern Sie das Quadrat in Bild 25 in ein Dreieck. Es gibt mehrere Wege dies zu tun. Allerdings will ich, dass das Dreieck so nah wie möglich an das Quadrat herankommt. Versuchen Sie also einmal folgende Methode: 4. Zeichnen Sie (immer noch in Bild 25) eine vertikale Linie, die das Quadrat nicht berührt. 5. Stellen Sie nun sicher, dass An Objekten ausrichten (die Schaltfläche mit dem Magnet) aktiviert ist und wählen Sie die Linie aus. Klicken Sie nun auf die Mitte der Linie und ziehen Sie diese bei gedrückter Maustaste in die Mitte der oberen Kante des Quadrates (siehe Abbildung 9.5).

211

Morphing mit Formtweening

Abbildung 9.5: Bei eingeschalteter Option An Objekten ausrichten

kann man die Linie exakt in der Mitte der oberen Quadratkante positionieren.

6. Heben Sie nun die Markierung der Linie auf, indem Sie auf eine freie Stelle der Bühne klicken. Ziehen Sie als Nächstes die obere linke Ecke des Quadrates zum Schnittpunkt des Quadrates mit der Linie. Gehen Sie den gleichen Vorgang noch einmal für die obere rechte Ecke durch. 7. Markieren Sie nun die beiden Teilstücke der Linie und löschen Sie diese. 8. Stellen Sie im ersten Bild Tween (im Eigenschaften-Bedienfeld) auf Form ein und testen Sie den Film. Das Ergebnis ist wahrscheinlich nicht das, was Sie erwartet haben. Jetzt haben wir die Chance, Formmarken einzusetzen. 9. Wählen Sie ANSICHT / FORMMARKEN ANZEIGEN. 10. Stellen Sie den Abspielkopf auf Bild 1 ein und wählen Sie dann MODIFIZIEREN / FORM / FORMMARKE HINZUFÜGEN oder drücken Sie (Strg)+(ª)+(H). 11. Es erscheint ein kleiner roter Kreis mit dem Buchstaben a (eine Formmarke). Wechseln Sie vorübergehend zu Bild 25 und Sie werden auch hier eine a-Formmarke wiederfinden. 12. Stellen Sie sicher, dass Sie sich wieder in Bild 1 befinden. Ziehen Sie die Formmarke auf die obere linke Ecke des Quadrates (siehe Abbildung 9.6). Wie Sie sehen, ist die Marke immer noch rot, was anzeigt, dass Sie die Formmarke am Ende des Tweens noch nicht richtig positioniert haben.

212

Feintuning eines Formtweens

Abbildung 9.6: An der oberen linken Ecke des Quadrates befindet sich eine Formmarke.

13. Gehen Sie nun in das Bild 25 und ziehen Sie die Formmarke a zur Mitte der linken Dreieckskante. Die Formmarke wird nun grün und ist somit richtig verknüpft. Wenn Sie in das Bild 1 zurückkehren, werden Sie feststellen, dass die Formmarke nun gelb gefärbt ist. Das bedeutet ebenfalls, dass sie richtig verknüpft wurde. 14. Testen Sie den Film. Wenn er gut aussieht, benötigen Sie keine weitere Formmarke. Wenn nicht – und das ist in dieser Übung eigentlich meist der Fall – sollten Sie eine weitere Formmarke anlegen. 15. Fügen Sie also in Bild 1 eine weitere Formmarke ein ((Strg)+(ª)+(H)). Diese erhält automatisch den Namen b. Ziehen Sie diese Formmarke auf die obere rechte Ecke des Quadrates. 16. Ziehen Sie in Bild 25 die Formmarke b auf die Mitte der rechten Dreieckskante (siehe Abbildung 9.7). 17. Wenn Sie nun den Film testen, wird das Ergebnis viel besser sein als zuvor (ohne Formmarken).

213

Morphing mit Formtweening

Abbildung 9.7: Nun haben wir zwei Formmarken angelegt.

Formmarken verstehen Die zeitaufwändigste Aktion in der letzten Übung war, das Dreieck möglichst passend zum Quadrat zu zeichnen (betrachten Sie das als kurze Wiederholung). Das Hinzufügen von Formmarken war dagegen simpel. Klar – ich habe Ihnen natürlich verraten, an welcher Position man die Formmarken am besten anbringt. Trotzdem ist es recht einfach, dies selbst herauszufinden. Es ist immer so, dass Sie Flash sagen sollten »dieser Punkt in der Form am Anfang des Tweens wird zu diesem Punkt am Ende«. Sie können sich das ansehen, wenn Sie die Schrubbertechnik in einer bedächtigen Form einsetzen. Dabei können Sie beobachten, dass sich die Formmarke aus dem ersten Schlüsselbild in den interpolierten Bildern auf die Position der Formmarke im letzten Schlüsselbild zubewegt. Bitte verwenden Sie nicht mehr Formmarken als unbedingt nötig! Sie sollten nicht von vornherein zehn Formmarken definieren, wenn eine einzige zum selben Ergebnis führen wird. Wenn Sie die erste Marke definiert haben, sollten Sie sich erst einmal das Ergebnis ansehen, denn manchmal entspricht es schon Ihren Anforderungen. Sie dürfen in Ihrer täglichen Arbeit mit Flash gerne Formmarken verwenden, wann und wo Sie wollen. Denken Sie aber daran, dass meist schon eine Marke genügt, um Flash den Tipp zu geben, wie Ihre Animation aussehen soll.

214

Feintuning eines Formtweens

Es gibt noch einige weitere Punkte, deren Verständnis für Sie hilfreich sein wird: 쐽

Sie können keine Formmarken definieren, wenn Sie sich nicht im ersten Schlüsselbild eines Formtweens befinden. Mit anderen Worten: Sie müssen zuerst den Formtween definieren, dann in das erste Schlüsselbild dieses Tweens gehen und dort die Formmarken einzufügen.

쐽

Sie können ANSICHT / FORMMARKEN ANZEIGEN ausschalten, um die Formmarken zu verstecken. Sie werden allerdings immer noch berücksichtigt.

쐽

Formmarken werden erst dann berücksichtigt, wenn sie in beiden Schlüsselbildern des Formtweens an eine Linie oder Füllung angekoppelt wurden. Wenn das passiert ist, verändern sie die Farbe.

쐽

Sie können eine einzelne Formmarke löschen, indem Sie darauf rechtsklicken. Mit MODIFIZIEREN / FORM / ALLE MARKEN LÖSCHEN haben Sie die Möglichkeit, alle Formmarken zu entfernen.

쐽

Man kann Formmarken nur mit einem Schlüsselbilder-Paar verwenden! Wenn Sie beispielsweise einen Tween mit drei Schlüsselbildern erzeugen wollen (siehe letztes Kapitel), haben Sie nicht die Möglichkeit, die Formmarken aus dem Tween zwischen den ersten beiden Schlüsselbildern im Tween zwischen den Schlüsselbildern 2 und 3 zu verwenden. Die Lösung ist aber recht einfach: Erstellen Sie zwei getrennte Tweens, die je ein eigenes Start- und Endschlüsselbild besitzen (siehe Abbildung 9.8).

Abbildung 9.8: Eine Formmarke stellt die Bedingung, dass man nur zwei Schlüsselbilder im Formtween verwendet.

215

Morphing mit Formtweening

Gute Gründe, warum man Formtweens vermeiden sollte Der wohl beste Grund, warum man Formtweens vermeiden sollte ist, dass man sie oft nicht (oder selten) benötigt. Ein Nachteil von Formtweens ist außerdem auch, dass sie nicht unwesentlich zur Dateigröße beitragen. Denken Sie einmal daran, was passiert, wenn Sie ein Schlüsselbild einfügen: Der Inhalt des vorausgegangenen Schlüsselbildes wird kopiert und im neuen Schlüsselbild eingefügt. Wenn Sie im ersten Schlüsselbild also ein Quadrat gezeichnet haben, existiert im zweiten Schlüsselbild eine Kopie dieses Quadrates. Das Quadrat existiert also zweimal im Speicher. Auch wenn Sie das Quadrat im zweiten Schlüsselbild verändern, bleibt es doch als eigene Form im Speicher. Vergleichen wir das mit einem Bewegungstween: Angenommen, im ersten Schlüsselbild liegt das Symbol eines Quadrates. Dann haben wir im zweiten Schlüsselbild eine Instanz desselben Symbols erzeugt (das Quadrat existiert also nur einmal im Speicher). Sie sehen, dass allein die Vorbereitung für die unterschiedlichen Tweens einen Speicherzuwachs des Form- gegenüber dem Bewegungstween von knapp 100% ausmacht. Ein weiterer Grund, warum Sie Formtweens vermeiden sollten ist, dass sie schlechter zu handhaben sind als Bewegungstweens. Das gilt besonders für Tweens, bei denen viele Formmarken nötig sind. Bei einem Bewegungstween können Sie außerdem die Bibliothek (mit allen Vorteilen) anwenden. Verwenden Sie Formtweens also nur, wenn Sie es unbedingt müssen.

9.3

Zusammenfassung

Da Sie das Formtweening verstanden haben, kennen Sie nun beide Möglichkeiten, wie Flash Sie durch Tweening (sowohl Form- als auch Bewegungstweening) unterstützt. Sie haben die Möglichkeiten des Morphings kennen gelernt. Die Grundregeln des Formtweenings lauten: keine gruppierten Formen und keine Symbole verwenden! Deshalb sind Formtweens recht einfach zu erstellen, allerdings benötigt man einige Techniken, um ein gutes Ergebnis zu erzielen. Verwenden Sie beispielsweise Formmarken, um Flash klarzumachen, was Sie sich vorstellen. Dies war das letzte Kapitel, in dem wir uns mit den Grundlagen von Animationen befasst haben. Es wird langsam Zeit, sich den interessanteren Dingen zuzuwenden (zum Beispiel Sound und Interaktivität).

216

Workshop

9.4

Workshop

F&A F

Warum erscheint in meinem Formtween auf einmal eine gestrichelte Linie in den interpolierten Bildern der Zeitleiste? A

F

Meine Animation verhält sich eigenartig. Manche Objekte erscheinen nur im ersten und letzten Bild. Ich muss aber die Regeln der Formtweens beachtet haben, da ich keine gestrichelte Linie in der Zeitleiste erhalte. A

F

Sie haben entweder eine Regel der Formtweens verletzt, die besagt, dass man keine Symbole oder Gruppen verwenden darf. Es kann aber auch sein, dass Ihr Tween nicht genau zwei Schlüsselbilder besitzt. Achten Sie also darauf, dass Sie zwischen zwei Schlüsselbildern tweenen, die beide weder Symbole noch gruppierte Objekte enthalten.

Die richtig aussehende Zeitleiste besagt leider nicht, dass Sie wirklich alles richtig gemacht haben, denn wenn Sie einige Objekte in den beiden Schlüsselbildern haben, die weder Symbole noch Gruppen sind, erscheint die gestrichelte Linie nicht mehr. Nur wenn alle Objekte Symbole oder Gruppen sind, werden Sie auf diese Weise auf den Regelverstoß aufmerksam gemacht.

Wenn ich auf ein grünes interpoliertes Bild klicke, kann ich im Eigenschaften-Bedienfeld die Einstellung Tween verändern. Ich dachte, dass es sich hier um das Territorium von Flash handelt. Wieso kann ich dann darauf zugreifen? A

In Wirklichkeit greifen Sie auf das Eigenschaften-Bedienfeld des ersten Schlüsselbildes des Tweens zu. Denken Sie daran, dass ein Schlüsselbild ohne Tween angibt, was bis zum nächsten Schlüsselbild auf der Bühne erscheinen soll. Genauso ist das auch bei Tweens. Allerdings rechnet Flash hier für Sie. Die gute Nachricht ist, dass Sie beim Klicken an dieser Stelle nicht besonders vorsichtig sein müssen (da immer das erste Schlüsselbild des Tweens angesprochen wird). Dennoch sollten Sie sich darüber im Klaren sein, welches Schlüsselbild in so einem Fall angesprochen wird.

Quiz Bitte versuchen Sie zuerst selbst die Antwort auf die folgenden Fragen zu geben, bevor Sie die Lösungen nachlesen. Schauen Sie sich bitte auch die Erklärungen der Lösungen an, auch wenn Ihr Ergebnis stimmt.

217

Morphing mit Formtweening

1. Was ist die ideale Anzahl von Formmarken in einem Formtween? a.

10

b. Nicht mehr als 5 c. Nicht mehr als nötig 2. Welche Art von Tweening wird eine kleinere Dateigröße ermöglichen: Form- oder Bewegungstweening? a.

Formtweening

b. Bewegungstweening c. Das hängt von der Anzahl der Farben ab, die in der Datei verwendet wurden. 3. Wie kann man Texte in einen Formtween einbauen? a.

Text kann in Formtweens nicht verwendet werden.

b. Ich trenne den Text. c. Ich stelle sicher, dass der Text sich nicht in der Bibliothek befindet.

Übung Es gibt eine Menge Möglichkeiten, den Umgang mit Formtweens zu üben. Hier ist eine kleine Herausforderung, die Ihre Sinne schärfen soll: Versuchen Sie einen einzelnen Buchstaben in eine verwandte Form zu tweenen (zum Beispiel ein A in ein Dreieck oder ein C in einen Kreis). Verwenden Sie gegebenenfalls Formmarken, um die Animation nach Ihren Wünschen ablaufen zu lassen. Bitte versuchen Sie noch nicht, Ihren ganzen Namen zu tweenen. Ein oder zwei Buchstaben reichen zunächst.

218

Sound einbinden

0 1

Sound einbinden

Mit Sounds erwecken Sie einen Film zum Leben. Meist nehmen die Betrachter Ihrer Animation die Hintergrundgeräusche oder -musik gar nicht so bewusst wahr. Man kann auf diese Weise aber den »Spirit« einer Seite entscheidend mitprägen. Schlechte oder schlecht verwendete Sounds werden dem Anwender allerdings unangenehm auffallen. Der AudioEffekt ist nicht immer unmittelbar erkennbar – und gerade das macht ihn so mächtig. Unabhängig davon, warum Sound so nützlich ist, ist es sehr wichtig, dieses Mittel effektiv einzusetzen, da es sich bei Audio um den größten Teil der Datenmenge einer normalen Animation handelt. Es gibt keinen Grund, dem Sound zu erlauben, mehr Speicher zu belegen als unbedingt nötig. Leider gibt es aber keine »Bringe Audio gut rüber«-Schaltfläche und die Wahl zwischen guter Qualität und kleiner Dateigröße hat mehr von einem Kampf als von einem Balanceakt. Man muss die Technik dahinter verstehen. Genau das ist das Ziel dieses Kapitels. In diesem Kapitel werden Sie: 쐽

Sound importieren und in Schlüsselbildern verwenden,

쐽

Audio-Konzepte (wie zum Beispiel Aufnahmequalität, Frequenz und Komprimierung) kennen lernen und

쐽

Tricks ausprobieren, wie man die Dateigröße von Soundeffekten verringert.

10.1 Sounds importieren Flash unterstützt zwar die Wiedergabe von Audio-Dateien, bietet aber leider keine Möglichkeit, Ton oder Geräusche zu generieren. Sie müssen sich also auf die Suche nach einer fertigen Sound-Datei machen, sich Ihre Sounds anfertigen lassen oder selbst zu entsprechender Software greifen, um Ihre eigenen Geräusche zu generieren oder aufzuzeichnen. Das Einbinden von Sound geschieht in zwei Schritten: Zuerst müssen Sie die Audio-Datei importieren und dann angeben, wo (besser wann) und wie sie abgespielt werden soll. Das kann man fast mit der Verwendung von Rastergrafiken (siehe Kapitel 3) vergleichen. Wenn man beispielsweise ein Geräusch importiert hat, wird es in der Bibliothek abgespeichert. An dieser Stelle möchte ich kurz darauf hinweisen, dass es im Internet natürlich eine Vielzahl von Bezugsquellen für Sounds gibt. Bedenken Sie aber, dass viele dieser Dateien urheberrechtlich geschützt sind. Außerdem sollten Sie bei der Erstellung einer professionellen Internetseite lieber einen Sound-Experten beauftragen, eigene Sounds für Sie zu generieren. Das hat eine Menge Vorteile: Sie haben einerseits die Urheberrechts-Fragen von Anfang an geklärt und können dafür sorgen, dass niemand sonst Ihre Audio-Dateien verwendet. Stellen Sie sich vor, Sie wollen ein Geräusch verwenden, das auch eine andere

220

Sounds importieren

Firma einsetzt, die plötzlich viel populärer wird. Auf einmal stehen Sie wie ein Nachahmer da, obwohl Sie die Datei vielleicht schon viel früher verwendet haben. Oder denken Sie an eine Firma, die den gleichen Sound (mit dem Sie ein hochwertiges Produkt bewerben) für Zwecke einsetzt, die Ihrem Image schaden. Ich bin der Meinung, dass sich die Investition auf jeden Fall lohnt, wenn man eine exklusive Seite erstellen möchte.

Unterstützte Formate Flash kann die folgenden digitalen Audioformate verarbeiten: 쐽

MP3

쐽

WAV

쐽

AIF (kommt auch als AIFF vor)

쐽

AU

Dabei gibt es nur einen Haken: Wenn Sie QuickTime 4 oder 5 noch nicht installiert haben, können Sie unter Windows keine AIF-Dateien und mit einem Macintosh keine WAV-Dateien importieren. Laden Sie QuickTime einfach von http://www.apple.com herunter und installieren Sie diese Software. Dann können Sie alle vier Formate beliebig einsetzen. Ich werde oft gefragt, welches dieser Formate das beste ist. Grundsätzlich kann man sagen, dass es keine Rolle spielt, welches Format Sie verwenden. Sie sollten allerdings immer mit der besten Qualität beginnen, die Ihnen zur Verfügung steht. Dabei unterscheiden sich WAV und AIF kaum voneinander. Sie bieten beide die gleiche hohe Qualität. Bei den MP3-Dateien sieht das aber schon anders aus. Hier liegen die Audio-Informationen nämlich komprimiert vor. Das heißt, dass die Qualität nicht besonders hoch ist. Es gibt allerdings zwei gute Gründe, warum man MP3-Dateien einsetzen sollte: 쐽

wenn die einzige Datenquelle eine MP3-Datei ist oder

쐽

wenn die MP3-Datei (soweit Sie das beurteilen können) schon optimal komprimiert wurde.

MP3-Dateien werden qualitativ nicht schlechter, wenn man sie in Flash verwendet, allerdings werden Sie auch nicht besser. Das ist wiederum der Grund, warum ich Ihnen nicht empfehlen kann, eine MP3-Datei als Quell-Datei zu verwenden. Es sei denn, Sie haben nichts anderes oder Sie sind mit der aktuellen Qualität hundertprozentig zufrieden.

221

Sound einbinden

Übung: Importieren Sie einen Sound Die Vorgehensweise, um Sound in Flash zu importieren, ist recht einfach. Folgen Sie diesen Schritten: 1. Wählen Sie in einer neuen Datei DATEI / IMPORTIEREN. (Unter Windows finden Sie einige Sounds in C:\Windows\Media; Macintosh-Anwender können eine Suche nach Dateien vom Typ Sound starten.) Man kann die Dateianzeige nach Sound-Dateien ausfiltern, wenn man (wie in Abbildung 10.1) Alle Ton-Formate auswählt.

Abbildung 10.1: Wenn man nach bestimmten Dateien sucht, kann man über das Auswahlfeld Dateityp die Anzeige filtern.

2. Nachdem Sie eine Ton-Datei ausgewählt haben, können Sie auf Öffnen klicken. Der Sound wird nun importiert. (Sie werden nichts hören, aber die Ton-Datei steht Ihnen nun in Flash zur Verfügung). Den Ton finden Sie dann in der Bibliothek wieder. Schauen Sie doch einmal nach ((Strg)+(L)). 3. Auch wenn wir hier noch nicht genau auf die Verwendung von Sound eingehen (das kommt im nächsten Abschnitt), sollten wir es schon einmal ausprobieren. Es gibt zwei Möglichkeiten, den Sound einzubinden: Die eine ist, ihn direkt aus der Bibliothek auf die Bühne zu ziehen. Dazu ist ein editierbares (also nicht interpoliertes) Bild erforderlich, das sich in einer nicht gesperrten Ebene befindet. Die andere Methode ist, einfach ein Schlüsselbild auszuwählen (klicken Sie in der Zeitleiste einfach auf 1) und im Eigenschaften-Bedienfeld die gewünschte Datei im Auswahlfeld Ton einzustellen (siehe Abbildung 10.2). Hier werden alle Ton-Dateien angezeigt, die Sie zuvor in Ihren Film importiert haben.

222

Sounds importieren

Abbildung 10.2: Die importierten Audio-Dateien erscheinen sowohl in der Bibliothek als auch im Eigenschaften-Bedienfeld.

4. Wenn Sie den Film nun testen, werden Sie den Sound hören. (Dafür sollten natürlich Ihre Soundkarte und die Computerlautsprecher funktionieren.)

Sounds aus einer anderen Bibliothek importieren Ich bin mir sicher, dass Sie mit mir einer Meinung sind: Sounds zu importieren ist ein Kinderspiel. Es gibt noch eine andere Möglichkeit, Ton zu importieren. Sie können nämlich die erforderlichen Dateien direkt aus Bibliotheken anderer Flash-Filme übernehmen. Dazu brauchen Sie nur das entsprechende Soundobjekt von einer Bibliothek in die andere zu ziehen (oder aus der fremden Bibliothek auf die Bühne, wenn das aktuelle Bild bearbeitet werden kann). Sie können das ausprobieren, indem Sie die Sound-Bibliothek öffnen, die mit Flash ausgeliefert wird. Stellen Sie sicher, dass Ihre Bibliothek geöffnet ist und wählen Sie dann FENSTER / ALLGEMEINE BIBLIOTHEKEN / SOUNDS. Ordnen Sie die beiden Bibliotheken so an, dass beide sichtbar sind. Nun können Sie einzelne Soundobjekte aus der Flash-Bibliothek in Ihre ziehen. Wenn Sie die zweite Variante verwenden (indem Sie die Sounds auf die Bühne ziehen), werden Sie feststellen, dass die Objekte auch in Ihrer Bibliothek auftauchen.

223

Sound einbinden

10.2 Sound verwenden Da wir nun wissen, wie man Sounds importiert, können wir uns mit der Frage beschäftigen, wie man sie im richtigen Moment abspielt. Es gibt nur eine Stelle in Flash, an der man Sounds einfügen kann: in Schlüsselbildern.1 Falls Sie beispielsweise dann einen Sound abspielen wollen, wenn ein Anwender mit der Maus über eine Schaltfläche fährt, müssen Sie den Sound ebenfalls in ein Schlüsselbild einfügen – dabei handelt es sich lediglich um ein Schlüsselbild in der Schaltfläche. Mit solchen Schaltflächen werden wir uns aber erst in Kapitel 13 beschäftigen. Wir wissen also, dass man Sounds in Schlüsselbilder einfügt. Wie bekommt man diese aber dort hinein? Dazu gibt es das Eigenschaften-Bedienfeld. Außerdem kann man an der Zeitleiste erkennen, wann und wie lange eine Ton-Datei abgespielt wird (siehe Abbildung 10.3).

Abbildung 10.3: Die Wellenform (eine Abbildung des Tons) wird in der Zeitleiste angezeigt. Das ist besonders dann hilfreich, wenn Sie Bilder mit bestimmten Soundabschnitten synchronisieren wollen.

Im Eigenschaften-Bedienfeld können Sie aber trotzdem immer noch am besten erkennen, welcher Sound in welches Schlüsselbild eingefügt wurde. Allerdings werden nur Informationen zum aktuellen Schlüsselbild angezeigt. Man kann dieses Bedienfeld sehr leicht missverstehen, da man Schlüsselbilder einfach verlassen kann. Die Abbildung 10.4 sieht ähnlich aus wie die Abbildung 10.3. Allerdings wird im Eigenschaften-Bedienfeld angezeigt, dass kein Ton verwendet wird. Wenn Sie auf die Zeitleiste schauen, werden Sie 1

224

Es gibt eine Ausnahme, die mit ActionScript zusammenhängt. Dazu kommen wir aber erst viel später.

Sound verwenden

feststellen, dass zwar eine Wellenform angezeigt, aber kein Schlüsselbild ausgewählt wird. Deshalb sollten Sie erst dann auf das Eigenschaften-Bedienfeld schauen, nachdem Sie das entsprechende Schlüsselbild ausgewählt haben.

Abbildung 10.4: Das EigenschaftenBedienfeld kann irreführend sein. Es zeigt nur dann Sounds an, wenn ein Schlüsselbild ausgewählt wurde. Da hier aber kein Schlüsselbild aktiviert wurde, wird auch kein Sound im Bedienfeld angezeigt.

Sync-Einstellungen Wenn Sie in einem Schlüsselbild die Wiedergabe von Sound aktiviert haben, können Sie exakt angeben, wie der Ton wiedergegeben werden soll. Die wichtigste Entscheidung, die Sie dabei treffen müssen, ist, die Sync-Eigenschaft des Sounds festzulegen. Dabei definieren Sie, welche Priorität der Sounds gegenüber den sichtbaren Elementen der Animation besitzt. Bevor Sie die Einstellungen ausprobieren, betrachten Sie bitte die folgende Liste und die Abbildung 10.5 für eine genauere Beschreibung jeder Option. 쐽

Ereignis ist die Standardeinstellung und üblicherweise auch die beste Wahl. Mit die-

ser Einstellung wird der Sound wiedergegeben, wenn das entsprechende Schlüsselbild erreicht wurde, und sie stoppt erst, wenn die Ton-Datei komplett abgespielt wurde. Das Zusammenspiel von Bild und Ton wird aber nicht auf jedem Computer gleich sein. Der Sound wird natürlich nicht schneller oder langsamer wiedergegeben (das würde sich recht lustig anhören), aber die Geschwindigkeit, in der die Grafik berechnet wird, ist doch recht unterschiedlich.

225

Sound einbinden

쐽

Start ist mit Ereignis vergleichbar. Allerdings kann hier ein bereits abgespielter Sound nicht überlagert werden. Wenn Sie in mehreren Schlüsselbildern den gleichen Sound per Ereignis starten, werden die einzelnen Instanzen des Sounds (wie bei einem Kanon) überlagert. Die Option Start besagt aber: »Spiele den Sound ab, wenn er nicht schon wiedergegeben wird.«

쐽

Mit Stoppen kann man die Wiedergabe eines bestimmten Sounds beenden. Wenn Sie beispielsweise eine Hintergrundmusik abspielen lassen, können Sie das Abspielen dieses Sounds (wo auch immer diese Soundwiedergabe begonnen wurde) stoppen. Alle anderen Sounds werden aber ganz normal fortgesetzt.

쐽

Wenn Sie Stream eingestellt haben, wird der Sound synchron mit der Bildwiedergabe abgespielt. Da (wie wir schon festgestellt haben) der Sound aber vom Tempo nicht variiert werden kann, werden gegebenenfalls einzelne Bilder übersprungen, um (bei einem grafisch langsamen Computer) mit dem Sound Schritt zu halten. Wenn Sie also eine Animation mit 12 Bps erstellt haben, sollte bei einem Drei-Sekunden-Sound die Animation auch 36 Bilder haben, da sonst ein Teil des Sounds nicht abgespielt wird. Wenn Sie also in der Zeitleiste eine besondere Stelle im Sound erkennen, können Sie sicher sein, dass mit der Option Stream in dem Moment auch versucht wird, das entsprechende Bild anzuzeigen (vorausgesetzt der Computer des Betrachters ist schnell genug). Sounds, die per Stream wiedergegeben werden, werden auch bei der Schrubbertechnik abgespielt. Sie können damit z.B. Lippensynchronizität testen. Abbildung 10.5: Sie können im EigenschaftenBedienfeld für jede Sound-Instanz die Einstellung Sync verändern.

Die Entscheidung, welche Sync-Einstellung man verwenden sollte, ist eigentlich gar nicht so schwer. Ereignis ist bei fast jedem Sound (besonders bei kurzen Geräuschen) die richtige Wahl, es sei denn, es wird eine besonders präzise Synchronisation gewünscht. Eine Hintergrundmusik, die irgendwann beginnt und sich dann ständig wiederholt, benötigt keine besondere Abstimmung mit den Bildern. Deshalb ist auch hier Ereignis die richtige Wahl. Wenn Sie aber z.B. 5 Schaltflächen besitzen, die immer dann ein Geräusch von sich geben, wenn der Betrachter mit der Maus darüber fährt, gibt das zwar bei kurzen Tönen kein Problem. Sollten Sie jedoch etwas längere Audio-Dateien für diesen Effekt verwenden, wird der Betrachter schnell abgelenkt: Die Geräusche überlappen sich und es entsteht ein ganzer Sound-Teppich. Hier wäre Start wahrscheinlich die bessere Wahl. Wir kommen auf solche Sounds im 13. Kapitel noch zu sprechen.

226

Sound verwenden

Die Einstellung Stoppen können Sie besonders geschickt einsetzen, denn es wird ein Sound gezielt gestoppt. Wenn Sie im 14. Kapitel mehr über Aktionen lernen, werden Sie erfahren, wie man alle Sounds auf einmal stoppt. Abschließend sei gesagt, dass Stream für eine Funktion besonders gut geeignet ist: Grafik mit Sound zu synchronisieren. Das ist besonders dann interessant, wenn Sie einen Charakter erschaffen haben, dessen Lippen sich synchron zur Stimme bewegen sollen. Versuchen Sie das einmal ohne diese Einstellung. Sie werden schnell verzweifeln, da Sie bei der Schrubbertechnik nichts hören. Erst wenn Sie Stream eingestellt haben, wird der Sound im Prinzip in kleine Stücke zerteilt, die den einzelnen Bildern zugeordnet werden. Deshalb können Sie auch beim Schrubben die Stimme Ihres Charakters hören und genau abgleichen. Wenn Sie ein Drei-Sekunden-Geräusch in einer 12-Bps-Animation verwenden, wird Flash während des Geräusches 36 Bilder anzeigen. Was passiert aber, wenn Sie die Bildrate auf 24 Bps erhöhen? Ganz einfach: Flash wird nun die Bilder in 1,5 Sekunden spielen, aber den Sound unverändert lassen (siehe Abbildung 10.6). Abbildung 10.6: Die gleiche Animation mit gleichem Sound in 12 Bps (oben) und 6 Bps (unten). Alles bleibt gleich, lediglich der Sound benötigt eine andere Anzahl von Bildern, um abgespielt zu werden.

Effekt-Einstellungen Das Eigenschaften-Bedienfeld bringt einige sehr interessante Effekte mit sich, die Sie bei einem ausgewählten Sound anwenden können. Im Auswahlfeld neben dem Wort Effekt können Sie mehrere Einstellungen (wie zum Beispiel Einblenden, Ausblenden, von links nach rechts oder von rechts nach links) vornehmen. Damit Sie die Handhabung besser verstehen, sollten Sie Benutzerdefiniert einstellen oder auf Bearbeiten neben dem Soundnamen klicken. Es erscheint das Fenster Hülle bearbeiten (siehe Abbildung 10.7).

227

Sound einbinden

Abbildung 10.7: Im Fenster Hülle bearbeiten können Sie vorgefertigte Überblendeffekte auswählen oder Ihre eigenen erzeugen. 쐽

Im linken Kanal/rechten Kanal werden verschiedene Wellenformen angezeigt, wenn es sich bei Ihrem Sound um Stereo handelt. Aber selbst wenn es sich um ein Monosignal handelt, werden beide Kanäle angezeigt, damit Sie beispielsweise einen Überblendeffekt von links nach rechts erzeugen können. In diesem Fall kommt aus beiden Lautsprechern genau das gleiche Geräusch (allerdings mit unterschiedlichen Lautstärken).

쐽

Die Hüllenkurve stellt die Lautstärke des Sounds zu den unterschiedlichen Zeitpunkten dar. Wenn die Kurve oben ist, spielt der Sound mit 100% Lautstärke. Wenn die Kurve also nach rechts hin ansteigt, wird der Sound immer lauter.

쐽

Die Hüllenanfasser sind vergleichbar mit Schlüsselbildern im Sound. Immer wenn Sie die Richtung der Hüllenkurve verändern wollen, können Sie an der entsprechenden Stelle auf die Hüllenkurve klicken, um einen Hüllenanfasser zu erzeugen. Es wird auch im anderen Kanal ein solcher Wendepunkt erzeugt, der sich von seinem Gegenstück (im anderen Kanal) zwar in der Lautstärke, aber nicht in der Position (Zeitpunkt) unterscheiden kann.

228

Sound verwenden

쐽

Mit dem Abspielstart legen Sie fest, an welcher Stelle der Sound starten soll. Damit können Sie zum Beispiel die Stille am Anfang einer Aufnahme ausschließen und den Sound direkt beim ersten Geräusch starten lassen.

쐽

Über das Abspielende können Sie im Gegenzug das Abspielen des Sounds vorzeitig beenden. Das macht Sinn, wenn beispielsweise auch hier Stille folgt oder wenn Sie nur einen Teil des Sounds verwenden wollen. Wenn Sie so den Sound verkürzen, wird auch nur dieser Teil in Ihrer .swf-Datei gespeichert (was für eine geringere Dateigröße sorgt).

쐽

Mit Stopp/Abspielen können Sie die Effekte überprüfen, die Sie eingestellt haben. Sie sehen zwar, was Sie produziert haben, aber Sie werden wohl doch eher Ihrem Gehör vertrauen, wenn es um die Feinabstimmung des Sounds geht.

쐽

Wenn Sie Vergrößern/Verkleinern verwenden, können Sie genauer bestimmen, wann Effekte einsetzen sollen oder wo der Sound beginnen und enden soll.

쐽

Mit Sekunde/Bilder können Sie festlegen, welche Einheit angezeigt werden soll. Es lohnt sich nicht, dass Sie sich Sekunden anzeigen lassen, wenn Sie die Synchronisation der Bilder anpassen wollen.

Auch wenn es so viele Einstellmöglichkeiten in diesem Fenster gibt, können Sie nur zwei Aktionen damit ausführen: Entweder Sie wählen einen vordefinierten Effekt oder Sie erstellen einen neuen. Sie können natürlich auch eine vorgefertigte Hüllenkurve zuweisen und diese dann Ihren Anforderungen anpassen. Sie sollten nach jeder Änderung den Sound testen. Alle Änderungen, die Sie vornehmen, beeinflussen die Original-SoundDatei in der Bibliothek nicht. Sie können also mehrere Soundinstanzen mit unterschiedlichen Effekten belegen, wobei aber immer die Original-Datei in der Bibliothek zu Grunde gelegt wird. Eine sehr wichtige Sache ist, dass man durch die Verwendung des Start- und Endpunktes die Dateigröße verringern kann und somit für den Anwender Downloadzeit gespart wird; dieses Detail sollten Sie in Erinnerung behalten. Es nützt allerdings nichts, wenn Sie stattdessen die Hüllenkurve auf 0% setzen, denn der Sound bleibt dann immer noch genauso lang (und die Datei genauso groß) wie zuvor.

Wdh-Einstellungen Abschließend möchte ich Sie noch auf die Einstellung Wdh im Eigenschaften-Bedienfeld hinweisen. Hier können Sie angeben, wie oft der Sound wiederholt werden soll. Bei den Wiederholungen werden keinerlei Pausen eingefügt, was besonders schön für spezielle Loop-Sounds ist. Manche Sounds eignen sich besser für Wiederholungen als andere. Ein gut geeigneter Sound endet auf die gleiche Weise, wie er startete. Selbstverständlich kann man auch eine große Ton-Datei importieren und über den Start- und Endpunkt einen schönen wiederhol-

229

Sound einbinden

baren Sound erstellen, allerdings dürfte das nicht gerade einfach sein. Im Normalfall werden Sie nach einem Sound suchen, der von einem Tontechniker vorbereitet wurde, um diesen Zweck zu erfüllen. Solche professionellen Sounds verraten nicht, dass und wann sie wiederholt werden. Sie hören sich wie eine Endlosmelodie an. Wenn Sie einen passenden Sound gefunden haben, den Sie »endlos« oft wiederholen wollen, ist es in Flash gängige Praxis, eine sehr große Zahl in das Feld Wdh einzutragen. Wenn Sie also 99999999999 eintragen, wird Flash die Zahl in 2147483647 umwandeln (die größte ganze Zahl, die Flash verwalten kann). Ich denke, dass ein sehr geduldiger Betrachter diese Anzahl von Durchläufen abwarten könnte. Wenn Sie aber nachrechnen, werden Sie feststellen, dass ein Ein-Sekunden-Sound bei 2.147.483.647-maliger Wiederholung etwa 68 Jahre benötigt, um am Ende zu sein!

Übung: Fügen Sie Sounds und Soundeffekte zu einer Animation hinzu In dieser Übung werden wir einen Beispielfilm mit Sound versehen. 1. Öffnen Sie bitte wieder das keyframing.fla-Beispiel, das Sie bereits im sechsten Kapitel verwendet haben. Öffnen Sie bitte auch die Sound-Bibliothek per FENSTER / ALLGEMEINE BIBLIOTHEKEN / SOUNDS. 2. Öffnen Sie die Bibliothek der keyframing.fla-Beispiel-Datei über FENSTER / BIBLIOTHEK ((Strg)+(L)).

Abbildung 10.8: Schieben Sie die beiden Bibliotheken nebeneinander, damit wir Sounds übernehmen können.

230

Sound verwenden

3. Ziehen Sie die folgenden Dateien aus der Sound-Bibliothek in die Bibliothek der Beispiel-Datei: Beam Scan, Smack und Visor Hum Loop. 4. Damit sind die Sounds nun in Ihrer Datei verfügbar. Allerdings müssen wir sie noch in Schlüsselbilder einfügen. Lassen Sie uns zuerst aber eine Ebene nur für die Sounds anlegen. Wählen Sie also EINFÜGEN / EBENE (es ist egal, wo die neue Ebene angezeigt wird). Nennen Sie die Ebene Musik. 5. Wählen Sie das erste Bild der neuen Ebene aus und öffnen Sie das EigenschaftenBedienfeld. Wählen Sie unter Ton den Sound Visor Hum Loop aus. Damit das Geräusch ständig wiederholt wird, tragen Sie eine Reihe Neunen (99999999999) unter Wdh ein (siehe Abbildung 10.9).

Abbildung 10.9: Wenn Sie eine sehr große Zahl unter Wdh eintragen, wird der Sound ständig wiederholt.

6. Wählen Sie nun STEUERUNG / FILM TESTEN. Der Sound wird sehr schön wiederholt und gibt unserem Film einen dramatischen Touch. Lassen Sie uns einige weitere Soundeffekte einfügen. 7. Fügen Sie eine weitere Ebene ein und nennen Sie diese Soundeffekte. Nun fügen wir an der Stelle ein Geräusch ein, wo das M mit dem X zusammenstößt. Das passiert ziemlich genau in Bild 17. Fügen Sie also in der Ebene Soundeffekte bei Bild 17 ein Schlüsselbild ein. 8. Wählen Sie das soeben erzeugte Schlüsselbild aus und tragen Sie im EigenschaftenBedienfeld Smack zum Abspielen ein. Lassen Sie die anderen Einstellungen unverändert, da wir den Sound nicht wiederholen wollen.

231

Sound einbinden

9. Wählen Sie erneut STEUERUNG / FILM TESTEN. Der Effekt ist gut, allerdings bleibt das Summen den ganzen Film hindurch hörbar. 10. Das ändern wir, indem wir in Bild 29 in der Ebene Soundeffekte ein weiteres Schlüsselbild erzeugen: Tragen Sie hier im Eigenschaften-Bedienfeld wieder Visor Hum Loop ein, wählen aber unter Sync den Wert Stoppen. Damit beenden wir die Wiedergabe des Summens. 11. Zum Schluss fügen wir noch ein Geräusch ein, wenn der Glitzer animiert wird. Dazu fügen wir wieder in Soundeffekte in Bild 30 ein Schlüsselbild ein und lassen Beam Scan einmal abspielen. Testen Sie den Film noch einmal und Sie werden mir zustimmen, dass der Film viel besser ist als die stumme Variante. Nebenbei: Diese Sounds haben die Dateigröße gerade einmal um 3 kb erhöht!

10.3 Qualität und Dateigröße kontrollieren Da Sie nun wissen, wie man mit Sound innerhalb von Flash umgeht, sollten Sie sich Gedanken darüber machen, wie die Qualität im Zusammenhang mit der Dateigröße steht. Wenn Sie die beste Audioqualität verwenden, wird die Datei sehr groß. Dem gegenüber steht eine kleine Datei für schlechte Qualität. Das ist einfach eine Tatsache. Sie müssen sich entscheiden, wie Sie diese beiden Werte ausbalancieren. Ist die Soundqualität so wichtig, dass Sie Ihr Publikum länger vor dem Bildschirm beim Download warten lassen wollen? Lässt ein schneller Download den Betrachter über qualitativ schlechten Sound hinwegsehen? Sie sollten sich darüber viele Gedanken machen, um den besten Kompromiss zu finden. Bevor wir dieses Thema weiter diskutieren, sollten wir ein paar Grundlagen lernen, um diese später in Flash umsetzen zu können.

Digital-Audio-Grundlagen Digitale Sounds sind nicht flüssig. Genauso wie Ihr Monitor flimmert, besteht ein digitales Geräusch aus vielen Klangteilen, die man auch Samples nennt. Diese Samples folgen allerdings so schnell aufeinander, dass Sie meinen, einen flüssigen Sound zu hören. Die Geschwindigkeit, in der die Samples abgespielt werden, nennt man auch SampleRate. Dabei klingen hohe Raten besser als niedrige. Eine CD wird zum Beispiel mit 44 KHz aufgenommen. Ein Sound mit halber Rate (22 KHz) klingt aber nicht extrem viel schlechter, obwohl er nur die halbe Datenmenge benötigt.

232

Qualität und Dateigröße kontrollieren

Ein weiterer wichtiger Faktor ist die Bit-Tiefe. Genauso wie Ihr Monitor 256 Farben (8 Bit) oder 16,7 Millionen Farben (24 Bit) anzeigen kann, ist es bei Sounds möglich, einen Vollausschlag in 256 oder 65.536 (16 Bit) einzelne Werte zu unterteilen. Ein 16-Bit-Sound (wie bei einer CD) ist also viel höher aufgelöst als ein 8-Bit-Sound und klingt deshalb viel besser. Die Werte Sample-Rate und Bit-Tiefe sind voneinander unabhängig. So kann man zum Beispiel Sounds mit hoher Sample-Rate, aber niedriger Bit-Tiefe oder umgekehrt erzeugen. Noch etwas anderes: Ein Stereosound ist immer doppelt so umfangreich wie ein Monosound (da die Informationen für zwei Kanäle abgespeichert werden müssen). Außerdem wird durch die Länge des Sounds die Dateigröße direkt beeinflusst. Je länger ein Sound ist, umso größer wird die Datei. Es gibt zwar Möglichkeiten, die genaue Größe einer Sound-Datei zu berechnen, was an dieser Stelle allerdings zu weit führen würde. Seien Sie einfach versichert, dass SoundDateien meist sehr groß sind. Eine Minute in CD-Qualität benötigt beispielsweise etwa neun Megabyte Speicher. Deshalb sollten Sie versuchen, einen besseren Weg zu finden. Eine Möglichkeit ist die Komprimierung. Für das MP3-Format wird der Sound beispielsweise analysiert und es entsteht eine Datei, mit der man den Sound mit recht wenig Verlust wieder rekonstruieren und abspielen kann. Die Dateigröße wird dabei stark vermindert. (Eine CD-Minute ist danach nur noch ein Megabyte groß.) Wie das genau funktioniert weiß ich nicht. Das ist bestimmt Magie, glaube ich.

Einstellungen beim Exportieren Die ganze Theorie ist ja recht interessant, aber wie wendet man das nun auf die eigenen Sounds an? Es gibt zwei Stellen in Flash, an denen man die Soundqualität einstellen kann: das Soundeigenschaften-Fenster (hier kann man für jeden einzelnen Sound verschiedene Angaben machen) oder global in den Veröffentlichungseinstellungen.

Globale Veröffentlichungseinstellungen Wenn Sie die Standardeinstellung für jeden Sound in Ihrem Flash-Film verändern wollen, wählen Sie DATEI / EINSTELLUNGEN FÜR VERÖFFENTLICHUNGEN. Stellen Sie sicher, dass Sie bei den Formaten Flash (.swf) aktiviert haben und klicken Sie dann auf die Registerkarte Flash (siehe Abbildung 10.10). Sie sehen zwei unterschiedliche Einstellungen: Audio-Stream und Audio-Ereignis. Dabei beeinflusst Audio-Stream alle Sounds, die per Sync-Einstellung auf Stream gesetzt wurden und Audio-Ereignis die Sync-Werte Ereignis und Start. Wenn Sie auf die Schaltfläche Einstellungen klicken, sehen Sie alle verfügbaren Optionen (siehe Abbildung 10.11).

233

Sound einbinden

Abbildung 10.10: In der Registerkarte Flash können Sie die globalen Einstellungen vornehmen, die dann alle Sound-Dateien Ihres Films betreffen.

Abbildung 10.11: Sie können in den Einstellungen für Veröffentlichungen die Komprimierung für alle im Film enthaltenen Sounds festlegen.

In der folgenden Liste finden Sie eine Beschreibung zu jeder Option: 쐽

Deaktivieren ist schnell erklärt. Damit befehlen Sie Flash, keine Sounds zu exportie-

ren. Deshalb gibt es auch keine weiteren Optionen, wenn Sie diesen Wert auswählen.

234

Qualität und Dateigröße kontrollieren

쐽

ADPCM ist vergleichbar mit Raw (siehe unten), allerdings wird eine niedrige Komprimie-

rung unterstützt. Der einzige Grund, warum Sie diese Funktion verwenden sollten ist, wenn Sie den Film im Flash-3-Format abspeichern wollen. Ansonsten ist MP3 klar vorzuziehen. 쐽

Wenn Sie MP3 wählen, werden Sie eine großartige Komprimierung bei guter Qualität erhalten. Verändern Sie hier einfach die Bitrate (nach oben für bessere Qualität und nach unten für kleinere Dateien). Tasten Sie sich von oben nach unten vor und nehmen Sie die Rate, kurz bevor der Sound inakzeptabel wird.

쐽

Die neue Komprimierungs-Einstellung in Flash MX heißt Sprache. Wenn Sie diese Option verwenden, muss der Betrachter über einen Flash-6-Player verfügen. Hier wird die Komprimierung auf die menschliche Sprache angepasst. Allerdings sollten Sie (in Bezug auf Dateigröße und Qualität) die Option MP3 als Vergleich heranziehen.

쐽

Mit RAW bleibt der Sound so wie er ist (und leider auch so groß). Sie können allerdings die Dateigröße eines Stereosounds halbieren, indem Sie ihn auf Mono umschalten.

Sie sollten auch noch einen Blick auf das Feld Sound-Einstellungen übergehen werfen, denn wenn Sie das aktivieren, gelten die Einstellungen dieses Fensters auch, wenn etwas anderes über die Sound-Einstellungen für bestimmte Sounds angegeben wurde.

Individuelle Export-Einstellungen Zusätzlich zu den globalen Einstellungen kann jedes Soundobjekt in der Bibliothek mit eigenen Export-Einstellungen versehen werden. Doppelklicken Sie einfach auf einen Sound in der Bibliothek und Sie werden mit dem Fenster Soundeigenschaften konfrontiert (siehe Abbildung 10.12). Dieses Fenster erinnert sehr stark an die Export-Eigenschaften von Rastergrafiken. Hier werden Sie mit allen Einstellungen versorgt, die Sie auch in den globalen Export-Einstellungen für Sounds vornehmen können. Zusätzlich wird hier die Größe der exportierten Datei angezeigt und über die Testen-Schaltfläche erhalten Sie einen Eindruck vom komprimierten Sound. Über die Schaltflächen Aktualisieren und Importieren können Sie bequem Sounds ersetzen. Das macht beispielsweise dann Sinn, wenn Sie immer mit einem bestimmten Geräusch gearbeitet haben und nun eine besser passende Datei gefunden haben. So können Sie mit einem Klick die Soundverknüpfungen im ganzen Film auf die neue Datei umlenken. Das spart eine Menge Arbeit.

235

Sound einbinden

Abbildung 10.12: Hier werden SoundEinstellungen für einen einzelnen Sound vorgenommen. Dabei werden die globalen Einstellungen übergangen.

Tricks für mehr Effizienz Die beste Möglichkeit, Speicherplatz über Audio zu sparen ist, Sounds ganz zu vermeiden. Auch wenn das abwegig klingt, sollte man darüber nachdenken. Sie sollten sich zwingen, über die Notwendigkeit jedes einzelnen Sounds nachzudenken. Wenn für Ihren Film aber nichts dazu gewonnen wird, sollten Sie die Finger von dem Sound lassen, da nämlich auf jeden Fall unnötiger Speicherplatz belegt wird. Wenn Sie sich dann aber entschieden haben, dass der entsprechende Sound wirklich notwendig ist, können Sie die Dateigröße herunterdrücken. Dazu sollten Sie zuerst einmal Stille am Anfang und am Ende des Sounds löschen. Eine weitere Möglichkeit ist die Verwendung eines kurzen wiederholten Sounds anstelle eines langen linearen Geräusches. Damit das Ganze nicht zu monoton klingt, können Sie Ihre Animation mit ein paar zufällig wirkenden kurzen Sounds spicken. Das hört sich meist sehr interessant an. Die wohl subjektivste Frage ist allerdings, welchen Grad der Komprimierung man verwenden sollte. Vielleicht werden Sie denken, dass man Stimme weiter komprimieren kann als Musik. Das ist ein weit verbreitetes Missverständnis. Man kann aber eine andere Verallgemeinerung treffen: Sounds, die von natürlichen Geräuschen (und somit auch von herkömmlichen Instrumenten) erzeugt werden, sollten besser in hoher Qualität verbleiben, wogegen man synthetische Sounds weiter komprimieren kann. Zuletzt möchte ich noch darauf hinweisen, dass Monosounds klarer klingen als Stereo. Das heißt nicht, dass Sie niemals Stereo verwenden sollten. Allerdings können Sie Stereo-

236

Zusammenfassung

Dateien nicht so weit komprimieren wie Mono-Daten (was doppelt ins Gewicht fällt, da Stereo-Dateien doppelt so groß sind wie Mono-Dateien der gleichen Qualität und Länge). Prüfen Sie bitte ganz genau, ob Sie wirklich Stereo brauchen. Bedenken Sie, dass Sie einen Unterschied zwischen links und rechts auch ohne Stereo-Daten in Flash erzeugen können.

10.4 Zusammenfassung Flash unterstützt die Einbindung von Audio sehr elegant. Importieren Sie einfach die nötigen Sounds in Ihren Film und legen Sie fest, in welchen Schlüsselbildern welche Sounds abgespielt werden sollen. Dabei gibt es eine Menge Optionen, die das Abspielverhalten beeinflussen. Die »Kosten« für die Verwendung von Sound liegen im hohen Speicherbedarf. Aber auch dafür gibt es eine Hand voll Gegenmittel. Ich bin sicher, dass Sie in den meisten Fällen eine MP3-Komprimierung verwenden werden, da diese das beste Gleichgewicht zwischen Qualität und Dateigröße schafft. Ich hoffe, ich habe Sie nun ein wenig in Bezug auf die Verwendung von Audio sensibilisiert. Bitte verstehen Sie mich nicht falsch: Sounds sind ein wichtiges gestalterisches Mittel, aber denken Sie einfach genau nach, bevor Sie Sounds einsetzen. Ihr Publikum mit einer langsameren Verbindung wird es Ihnen danken.

10.5 Workshop F&A F

Ich habe einen langen Sound in das erste Schlüsselbild meines Films eingefügt. Wenn ich den Film aber teste, höre ich den Sound nur kurz, der dann sofort abbricht. Warum ist das so? A

F

Sie haben wahrscheinlich die Sync-Einstellung namens Stream verwendet. Wenn dann Ihr Film nicht so lang ist wie der Sound, wird dieser stumm geschaltet, sobald das Ende des Films erreicht ist. Ändern Sie die Sync-Einstellung einfach auf Ereignis und es wird funktionieren.

Ich habe einen Sound in das erste Bild meines Filmes eingefügt. Wenn ich den Film abspiele, höre ich allerdings nichts. Ich habe schon nachgesehen, dass die Lautsprecher eingesteckt sind und die eingestellte Lautstärke nicht zu niedrig ist. Was könnte es noch sein?

237

Sound einbinden

A

F

Ich habe einen MP3-Sound importiert und möchte sichergehen, dass er nicht erneut komprimiert wird, weil das die Qualität herabsetzen würde. Wie mache ich das? A

F

Sie können zwei Dinge überprüfen. Zuerst einmal sollte weder STEUERUNG / SOUND DEAKTIVIEREN aktiv sein, noch sollte die Hüllkurve des Sounds als horizontale Linie auf dem niedrigsten Niveau liegen. Als Zweites können Sie auch noch den importierten Originalsound prüfen, um sicher zu gehen, dass es sich nicht um Stille handelt.

Ganz einfach. Aktivieren Sie im Soundeigenschaften-Fenster des MP3-Sounds die Option Qualitätseinstellung des importierten MP3 verwenden.

Ich habe eine 61kb große MP3-Datei importiert, aber wenn ich den Film exportiere, wird er 900kb groß, ohne dass er irgendwelche aufwendigen Elemente beinhaltet, denn wenn ich den Sound entferne, ist die Datei nur noch 5kb groß. A

Hier haben Sie wahrscheinlich die falschen Komprimierungseinstellungen (zum Beispiel RAW) verwendet. Bitte prüfen Sie diese sowohl in den Einstellungen für Veröffentlichungen und im Soundeigenschaften-Fenster.

Quiz 1. Was ist das bessere Dateiformat für Originalsounds? AIF oder WAV? a.

AIF, da es für den Macintosh entwickelt wurde

b. WAV, da es noch neuer ist c. Weder noch, da beide die gleiche Qualität liefern können 2. Wo platziert man Sounds, damit man sie im fertigen Film hören kann? a.

In der Bibliothek, in Symbolen oder in Schlüsselbildern

b. In Schlüsselbildern (egal wo diese sind) c. Auf der Sound-Ebene 3. Wie kann man einen Sound dazu bringen, sich »ewig« zu wiederholen? a.

Das kann man nicht. Man sollte stattdessen eine sehr große Zahl in das Wdh-Feld eintragen. Das kommt einer Endlosschleife schon sehr nahe.

b. Mann schreibt unendlich in das Wdh-Feld. c. Stellen Sie sicher, dass die Sound-Datei die Buchstaben wdh im Dateinamen enthält.

238

Effektiv mit Ebenen

1 1

Effektiv mit Ebenen

Die meisten Leute denken, die Ebenen in Flash seien nur für das Anordnen visueller Elemente in verschiedenen Schichten zuständig. Das ist auch verständlich, da fast jedes Grafikprogramm solche Ebenen verwendet. Auch wenn die Ebenen in Flash den gleichen Effekt bringen, liegt doch ihr wahrer Wert nicht darin. Eine Ebene bietet nämlich eine eigene Zeitlinie. In diesem Kapitel werden Sie lernen, wie die Ebenen Sie beim Erstellen von Animationen unterstützen und wie Sie damit Objekte in unterschiedlichen Sicht-Ebenen anordnen können. Im Detail werden Sie in diesem Kapitel 쐽

Animationen über Ebenen steuern,

쐽

Ebenen-Eigenschaften verändern, um besondere Effekte zu erzielen und

쐽

Führungs-Ebenen, Pfade und maskierte Ebenen kennen lernen.

11.1 Wie Ebenen funktionieren Wenn Sie sich ein wenig mit Photoshop, Fireworks oder irgendeinem anderen Grafikprogramm auskennen, sind Sie mit Ebenen als Instrument für die Anordnung von visuellen Objekten in verschiedenen Schichten bereits vertraut. Wir haben auch schon gelernt, dass man Grafiken gruppieren kann und so verschiedene Anordnungen über- und untereinander festlegen kann. Wozu brauchen wir dann noch Ebenen?

Der wahre Zweck von Ebenen In Flash haben verschiedene Ebenen auch verschiedene Zeitlinien – und das macht sie eigentlich so wertvoll. Die Bilder in verschiedenen Ebenen werden zwar über oder unter anderen Ebenen angezeigt, allerdings ist das nicht die Hauptaufgabe der Flash-Ebenen. In verschiedenen Ebenen können Sie nämlich Animationen unterschiedlich steuern. Sicher haben Sie aus dem achten Kapitel behalten, dass man nur ein Objekt pro Ebene bewegungstweenen kann. Stellen Sie sich vor, Sie wollen zwei Kreise aufeinander zubewegen. Das funktioniert nur, indem Sie jeden Kreis in einer eigenen Ebene anzeigen. Lassen Sie uns zu Beginn mit etwas Einfachem starten:

Übung: Verwenden Sie zwei Ebenen, um zwei Kreise zu animieren In dieser Übung werden wir zwei Kreise über die Bühne bewegen, wobei der eine schneller ist als der andere.

240

Wie Ebenen funktionieren

1. Zeichnen Sie in einer neuen Datei einen Kreis, wählen Sie diesen aus und konvertieren Sie ihn in ein Symbol. Nennen Sie das neue Symbol Kreis und lassen Sie das Standardverhalten Movieclip unverändert. Klicken Sie auf OK. 2. Mit dieser Instanz auf der Bühnen können Sie nun einen Bewegungstween erstellen. Damit es später nicht zu kompliziert wird, sollten Sie die Ebene Schnell nennen, da sich dieser Kreis gleichmäßig schnell bewegen soll. Um eine Ebene umzubenennen, können Sie einmal auf die gewünschte Ebene klicken, um sie zu fokussieren und danach auf den Namen der Ebene doppelklicken, damit Sie den neuen Namen eintragen können. Man kann auf jedes interaktive Element (Schaltflächen, Felder ...) einen Fokus richten. In einem Online-Formular kann immer nur ein Element zur gleichen Zeit den Fokus erhalten. Wenn Sie etwas auf der Tastatur eingeben, erscheint der Text in dem Element, das gerade fokussiert ist. Immer wenn Sie in normalen Windows-Programmen (ÿ) drücken, springt der Fokus ein Feld weiter. In Flash ist (ÿ) für das Ein-/Ausblenden der Bedienfelder vorgesehen. Genauso können auch die Bedienelemente von Flash fokussiert werden. Eine Ebene, die den Fokus erhalten hat, erkennen Sie beispielsweise an der geschwärzten Darstellung. 3. Da bisher nur ein Bild in der Zeitleiste eingetragen wurde, sollten Sie den Kreis an der linken Seite der Bühne positionieren. Danach klicken Sie auf Bild 30 in der Ebene Schnell und fügen dort ein Schlüsselbild ein. 4. Stellen Sie sicher, dass der Abspielkopf auf Bild 30 zeigt und ziehen Sie den Kreis auf die andere Seite der Bühne. 5. Erzeugen Sie im Schlüsselbild 1 einen Bewegungstween. 6. Lassen Sie uns nun eine weitere Ebene erzeugen. Dazu können Sie entweder EINFÜGEN / EBENE wählen oder die Schaltfläche Ebene einfügen betätigen (siehe Abbildung 11.1). Bevor Sie es vergessen, sollten Sie die Ebene mit dem Namen Langsam versehen (siehe Schritt 2). 7. Von nun an sollten Sie immer ganz sicher sein, wo Sie sich gerade befinden und welche Ebene Sie gerade bearbeiten. Sie können immer nur in einer Ebene zur gleichen Zeit sein – und das ist die mit dem Bleistiftsymbol hinter dem Namen (siehe Abbildung 11.2). 8. Jetzt werden wir die Instanz des Kreises aus der Schnell-Ebene kopieren und in die Ebene Langsam einfügen. Klicken Sie auf den Kreis. Da er sich in der Ebene Schnell befindet, wird diese Ebene aktiviert (der Bleistift steht nun bei Schnell). Der Kreis wird ausgewählt. Drücken Sie (Strg)+(C), um die Instanz zu kopieren. Jetzt müssen Sie wieder in die Ebene Langsam wechseln (auf den Namen klicken) und den Kreis dort per (Strg)+(V) einfügen. Positionieren Sie den neuen Kreis auch auf der linken Seite der Bühne (aber bitte nicht so, dass er den ersten Kreis verdeckt).

241

Effektiv mit Ebenen

Abbildung 11.1: Mit der Schaltfläche Ebene einfügen

kann man am schnellsten eine neue Ebene erzeugen.

Abbildung 11.2: Das Bleistiftsymbol gibt an, welche Ebene im Moment aktiv ist (in diesem Fall die Ebene Langsam).

9. Damit Sie klarer sehen, können Sie die Instanz des Kreises in der Ebene Langsam einfärben (über Farbton im Eigenschaften-Bedienfeld). 10. Fügen Sie nun in der Ebene Langsam bei Bild 30 ein Schlüsselbild ein und bewegen Sie dort den zweiten Kreis nach rechts (aber nicht so weit wie den ersten).

242

Wie Ebenen funktionieren

11. Erzeugen Sie im ersten Bild der Ebene Langsam einen Bewegungstween und testen Sie den Film. Sie sehen zwei Kreise, die sich gleichzeitig, aber mit unterschiedlicher Geschwindigkeit bewegen. Lassen Sie diese Datei für die nächste Übung geöffnet. Die frühere Beschreibung sollte nicht den Anschein erwecken, dass man Ebenen vermeiden sollte. Im Gegenteil – erstellen Sie so viele Ebenen wie Sie brauchen, auch wenn es nur um die Anordnung von Objekten geht. Auch wenn eine Flash-Datei mit vielen Ebenen ein wenig mehr Zeit beim Öffnen brauchen wird, werden alle Ebenen beim Export in einer .swf-Datei zusammengefügt. Dadurch entstehen also keine zusätzlichen Daten. Die Ebenen sind nicht nur für die Organisation und die Anordnung von Objekten gut, sondern absolut notwendig für Animationseffekte.

Ebenen-Einstellungen, die Ihnen beim Editieren helfen Wir haben schon gesehen, wie das Bleistiftsymbol anzeigt, welche Ebene gerade bearbeitet wird. Allerdings zeigen auch andere Symbole in der Zeitleiste an, welche Eigenschaften eine Ebene hat. Betrachten Sie die Abbildung 11.3 für einen kurzen Überblick bezüglich der Eigenschaften. Wir werden sie gleich im Detail besprechen.

Abbildung 11.3: Ebenen-Eigenschaften, die man verändern kann

In Abbildung 11.3 sehen Sie so gut wie jede Variation von Ebenen-Eigenschaften. Wenn Sie auf die Ebene rechtsklicken und dann Eigenschaften wählen, können Sie Veränderungen vornehmen. Hier folgt eine kurze Einführung in jede einzelne Möglichkeit:

243

Effektiv mit Ebenen

쐽

Bei Name können Sie die Ebene umbenennen.

쐽

Mit Einblenden haben Sie die Möglichkeit, die Ebene zu verstecken oder wieder anzuzeigen. Diese Option steht Ihnen auch in der Zeitleiste zur Verfügung und wird durch ein Augen-Symbol kenntlich gemacht.

쐽

Wenn Sie Sperren aktivieren, können Sie in der entsprechenden Ebene nichts zeichnen. Durch einen erneuten Klick wird sie wieder zur Bearbeitung freigegeben.

쐽

Mit der Option Ebene als Kontur anzeigen können Sie die Ansicht der Ebene auf ein Minimum reduzieren. Die Ebene verhält sich fast wie ausgeblendet, allerdings sind die Umrisse der Objekte noch zu sehen.

쐽

Wenn Sie Normal aktivieren, verhält sich die Ebene (wie der Name schon sagt) ganz normal. Das ist auch die Standardeinstellung.

쐽

Nicht mehr normal ist dann schon die Option Führungs-Ebene, denn hier können Sie hineinzeichnen, was Sie wollen. Dabei handelt es sich meist um Figuren, die bei der Ausrichtung behilflich sind, denn alles was hier abgelegt wird, erscheint nicht im späteren Film.

쐽

Wenn Sie auf eine Ebene rechtsklicken, können Sie Pfad hinzufügen auswählen. Die Ebene erhält dann eine Zusatz-Ebene, die als Pfad gekennzeichnet ist.

쐽

Die ursprüngliche Ebene (der Sie den Pfad hinzugefügt haben) ist dann eine am Pfad entlang geführte Ebene. Das wird durch die Option Ausgerichtet kenntlich gemacht.

쐽

Wenn Sie die Einstellung Maske auswählen, können Sie in der Ebene beliebige Formen und Nicht-Flimsequenz-Symbole einfügen, die bestimmen, welcher Teil einer maskierten Ebene sichtbar oder nicht sichtbar ist.

쐽

Durch Maskiert können Sie dann letztlich festlegen, dass diese Ebene durch eine solche Maske betrachtet werden soll.

쐽

Eine Ordner-Ebene kann keinen Inhalt auf der Bühne beinhalten, dafür kann sie aber andere Ebenen beherbergen und sorgt so für mehr Übersicht.

Manche der Ebenen in Abbildung 11.3 lassen sich mit einem Klick erzeugen. Andere wiederum benötigen eine Vielzahl von Schritten. Wir werden uns im weiteren Verlauf dieses Kapitels noch mit Führungs-Ebenen und Masken beschäftigen. Für den Anfang sollten wir jedoch mit leichteren Einstellungen beginnen. Wenden wir uns also dem Anzeigen/Verstecken, Sperren/Entsperren und dem Anzeigen als Konturen zu.

Übung: Experimentieren Sie mit dem Verstecken und der Konturenansicht von Ebenen 1. Öffnen Sie die Datei aus der letzten Übung und schauen Sie sich die Animation erneut an, damit Sie sich erinnern, wie sie aussah.

244

Wie Ebenen funktionieren

2. Woher weiß man, welcher Kreis in welcher Ebene liegt? Wenn Sie sich überschneiden, liegt einer über dem anderen. Stellen Sie den Abspielkopf auf Bild 1 ein. Wenn Sie nur auf den Bildschirm sehen, werden Sie nicht feststellen können, welcher Kreis zu welcher Ebene gehört. Man könnte versuchen, anhand der Namen der Ebenen eine Aussage zu treffen, aber Schnell und Langsam sind nicht wirklich aussagekräftig. Besonders schwierig wird es, wenn Sie nur ein Standbild betrachten. Um ein wenig mehr Durchblick zu bekommen, können Sie kurzzeitig einzelne Ebenen ausblenden. Wenn Sie also auf das Auge über den Ebenen klicken, werden alle auf einmal ausgeblendet. Ein erneuter Klick macht alle Ebenen wieder sichtbar. Wenn Sie aber nur eine einzige Ebene verstecken wollen, klicken Sie einfach auf den Punkt unter dem Auge, der zur entsprechenden Ebene gehört. Sie werden nicht nur ein rotes X an der Stelle sehen, an der zuvor noch der Punkt war, sondern der Inhalt der Ebene wird (solange Sie das X per Klick nicht wieder entfernen) ausgeblendet. Mit dieser Methode können Sie herausfinden, was sich in bestimmten Ebenen befindet, da man sie einzeln ausblenden kann. 3. Blenden Sie wieder alle Ebenen ein, damit Sie die Kreise auf einem anderen Weg unterscheiden können. Diesmal verwenden Sie Konturen. Wenn Sie auf das Quadrat oberhalb der Ebenen klicken, werden die Inhalte aller Ebenen als Konturen angezeigt (siehe Abbildung 11.4). Da sich unsere Kreise in verschiedenen Ebenen befinden, werden sie in unterschiedlichen Farben angezeigt, die Sie neben den Ebenennamen wiederfinden.

Abbildung 11.4: Die Inhalte von Ebenen können als Konturen angezeigt werden.

245

Effektiv mit Ebenen

4. Sollten die Konturen in der gleichen Farbe angezeigt werden, können Sie in den Ebeneneigenschaften (Doppelklick auf die Ebene) die KONTURFARBE einstellen (siehe Abbildung 11.5). Wenn Sie nun wieder die Bühne betrachten, werden die Kreise unterschiedliche Farben haben.

Abbildung 11.5: Man kann alle Ebeneneigenschaften

im gleichnamigen Fenster bearbeiten.

Ebenen verwalten In Flash MX wurde ein neues Verwaltungssystem eingeführt: die Ebenen-Ordner. Oberflächlich gesehen ist das ein recht geradliniges Konzept, denn auf diese Weise kann man zum Beispiel 100 Ordner, die für unterschiedliches Tweening einer komplexen Animation benötigt werden, in einem Ordner verstecken und auf einen Klick ein- und ausblenden. Sie erstellen einen Ebenen-Ordner, indem Sie auf die Schaltfläche Ebenen-Ordner einfügen weiter rechts neben der Schaltfläche Ebene einfügen unten links in der Zeitleiste klicken. Auch wenn ich den Ebenen-Ordnern nicht eine ganze Übung widmen möchte, werde ich hier ein paar interessante Funktionen zu diesem Thema erwähnen. Wenn es Sinn macht, einzelne Ebenen ein- oder auszublenden, wäre es doch noch besser, das mit mehreren Ebenen durchführen zu können. Mit Ebenen-Ordnern geht das. Stellen Sie sich vor, Sie haben ein recht kompliziertes Konstrukt auf mehrere Ebenen verteilt und in einem Ebenen-Ordner zusammengefasst. Dann genügt beispielsweise ein Klick auf die Ihnen bekannte Schaltfläche, um alle Ebenen in Konturen anzuzeigen.

246

Ebenen-Eigenschaften für visuelle Effekte

Bisher haben Sie zum Thema Ebenen also Folgendes gelernt: Mit zusätzlichen Ebenen kann man mehr als nur ein Objekt animieren. Besonders für Bewegungstweens ist das interessant, denn wenn Sie zwei Objekte gleichzeitig per Bewegungstween animieren wollen, müssen Sie diese in verschiedenen Ebenen unterbringen. Außerdem haben Sie gelernt, wie man mit den Ebenen-Eigenschaften die einzelnen Ebenen modifizieren kann. Mit den Optionen Anzeigen/Verstecken, Sperren/Entsperren und der Konturenansicht kann man schnell herausfinden, welche Objekte in welcher Ebene angesiedelt sind. Denken Sie bitte daran, dass alle bisher besprochenen Einstellungen (auch Ordner-Ebenen) keinerlei Einfluss auf die fertige Animation haben. Der Betrachter wird ausgeblendete Ebenen genauso sehen, wie auch Ebenen in der Konturenansicht für ihn mit allen Füllungen erscheinen werden. Die Einstellungen sind nur für Sie (den Autor) interessant.

11.2 Ebenen-Eigenschaften für visuelle Effekte Die drei verbleibenden Ebenenarten (Führungs-Ebenen, Pfade und Masken) sind sehr mächtig. Im Gegensatz zu den bisher besprochenen Einstellungen haben diese Ebenentypen Auswirkungen auf das, was das Publikum später sehen wird. Allerdings ist die Verwendung dieser Ebenen-Eigenschaften etwas komplizierter, als nur ein Symbol in der Zeitleiste anzuklicken. Wenn Sie allerdings erleben, was mit diesen Einstellungen möglich ist, werden Sie schnell erkennen, warum sich der zusätzliche Aufwand lohnt.

Führungs-Ebenen Wenn Sie den Film veröffentlichen oder exportieren, werden die Führungs-Ebenen automatisch unsichtbar. Ich habe gerade gesagt, dass sich die nun beschriebenen Ebenen auf das Endergebnis auswirken. Das erste Thema, das wir nun betrachten, ist, dass etwas unsichtbar wird. Trotzdem sind diese Ebenen sehr nützlich, denn auch wenn man nichts von ihnen sieht, können sie doch das Gesamtbild des Filmes positiv verändern. Warum sollte es Sinn manchen, etwas zu zeichnen, das gar nicht mitexportiert wird? Meist werden Führungs-Ebenen dazu eingesetzt, Objekte zu positionieren, die an mehreren Stellen im Film auftauchen sollen. Stellen Sie sich einen Titel vor, der mehrfach auftauchen soll. Dazu zeichnen Sie eine Linie in die Führungs-Ebene und können die verschiedenen Titeltexte immer an der gleichen Linie ausrichten. Die Linie selbst wird der Betrachter aber nie zu Gesicht bekommen. Ein anderer Grund für den Einsatz dieser Ebenen kann die Dokumentation sein. Wenn Sie beispielsweise einem anderen Designer, der auch an Ihrer Datei arbeitet, etwas über einen Text mitteilen wollen, so können Sie diesen Text in eine Führungs-Ebene schrei-

247

Effektiv mit Ebenen

ben, da sie den fertigen Film nicht beeinflusst und nur von Personen mit Zugriff auf die Flash-Datei gesehen werden kann. Außerdem kann es durchaus passieren, dass Sie sich kurz vor Fertigstellung des Films entscheiden, eine einzelne Animation zu löschen. Bevor Sie aber die Animation für immer entfernen, sollten Sie lieber die betreffende(n) Ebene(n) zu Führungs-Ebenen ernennen. So haben Sie jederzeit wieder Zugriff auf die Animation, die für den Betrachter plötzlich nicht mehr existiert.

Übung: Verwenden Sie eine Führungs-Ebene, um den Bereich außerhalb der Grenzen zu definieren Angenommen, wir wollen eine Präsentation erstellen, in der einerseits Text vorkommt und andererseits ein Rahmen animiert werden soll. Der Text soll den Rahmen aber nicht berühren. Dabei kann uns eine Führungs-Ebene sehr behilflich sein. 1. Zeichnen Sie in einer neuen Datei ein ausgefülltes Rechteck in der Größe der Bühne. Verwenden Sie dann das Stift-Werkzeug, um eine unregelmäßige Figur in das Rechteck zu zeichnen. Wählen Sie die mittlere Füllung aus und löschen Sie diese (siehe Abbildung 11.6). Wählen Sie nun die ganze Form aus und konvertieren Sie diese in ein Symbol, das Sie Rahmenform nennen können. Nennen Sie diese Ebene Registrierung, da sie unsere Führungs-Ebene wird.

Abbildung 11.6: Dies wird unsere Führungs-Ebene.

2. Fügen Sie eine neue Ebene namens Rahmen ein. Hier soll eine Kopie der Rahmenform zu einem späteren Zeitpunkt im Ablauf des Films in Position gebracht werden, damit ich die Funktion von Führungs-Ebenen besser demonstrieren kann. Wählen Sie zuerst

248

Ebenen-Eigenschaften für visuelle Effekte

die Rahmenform in der Ebene Registrierung und kopieren Sie diese ((Strg) +(C)).Wählen Sie dann Bild 25 in der Ebene Rahmen aus und fügen Sie hier ein Schlüsselbild ein. Stellen Sie sicher, dass Sie sich in der Ebene Rahmen befinden (falls nicht, klicken Sie einfach auf den Namen) und fügen Sie die Rahmenform an der gleichen Position in Bild 25 ein ((Strg)+(ª)+(V)). 3. Klicken Sie auf Bild 35 in der gleichen Ebene und fügen Sie ein weiteres Schlüsselbild ein. Stellen Sie den Abspielkopf nun wieder zurück auf Bild 25 und skalieren Sie die Rahmenform so groß, dass man den Rand auf der Bühne nicht sehen kann (siehe Abbildung 11.7). Erzeugen Sie abschließend in Bild 25 einen Bewegungstween.

Abbildung 11.7: An dieser Stelle (Bild 25) soll zum ersten Mal der Rahmen erscheinen. Wir vergrößern ihn so weit, dass fast die ganze Bühne zu sehen ist. Dann wird er von außen nach innen eingeblendet.

4. Klicken Sie auf Bild 35 der Ebene Registrierung. Fügen Sie dort mit (F5) ein Bild ein, damit diese Ebene genauso lang besteht wie die anderen. Stellen Sie nun die Ansicht dieser Ebene auf Konturenansicht um (indem Sie auf das Kästchen neben dem Ebenennamen klicken). Verwenden Sie die Schrubbertechnik, um zu erkennen, dass die Kontur der Führungs-Ebene genau anzeigt, bis wohin der Rahmen am Ende reichen wird. Damit können wir nun verhindern, dass sich Text und Rahmen in die Quere kommen. Wenn Sie allerdings den Film testen, werden Sie sehen, dass die Ebene Registrierung die ganze Zeit sichtbar ist. Das ist im Moment auch noch richtig so, da wir bisher die Ebene noch nicht in eine Führungs-Ebene umgewandelt haben. 5. Das werden wir nun ändern, indem wir die Ebenen-Eigenschaften von Registrierung öffnen und den Modus Führungs-Ebene aktivieren. Sie sollten die Ebene an dieser Stelle auch sperren und die Option Als Konturen anzeigen aktivieren.

249

Effektiv mit Ebenen

6. Erstellen Sie nun eine neue Ebene, die Sie Text nennen. 7. Im ersten Bild der Text-Ebene erstellen wir nun einen Textblock mit großer Schrift (etwa 40). Schreiben Sie nun so viel Text, wie in den Rahmen hineinpasst und achten Sie darauf, dass Sie den Rand nicht überschreiben (siehe Abbildung 11.8).

Abbildung 11.8: Durch die Konturenansicht der Führungs-Ebene können wir den Text sehr genau formatieren, ohne die Ränder zu berühren.

8. Testen Sie den Film und stellen Sie gegebenenfalls die Option IN SCHLEIFE LEN aus dem Menü STEUERUNG beim Abspielen aus.

ABSPIE-

In der letzten Übung haben wir eine Führungs-Ebene verwendet, um einen gesperrten Bereich zu markieren. Das kann Ihnen später noch öfter von Nutzen sein, wenn Sie beispielsweise Schaltflächen erstellen, die sich stark vergrößern, wenn man mit der Maus darüber fährt oder wenn ein Menü aufklappen soll. In diesen Fällen wollen Sie wahrscheinlich nicht, dass andere Elemente dadurch verdeckt werden. Sie können dann einfach den größten Zustand einer Schaltfläche in eine Führungs-Ebene kopieren und schon wissen Sie immer, wo Sie noch freie Bahn haben und wo nicht.

Pfade Wenn Führungs-Ebenen nützlich sind, sind Pfade unverzichtbar! Eine Pfad-Ebene ist eigentlich eine normale Führungs-Ebene, die eine untergeordnete Ebene besitzt, welche sich im Modus Ausgerichtet befindet. Das Geniale ist, dass Sie in der Pfad-Ebene eine beliebige Linie zeichnen und dann in der ausgerichteten Ebene einen Bewegungstween

250

Ebenen-Eigenschaften für visuelle Effekte

erstellen können, der genau der Linienform des Pfades folgt. Eine Pfad-Ebene wird (genau wie eine Führungs-Ebene) für das Publikum unsichtbar sein. Wer will auch schon vorher wissen, wie sich ein Objekt bewegt? Merken Sie sich bitte, dass für diese Technik zwei Ebenen benötigt werden: Die Pfad-Ebene und die ausgerichtete Ebene, die dem Pfad folgen soll.

Übung: Verwenden Sie einen Pfad, um einen springenden Ball zu simulieren 1. Zeichnen Sie in einer neuen Datei eine Kurve wie in Abbildung 11.9. Diesem Pfad soll der Ball später folgen. Sie können dazu gerade Linien zeichnen, die Sie verbiegen und dann zusammendocken. Sie sollten nur sicherstellen, dass es sich um eine durchgehende Linien handelt.

Abbildung 11.9: Eine einfache Linie wird als Pfad für den Ball verwendet.

2. Öffnen Sie nun die Ebenen-Eigenschaften (per Doppelklick auf die Ebene). 3. Nennen Sie die Ebene Pfad und sperren Sie diese, damit Sie die Linie nicht weiter verändern können. Stellen Sie außerdem die Art der Ebene auf Führungs-Ebene. 4. Fügen Sie eine neue Ebene ein und nennen Sie diese Ball. 5. Im Normalfall wird die Ball-Ebene über der Pfad-Ebene liegen. Jetzt werden wir diese Ebene am Pfad ausrichten, damit sich der Ball genau über den Pfad bewegt. Es gibt zwei Anforderungen an eine ausgerichtete Ebene: Sie muss genau unter dem Pfad lie-

251

Effektiv mit Ebenen

gen und die Ebenen-Eigenschaft muss auf Ausgerichtet stehen. Die Anordnung der Ebene kann man verändern, indem man auf die Ebene klickt und sie bei gedrückter Maustaste verschiebt. Schieben Sie die Ball-Ebene also unter die Pfad-Ebene. 6. Sie haben nun nicht nur die Anordnung der Ebenen verändert, sondern zusätzlich noch die ehemalige Führungs-Ebene in eine echte Pfad-Ebene verwandelt (Das sieht man am Pfeil-Symbol neben dem Ebenennamen). Die beiden Ebenen werden nur noch durch eine gestrichelte Linie getrennt (siehe Abbildung 11.10), was Ihnen zeigen soll, dass die beiden enger verbunden sind als andere (denn die eine Ebene stellt ja den Pfad für die andere zur Verfügung). Vielleicht ist die letzte Aktion für Sie nicht so einleuchtend gewesen, oder Sie wollen nicht, dass Flash Ihnen die ganze Arbeit abnimmt und selbstständig die Ebenen-Eigenschaften anpasst. Deshalb können Sie den letzten Schritt mit BEARBEITEN / RÜCKGÄNGIG wieder zurücknehmen und einen anderen Weg einschlagen.

Abbildung 11.10: Die Pfad-Ebene hat ein eigenes Symbol erhalten und die BallEbene wurde verknüpft.

7. Dieses Mal werden wir die Pfad-Ebene über die Ball-Ebene ziehen. Außer der Anordnung der Ebenen verändert sich jetzt nichts. Wir können aber auch nicht die Führungs- in eine Pfad-Ebene verwandeln (was wir im Endeffekt ja wollen), allerdings können wir die Ball-Ebene in den Ausgerichtet-Zustand versetzen, da sie sich jetzt unter der späteren Pfad-Ebene befindet. Öffnen Sie also per Doppelklick die Ebeneneigenschaften der Ball-Ebene und stellen Sie Ausgerichtet ein. 8. Jetzt werden wir die eigentliche Animation erstellen und den Ball direkt mit dem Pfad verknüpfen. Zeichnen Sie dazu in der Ball-Ebene einen Kreis im ersten Bild und wandeln Sie ihn in ein Symbol um. Nennen Sie es Bild des Balls. Fügen Sie nun in der gleichen Ebene bei Bild 50 ein Schlüsselbild ein. Beachten Sie, dass die Pfad-Ebene nicht so lange existiert. Fügen Sie dort im Bild 50 ein normales Bild ein (F5). Erzeugen Sie nun im ersten Bild der Ball-Ebene einen Bewegungstween. 9. Es gibt noch einen letzten Schritt, den Sie unternehmen müssen, um den Ball auf den richtigen Pfad zu bringen: Sie müssen den Ball in beiden Schlüsselbildern an den Pfad ankoppeln. Koppeln Sie also im ersten Bild die Mitte des Balls an das linke Ende des Pfades und im letzten Bild an das rechte Ende des Pfades. Testen Sie den Film. Der Ball wird dem Pfad von links nach rechts folgen.

252

Ebenen-Eigenschaften für visuelle Effekte

Die meiste Zeit haben Sie bei dieser Übung wohl für die Anordnung von Ebenen gebraucht. Wenn wir es noch einmal betrachten, haben wir nur einen Pfad gezeichnet und ein Symbol in einer anderen Ebene erstellt. Dann wurden die Ebenen verknüpft und das Symbol wurde in zwei als Bewegungstween verbundenen Schlüsselbildern an die Enden des Pfades angekoppelt. Lassen Sie uns schnell noch über eine andere Sache in Bezug auf Pfade sprechen: Das Einegschaften-Bedienfeld eines Bewegungstweens enthält die Option An Pfad ausrichten.

Der Effekt, den Sie damit erreichen können ist, dass sich ein Objekt, welches einem Pfad folgt, immer in die Bewegungsrichtung dreht. Ändern Sie dazu die Form des Kreises ein wenig, um diesen Effekt auszuprobieren (bei einem runden Symbol kann man eine Drehung schlecht erkennen). Ich habe Ihnen bisher bewusst nichts von der Schaltfläche Pfad-Ebene hinzufügen gesagt, die sich neben der Schaltfläche Ebene einfügen befindet (siehe Abbildung 11.11), denn hier werden mehrere Schritte auf einmal erledigt. In der vorausgegangenen Übung sollten Sie aber mit den einzelnen Schritten genau vertraut gemacht werden, wofür sich die »Abkürzung« über die Schaltfläche nicht eignet. Wenn Sie beispielsweise schon den Ball in eine eigene Ebene gezeichnet haben, können Sie diese Ebene fokussieren und auf Pfad-Ebene hinzufügen klicken. Nun wird über der Ball-Ebene automatisch eine PfadEbene erzeugt, die schon mit der unteren Ebene verknüpft ist. Die Ball-Ebene wird außerdem automatisch in den Ausgerichtet-Zustand versetzt.

Abbildung 11.11: Mit der Schaltfläche Pfad-Ebene hinzufügen kann man mehrere Schritte auf einmal erledigen.

Maskieren Wenn Führungs-Ebenen nützlich und Pfade unverzichtbar sind, kann man Maskierungen ruhigen Gewissens als unglaublich bezeichnen! Es handelt sich wirklich um einen ganz anderen Effekt. Die einzige Gemeinsamkeit liegt darin, dass es sich bei einer Maskierung um eine Ebenen-Eigenschaft handelt, für die man mindestens zwei Ebenen benötigt. Der

253

Effektiv mit Ebenen

grafische Inhalt einer Maske gibt an, was von einer maskierten Ebene durchscheint. Es ist, als ob Sie die Löcher zeichnen würden, die angeben, wo man durch die Maske hindurchsehen kann. Grundsätzlich können Sie sich hier so orientieren wie beim Gespann Pfad und ausgerichtete Ebene. Hier erzeugen Sie allerdings zuerst eine Ebene, die Sie über die Ebeneneigenschaften als Maske definieren. Danach stellen Sie die Maskiert-Option für die darunter liegende Ebene ein. Sie werden den Effekt aber erst sehen, wenn Sie den Film testen oder alle einbezogenen Ebenen sperren.

Übung: Scheinwerfer-Effekt mit Maskierung 1. Lassen Sie uns zuerst den Scheinwerfer mit seiner Bewegung erstellen. Zeichnen Sie dazu in einer neuen Datei einen ausgefüllten Kreis, den Sie in ein Filmsequenz-Symbol namens Spot umwandeln. 2. Nennen Sie die Ebene, in der sich der Spot befindet Spot-Bewegung. 3. Erzeugen Sie Schlüsselbilder in den Bildern 10, 20 und 30. Bewegen Sie den Spot in Bild 10 auf eine andere Position und in Bild 20 auf eine wiederum verschiedene Position. Lassen Sie Bild 1 und 30 identisch. 4. Erzeugen Sie in den Bildern 1, 10 und 20 je einen Bewegungstween. 5. Wechseln Sie nun in die Ebenen-Eigenschaften und stellen Sie das Verhalten der Ebene auf Maske um. 6. Beobachten Sie, wie sich das Symbol neben dem Namen der Ebene in das MaskenSymbol verwandelt (siehe Abbildung 11.12). Sperren Sie diese Ebene, damit wir nicht versehentlich etwas ändern.

Abbildung 11.12: Unsere Masken-Ebene wird nun mit einem gesonderten Maskensymbol markiert.

7. Nun können wir darunter eine weitere Ebene einfügen, deren Verhalten wir auf Maskiert stellen. Fügen Sie nun eine neue Ebene ein, die im Normalfall oberhalb unserer Masken-Ebene erscheint. Das ist soweit noch akzeptabel. Nennen Sie die neue Ebene Gebäude.

254

Ebenen-Eigenschaften für visuelle Effekte

8. Damit die neue Ebene maskiert wird, müssen wir sie zuerst unter die Masken-Ebene ziehen. Meist wird sie dabei schon in eine maskierte Ebene umgewandelt (siehe Abbildung 11.13). Man kann diese Einstellung natürlich auch von Hand über die Ebeneneigenschaften vornehmen.

Abbildung 11.13: Die maskierte Ebene Gebäude erhält ebenfalls ein gesondertes Symbol.

9. Zeichnen Sie in der Gebäude-Ebene viele Rechtecke in verschiedenen Farben, um Gebäude zu simulieren. 10. Die Animation sollte schon funktionieren, wenn Sie den Film testen oder alle Ebenen sperren. Setzen Sie nun die Hintergrundfarbe des Filmes auf Schwarz (MODIFIZIEREN / DOKUMENT). 11. Auch wenn das jetzt schon gut aussieht, fehlt noch etwas: Es ist die Art, wie ein Scheinwerfer aussieht, wenn er auf leere Stellen trifft. Der schwarze Hintergrund ist einfach zu dunkel. Lassen Sie uns eine weitere Ebene mit einer abgeschwächten Version der Gebäude erzeugen, um die Animation glaubwürdiger zu machen. 12. Zuerst sollten Sie alle Rechtecke markieren und in ein Filmsequenz-Symbol namens Gebäudegrafik konvertieren (die Ebene muss dazu entsperrt sein). 13. Erzeugen Sie eine neue Ebene, die Sie dunkle Gebäude nennen. 14. Ziehen Sie die neue Ebene unter die anderen. Diese Ebene soll aber nicht maskiert sein. Stellen Sie deshalb das Verhalten in den Ebeneneigenschaften gegebenenfalls auf Normal. 15. Kopieren Sie die Gebäudegrafik mit (Strg)+(ª)+(V) an dieselbe Stelle in die neue Ebene. Verstecken Sie alle Ebenen bis auf dunkle Gebäude, damit wir sicher sein können, welche wir gerade bearbeiten. Stellen Sie nun über das Eigenschaften-Bedienfeld die Helligkeit auf -40% ein. 16. Das sieht doch super aus, oder? Wir hätten die dunklen Gebäude nicht erstellen müssen, um mehr über den Maskeneffekt zu lernen, aber es verleiht der Animation einen viel glaubwürdigeren Eindruck.

255

Effektiv mit Ebenen

Es gibt einige Dinge, die man mit Masken nicht lösen kann: Man kann nicht mehr als ein Symbol in einer Masken-Ebene verwenden. Wenn Sie beispielsweise zwei Kreise animieren wollen, stellen Sie sicher, dass diese per MODIFIZIEREN / TEILEN bearbeitet worden sind. Außerdem kann man keine Pfade und Masken kombinieren. Es ist also nicht möglich, unseren springenden Ball als Maske für den Scheinwerfereffekt zu verwenden. Und: Das Filmsequenz-Symbol verhält sich wie ein Grafiksymbol, wenn es als Maske dient (was das genau heißt, werden wir in Kapitel 12 sehen). Wir haben gerade die Maske bewegt und so einen Spot simuliert. Manchmal macht aber auch der umgekehrte Weg Sinn. Stellen Sie sich das Innere eines Flugzeuges vor. Wenn Sie draußen Wolken vorbeiziehen lassen wollen, sollten Sie einfach die Maske des Fensters unbeweglich stehen lassen und die Wolken in der maskierten Ebene bewegen. Sicher würde das auch anders gehen, indem Sie beispielsweise das Innere des Flugzeuges so gestalten, dass alles aus Objekten besteht und nur das Fenster frei bleibt, aber mit einer Maskenkonstruktion können Sie viel schneller und effizienter arbeiten. Die Maskierung hat also unglaubliches Potenzial im Hinblick auf visuelle Effekte.

11.3 Zusammenfassung Wir haben eine Menge zum Thema Ebenen kennen gelernt. Solche Ebenen lassen sich für weit mehr einsetzen als das Anordnen von Objekten in verschiedenen Schichten. Eine wichtige Gegebenheit ist, dass man nur einen Bewegungstween pro Ebene erzeugen kann. Wenn Sie also mehr Animationen einfügen wollen, benötigen Sie weitere Ebenen. Außerdem haben wir Ebenen-Eigenschaften besprochen. Wir haben gelernt, wie man einzelne oder alle Ebenen ausblendet, sperrt oder als Kontur anzeigt. Diese Eigenschaften kann man direkt über die Zeitleiste steuern. Über Führungs-Ebenen kann man Inhalte für die Konstruktion eines Films anlegen, die aber im fertigen Film nicht erscheinen. Wir haben Objekte an Pfaden entlang bewegt und zum Schluss eine Maske erstellt, die bestimmte Teile einer maskierten Ebene sichtbar macht oder versteckt.

256

Workshop

11.4 Workshop F&A F

Ich habe eine Ebene als Maske und eine als maskierte Ebene definiert. Wenn ich nun eine neue Ebene einfüge wird diese automatisch zu einer maskierten Ebene. Sobald ich diese aber in eine normale Ebene umwandle, wird auch die andere maskierte Ebene normal. Was passiert hier? A

F

Warum ist der Modus, den ich meiner Ebene zuweisen will, deaktiviert? A

F

Für den Maskierungseffekt sind zwei verbundene Ebenen (eine Maske und eine maskierte Ebene) nötig, wobei die Maske über der maskierten Ebene sein muss. Wenn sich Ihre neue Ebene nun zwischen den beiden alten Ebenen befindet, wird sie logischerweise zu einer maskierten Ebene, und bei einer Umwandlung zu einer normalen Ebene ist die zweite maskierte Ebene nicht mehr direkt unter der Maske. Das hat zur Folge, dass auch diese Ebene normalisiert wird. Lösen Sie derartige Probleme einfach, indem Sie die zu normalisierende Ebene über die Maske ziehen. Das hängt davon ab, welchen Modus Sie Ihrer Ebene zuweisen wollen. Sie können beispielsweise keine Ebene auf den Status Maskiert setzen, wenn die Ebene darüber keine Maske ist. Ebenso können Ebenen nicht als Ausgerichtet gekennzeichnet werden, wenn sich in der Ebene darüber nicht ein Pfad befindet.

Ich habe einen Pfad erstellt und einen 40-Bild-Bewegungstween in der ausgerichteten Ebene erzeugt. Wenn ich versuche, in Bild 40 das zu bewegende Objekt an den Pfad anzukoppeln, fehlt der Pfad. Warum ist das so? A

Wahrscheinlich lebt der Pfad nicht so lang wie Ihr Bewegungstween. Erzeugen Sie in der Pfad-Ebene ein Bild an (in Ihrem Fall) Position 40, und Sie werden den Pfad wieder sehen.

Quiz 1. Wenn Sie etwas in eine Masken-Ebene zeichnen, aber der Inhalt der maskierten Ebene unverändert bleibt, bis Sie den Film testen: Was ist dann das Problem? a.

Es gibt kein Problem. Man kann den Effekt nur sehen, wenn man den Film testet.

b. Sie müssen die maskierte Ebene verstecken. c. Sie müssen beide Ebenen sperren.

257

Effektiv mit Ebenen

2. Wie viele Ebenen kann man mit einer Masken-Ebene maskieren? a.

Eine. Wenn man mehrere Ebenen maskieren will, benötigt man für jede Ebene eine eigene Maske.

b. So viele man will c. Es ist genau andersherum: Man kann viele Masken für eine maskierte Ebene erzeugen. 3. Wo ist die Stelle, in der (wie bei der Verwendung der Bibliothek) Effizienz keine Rolle spielt? a.

Nirgendwo in Flash, denn Sie sollte immer effizient sein

b. In Führungs-Ebenen, da diese nicht in den fertigen Film exportiert werden c. In versteckten Ebenen, da diese versteckt sind

Übungen 1. Versuchen Sie sich einmal an folgender Masken-Aufgabe: Zeichnen Sie eine Maske, die zwei Fenster darstellt. Die maskierte Ebene soll Wolken enthalten, die an den Fenstern vorüberziehen. Denken Sie daran, dass Sie nur ein Symbol in der MaskenEbene verwenden dürfen! 2. Versuchen Sie, eine Kreisbewegung als Bewegungstween zu realisieren. Stellen Sie dazu einen Pfad her, der einer Kreislinie entspricht. Dabei gibt es aber ein Problem: Wenn das zu bewegende Objekt an der gleichen Stelle startet, an der es auch ankommen soll, wird ein Bewegungstween nicht funktionieren. Trennen Sie deshalb ein sehr kleines Stück aus der Kreislinie heraus, damit Sie zwei Enden erhalten, an die Sie das zu bewegende Objekt andocken können.

258

Filmsequenzen und Grafik-Symbole

2 1

Filmsequenzen und Grafik-Symbole

Wenn Sie sehen, was man mit Filmsequenz-Symbolen machen kann, werden Sie erstaunt sein. Sie können innerhalb einer Filmsequenz eine Animation erzeugen und dann wiederum ein Symbol darin animieren (sozusagen eine doppelt animierte Animation). Damit können Sie beispielsweise die Filmsequenz eines sich drehenden Rades entwerfen und es über die Bühne bewegen. Mit Symbolen im Allgemeinen kennen Sie sich ja schon aus, denn wir haben im fünften Kapitel bereits die Grundlagen gelernt. Der wohl größte Vorteil von Symbolen ist, dass man nur ein Master-Symbol in der Bibliothek hat und so viele Instanzen verwenden kann, wie man will, ohne die Dateigröße massiv zu verändern. Sie sollten sich aber auch an Kapitel 8 erinnern, in dem wir uns mit Bewegungstweens beschäftigt haben. Hier wurde gesagt, dass jedes Objekt, das Sie bewegen wollen, ein Symbol sein muss. Sie haben sicher schon bemerkt, dass Flash Sie immer fragt, welche Art von Symbol Sie erstellen wollen, wenn Sie eine Grafik konvertieren. Mit Schaltflächen werden wir uns aber erst im nächsten Kapitel beschäftigen. Dafür gehen wir jetzt auf Filmsequenzen und Grafik-Symbole ein. Sie werden am heutigen Tag also 쐽

lernen, wie man Filmsequenzen erstellt und anwendet,

쐽

sehen, dass Filmsequenzen ihre eigene, unabhängige Zeitlinie mitbringen,

쐽

die fundamentalen Unterschiede zwischen Filmsequenzen und Grafik-Symbolen kennen lernen und

쐽

herausfinden, dass Filmsequenzen adressierbar sind.

12.1 Das Verhalten von Filmsequenzen Viele Leute nehmen fälschlicherweise an, dass Grafik-Symbole nur ein Bild und Filmsequenzen mehrere Bilder enthalten. Man kann auf diese Weise sicherlich arbeiten, aber es geht noch mehr. Angenommen, Sie zeichnen das Grafik-Symbol eines Rades (einen Kreis mit Speichen) und fügen dieses in ein Filmsequenz-Symbol ein, in dem das Rad gedreht wird. Wenn Sie nun ein Auto erzeugen, das zwei solche Räder hat, ist das Auto selbst wieder ein Grafik-Symbol, da es ja nur ein Bild besitzt. Trotzdem handelt es sich um eine Animation. Verzweifeln Sie nicht, wenn sich das jetzt verwirrend anhört, denn wir werden das noch in einer Übung durchspielen. Sie sollten nur schon einmal gehört haben, dass Sie nicht nur dann an eine Filmsequenz denken müssen, wenn das Symbol mehrere Bilder besitzt.

Eine Filmsequenz erstellen Das Erstellen einer Filmsequenz ist mit dem Anlegen eines Symbols vergleichbar. Zuerst erstellen wir eine Animation innerhalb der Filmsequenz. Wenn wir die Filmsequenz dann mit einem Bewegungstween versehen, wird sich die gesamte Animation mitbewegen. Hier

260

Das Verhalten von Filmsequenzen

werden wir zuerst ein Rad zeichnen und eine Instanz davon verwenden, um ein drehendes Rad zu erzeugen. Das wiederum binden wir zweimal in ein Auto-Symbol ein. Das Auto soll sich schließlich mit drehenden Rädern über den Bildschirm bewegen.

Übung: Verwenden Sie eine Filmsequenz, um ein Rad zu drehen 1. Zeichnen Sie in einer neuen Datei einen Kreis, der durch mehrere Linien geteilt wird. Zeichnen Sie die Linien bitte nicht genau symmetrisch, damit wir später gut erkennen können, ob sich unser Rad auch dreht (siehe Abbildung 12.1). Wählen Sie die gesamte Form aus und konvertieren Sie diese in ein Filmsequenz-Symbol, das Sie Rad nennen.

Abbildung 12.1: Diesem Rad kann man gut ansehen, dass es sich dreht.

2. Wählen Sie nun die Instanz auf dem Bildschirm aus und konvertieren Sie diese erneut in ein Filmsequenz-Symbol (das hört sich jetzt doppelt gemoppelt an, ist es aber nicht, wie Sie gleich sehen werden). Nennen Sie das neue Symbol drehendes Rad. 3. Gehen Sie nun in das Master-Symbol von drehendes Rad. Hier finden Sie eine Instanz von Rad vor (siehe Abbildung 12.2).

Abbildung 12.2: Im EigenschaftenBedienfeld sieht man den Namen des ausgewählten Originalsymbols.

261

Filmsequenzen und Grafik-Symbole

4. Jetzt erstellen wir einen einfachen Bewegungstween (und das ist die Auflösung aus Punkt 2, denn man braucht ein Symbol, um einen Bewegungstween zu erzeugen). Klicken Sie auf Bild 20 und fügen Sie ein Schlüsselbild ein. Stellen Sie im ersten Bild einen Bewegungstween ein und die Option Drehen im Eigenschaften-Bedienfeld auf UZS mit dem Wert 1. 5. Kehren Sie in die Szene zurück. Sie finden eine Instanz von drehendes Rad vor, das sich aber nicht dreht. Erst wenn Sie den Film testen, können Sie das erkennen. 6. Erzeugen Sie nun eine weitere Instanz von drehendes Rad, indem Sie das Symbol erneut aus der Bibliothek auf die Bühne ziehen. Positionieren Sie die Symbole so nebeneinander, dass Sie mit dem Pinsel-Werkzeug nur noch den äußeren Rahmen Ihres Autos zeichnen müssen. Wählen Sie nun alles aus und konvertieren Sie es in ein Filmsequenz-Symbol namens Auto. 7. Erzeugen Sie nun ein Schlüsselbild in Bild 30 und einen Bewegungstween, in dem das Auto von einer Seite der Bühne zur anderen fährt. Testen Sie den Film, um das Ergebnis zu sehen (beim Schrubben werden sich die Räder nämlich nicht drehen). Wenn Sie sich mit der Verschachtelung von Symbolen nicht gut auskennen, kann diese Übung ein wenig verwirrend sein. Lesen Sie gegebenenfalls noch einmal in Kapitel 5 nach.

Filmsequenz- und Grafik-Symbole im Vergleich Es macht keinen Unterschied, ob Ihr Master-Symbol ein Grafik- oder ein FilmsequenzSymbol ist. Das wirkt sich nur auf das Standardverhalten aus, wenn man eine Instanz aus der Bibliothek auf die Bühne zieht. Was zählt, ist das Verhalten der Instanz auf der Bühne. Wenn Sie eine Filmsequenz auf die Bühne ziehen, wird sie sich standardmäßig wie eine Filmsequenz verhalten. Das kann man aber ändern, indem man das EigenschaftenBedienfeld verwendet und bei Verhalten den Wert Grafik einstellt (siehe Abbildung 12.2). Was zählt, ist das Verhalten der Instanz. Wenn man ein Symbol, das aus mehreren Bildern besteht, als Grafik interpretieren lässt, gibt es die zusätzliche Option Erstes im Eigenschaften-Bedienfeld. Hier kann man einstellen, welches Bild (im Symbol) zuerst angezeigt werden soll. Außerdem können Sie im Auswahlfeld daneben zwischen Wiederholen, Einmal abspielen und Einzelbild wählen, was wohl keiner weiteren Erklärung bedarf. Wenn Sie beispielweise unsere beiden Räder nehmen, können Sie eines davon bei Bild 10 starten lassen. Somit werden sich beide Räder komplett drehen, das erste hat aber einen Vorsprung von neun Bildern.

262

Das Verhalten von Filmsequenzen

Abbildung 12.3: Eine Instanz kann (unabhängig vom Verhalten des Master-Symbols) jedes beliebige Verhalten besitzen, das Sie im EigenschaftenBedienfeld auswählen.

Wenn man einem Symbol das Verhalten Grafik zuweist, wird es (wenn es mehrere Bilder enthält) das erste Bild im ersten Bild der Hauptzeitlinie anzeigen, das zweite im zweiten Bild und so weiter. Wenn wir nur über 5 Bilder in der Hauptanimation verfügen, wird beim letzten Bild das Bild Nummer 5 des Grafik-Symbols angezeigt. Danach stoppt das Symbol. Bei Filmsequenzen sieht das anders aus. Hier würde sich unser Rad weiterdrehen. Stellen Sie sich das so vor, als ob eine Filmsequenz nach dem Takt eines eigenen Trommlers marschiert (was aber nicht heißt, dass Sie hier eine andere Bildwiederholrate einstellen können). Dabei ist es egal, wie viele Bilder die Hauptanimation hat. Das Rad wird sich immer weiter drehen, bis die Wiedergabe beendet ist. Auch wenn Filmsequenzen unabhängige Zeitschienen besitzen, kann man sie nicht auf eine andere Bildrate einstellen als im Hauptfilm. Die Zeitschienen laufen zwar getrennt voneinander, aber immer im gleichen »Takt« ab.

Übung: Vergleichen Sie ein Grafik- mit einem Filmsequenz-Symbol 1. Wählen Sie in einer neuen Datei EINFÜGEN / NEUES SYMBOL, nennen Sie es Zahlen und wählen Sie Filmsequenz als Verhalten. Beachten Sie dabei, dass Sie nach dem Klick auf OK in der Masterversion des neuen Symbols landen.

263

Filmsequenzen und Grafik-Symbole

2. Schreiben Sie in Bild 1 von Zahlen mit dem Text-Werkzeug eine 1 in die Nähe der Bildschirmmitte. Fügen Sie dann ein Schlüsselbild in Bild 2 ein und ändern Sie die Zahl in eine 2. Fahren Sie so bis zum Bild 10 fort. 3. Kehren Sie zum Hauptbildschirm zurück und stellen Sie sicher, dass Sie sich nicht mehr in Zahlen befinden. Ziehen Sie dann eine Instanz von Zahlen aus der Bibliothek auf die Bühne. Testen Sie den Film, denn nur so können Sie eine Filmsequenz ausprobieren. Es werden alle 10 Zahlen durchlaufen, obwohl unsere Hauptzeitlinie nur ein Bild lang ist. 4. Fügen Sie (in der Szene, nicht im Symbol) ein Bild bei Bild 5 ein ((F5)). Damit verlängern Sie den Film einfach um ein paar Bilder. Testen Sie den Film erneut und Sie werden keinen Unterschied feststellen. 5. Ziehen Sie eine weitere Instanz der Filmsequenz Zahlen auf die Bühne. Stellen Sie nur für diese Instanz das Verhalten auf Grafik ein. (Das geht über das EigenschaftenBedienfeld.) Stellen Sie außerdem die Grafikoption auf Wiederholen. Testen Sie den Film nun erneut. 6. Wenn die Zahlen so schnell laufen, dass Sie keinen Unterschied sehen, wählen Sie bitte eine niedrigere Bildrate. Sie werden sehen, dass die Grafik-Instanz nur die Zahlen 1 bis 5 anzeigt. Die Filmsequenz wiederholt dagegen alle 10 Bilder. Wenn Sie die Wiedergabe beendet haben, können Sie die Schrubbertechnik verwenden und werden sehen, dass Sie bei einem Grafik-Symbol im Gegensatz zur Filmsequenz eine Vorschau erhalten. 7. Probieren wir noch eine letzte Sache aus: Wählen Sie STEUERUNG / STOPP, wenn Sie den Film abspielen. Dadurch läuft der Abspielkopf nicht mehr weiter. Die Filmsequenz wiederholt sich weiter, während die Grafik anhält. Sie sehen, dass ein GrafikSymbol fest an die Zeitlinie gekoppelt ist, während eine Filmsequenz über eine eigene Zeitlinie verfügt. Es gibt einige weitere Punkte, denen man Beachtung schenken sollte: Zuerst einmal wiederholen sich Filmsequenzen ständig. Eine Option »Einmal abspielen« gibt es in Flash nicht. (Ein »Stoppe beim letzten Bild«-ActionScript werden wir allerdings im 14. Kapitel kennen lernen.) Filmsequenzen bereiten deshalb zusätzliche Arbeit. Der scheinbare Vorteil, dass man Grafik-Symbole (wegen ihrer starken Verknüpfung zur Hauptzeitlinie) mit der Schrubbertechnik beim Erstellen eines Films genau im Auge hat, ist mit dem Vorteil von Filmsequenzen eigentlich nicht zu vergleichen: Man kann diese nämlich, wann immer man das will, über ActionScript anhalten und weiterspielen lassen (weshalb eine Vorschau unmöglich ist). Testen Sie deshalb beim Einsatz von Filmsequenzen den Film, um beurteilen zu können, was der Betrachter später sieht.

264

Filmsequenzen-Feintuning

Wann Sie Filmsequenzen verwenden sollten Sie sollten Filmsequenzen möglichst für alle Symbole verwenden, die Grafik enthalten (auch wenn sie nur aus einem Bild bestehen). Wir werden später sehen, dass man mit Filmsequenzen nicht so viel Speicher belegt wie mit Grafik-Symbolen. Allerdings gibt es trotzdem einige Gründe dafür, Grafik-Symbole zu verwenden: Ich empfehle Ihnen Symbole mit dem Verhalten Grafik, wenn Sie beim Erstellen des Films unbedingt eine Vorschau benötigen. Wenn Sie in so einem Fall Filmsequenzen (ohne Vorschaumöglichkeit) einsetzen, fällt Ihnen Ihre Arbeit schnell zur Last. Nehmen wir als Beispiel wieder die Lippensynchronizität. Hier wären Filmsequenzen nicht anzuraten. Außerdem können Sie ruhig mit Grafik-Symbolen arbeiten, wenn Sie definitiv keine Wiederholung der Symbol-Sequenz benötigen. Die Einbindung eines Scripts, welches die Schleife einer Filmsequenz stoppen soll, bedeutet definitiv mehr Arbeitsaufwand. Ich will Ihnen aber nicht vorenthalten, dass es mit Grafik-Symbolen wegen der Ankoppelung an die Hauptzeitlinie auch Probleme geben kann. Das ist immer dann der Fall, wenn die Anzahl der verwendeten Bilder nicht übereinstimmt. Angenommen, wir haben ein Symbol mit einem drehenden Rad (wie in der ersten Übung), das sich über 20 Bilder einmal um die eigene Achse dreht. Wenn sich dieses Symbol im Grafik-Modus befindet, wird es sich in einer Auto-Animation mit nur einem Bild nicht drehen. In einer Auto-Animation mit 10 Bildern schafft es gerade einmal eine halbe Drehung und wird (bei einer Schleifenwiedergabe der Animation) eine halbe Drehung überspringen. Wenn das Rad-Symbol aber als Filmsequenz definiert worden wäre, würde sich das Rad unabhängig von der Länge der Auto-Animation gleichmäßig immer weiter um die eigene Achse drehen. Beachten Sie: Wenn Sie verschachtelte Symbolgebilde (Symbole in Symbolen) verwenden oder Bewegungstweening einsetzen, empfiehlt sich meist die Verwendung von Filmsequenzen, da diese in ihrer eigenen Zeitlinie animieren und man nicht auf die in der Hauptzeitlinie zur Verfügung stehende Zeit achten muss.

12.2 Filmsequenzen-Feintuning Wir haben bisher den wichtigsten der Unterschiede zwischen Filmsequenzen und GrafikSymbolen besprochen – die Zeitlinie einer Filmsequenz ist unabhängig. Allerdings gibt es da noch mehr: Filmsequenzen sind nämlich adressierbar. So können Sie bestimmte Aktionen gezielt auf einzelne Instanzen anwenden. Auf diese Weise ist es beispielsweise möglich, bei zwei Instanzen der gleichen Filmsequenz die eine anzuhalten, während die andere weiter animiert.

265

Filmsequenzen und Grafik-Symbole

Adressierbare Filmsequenz-Instanzen Besinnen Sie sich noch einmal darauf, dass man im Eigenschaften-Bedienfeld einen Namen eingeben kann, der die Filmsequenz eindeutig bezeichnet (siehe Abbildung 12.4). Warum sollte man einer Instanz einen Namen geben, wenn das Symbol in der Bibliothek doch schon einen hat? Die Antwort steckt schon in der Frage, denn eine Instanz ist etwas anderes als ein Symbol (das ja mehrere Instanzen erzeugen kann). Nur so kann man beispielsweise zwei Instanzen des gleichen Symbols unterschiedlich ansprechen.

Abbildung 12.4: Wenn man das Verhalten im Eigenschaften-Bedienfeld auf Movieclip stellt, erhält man die Möglichkeit, die Instanz zu benennen.

Erinnern Sie sich daran, wie wir die Zeitlinie in der letzten Übung angehalten haben? So ein Stopp funktioniert, als ob man »Stopp!« in eine Menge rufen würde. Anders sieht es beim Anhalten einer einzelnen Instanz namens Inst_1 aus: »Hey! Inst_1, Du stoppst jetzt!« Das funktioniert natürlich nur, wenn man der Instanz zuvor auch einen Namen gegeben hat. Bitte achten Sie darauf, den Namen eines Symbols nicht mit der Bezeichnung einer Instanz verwechseln.

266

Filmsequenzen-Feintuning

Einsparungen in der Dateigröße Filmsequenzen sind kleiner als Grafik-Symbole (was besonders für Filmsequenzen in Filmsequenzen gilt). Man kann das mit einem simplen Test beweisen: Zeichnen Sie eine Linie und wandeln Sie diese in eine Filmsequenz um. Erzeugen Sie nun mit 4 Linieninstanzen eine Quadratfilmsequenz, daraus eine Sequenz mit 4 Quadraten und so weiter. Wenn Sie nun das gleiche mit Grafik-Symbolen erzeugen, wird die Datei genauso aussehen. Exportieren Sie die beiden Möglichkeiten aber, werden Sie feststellen, dass die Grafik-Symbole insgesamt zehnmal so groß sind wie die Filmsequenzen. Das ist unterscheidet einen Film, der 10 Sekunden zum Downloaden braucht, von einem, der fast 2 Minuten benötigt! Flash ermöglicht eine Vorschau beim Schrubben, wenn man ein Grafik-Symbol verwendet. Und genau das ist schon der Grund, warum die Datei größer wird. Bei Grafik-Symbolen muss sich Flash genau merken, wann ein Symbol wie aussieht, bei Filmsequenzen nicht, da sie ja dynamisch gesteuert werden (das haben wir noch nicht gesehen, werden wir aber nachholen). Wenn man einen Film exportiert, werden Grafik-Symbole vorgerendert. (Flash rechnet dann schon aus, wie die Grafik später aussehen soll.) Der Film wird dadurch flüssiger ablaufen, aber bei Symbolen in Symbolen (und so weiter) führt das schnell zu einer viel größeren Datei. Damit sollten Sie gelernt haben, dass Sie möglichst immer Filmsequenzen verwenden sollten, es sei denn, Sie benötigen unbedingt einen der genannten Vorteile von Grafik-Symbolen. Die Laufzeit ist der Moment, in dem ein Anwender den Flash-Film betrachtet. Sie können alles Mögliche einstellen und verändern, wenn Sie einen film bearbeiten, wenn der Film aber exportiert ist, sind Sie darauf beschränkt, was zur Laufzeit möglich ist. So können Sie zur Laufzeit beispielsweise die Bildrate nicht mehr verändern.

Effekte der Download-Reihenfolge Auch wenn ich bisher kaum Gutes über Grafik-Symbole gesagt habe: Man kann ihnen ab und zu auch etwas Gutes abgewinnen. So müssen Grafik-Symbole im Gegensatz zu Filmsequenzen nicht komplett geladen sein, bevor sie abgespielt werden können. In den meisten Fällen spielt das zwar kaum eine Rolle, da Flash-Dateien meist sowieso recht klein sind, aber ich dachte es wäre die Erwähnung wert.

267

Filmsequenzen und Grafik-Symbole

12.3 Zusammenfassung In diesem Kapitel haben wir nicht so viel Neues besprochen. Sie kannten bereits zwei wichtige Techniken: das Verschachteln von Symbolen und wie man Bewegungstweens erstellt. Inzwischen wissen Sie aber auch, wie man Filmsequenzen einsetzt und welche Vor- und Nachteile sie gegenüber Grafik-Symbolen haben. Man kann die Schrubbertechnik bei Filmsequenzen nicht anwenden – zumindest wird man bei der Filmsequenz keine Animation sehen, bis man den Film testet. In manchen Fällen (zum Beispiel bei einer Lippensynchronisation) bietet sich deshalb die Verwendung von Grafik-Symbolen an. Wenn Sie einmal ein paar Tests bezüglich der Dateigröße gemacht haben, werden Sie feststellen, dass Filmsequenzen wesentlich kleiner ausfallen. Auf lange Sicht kann ich Ihnen versprechen, dass Sie Filmsequenzen wegen ihrer Adressierbarkeit zu schätzen wissen werden.

12.4 Workshop F&A F

Ich habe die Übung mit den drehenden Autorädern durchgeführt. Am Anfang habe ich vergessen, dem Symbol Drehendes Rad das Verhalten Filmsequenz zuzuweisen. Deshalb habe ich dieses Verhalten in der Bibliothek dem Symbol zugewiesen, um den Fehler zu beheben. Allerdings läuft die Animation immer noch nicht. Warum? A

F

Ich kann die Wiederholen-Option im Eigenschaften-Bedienfeld nicht mehr finden. Ich schwöre, ich habe sie zuvor schon gesehen. A

F

268

Wenn Sie das Verhalten des Master-Symbols verändern, bezieht sich diese Änderung nur auf Symbole, die ab diesem Zeitpunkt auf die Bühne gezogen werden. Bereits existierende Instanzen sind von der Änderung nicht betroffen. Wenn Sie den Fehler beheben möchten, sollten Sie jede Instanz von Drehendes Rad auswählen (im Auto-Symbol) und dann über das Eigenschaften-Bedienfeld das Verhalten auf Filmsequenz umstellen.

Sie haben diese Option bestimmt schon einmal gesehen, allerdings nicht bei einer Instanz einer Filmsequenz. Die Wiederholen-Option steht nur bei Instanzen von Grafik-Symbolen zur Verfügung.

Ich habe in diesem Buch mehrfach »Instanz, deren Verhalten Grafik ist« gelesen. Warum sagen Sie nicht einfach »Grafik-Symbol«?

Workshop

A

Da gibt es einen Unterschied: Mit einem Grafik-Symbol ist meist das Master-Symbol gemeint. Allerdings behalten nicht alle Instanzen so eines Grafik-Symbols immer auch ihr Grafik-Verhalten, denn Sie können es ja über das EigenschaftenBedienfeld umändern.

Quiz Hier ist sie wieder, die übliche Mahnung: Versuchen Sie bitte zuerst selbst zu antworten, bevor Sie die Lösung nachlesen. 1. Wie viele Bilder kann man in einem Grafik-Symbol und wie viele in einer Filmsequenz verwenden? a.

Eines in Grafik-Symbolen und so viele man will in Filmsequenzen

b. Jeweils so viele man will c. In Master-Symbolen ist das in beiden Fällen egal. Wenn man allerdings eine Instanz mit Grafik-Verhalten hat, darf man nur ein Bild verwenden. Wenn sie sich aber als Filmsequenz verhält, ist das gleichgültig. 2. Was passiert, wenn man zwei Symbole in der Bibliothek gleich benennt, und was, wenn man so bei Filmsequenz-Instanzen verfährt? a.

Das kann man beides nicht.

b. Man kann Symbole nicht gleich benennen. Bei Instanzen ist das aber kein Problem. c. Man kann sowohl Instanzen als auch Symbole gleich benennen, allerdings wäre das keine gute Idee, da Flash etwas verwechseln könnte. 3. Wenn Filmsequenzen doch weniger Speicher belegen, gibt es dann überhaupt einen Grund, Grafik-Symbole einzusetzen? a.

Nein, man sollte sie immer vermeiden.

b. Ja, denn mit Grafik-Symbolen kann man Grafiken besser mit der Zeitlinie koordinieren und sie machen einen Film oft flüssiger. c. Ja, Grafik-Symbole sind besser für die Augen, da sie vorgerendert werden.

269

Filmsequenzen und Grafik-Symbole

Übungen 1. Auch wenn ich bisher oft schlecht über Grafik-Symbole gesprochen habe, gebe ich Ihnen nun eine Übung mit auf den Weg, in der sie absolut notwendig sind: Erstellen Sie die Animation einer Dampflok. Erzeugen Sie zunächst ein Grafik-Symbol Schornstein. Animieren Sie diesen so, dass er normal beginnt und sich dann bis Bild 5 per Formtween ein wenig zusammenzieht, um dort wieder in seine Ursprungsform zurückzukehren, bis er in Bild 6 ein wenig größer als zuvor ist und eine Rauchwolke auspustet. In den Bildern 7 bis 10 ist er dann wieder normal groß. Fügen Sie den Schornstein nun in ein Grafik-Symbol Lok ein und stellen Sie sicher, dass beide die gleiche Anzahl an Bildern besitzen. Bringen Sie die Lok nun auf die Bühne und bewegen Sie das Gefährt per Bewegungstween. Beim Schrubben können Sie nun genau bestimmen, wo Wolken ausgestoßen werden. Fügen Sie genau an diesen Stellen Grafik-Symbol-Instanzen einer Wolke ein, die Sie per Bewegungstween auf 0% Alpha ausblenden. Viel Spaß! 2. Nun erstellen wir ein Riesenrad. Zuerst sollten Sie eine Passagiergondel zeichnen, die Sie in eine Filmsequenz umwandeln, um sie animieren zu lassen. Verwenden Sie einen Pfad, um die Gondel in etwa 28 Bildern eine volle Umdrehung fahren zu lassen. Platzieren Sie nun 10 Gondeln in einer 36-Bild-Filmsequenz namens Riesenrad und legen Sie für jede Instanz das Startbild fest. Lassen Sie die erste Gondel in Bild 3 starten, die zweite in Bild 4, die dritte in Bild 7 und so weiter. Am Ende haben Sie zehn gleich rotierende Gondeln, die allerdings an unterschiedlichen Stellen starten.

270

Schaltflächen für den Anwender

3 1

Schaltflächen für den Anwender

Da Sie nun wissen, wie man einfache Grafiken und Animationen in Flash erzeugt, können wir uns einem sehr interessanten Thema zuwenden – Interaktivität. Eine geradlinige Animation kann schon sehr überzeugend sein, allerdings wird der Anwender noch mehr in den Bann gezogen, wenn er selbst eingreifen kann. Er wird zu einem Teil des Films. In diesem und dem nächsten Kapitel werden Sie deshalb lernen, wie man einem Film Interaktivität verleiht. Die direkteste Art, solche Interaktivität zu erzeugen, ist das Einfügen von Schaltflächen. So könnte man als Anwender den Film beispielsweise stoppen und weiterspielen lassen. Oft wird auch das Überspringen einer einleitenden Animation per Knopfdruck realisiert. Mit Flash kann man außergewöhnliche Schaltflächen in allen Formen erzeugen. Zusätzlich kann man schöne visuelle sowie akustische Effekte einbinden. In diesem Kapitel lernen Sie, die sichtbaren Elemente der Schaltflächen zu erstellen, und im nächsten Kapitel werden die Schaltflächen auch etwas auslösen. Es gibt viele Möglichkeiten, wie man Schaltflächen einsetzen kann. In diesem Kapitel werden Sie 쐽

eine einfache Schaltfläche erstellen,

쐽

Schaltflächen mit mehreren Zuständen erzeugen, die einen Drücken- und DarüberZustand besitzen,

쐽

Schaltflächen erzeugen, die fortgeschrittene Funktionen (animierte Zustände und Sound-Effekte) besitzen,

쐽

genau festlegen, welcher Bereich einer Schaltfläche angeklickt werden kann, und lernen, wie Sie unsichtbare Schaltflächen erstellen. Die Zustände einer Schaltfläche sind die sich optisch unterscheidenden Schaltflächen, die der Anwender sieht, wenn er mit der Schaltfläche interagiert. Die meisten Dialoge in Flash enthalten eine OK-Schaltfläche. Sie besitzt einen Drücken-Zustand, der sichtbar wird, wenn der Anwender auf OK klickt. Dieser Zustand ist optisch leicht anders als der normale Auf-Zustand, in dem sich eine Schaltfläche befindet, wenn sie nicht angeklickt wird und sich auch der Mauszeiger nicht darüber befindet (Darüber-Zustand).

13.1 Eine Schaltfläche erstellen Immer, wenn Sie ein Symbol erzeugen, müssen Sie das Verhalten als Filmsequenz, als Grafik oder als Schaltfläche definieren. Filmsequenzen und Grafik-Symbole haben wir bereits intensiv besprochen. Wenn man aber eine Schaltfläche erzeugen will, braucht man eigentlich nur die Option Schaltfläche aktivieren. Schauen wir uns das im Detail an:

272

Eine Schaltfläche erstellen

Übung: Erstellen Sie eine ganz einfache Schaltfläche 1. Zeichnen Sie in einer neuen Datei ein Oval oder ein Rechteck, das später eine Schaltfläche werden soll. 2. Wählen Sie mit dem Pfeil-Werkzeug die gesamte Form aus. 3. Konvertieren Sie die Auswahl in ein Symbol (EINFÜGEN / IN SYMBOL REN).

KONVERTIE-

4. Nennen Sie Ihr Symbol Meine Schaltfläche und wählen Sie die Option Schaltfläche aus. 5. Testen Sie nun den Film und fahren Sie mit der Maus über Ihre Schaltfläche. Sie werden feststellen, dass sich der Mauszeiger in eine Hand mit ausgestrecktem Zeigefinger verwandelt (siehe Abbildung 13.1). Sie können die Wiedergabe beenden, aber lassen Sie bitte die Quell-Datei geöffnet, da wir damit in der nächsten Übung noch weiter arbeiten werden.

Abbildung 13.1: Jede beliebige Form kann als Schaltfläche dienen. Der Mauszeiger verändert sich, wenn man ihn über eine Schaltfläche bewegt.

Es gibt noch eine andere Möglichkeit, Schaltflächen zu betrachten, ohne den Film zu testen. Sie können STEUERUNG / SCHALTFLÄCHEN AKTIVIEREN wählen, um in Flash schon die Schaltflächen bedienen zu können. Das ist aber eher mit Mühen verbunden als wirklich praktisch, da Sie diese Funktion erst wieder ausschalten müssen, bevor Sie an den Schaltflächen etwas ändern können (beispielsweise einfach bewegen und nicht als Buttons einsetzen). Das war doch einfach, oder? Wir haben hier eine Schaltfläche erstellt, die aber in zwei Punkten wahrscheinlich nicht Ihren Erwartungen entspricht: Sie sieht nicht aus wie eine Schaltfläche (mit verschiedenen Zuständen) und sie verhält sich nicht so, da noch nichts passiert, wenn man darauf klickt. Den zweiten Punkt (das Ausführen von Aktionen) werden wir im nächsten Kapitel behandeln. Zuerst sollten wir das Aussehen der Schaltfläche verbessern, indem wir einen Darüber- und einen Drücken-Zustand hinzufügen.

Übung: Befähigen Sie Ihre Schaltfläche zu mehreren Zuständen 1. Doppelklicken Sie auf die Instanz Ihrer Schaltfläche. (Nehmen Sie die Datei der vorherigen Übung.) Sie gelangen in das Master-Symbol der Schaltfläche. Nebenbei bemerkt: Wenn Sie auch im Bearbeitungsmodus von Flash immer noch das Hand-

273

Schaltflächen für den Anwender

Symbol erhalten, sobald Sie den Mauszeiger über die Schaltfläche bewegen, sollten Sie die Option STEUERUNG / SCHALTFLÄCHEN AKTIVIEREN ausschalten. 2. Da wir uns nun im Master-Symbol von Meine Schaltfläche befinden, werden Sie feststellen, dass es hier nur vier Bilder gibt – und anstelle von Nummern sind sie mit Auf, Darüber, Drücken und Aktiv gekennzeichnet (siehe Abbildung 13.2). Man kann diese Bilder mit ihren Nummern (1-4) oder den angegebenen Zustandsnamen bezeichnen. In jedes Zustandsbild zeichnet man, wie die Schaltfläche im dazugehörigen Zustand aussehen soll. Im Auf-Zustand wird schon angezeigt, wie die Schaltfläche in Normalfall aussehen soll. Der Auf-Zustand definiert, wie die Schaltfläche im Normalfall aussehen soll. Im Darüber-Zustand kann man sehen, wie sie aussieht, wenn der Betrachter mit dem Mauszeiger darüber fährt. Der Drücken-Zustand wird aktiviert, wenn man auf die Schaltfläche klickt, und der Aktiv-Zustand gibt an, in welchem Bereich für eine Zustandsänerung überhaupt geklickt werden kann.

Abbildung 13.2: Im Master-Symbol einer Schaltfläche befinden sich vier Bilder, die mit den Zustandsnamen gekennzeichnet sind.

3. Nun wollen wir den Darüber-Zustand neu definieren. Wählen Sie ihn dazu aus, indem Sie in der Zeitleiste unter das Wort Darüber klicken. Fügen Sie hier wie gewohnt ein Schlüsselbild ein. Jetzt füllen Sie die Schaltfläche einfach mit einer etwas helleren Farbe aus. 4. Fügen Sie ein Schlüsselbild im Drücken-Zustand ein.

274

Eine Schaltfläche erstellen

5. Wählen Sie hier die gesamte Form aus und schieben Sie sie ein wenig nach unten rechts. Sie können dazu die Cursortasten verwenden. Eine Bewegung um drei Bildpunkte nach rechts und unten erwirken Sie durch dreimaliges Drücken der (Æ)-Taste gefolgt durch ebenfalls dreimaliges Drücken der (¼)-Taste. 6. Wir haben die Schaltfläche nun stark erweitert. Kehren Sie bitte in die Hauptszene zurück und testen Sie den Film. Sie sehen also, dass man durch Einfügen bestimmter Grafiken in die zu den Zuständen gehörigen Bilder ganz einfach eine recht anspruchsvolle Schaltfläche erstellen kann.

Den Aktiv-Zustand der Schaltfläche definieren Sicher ist Ihnen der Aktiv-Zustand schon aufgefallen. Alles, was hier gezeichnet wird, kann der Betrachter nicht sehen. Er definiert vielmehr den Bereich, in den der Anwender klicken kann, um die Schaltfläche in den Drücken-Zustand zu versetzen. Stellen Sie sich vor, Sie haben eine Schaltfläche in der Form eines Rings. Wenn Sie nichts in den Aktiv-Status hineinzeichnen, kann man nur auf den Ring, aber nicht in die Mitte klicken (siehe Abbildung 13.3). Sobald Sie aber einen ausgefüllten Kreis in diesen Zustand zeichnen, wird man auch in der Ringmitte die Schaltfläche betätigen können. Diese Technik ist auch dann nützlich, wenn man eine sehr kleine Schaltfläche hat, die auch ein Anwender anklicken können sollte, der keine chirurgischen Erfahrungen hat. Geben Sie dem Publikum also eine Chance, indem Sie den Aktiv-Zustand groß genug auslegen.

Abbildung 13.3: Wenn man die Form im Aktiv-Zustand verändert, kann man den anklickbaren Bereich modifizieren.

In Verbindung mit Schaltflächen wird das Zeitleisten-Konzept ein wenig verändert. Wenn Sie normalerweise ein Schlüsselbild an Position 1 erstellen, ist danach nichts mehr auf der Bühne. Bei Schaltflächen werden aber in den ersten vier Bildern (also in allen Zuständen) für Sie unsichtbare Bilder eingefügt. Wenn Sie also etwas im Auf-Zustand zeichnen, bleibt es auch in allen anderen Zuständen präsent, ohne dass Sie es der Zeitleiste ansehen.

275

Schaltflächen für den Anwender

Übung: Erstellen Sie eine Schaltfläche mit einem extra großen Aktiv-Zustand 1. Verwenden Sie in einer neuen Datei das Text-Werkzeug, um das Wort Home auf die Bühne zu bringen. 2. Wählen Sie den Text aus und konvertieren Sie ihn in ein Schaltflächen-Symbol namens Home Schaltfläche. 3. Testen Sie den Film und beobachten Sie den Mauszeiger, wenn Sie ihn über die Schrift bewegen. Sie sehen, dass Sie nur auf die Schaltfläche klicken können, wenn Sie sich exakt über der Schrift befinden. Sie können nicht in das Innere des O klicken. 4. Diese negative Eigenart können wir der Schaltfläche allerdings austreiben. Kehren Sie in die Hauptszene zurück und doppelklicken Sie auf die Instanz der Home Schaltfläche. Sie gelangen nun in das Master-Symbol. 5. Fügen Sie hier ein Schlüsselbild in den Aktiv-Zustand der Schaltfläche ein. Dabei wird (wie sonst auch) der Inhalt des vorherigen Schlüsselbildes in das neue Schlüsselbild kopiert. Es erscheint also das Wort Home aus dem Auf-Zustand. Wenn wir den neuen Aktiv-Zustand definiert haben, können wir den Text getrost löschen, da das Publikum diesen Bereich sowieso nicht sehen kann. 6. Zeichnen Sie ein Oval, das etwas größer ist als der Text, und löschen Sie dann das Wort Home. 7. Wenn Sie den Film nun erneut testen, werden Sie die Schaltfläche viel einfacher anklicken können. Die Schaltfläche aus der letzten Übung hat einen größeren Bereich zum Anklicken erhalten, als optisch zu vermuten wäre. Bitte bedenken Sie aber, dass ein leerer Aktiv-Zustand immer das vorherige Schlüsselbild als Vorlage nimmt. Wenn Sie also keinen Aktiv-Zustand definiert haben und sich im Drücken-Zustand eine Zeichnung befindet, werden Sie nur dort klicken können.

Die Dateigröße von Schaltflächen minimieren Wir haben schon oft besprochen, dass man unbedingt auf die Dateigröße des exportierten Films achten sollte, auch wenn die Internetverbindungen heute immer schneller werden. Deshalb sollten wir auch bei Schaltflächen auf die anfallende Datenmenge achten. In der vorletzten Übung (mit der Ellipse) haben wir nicht sehr effizient gehandelt, denn wir haben mehrere Schlüsselbilder erstellt, wodurch der Inhalt des vorherigen Schlüsselbildes kopiert wurde (was also den doppelten Speicherbedarf ausmacht). Es wäre besser gewesen ein Symbol anzulegen, das die Form der Schaltfläche aufnimmt, denn wir haben lediglich die Farbe und die Position verändert.

276

Eine Schaltfläche erstellen

Es wird oft angenommen, dass Schaltflächen schon optimiert sind, da es sich dabei ja bereits um Symbole handelt. Allerdings kann man weiteren Speicherplatz sparen, indem man mit Symbolen in Symbolen arbeitet.

Übung: Erstellen Sie eine Schaltfläche mit mehreren Zuständen, die Symbole in jedem Zustand enthält 1. Öffnen Sie eine neue Datei und zeichnen Sie eine Ellipse. 2. Wandeln Sie die Ellipse in ein Symbol mit Schaltflächen-Verhalten um und nennen Sie es MeineSchaltfläche. 3. Doppelklicken Sie auf das neue Symbol, um das Master-Symbol zu bearbeiten. 4. Die Ellipse im Schaltflächen-Symbol ist immer noch eine Fläche. 5. Damit wir effizient arbeiten, wandeln Sie diese Ellipse bitte in ein Movieclip-Symbol namens Ellipse um. 6. Nun haben Sie ein Ellipse-Symbol im Auf-Zustand der Schaltfläche MeineSchaltfläche. Fügen Sie nun ein Schlüsselbild im Darüber-Zustand ein und vergrößern Sie die neue Ellipse-Instanz ein wenig. Außerdem können Sie die Farbe ein wenig verändern. 7. Wenn Sie jetzt ein weiteres Schlüsselbild im Drücken-Zustand einfügen, können Sie die Ellipse-Instanz dort ein wenig nach rechts unten verschieben und gegebenenfalls wieder umfärben. 8. Kehren Sie zur Hauptszene zurück und testen Sie den Film. Sie haben einen recht ansprechenden Knopf erstellt (siehe Abbildung 13.4), der eine nur minimale Dateigröße hat, weil er in allen Zuständen auf das Ellipse-Symbol aufbaut. Abbildung 13.4: Diese Schaltfläche beinhaltet in den drei Zustanden Auf (links), Darüber (Mitte) und Drücken (rechts) Instanzen des EllipseSymbols.

277

Schaltflächen für den Anwender

13.2 Instanzen von Schaltflächen Ich hoffe, dass Sie langsam Gefallen an Schaltflächen gefunden haben, denn auch die schnell erstellten Versionen aus den letzten Übungen sehen doch schon ganz gut aus, oder? Auch wenn wir noch bis zum nächsten Kapitel warten müssen, um endlich mit den Schaltflächen zu steuern bzw. zu »schalten«, macht es Sinn, einen kleinen Blick nach vorne zu riskieren, damit Sie wissen, wo unser Ziel liegt. So wie bei anderen Symbolen können wir beliebig viele Schaltflächen-Instanzen auf die Bühne bringen, ohne die Dateigröße gravierend zu beeinflussen. Jede Instanz kann die gewohnten unterschiedlichen Eigenschaften (wie zum Beispiel Skalierung und Rotation) besitzen. Außerdem können wir jeder Schaltflächen-Instanz eine Aktion zuweisen. Deshalb sollten wir uns einmal ansehen, wie man diese Aktionen einer Instanz (nicht dem Master-Symbol) zuweist. Das Einzige, was wir in das Master-Symbol legen, sind die sichtbaren Elemente und Sounds (wie wir in einer Minute sehen werden). Es wird oft versucht, eine Aktion in einer Schaltfläche selbst zu definieren, was allerdings nicht möglich ist. Auch wenn es sich logisch anhört: Eine Aktion, die beim Klick auf die Schaltfläche ausgeführt werden soll, in den Drücken-Status zu schreiben, funktioniert nicht auf diese Weise. Aktionen sind Ihre Möglichkeit, um Flash etwas zu befehlen (beispielsweise »Stopp!«, »Abspielen!« oder »Springe zu Bild X!«). Wie man Aktionen anwendet, wird im nächsten Kapitel besprochen. Dieses Konzept wollte ich schon einmal erwähnt haben, da wir hier von Instanzen sprechen und die Themen bei Schaltflächen sehr verwandt sind. Man definiert also Aktionen in den Instanzen von Schaltflächen. Machen wir einen kurzen Abstecher – aber nicht mehr. Rechtsklicken Sie auf eine beliebige Schaltflächen-Instanz und wählen Sie AKTIONEN aus dem Kontextmenü. Klicken Sie auf die Plus-Schaltfläche (+) und wählen Sie AKTIONEN / FILMSTEUERUNG / ON. Beachten Sie, dass im AktionenFenster verschiedene Ereignisse aufgeführt werden (siehe Abbildung 13.5). Solche Ereignisse werden wir im nächsten Kapitel genauer unter die Lupe nehmen. Das Abfragen von Ereignissen ist der einzige Weg, wie Schaltflächen in Flash arbeiten. Ereignisse sind etwas, das passiert. In der Multimediawelt werden Ereignisse einerseits durch den Anwender hervorgerufen (wenn er beispielsweise eine Schaltfläche anklickt), oder sie treten bei zuvor definierten Situationen (wie beim Starten des Films) auf. Das war auch schon der ganze Abstecher in die Zukunft – machen wir uns also auf, dorthin zu kommen. Keine Angst, das geht schnell genug. Außerdem gibt es einige sehr interessante Themen bei erweiterten Schaltflächen (die als Nächstes ins Haus stehen). Merken

278

Erweiterte Schaltflächen

Abbildung 13.5: Bei den Aktionen in SchaltflächenInstanzen muss man angeben, welches Ereignis die Aktion auslösen soll.

Sie sich bitte schon einmal, dass man Aktionen in den Instanzen und das Aussehen im Master-Symbol einer Schaltfläche bestimmt.

13.3 Erweiterte Schaltflächen Wenn Sie die bisher erstellten Schaltflächen schon aufregend fanden, warten Sie noch einen Moment. Wir werden einige sehr anspruchsvolle Schaltflächen entwerfen. Wir werden dabei unsere bisher gewonnenen Kenntnisse über Animationen einfließen lassen.

Animierte Schaltflächen Eine animierte Schaltfläche zu erzeugen ist viel einfacher als Sie denken. Wollen Sie eine Schaltfläche, die ständig animiert ist? Oder soll sie nur animiert sein, wenn sich der Mauszeiger darüber befindet? Wie wäre es mit beidem? Sie können alles herstellen, was Sie wollen – eine Filmsequenz im entsprechenden Zustand ist das ganze Geheimnis.

279

Schaltflächen für den Anwender

Übung: Erstellen Sie eine animierte Schaltfläche 1. Schreiben Sie in einer neuen Datei mit dem Text-Werkzeug das Wort Home auf die Bühne. Wandeln Sie es in ein Filmsequenz-Symbol namens Normaler Text um. Dieses Symbol werden wir sehr oft verwenden. 2. Der Text auf der Bühne ist nun eine Instanz von Normaler Text. Wir erstellen nun eine Filmsequenz, die diese Instanz auf dem Bildschirm animieren wird. Wählen Sie die Instanz also aus und wandeln Sie sie erneut in ein Filmsequenz-Symbol namens Animierter Text um. 3. Jetzt müssen wir natürlich im Master-Symbol von Animierter Text für die Animation sorgen. Doppelklicken Sie also auf die Instanz. Vergewissern Sie sich, dass Sie sich im Master-Symbol von Animierter Text befinden, bevor Sie fortfahren. 4. An dieser Stelle können Sie nun ein Schlüsselbild in Bild 30 und ein weiteres in Bild 15 einfügen. Vergrößern Sie den Text in Bild 15 ein wenig. Aktivieren Sie in den Bildern 1 und 15 das Bewegungstweening. Schrubben Sie, um die Animation zu sehen. 5. Kehren Sie in die Hauptszene zurück. Löschen Sie alles auf der Bühne ((Strg)+(A) und dann (Entf)). Die Symbole sind jetzt noch sicher in der Bibliothek aufgehoben. Öffnen Sie nun die Bibliothek und ziehen Sie eine Instanz von Normaler Text auf die Bühne. 6. Jetzt sind wir soweit, um eine Schaltfläche zu erzeugen. Wählen Sie dazu die Instanz auf der Bühne aus und konvertieren Sie diese in ein Schaltflächen-Symbol namens Animierte Schaltfläche. So haben wir ein Symbol verwendet, um eine Schaltfläche zu produzieren. 7. Jetzt können wir die Schaltfläche so bearbeiten, dass sie animiert. Doppelklicken Sie dazu auf die Instanz von Animierte Schaltfläche auf der Bühne. Jetzt befinden Sie sich im Master-Symbol der Schaltfläche. Wie Sie sehen, liegt das Symbol Normaler Text im Auf-Zustand. 8. Wir werden jetzt eine Instanz von Animierter Text in den Darüber-Zustand einfügen. Sie können eine Instanz aus der Bibliothek auf die Bühne ziehen und diese am ersten Text ausrichten. Wir werden hier jedoch etwas anders vorgehen, um uns das Ausrichten zu ersparen. Fügen Sie ein Schlüsselbild in den Darüber-Zustand ein. 9. Wählen Sie die Instanz von Normaler Text im Darüber-Zustand der Schaltfläche und öffnen Sie das Eigenschaften-Bedienfeld. Drücken Sie nun auf die Schaltfläche Austauschen (siehe Abbildung 13.6). 10. Im gerade geöffneten Fenster Symbol wechseln finden Sie alle Symbole aus Ihrer Bibliothek wieder. Das aktuell verbundene Symbol wird durch einen Punkt markiert (siehe Abbildung 13.7). Klicken Sie auf Animierter Text und danach auf OK. Sie haben gerade das Symbol der Instanz gewechselt.

280

Erweiterte Schaltflächen

Abbildung 13.6: Man kann Symbole austauschen, die mit einer Instanz verbunden sind, ohne die anderen Eigenschaften (wie zum Beispiel die Position) der Instanz zu verändern.

Abbildung 13.7: In diesem Fenster können Sie ein anderes Symbol auswählen.

11. Der Schaltfläche fehlt nun nur noch ein schöner großer Aktiv-Zustand. Fügen Sie im Aktiv-Zustand also zuerst ein Schlüsselbild und dann ein Oval ein, das groß genug ist, um das größte Home-Wort zu überdecken. Dann können Sie den Text löschen. Wir haben uns hier vom Speziellen zum Allgemeinen vorgearbeitet, denn wir haben zuerst nur den Text erstellt. Aus diesem Symbol haben wir dann eine Animation erzeugt und aus diesen beiden Komponenten haben wir wiederum eine Schaltfläche gebastelt.

281

Schaltflächen für den Anwender

Schaltflächen-Behandlungs-Optionen Die Behandlungs-Option einer Schaltfläche gibt uns mehr Kontrolle über ihr Verhalten. In Abbildung 13.8 sehen Sie, dass man für jede Instanz einer Schaltfläche angeben kann, ob Flash sie Als Schaltfläche behandeln oder ob die Option Als Menüelement behandeln aktiviert werden soll. Abbildung 13.8: Hier können Sie sich entscheiden, ob Sie eine Schaltfläche als solche oder Als Menüelement behandeln wollen.

Der einfachste Weg, diese Behandlungs-Option zu verstehen, ist, mehrere Schaltflächen zu erzeugen, deren Darüber-Zustände sich von den Auf-Zuständen unterscheiden (dabei kann es sich ruhig um zwei Instanzen der gleichen Schaltfläche handeln). Wenn Sie beide Instanzen im Modus Als Schaltfläche behandeln belassen, werden Sie bei einmal auf einer Schaltfläche gedrückter Maustaste keine weiteren Schaltflächen ansprechen können. Erst wenn Sie beide Schaltflächen auf Als Menüelement behandeln gekennzeichnet haben, reagieren die anderen Schaltflächen auch noch, wenn Sie bereits die Maustaste gedrückt haben (wie man das aus Menüs kennt). Diese Funktion ist nicht besonders wichtig, aber Sie sollten wissen, dass es sie gibt.

Schaltflächen mit Sound versehen Es gibt mehrere Möglichkeiten, eine Schaltfläche mit Sound zu versehen. Die einfachste Variante ist, den Sound einfach in ein Schlüsselbild eines Zustandes einzubinden. So könnte man Audio in den Darüber-Zustand einbinden, um ihn immer dann abzuspielen, wenn der Betrachter mit der Maus über die Schaltfläche fährt. Bei etwas ausgefalleneren Effekten (wie dem wiederholten Abspielen, während sich der Mauszeiger über der Schaltfläche befindet) sind ein paar Schritte mehr nötig. Für ganz komplizierte Sound-Einbindungen müssen Sie sich zuerst mit ActionScript vertraut machen. Deshalb werden wir uns hier mit Sounds im Darüber-Zustand beschäftigen.

282

Erweiterte Schaltflächen

Übung: Erstellen Sie eine Schaltfläche, die mit einem Darüber-Sound versehen ist 1. Erzeugen Sie in einer neuen Datei ein Rechteck, das Sie direkt in ein SchaltflächenSymbol namens Audio-Schaltfläche umwandeln. 2. Doppelklicken Sie auf die Instanz, damit Sie das Master-Symbol bearbeiten können. 3. Damit wir Speicher sparen, wählen wir hier das Rechteck aus und konvertieren es in ein Filmsequenz-Symbol namens Form der Schaltfläche. 4. Jetzt fügen wir ein Schlüsselbild im Darüber-Zustand ein. 5. Nun benötigen wir noch einen Sound, den wir einfügen können. Öffnen Sie dazu Ihre Bibliothek und die Sound-Bibliothek (FENSTER / ALLGEMEINE BIBLIOTHEKEN / SOUNDS). Ziehen Sie nun die Audio-Datei Breaker Switch aus der Sound-Bibliothek in die Bibliothek Ihrer Datei. Jetzt können Sie im Darüber-Zustand den Sound aktivieren, indem Sie ihn im Eigenschaften-Bedienfeld auswählen (siehe Abbildung 13.9).

Abbildung 13.9: Wir haben einen Sound in den Darüber-Zustand der Schaltfläche integriert.

6. Wenn Sie den Film nun testen, werden Sie das Ergebnis sehen und hören. Speichern Sie diese Datei bitte ab, da wir sie in der nächsten Übung wieder benötigen. Das war ja gar nicht schwer. Ich habe den Sound Breaker Switch ganz bewusst gewählt, da ich mit dem in Kapitel 10 angesprochenen Effekt demonstrieren kann, was passiert, wenn man sehr schnell hintereinander auf die Schaltfläche zeigt und sie wieder verlässt. Korrigieren Sie das gegebenenfalls, indem Sie die Sync-Einstellung auf Start stellen.

283

Schaltflächen für den Anwender

In der folgenden Übung werden wir uns mit sich wiederholenden Sounds in Schaltflächen beschäftigen. Ich rate Ihnen aber, dieses Mittel nicht zu oft einzusetzen, denn auch wenn ein Schleifen-Sound beim ersten Hören ganz witzig klingt, kann er bei längerer Betrachtungszeit eines Films recht nervig werden.

Übung: Erstellen Sie eine Schaltfläche, die mit einem sich wiederholenden Sound versehen ist 1. Bearbeiten Sie das Master-Symbol der Schaltfläche aus der letzten Übung. 2. Wählen Sie das Schlüsselbild im Darüber-Zustand aus und tragen Sie im EigenschaftenBedienfeld einen sehr hohen Wert bei Wdh ein. 3. Testen Sie den Film nun. Es gibt einige Probleme. Das kleinste Übel ist im Moment, dass der Sound Breaker Switch als Schleife nicht besonders gut klingt. Es gibt größere Probleme: Erstens wird der Sound immer wieder über sich selbst gelegt und produziert so einen Klangteppich. Zweitens hört der Sound nicht auf zu spielen. 4. Das erste Problem können Sie beheben, indem Sie die Sync-Einstellung auf Start stellen (siehe Kapitel 10). Wenn Sie den Film erneut testen, werden Sie merken, dass das funktioniert. 5. Allerdings wird der Sound immer noch nicht beendet. Der richtige Moment, den Sound anzuhalten, ist, wenn der Anwender die Schaltfläche mit dem Mauszeiger verlässt und sie somit wieder in den Auf-Zustand versetzt. Erraten Sie es? Genau: Wir müssen nur im Auf-Zustand den Sound Breaker Switch per Sync-Einstellung auf Stoppen anhalten. Probieren Sie es aus und testen Sie den Film.

Unsichtbare Schaltflächen Unsichtbare Schaltflächen sind recht nützlich. Man kann sie ebenfalls recht einfach erzeugen. Sie wird Ihnen (dem Designer) in hellem Blau erscheinen, während der Betrachter sie nicht sehen kann. Vielleicht sehen Sie im ersten Moment keine Verwendung für Schaltflächen, die man nicht sehen kann. Es gibt jedoch einige gute Einsatzgebiete. Man kann solche Schaltflächen über etwas anderes legen, ohne es zu verdecken. Ein Beispiel wäre eine Landkarte, in der ein Anwender Städte anklicken kann, um mehr darüber zu erfahren.

284

Erweiterte Schaltflächen

Übung: Erzeugen Sie eine unsichtbare Schaltfläche 1. Wählen Sie in einer neuen Datei EINFÜGEN / NEUES SYMBOL und nennen Sie es Unsichtbar. Stellen Sie das Verhalten auf Schaltfläche ein und klicken Sie auf OK. Sie gelangen in das Master-Symbol einer (noch) leeren Schaltfläche. 2. Lassen Sie alle Bilder leer und fügen Sie nur im Aktiv-Zustand ein Schlüsselbild ein. 3. Zeichnen Sie einen Kreis um das Plus-Zeichen, das die Mitte des Symbols markiert. Im Zweifelsfall können Sie über das Eigenschaften-Bedienfeld die Position 0,0 einstellen. Das Ergebnis sieht dann etwa so wie in Abbildung 13.10 aus.

Abbildung 13.10: So sieht eine unsichtbare Schaltfläche aus. Nur im Aktiv-Zustand befindet sich ein Schlüsselbild.

4. Kehren Sie in die Hauptszene zurück und ziehen Sie eine Instanz der unsichtbaren Schaltfläche auf die Bühne. Wie Sie sehen, ist sie blau. Testen Sie den Film. Wie Sie sehen, sehen Sie nichts außer einer Veränderung des Mauszeigers, wenn Sie ihn über die unsichtbare Schaltfläche bewegen. 5. Zeichnen Sie in der Hauptszene ein großes Rechteck mit einigen Kreisen (wie in Abbildung 13.11) und stellen Sie sich das als Karte mit einigen Städten vor. Ziehen Sie nun für jeden Kreis eine Instanz von Unsichtbar auf die Bühne. Positionieren Sie diese entsprechend und passen Sie die Größe an.

285

Schaltflächen für den Anwender

Abbildung 13.11: Man kann über jede Zeichnung unsichtbare Schaltflächen legen.

Für etwas, das man nicht sehen kann, sind unsichtbare Schaltflächen doch recht leistungsstark. Ich kann mit Sicherheit behaupten, dass ich in keinem Projekt ohne sie auskomme. Der große Vorteil ist, dass man die Schaltflächen-Funktionalität vom Optischen trennen kann.

13.4 Zusammenfassung Jetzt sollten Sie verstanden haben, wie man in Flash aus jeder beliebigen Form eine Schaltfläche erzeugt. Sie wissen ebenfalls, wie man ihr Aussehen verändern kann, wenn der Betrachter interagiert. Außerdem können Sie jetzt genau festlegen, welcher Teil der Schaltfläche überhaupt anklickbar ist. Zusätzlich haben wir Sound in Schaltflächen eingefügt und unsichtbare Schaltflächen generiert. Sie können Ihre Animationen also jetzt mit Schaltflächen »zukleistern«, was aber nur die halbe Miete ist, denn wir benötigen ja noch die auszuführenden Aktionen. Lesen Sie dazu im nächsten Kapitel weiter.

286

Workshop

13.5 Workshop F&A F

Ich habe eine Filmsequenz auf die Bühne gezogen und versehentlich das Verhalten per Eigenschaften-Bedienfeld in Schaltfläche geändert. Nun funktioniert meine Filmsequenz nicht mehr, sondern verhält sich wie eine Schaltfläche (mit dem Hand-Cursor, wenn man ihn darüber bewegt). Was ist hier los? A

F

Erinnern Sie sich daran, dass man das Verhalten von Instanzen verändern kann, auch wenn das Master-Symbol ein anderes Verhalten hat. Wenn Sie eine Filmsequenz in eine Schaltfläche umwandeln, repräsentieren die ersten 4 Bilder die 4 Zustände der Schaltfläche. Allerdings werden die Namen der Zustände nicht angezeigt, wenn das Verhalten der Instanz nicht von Anfang an Schaltfläche war. Sie werden zu diesem Thema in Kapitel 5 aber noch mehr lernen.

Wenn ich auf Abspielen klicke, funktionieren meine Schaltflächen nicht. Wieso? A

Das geht nur, wenn Sie den Film testen ((Strg)+(Enter)). Sie können aber auch im Autoren-Modus von Flash die Schaltflächen einschalten, indem Sie STEUERUNG / SCHALTFLÄCHEN AKTIVIEREN wählen.

Quiz Ich sage ja gar nichts. Sie wissen doch Bescheid, oder? 1. Wie viele Bilder kann man animieren, wenn man den Darüber-Zustand einer Schaltfläche verwendet? a.

Das hängt von der Anzahl der Schlüsselbilder in der Schaltfläche ab.

b. Nicht mehr als 4 Bilder c. So viele man will, da man eine Filmsequenz einbindet 2. Kann man verschiedene Sounds in unterschiedlichen Instanzen einer Schaltfläche verwenden? a.

Nein

b. Ja c. Das hängt davon ab, ob sich der Sound wiederholt. Für sich wiederholende Sounds gilt: Ja; für sich nicht wiederholte Sounds: Nein.

287

Schaltflächen für den Anwender

4. Was passiert, wenn die Schaltfläche keine Grafik außer im Aktiv-Zustand beinhaltet? a.

Das wird nicht funktionieren.

b. Man hat eine unsichtbare Schaltfläche. c. Flash wird abstürzen.

288

ActionScript für die Erzeugung nichtlinearer Filme

4 1

ActionScript für die Erzeugung nichtlinearer Filme

Die Programmiersprache von Flash heißt ActionScript. Wie in jeder anderen Computersprache kann man auch in ActionScript Befehle auflisten, denen der Computer (in diesem Fall genauer: die Flash-Animation) folgen wird. Ohne ActionScript wird der Film immer wieder gleich ablaufen. Wenn Sie ihn aber beispielsweise durch den Anwender anhalten und weiterspielen lassen wollen, benötigen Sie diese Programmiersprache. Die einzelnen Elemente von ActionScript werden Aktionen genannt. Wenn Sie also Aktionen beispielsweise mit einer Schaltfläche ausführen wollen, müssen Sie zwangsläufig ActionScript lernen. In den Bedienfeldern für Aktionen können Sie vordefinierte Aktionen kombinieren. Im letzten Kapitel haben wir uns mit den optischen und akustischen Eigenheiten von Schaltflächen befasst. Jetzt werden Sie aber auch lernen, wie man ihnen Befehle (zum Beispiel »Abspielen!« oder »Stopp!«) zuweist. Genauer gesagt werden Sie: 쐽

die drei Orte kennen lernen, an denen man Aktionen einfügen kann,

쐽

lernen, wie man Aktionen so bearbeitet, dass sie genau das bewirken, was Sie sich ausgedacht haben,

쐽

Aktionen so lenken, dass sie nur bestimmte Teile des Films betreffen und

쐽

einige grundlegende Möglichkeiten herausfinden, wie man Aktionen für bestimmte Effekte richtig zusammensetzt.

Es gibt in Flash Hunderte von Aktionen. Wir werden in diesem Kapitel nicht alle kennen lernen, aber die Grundlagen ihrer Verwendung. So schaffen Sie gute Voraussetzungen, um mit Ihren Anforderungen zu wachsen.

14.1 Aktionen verwenden Verwenden Sie Aktionen wie Bausteine. Nehmen Sie die Aktionen, die Sie verwenden wollen und fügen Sie diese in einer bestimmten Reihenfolge zusammen. Wenn das dann Sinn macht, wird das Ergebnis sicher sehr interessant sein. Allerdings bedeutet diese Freiheit auch, dass es Kombinationen gibt, die unlogisch oder sogar widersprüchlich sind. Nehmen Sie sich einfach die nötigen Aktionen und fügen Sie diese in der richtigen Reihenfolge an den passenden Stellen zusammen. Danach brauchen Sie nur noch das eventuell nötige Feintuning vorzunehmen. Alle Aktionen werden über das Aktionen-Bedienfeld eingefügt. Sie können FENSTER / AKTIONEN wählen oder einfach (Strg)+(Alt)+(A) drücken, um es zu öffnen. Schauen Sie sich kurz die Abbildung 14.1 an, damit wir ein paar weitere Details besprechen können, bevor wir uns an einigen Übungen versuchen.

290

Aktionen verwenden

Abbildung 14.1: Das AktionenBedienfeld besteht aus vielen Komponenten. 쐽

In der Skriptbibliothek (auch Aktionsliste genannt) kann man die einzelnen Aktionen auswählen. Diese sind wie in Ordnern gruppiert.

쐽

Im Scriptbereich werden die Aktionen in der Reihenfolge der Abarbeitung aufgelistet.

쐽

Im Parameterbereich werden die Parameter der ausgewählten Aktion angezeigt. Manche sind allerdings so einfach, dass sie keine Parameter besitzen.

쐽

Durch die Schaltfläche Ausgewählte Aktion nach unten/oben verschieben kann man eine bestimmte Aktion immer um eine Zeile nach oben oder unten bewegen.

쐽

Über die Schaltfläche Objekt hinzufügen erhält man die gleichen Aktionen wie in der Aktionsliste. Allerdings werden hier auch Kurztastenkombinationen angezeigt (beachten Sie dazu den Tipp weiter unten).

쐽

Über Objekt entfernen kann man die ausgewählte Aktion wieder löschen. Wenn Sie die Schaltfläche Objekt hinzufügen verwenden, finden Sie Tastenkombinationen wie ESC+go vor. Das bedeutet, dass Sie die entsprechende Aktion über die nacheinander (!) eingegebene Tastenfolge (Esc), (G) und (O) hinzufügen können. Wenn Sie später feststellen, dass Sie die gleiche Aktion sehr häufig verwenden, wird diese Vorgehensweise schneller zum Ergebnis führen, als die Aktion immer wieder neu zu suchen.

291

ActionScript für die Erzeugung nichtlinearer Filme

Während Sie lernen, sollten Sie besser den normalen Modus verwenden. Sie können nämlich über den Optionspfeil zwischen Normaler Modus und Experten-Modus auswählen. Im Experten-Modus wird vorausgesetzt, dass die Syntax Ihrer Befehle richtig ist, was im NormalModus immer überprüft wird. Die Syntax ist bei fast jeder Programmiersprache unterschiedlich. Mit diesem Begriff ist die Art und Weise gemeint, in der Befehle aufeinander folgen und miteinander verknüpft werden müssen, um einen Vorgang gültig zu beschreiben. Ansonsten kommt es zu Fehlern. Eine E-Mail-Adresse hat als Bestandteil ihrer Syntax immer ein @-Zeichen, dafür dürfen aber keinerlei Leerzeichen verwendet werden. Wenn man sich nicht an diese Syntax-Regeln hält, kommt die Mail nicht an. Wenn Sie sich im Normal-Modus der Aktionseingabe befinden, wird Flash sicherstellen, dass die von Ihnen eingegebene ActionScript-Syntax immer korrekt ist. Das heißt nicht, dass Ihr Script so funktioniert, wie Sie es geplant hatten. Allerdings wird Flash die Befehle einwandfrei identifizieren können und sie alle abarbeiten. Die einfachste Möglichkeit, Aktionen hinzuzufügen, ist, einfach eine Aktion aus der Aktionsliste (links) auszuwählen und darauf doppelt zu klicken. Daraufhin wird sie im Scriptbereich (rechts) erscheinen. Jede hinzugefügte Aktion wird durch eine Zeile in diesem Bereich repräsentiert. In seltenen Fällen besteht eine solche Aktion aus einem einzigen Wort. Meist ist jedoch ein ganzer Satz oder Ausdruck erforderlich, da eine Aktion meist komplexer ist. Die gesamten Ausdrücke im Scriptbereich nennt man Script. Wenn Sie einmal eine Aktion eingefügt haben, gibt es zwei Möglichkeiten, diese zu bearbeiten. Beim Hinzufügen erscheinen die Ausdrücke in der Reihenfolge, in der Sie sie eingefügt haben. Diese Reihenfolge können Sie durch das Auswählen eines Ausdrucks mit anschließendem Betätigen der Hoch- und Runter-Schaltflächen verändern. Ebenso funktioniert das direkte Ziehen der Auswahl. Die andere Möglichkeit der Bearbeitung ist das Verändern von Parametern. Die Aktion gotoAndPlay stellt den Abspielkopf auf ein anderes Bild ein. Natürlich müssen Sie die Nummer des Bildes angeben, damit das Script auch funktionieren kann. In diesem Fall ist die Bildnummer ein Parameter, der im Parameterbereich angezeigt wird (wenn er geöffnet ist). Manche Aktionen benötigen keine Parameter. Man kann das Aktionen-Bedienfeld vergrößern und verkleinern. Außerdem gibt es unter dem Optionsmenü eine Option für die VOREINSTELLUNGEN. Hier können Sie beispielsweise die Schriftart und Schriftgröße verändern. An derselben Stelle finden Sie auch eine Option namens SYNTAXFARBCODIERUNG. Dabei handelt es sich um eine gute Unterstützung zum Lernen, denn unterschiedliche Bestandteile von ActionScript werden hier auch in unterschiedlichen Farben angezeigt (Eigenschaften in Grün, Schlüsselwörter in Blau und so weiter). Es ist dabei nicht so wichtig, dass Sie genau wissen, welche Farbe für

292

Aktionen verwenden

welche Elemente steht, denn die Unterscheidung ist schon allein dadurch eine große Stütze, dass Sie die Struktur besser durchschauen können. Und genau das passiert bei eingefärbtem Quelltext fast automatisch.

Aktionen durch Parameter spezifizieren Jetzt haben Sie die Chance, Aktionen und Parameter einzusetzen. Sie werden sehen, dass einige Aktionen ganz einfach sind. Die meisten sind allerdings doch eher kompliziert. Lassen Sie uns eine kleine Übung durchführen und anschließend analysieren, was wir getan haben.

Übung: Erstellen Sie eine Aktion, die einen Teil Ihres Filmes wiederholt 1. Erstellen Sie in einer neuen Datei einen Textblock, der das Wort Willkommen enthält. 2. Positionieren Sie ihn in der Mitte des Bildschirms und fügen Sie Schlüsselbilder in den Bildern 20 und 30 ein. 3. Stellen Sie den Abspielkopf auf Bild 1 ein und schieben Sie dort den Text so weit nach links, dass er sich komplett außerhalb der Bühne befindet. Stellen Sie in den Bildern 1 und 20 einen Bewegungstween her. In Bild 20 können Sie dann im EigenschaftenBedienfeld einstellen, dass die Schrift auf dem Weg zu Bild 30 einmal im Uhrzeigersinn (UZS) um die eigene Achse rotieren soll. Schlagen Sie gegebenenfalls im achten Kapitel für nähere Informationen nach. Wenn Sie den Film testen, werden Sie feststellen, dass er sich ständig wiederholt (inklusive dem Hineinschieben der Schrift von links). Wir werden das gleich ändern und sich nur den Teil zwischen den Bildern 20 und 30 wiederholen lassen. 4. Wählen Sie dazu das Bild 30 aus und öffnen Sie das Aktionen-Bedienfeld auf dem gewohnten Wege. In diesem Fall heißt es Aktionen – Bild (siehe Abbildung 14.2). Vergewissern Sie sich noch einmal, dass auch wirklich das Bild 30 ausgewählt ist, denn genau in diesem wollen wir eine Aktion ausführen, die den Film veranlasst, wieder zu Bild 20 zurückzuspringen. 5. Jetzt können Sie in der Aktionsliste den Ordner Aktionen/Filmsteuerung aufklappen und werden dann die Aktion goto finden. Doppelklicken Sie darauf und es wird ein goto-Ausdruck im Scriptbereich eingefügt (siehe Abbildung 14.3). Die angezeigten Parameter befinden sich noch in ihrem Standardzustand, was wir aber gleich ändern werden. Beachten Sie aber, dass in der Zeitleiste ein kleines a in dem Bild erscheint, in dem wir soeben die Aktion eingefügt haben. 6. Wenn Ihr Parameterbereich nicht angezeigt wird, sollten Sie sicherstellen, dass Sie sich im Normalmodus befinden (siehe Optionsmenü).

293

ActionScript für die Erzeugung nichtlinearer Filme

Abbildung 14.2: Wir haben dieses Bedienfeld geöffnet, nachdem wir das Bild 30 ausgewählt haben. Die hier eingegebenen Aktionen werden also genau dann ausgeführt, wenn der Abspielkopf das Bild 30 erreicht.

Abbildung 14.3: So sieht das Aktionen-Bedienfeld im Moment direkt nach dem Einfügen einer goto-Aktion aus.

7. Im Parameterbereich geben Sie alle Details für die aktuell ausgewählte Aktion (in diesem Fall gotoAndPlay) ein. In dieser Übung lassen Sie fast alles so wie es ist. Geben Sie lediglich beim Bild die Nummer 20 ein. Nun sollte gotoAndPlay(20); im Scriptbereich stehen (siehe Abbildung 14.4). 8. Testen Sie den Film erneut und Sie werden sehen, dass nur einmal die Schrift auf die Bühne geschoben wird und danach immer, wenn Bild 30 erreicht wird, der Drehvorgang in Bild 20 neu startet.

294

Aktionen verwenden

Abbildung 14.4: Der Endzustand der Aktion, die dem Bild 30 zugewiesen wurde. In diesem Fall springt der Abspielkopf jedes Mal, wenn er Bild 30 erreicht, direkt auf Bild 20 zurück.

So einfach diese Übung auch war, gibt es doch eine Sache, welche die Animation noch verbessern kann. Stellen Sie sich einmal die ganze Arbeit vor, die Sie haben, wenn Sie die Position des Schlüsselbildes verändern. Was wäre, wenn z.B. das zweite Schlüsselbild von Position 20 nach 25 umziehen müsste? Es würde alles gut funktionieren (natürlich mit einem längeren Schiebevorgang und einer schnelleren Drehung), allerdings würde die Wiederholung immer noch bei Bild 20 einsetzen (also noch im Schiebevorgang), was das Endergebnis schlecht aussehen ließe. Sie müssten sich also daran erinnern, das Script in Bild 30 auf gotoAndPlay(25); zu ändern, und Sie müssten diese Änderung bei jeder Verschiebung des Schlüsselbildes durchführen. Natürlich gibt es da einen besseren Weg. Man kann nämlich einem Bild auch einen Namen geben (der sich beim Verschieben des Bildes nicht verändert) und kann diesen in der goto-Aktion anstelle der Nummer angeben.

Übung: Verwenden Sie eine Bildnummer als Ziel eines goto 1. In der Datei, die wir soeben erstellt haben, wählen Sie bitte das Bild 20 (oder wo immer die Drehung startet) aus. Nennen Sie dieses Bild Schleifenstart (siehe Abbildung 14.5). 2. Gehen Sie wieder zum Bild 30 und öffnen Sie das Aktionen – Bild-Bedienfeld.

295

ActionScript für die Erzeugung nichtlinearer Filme

Abbildung 14.5: Wenn wir das Bild 20 über das Eigenschaften-Bedienfeld mit dem Namen Schleifenstart versehen, kann das Sprungziel in der Aktion von Bild 30 der Bildname (Schleifenstart) sein. Die Bildnummer (20) muss dann nicht verwendet werden.

3. Wir müssen nun die gotoAndPlay-Anweisung im Bild-Aktionen-Bedienfeld abändern. Auch wenn wir nur eine Zeile geschrieben haben, müssen wir diese auswählen, um ihren Parameter zu verändern. Stellen Sie nun im Auswahlfeld Typ den Wert Bildmarkierung ein. Sie erhalten dann auch bei der Option Bild ein Auswahlfeld, das alle Bildnamen enthält. In unserer Datei gibt es bisher nur die Bildmarkierung Schleifenstart, aber wenn Sie mehrere definiert hätten, würden Sie diese hier vorfinden. Wählen Sie also Schleifenstart aus (siehe Abbildung 14.6). Diese Methode ist besser, als einfach den Namen einzutragen, denn dabei können sich Tippfehler einschleichen. Sollten Sie den Pfeil zum Aufklappen des Auswahlfeldes nicht sehen, müssen Sie gegebenenfalls das Bedienfeld ein wenig vergrößern. 4. Testen Sie den Film erneut. Er wird sich für den Betrachter nicht von der ersten Version unterscheiden. Kehren Sie zur Zeitleiste zurück und ziehen Sie das Bild Schleifenstart an die Bildposition 10. 5. Testen Sie den Film noch einmal. Jetzt springt die Animation automatisch nach Bild 10, ohne dass wir das Script verändern müssen. Und gerade das ist der Vorteil, wenn Sie Bildmarkierungen als Sprungziel für Ihre goto-Aktionen verwenden: Sie können die Schlüsselbilder dann immer noch verschieben, ohne irgendetwas abändern zu müssen.

296

Aktionen verwenden

Abbildung 14.6: Die neue Version unseres goto ist besser, da eine Bildmarkierung angewählt wird.

Bild-Aktionen Wir haben gerade gesehen, wie eine Aktion den Abspielkopf an eine andere Stelle im Film geschickt hat. Lassen Sie uns aber einen Moment zurückgehen und sehen, was wir sonst noch gelernt haben. Aktionen sind Befehle, denen Flash folgen soll. Aktionen führen etwas aus. Aktionen können verändert werden, indem man ihre Parameter bearbeitet. Das sind alles nützliche Informationen, aber wann genau befolgt Flash diese Befehle? Die Antwort liegt da, wo Sie die Aktion einfügen. Es gibt drei Stellen, an denen man Aktionen einfügen kann: in Schlüsselbildern, in Instanzen von Schaltflächen und in Instanzen von Filmsequenzen. In der letzten Übung haben wir die Aktion in ein Schlüsselbild eingefügt. In diesem Fall wird die Aktion ausgeführt, wenn der Abspielkopf das Bild erreicht. Bei einer solchen Bild-Aktion braucht der Anwender nichts anderes zu tun, als darauf zu warten, dass der Abspielkopf das Bild (in dem die Aktion definiert wurde) erreicht. Auch wenn es sich hierbei nicht um echte »Interaktivität« handelt, ist diese Möglichkeit doch sehr nützlich. Manchmal ist es beispielsweise nötig, eine Stop-Aktion im ersten Bild einzufügen, damit der Film nicht abspielt, bevor irgendetwas eingetreten ist (üblicherweise das Betätigen einer Schaltfläche durch den Anwender). Ein anderes Beispiel wäre das Anhalten inmitten einer Animation. Alles was man braucht, ist ein Schlüsselbild und die StopAktion. Es gibt viele weitere Beispiele für Bild-Aktionen, die eintreten sollen, wenn eine bestimmte Stelle des Films erreicht wurde – nicht nur wenn der Anwender irgendetwas anklickt. Das waren Bild-Aktionen. Was ist aber mit den beiden anderen Möglichkeiten? Hier ist die nächste:

297

ActionScript für die Erzeugung nichtlinearer Filme

Schaltflächen-Aktionen Schaltflächen-Aktionen werden ausgeführt, wenn der Anwender auf eine Schaltfläche klickt. Die Entscheidung, welche Art von Aktion man verwenden soll, ist recht einfach: Wenn sie beim Erreichen einer Stelle im Film ausgeführt werden soll, verwenden Sie eine Bild-Aktion. Muss der Anwender aber interagieren, um Ihre Aktion aufzurufen, sollten Sie diese in der Instanz einer Schaltfläche unterbringen. Bild-Aktionen werden nach einem einfachen Muster erzeugt: Sie fügen die Aktion einfach in ein Schlüsselbild ein. Schaltflächen-Aktionen setzen allerdings voraus, dass Sie angeben, welches Maus-Ereignis die Aktion auslösen soll. Wollen Sie reagieren, wenn der Anwender die Maustaste drückt oder erst, wenn er sie wieder loslässt? Vielleicht wollen Sie sogar eine Aktion starten, wenn der Mauszeiger sich über die Schaltfläche hinweg bewegt. Diese Details geben Ihnen die Möglichkeit, die Aktion genau dann auszuführen, wann Sie es für sinnvoll halten. Maus-Ereignisse sind spezielle Situationen, die wiedergeben, wie genau der Anwender mit einer Schaltfläche interagiert. Man kann eine Schaltfläche nämlich nicht nur ansprechen, indem man die Maustaste drückt, sondern es ist manchmal auch sinnvoll, eine Aktion auszuführen, wenn sie wieder losgelassen wird. Diese Details sind aber nur für Schaltflächen interessant, da bei BildAktionen die Aktion immer dann ausgeführt wird, wenn das Bild erreicht wird. Die beste Möglichkeit, das nachzuvollziehen, ist, es selbst auszuprobieren. Wir werden in unserer letzten Übung einfach zwei Schaltflächen einbauen, mit denen man den Film anhalten und weiterspielen lassen kann.

Übung: Fügen Sie Schaltflächen in Ihre Animation ein, die diese anhalten und weiterspielen lassen können 1. Verwenden Sie entweder die Datei aus der letzten Übung oder erstellen Sie eine neue mit einem Bewegungstween über mehrere Bilder (stellen Sie sicher, dass sich etwas auf der Bühne bewegt, damit man sehen kann, ob die Animation abläuft oder steht). 2. Fügen Sie eine neue Ebene für die Schaltflächen ein. Wir wollen diese nämlich nicht in eine Ebene mit einem Bewegungstween einfügen, da sich die Elemente stören könnten. Nennen Sie die neue Ebene Schaltflächen. 3. Erzeugen Sie ein Rechteck in der neuen Schaltflächen-Ebene und wandeln Sie es in ein Schaltflächen-Symbol namens Meine Schaltfläche um.

298

Aktionen verwenden

4. Da wir zwei Schaltflächen benötigen, sollten Sie eine weitere Instanz von Meine Schaltfläche auf die Bühne (in die Schaltflächen-Ebene) bringen. Färben Sie eine Schaltfläche rot (für Stopp) und eine grün (für Wiedergabe) ein. Das funktioniert (wie Sie sich erinnern werden) über das Eigenschaften-Bedienfeld mit der Option Farbton. 5. Jetzt müssen wir unterschiedliche Aktionen für die beiden Schaltflächen einfügen. Wählen Sie die rote Schaltfläche aus und öffnen Sie das Bedienfeld für Schaltflächen (jetzt Objekt-Aktionen). Doppelklicken Sie auf die Filmsteuerungs-Aktion Stop in der Aktionsliste. Obwohl Sie eigentlich nur eine Aktion einfügen, werden drei Zeilen in den Scriptbereich geschrieben (siehe Abbildung 14.7). Das hängt damit zusammen, dass man nicht einfach Aktionen mit einer Schaltfläche verknüpfen kann, sondern man muss sie zusätzlich mit einem Maus-Ereignis in Verbindung bringen. Das Standard-Ereignis heißt release (loslassen). Die Aktion wird also ausgeführt, wenn der Anwender die Schaltfläche nach dem Anklicken wieder loslässt. Wir werden später noch weitere Ereignisse besprechen.

Abbildung 14.7: Eine mit einer Schaltfläche verknüpfte Aktion darf sich nur innerhalb eines Maus-Ereignisses befinden.

6. Wählen Sie nun die grüne Schaltfläche aus und fügen Sie ihr die Aktion play (Wiedergabe) aus den Filmsteuerung-Aktionen zu. Testen Sie dann den Film. Das Einbetten einer Aktion in ein Maus-Ereignis macht bei Objekt-Aktionen Sinn, da man genau festlegen muss, wann die Aktion ausgeführt werden soll. Das Erzeugen von drei Zeilen kann aber ein wenig verwirrend sein. Deshalb ist auch eine andere Herangehensweise denkbar.

299

ActionScript für die Erzeugung nichtlinearer Filme

In der letzten Übung haben wir eine Aktion eingefügt, die dann automatisch in ein MausEreignis eingebunden wurde. In diesem Fall könnte man das Ereignis modifizieren, um es auf die eigenen Wünsche anzupassen. Damit haben wir aber zuerst das Ergebnis (die Aktion) festgelegt und danach das Ereignis angegeben, das überhaupt zu der Aktion führt. Logischer erscheint da die andere Variante: Legen Sie zuerst das Maus-Ereignis und danach die Aktion fest. Den Eintrag on finden Sie unter den Filmsteuerung-Aktionen. Fügen Sie diesen zuerst ein und wählen Sie in den Parametern aus, welches Ereignis genau die Aktion auslösen soll. Dann fügen Sie zwischen den geschweiften Klammern die gewünschten Aktionen ein (siehe Abbildung 14.8).

Abbildung 14.8: Nachdem ein MausEreignis festgelegt wurde, wird der damit verknüpfte Aktionsbereich durch eine öffnende Klammer { eingeleitet und durch eine schließende } wieder beendet.

Wenn Sie diesem Weg folgen, kann die Sache für Sie ein wenig logischer sein, da Sie das Script in zeitlich richtiger Reihenfolge erstellen. Bisher waren unsere Aktionen recht einfach, allerdings sind die Maus-Ereignisse noch viel mächtiger. Man kann beispielsweise die gleiche Aktion von mehreren Ereignissen auslösen lassen. Selbstverständlich kann man in derselben Schaltfläche auch mehrere Ereignisse verschiedene Aktionen ausführen lassen. So könnte eine Schaltfläche beim Maus-Ereignis Press die Aktion Stop und bei Release wieder Play auslösen. Auf diese Weise würde der Film nur so lange angehalten, wie die Schaltfläche auch gedrückt wird. Bevor wir die Grundlagen der Aktionen bei Schaltflächen abschließen, sollten Sie sich die folgenden Sachverhalte noch einmal klar machen: Es ist wichtig, dass Sie Aktionen immer auf die Instanzen von Schaltflächen anwenden und nicht versuchen, diese in den MasterSymbolen unterzubringen. Das ist zwar sehr verlockend und scheint auch logisch zu sein, wenn man beispielsweise für alle Instanzen bestimmte Aktionen festschreiben will. Aber diese Methode funktioniert einfach nicht. Was Sie ohne Bedenken machen können, ist, einer Instanz die gewünschten Aktionen hinzuzufügen und die modifizierte Schaltfläche wiederum in eine Filmsequenz zu konvertieren. Auf diese Weise kann man schnell Schaltflächen mit gleichen Aktionen produzieren.

300

Aktionen verwenden

Filmsequenz-Aktionen Wir haben nun das Anwenden von Aktionen auf Schlüsselbilder und Schaltflächen kennen gelernt. Die meisten Fälle, in denen Sie Aktionen verwenden werden, fallen bestimmt in diese beiden Kategorien. Allerdings gibt es noch eine dritte Möglichkeit: Instanzen von Filmsequenzen. Auch wenn das jetzt ein wenig verwirrend sein kann, besteht bei Filmsequenzen (im Gegensatz zu Schaltflächen) die Möglichkeit, die Aktionen auch in den Master-Symbolen unterzubringen. Auch wenn man die Aktionen innerhalb der Filmsequenz nur auf Schlüsselbilder und Schaltflächen anwenden kann (was ja jetzt hinreichend besprochen wurde), will ich Ihnen zeigen, wie man sie mit Instanzen von Filmsequenzen verbindet. Wenn wir diese Methode hier in aller Ausführlichkeit besprechen wollten, würde das zu diesem Zeitpunkt ein wenig kompliziert werden. Allerdings kann ich Ihnen mit der folgenden Übung einen kleinen Vorgeschmack geben, was Sie in Kapitel 15 und in Anhang B noch zum Thema ActionScript erwartet.

Übung: Fügen Sie eine Aktion in die Instanz einer Filmsequenz ein 1. Erstellen Sie eine Filmsequenz, die aus einigen Bildern besteht und versehen Sie diese mit einer kleinen Animation, sodass man sehen kann, ob sie diese abspielt. 2. Platzieren Sie die Filmsequenz auf der Bühne und testen Sie den Film, um sicherzustellen, dass die Animation funktioniert. 3. Wenn Sie wieder in Flash zurück sind, wählen Sie die Instanz der Filmsequenz aus und öffnen Sie das Aktionen-Bedienfeld. Beachten Sie, dass fast alle Aktionen in der Aktionsliste verfügbar (also nicht deaktiviert) sind. 4. Fügen Sie die Aktion Stop aus den Filmsteuerung-Aktionen ein. Sie werden feststellen, dass die Aktion wieder eingebettet wird. Dieses Mal handelt es sich um ein Filmsequenz-Ereignis (»clip event«). Das Standard-Ereignis ist hierbei load, weshalb Sie ein Script wie in Abbildung 14.9 haben sollten. 5. Testen Sie nun den Film und Sie werden sehen, dass die Filmsequenz sofort anhält, nachdem sie geladen wurde (also zum ersten Mal auf dem Bildschirm erscheint). Man kann diesen Effekt auch erzielen, indem man die Stop-Aktion auf das erste Bild der Sequenz anwendet. Es spricht nichts dagegen, allerdings sollten Sie beachten, dass man auf diese Weise jede Instanz der Filmsequenz nach dem Laden anhält. Wenn man die Aktion allerdings auf die Instanz bezieht – wie wir es gerade getan haben – beeinflusst man damit nur diese eine Instanz.

301

ActionScript für die Erzeugung nichtlinearer Filme

Abbildung 14.9: Eine Aktion, die man einer Filmsequenz-Instanz zufügt, wird automatisch einem Filmsequenz-Ereignis (hier load) zugeordnet.

6. Wir werden nun noch zwei weitere Aktionen einfügen, die auf die Ereignisse mouseDown und mouseUp reagieren sollen. Wenn der Anwender klickt (mouseDown), soll die Filmsequenz abspielen. Wenn er die Maustaste aber wieder loslässt (mouseUp), soll auch die Sequenz anhalten. Wenn Sie momentan eine Zeile ausgewählt haben, die sich innerhalb der geschweiften Klammern befindet, werden Sie dort keine Filmsequenz-Ereignisse einfügen können. Es gibt keine Ereignisse in Ereignissen. 7. Ziehen Sie eine Play-Aktion unter die schließende Klammer des ersten onClipEvent. Auch diese Aktion wird automatisch in ein eigenes Filmsequenz-Ereignis »verpackt«. Wiederholen Sie den Vorgang mit einer Stop-Aktion. 8. So macht das Script nicht viel Sinn, da wir nun drei Versionen des onClipEvent(load) haben. Das erste ist noch o.k., beim zweiten sollten Sie aber die Ereigniszeile (onClipEvent(load)) anklicken und die Parameter im Ereignis von Laden auf Maus drücken ändern. Das letzte Ereignis sollte mit dem Parameter Maus loslassen versehen werden. Wenn Sie alles richtig gemacht haben, wird Ihr Script wie in Abbildung 14.10 aussehen. 9. Testen Sie den Film. Das Ergebnis ist wirklich verblüffend, wenn man die Einfachheit des ActionScripts bedenkt, das Sie eingebaut haben. Kehren Sie zurück ins AktionenBedienfeld und lesen Sie das Script noch einmal durch.

302

Aktionen verwenden

Abbildung 14.10: Die fertigen Aktionen für diese Filmsequenz

Es gibt ein paar wichtige Anmerkungen zu dieser Übung. Die Filmsequenz-Eigenschaften mouseDown und mouseUp beziehen sich auf jeden Mausklick – nicht nur auf die Klicks, die auf die Filmsequenz selbst angewandt werden. Wenn Sie etwas programmieren wollen, das sich auf einen Klick in einem bestimmten Bereich oder gezielt auf eine Grafik bezieht, sollten Sie eine Schaltfläche verwenden. Versuchen Sie einmal Folgendes: Erstellen Sie ein Schlüsselbild in Bild 20 der Hauptzeitleiste. Verschieben Sie die Instanz der Filmsequenz und fügen Sie in Bild 1 einen Bewegungstween ein. Testen Sie nun den Film und Sie werden sehen, dass sich der Mausklick nur auf das Abspielverhalten der Filmsequenz auswirkt. Die komplette Animation läuft ständig weiter. Mit dieser Technik kann man viel bewirken. Was Sie im Moment behalten sollten, ist, dass Aktionen von Filsequenz-Instanzen immer in Ereignisse eingebettet werden (genauso wie bei Schaltflächen). Schaltflächen reagieren auf on und Filmsequenzen auf onClipEvent. Außerdem beziehen sich solche Aktionen nur auf die eine Instanz der Filmsequenz, der sie zugeordnet sind.

Aktionen bearbeiten Wir haben bereits gelernt, wie man Aktionen in Schlüsselbilder, Schaltflächen-Instanzen und in Instanzen von Filmsequenzen einfügt. Dabei haben wir auch kleine Veränderungen an den einzelnen Aktionen vorgenommen. Allerdings kann man noch mehr tun als beispielsweise nur die Bildnummer einer goto-Aktion zu verändern.

303

ActionScript für die Erzeugung nichtlinearer Filme

Sie sollten sich zuerst einmal mit dem Aktion-Bedienfeld ein wenig vertrauter machen. Deshalb sollen Sie auch den Parameterbereich immer geöffnet lassen. Schauen Sie sich die Tastenkombinationen von häufig verwendeten Aktionen an, indem Sie mit der +-Schaltfläche nachschlagen. Machen Sie sich außerdem mit dem Verschieben von Aktionen im Aktionsfenster vertraut, denn Sie werden es oft benötigen. Man kann nur einige wenige Sachen mit dem Aktionen-Bedienfeld anstellen: Aktionen einfügen, bearbeiten und löschen. Wie bei jedem anderen Bedienfeld auch beziehen sich die Angaben jeweils nur auf die angegebene Schaltfläche, Filmsequenz oder das Schlüsselbild. Wenn Sie meinen, dass Sie gerade kein Script schreiben können, liegt das meist daran, dass Sie keines dieser Objekte ausgewählt haben. Man kann auch schnell denken, man habe ein Script verloren, wobei man allerdings nur die aktuelle Auswahl aufgehoben hat.

getURL Während man mit einer goto-Aktion zu einem anderen Bild springt, kann man mit GetURL den Anwender zu einer anderen Internetseite schicken. Wenn Sie sich mit Hyperlinks in HTML auskennen – GetURL ist das Gleiche. Als Parameter müssen Sie die Adresse der zu ladenden Internetseite angeben. URL steht für »uniform resource locator« und ist der Standard für die Adressierung von Internetseiten. Wenn Sie mit getURL beispielsweise auf meine Internetseite verweisen wollen, müssen Sie den URL kennen (er ist http:// www.phillipkerman.com). Es gibt noch einige weitere Attribute für diese Aktion, die wir allerdings im Kapitel 18 kennen lernen werden. Wir können das aber schnell einmal durchgehen, um zu sehen, wie einfach die Sache ist.

Übung: Erstellen Sie eine Schaltfläche, die auf eine anderen Internetseite verweist 1. Erschaffen Sie in einer neuen Datei eine Schaltfläche und bringen Sie eine Instanz davon auf die Bühne. 2. Öffnen Sie das Aktionen-Bedienfeld, wenn die Instanz ausgewählt ist. 3. Fügen Sie die Aktion getURL aus den Browser/Netzwerk-Aktionen ein. Wählen Sie die gerade eingefügte Aktion aus und tragen Sie beim Parameter URL die Adresse http:// www.phillipkerman.com ein.

304

Aktionen verwenden

4. Testen Sie den Film (oder besser: wählen Sie DATEI / VORSCHAU FÜR VERÖFFENTLICHUNGEN / STANDARD beziehungsweise drücken Sie (F12), um das Ergebnis in einem Browser zu sehen). Klicken Sie nun auf die Schaltfläche und wenn Sie online sind, werden Sie sich auf meiner Homepage wiederfinden.

Filmsequenzen anvisieren Die Navigations-Aktionen, die wir bisher kennen gelernt haben, ermöglichen es uns, in der Zeitlinie oder im Web umherzuspringen. Allerdings wissen Sie auch, dass Filmsequenzen ihre eigene Zeitlinie haben. Wie springt man also in Filmsequenzen? Wenn sich die Aktion innerhalb der Filmsequenz befindet oder auf die Instanz einer Sequenz angewendet wird, ist die Sache klar: Ein Stop beispielsweise hält die Filmsequenz immer an. Es wird allerdings etwas komplizierter, wenn man eine Aktion »aus der Ferne« auf eine Filmsequenz anwenden will. Nehmen wir einmal an, Sie haben eine Filmsequenz und eine Schaltfläche (die sich nicht innerhalb der Filmsequenz befindet). Wenn Sie nun die Schaltfläche mit einer Stop-Aktion belegen, wird per Klick das Abspielen des Films befohlen, allerdings wird die Filmsequenz dann immer noch weiter spielen. Damit man die Aktion nun gezielt auf eine Instanz ausrichten kann, muss man diese anvisieren. Bedenken Sie, dass es mehrere Instanzen des gleichen Master-Symbols auf der Bühne geben kann. Diesen Konflikt kann man in Flash auf mehrere Arten lösen. Man muss ja zwei Sachen erledigen: die Filmsequenz anvisieren und ihr befehlen, was zu tun ist. Erinnern Sie sich bitte, dass wir in Kapitel 12 schon festgestellt haben, dass man Filmsequenzen (über das Eigenschaften-Bedienfeld) benennen kann. Wenn man den Namen kennt, kann man die Sequenz gut anvisieren. Jetzt muss nur noch befohlen werden, was zu tun ist. Auch wenn es elegantere Methoden gibt, ist die am leichtesten verständliche wohl die Aktion with. Diese Aktion ist recht trickreich, denn man benötigt mehrere Schritte: Der erste ist, die Ziel-Filmsequenz zu benennen und dann die Aktion zu befehlen. Wenn Sie with aus der Aktionsliste auswählen, ist der einzige einzugebene Parameter das anzuvisierende Objekt. Man kann hier den Namen der Instanz angeben, auf welche die Aktion wirken soll (siehe Abbildung 14.11). Schreiben Sie nun nur noch die auszuführenden Aktionen in die geschweiften Klammern. Natürlich ist es nicht immer so einfach. Stellen Sie sich vor, Sie haben eine Filmsequenz innerhalb einer Filmsequenz. Solange Sie diese einzeln benennen, ist das Anvisieren noch recht einfach. Versuchen wir das einmal mit einer relativ komplexen Filmsequenz, die wiederum Filmsequenzen enthält.

305

ActionScript für die Erzeugung nichtlinearer Filme

Abbildung 14.11: In der with-Aktion muss man den Namen der anzuvisierenden Instanz angeben. Außerdem muss man in den Klammern die auszuführenden Aktionen angeben.

Übung: Verwenden Sie with, um eingebundene Instanzen anzuspringen In dieser Übung werden wir die Aktion with anwenden, um die Filmsequenzen von Rädern anzuhalten, die sich in einer Auto-Filmsequenz befinden. 1. Wir brauchen ein Auto mit drehenden Rädern, wie wir es bereits in Kapitel 12 in der Übung »Verwenden Sie eine Filmsequenz, um ein Rad zu drehen« erzeugt haben. Schlagen Sie dort gegebenenfalls noch einmal nach. 2. Ziehen Sie eine Instanz von Drehendes Rad auf die Bühne. Testen Sie den Film und merken Sie sich die Richtung, in die sich das Rad dreht. 3. Ziehen Sie eine weitere Instanz auf die Bühne und positionieren Sie sie links von dem anderen Rad. Nennen Sie die eine Instanz Vorderrad und die andere Hinterrad (siehe Abbildung 14.12). 4. Zeichnen Sie die Karosserie des Autos um die beiden Räder. Wählen Sie alles aus und konvertieren Sie es in eine Filmsequenz namens Auto. 5. Es gibt jetzt eine Instanz von Auto auf der Bühne. Da sie aber noch keinen Namen hat, nennen Sie diese im Eigenschaften-Bedienfeld einfach Das_Auto. 6. Fügen Sie ein Schlüsselbild in Bild 40 ein und bewegen Sie dort das Auto an eine andere Stelle auf der Bühne. Fügen Sie danach in Bild 1 einen Bewegungstween ein. 7. Zeichnen Sie in einer neuen Ebene ein Rechteck, das als Schaltfläche dienen soll. Konvertieren Sie es also in eine Schaltfläche namens Meine Schaltfläche. Ziehen Sie eine weitere Instanz der Schaltfläche auf die Bühne und verwenden Sie das Eigenschaften-Bedienfeld, um eine rot und die andere grün einzufärben.

306

Aktionen verwenden

Abbildung 14.12: Mit dem EigenschaftenBedienfeld benennen wir die einzelnen Räder so, dass sie getrennt angesprochen werden können.

8. Wählen Sie nun die rote Instanz von Meine Schaltfläche aus und öffnen Sie das Aktionen-Bedienfeld. Fügen Sie eine Stop-Aktion ein. 9. Testen Sie den Film und Sie werden sehen, dass unser Auto zwar anhält, die Räder sich aber noch weiter drehen. Um diesen Mangel zu beheben, brauchen wir zusätzliche Aktionen. 10. Kehren Sie nach Flash zurück und fügen Sie eine with-Aktion direkt nach Stop ein (siehe Abbildung 14.13).

Abbildung 14.13: Im Maus-Ereignis release fügen wir die with-Aktion direkt nach Stop ein.

307

ActionScript für die Erzeugung nichtlinearer Filme

11. Klicken Sie in das Parameterfeld Objekt und danach auf die Schaltfläche Zielpfad einfügen (die Schaltfläche mit dem Fadenkreuz). 12. Es öffnet sich nun das Fenster Zielpfad einfügen. Hier wird eine Hierarchie mit den Namen der einzelnen Instanzen von Filmsequenzen angezeigt, die sich in Ihrem Film befinden. Klicken Sie auf das Plus-Zeichen neben Das_Auto, um die untergeordneten Instanzen zu sehen. Klicken Sie nun auf Vorderrad und dann auf OK (siehe Abbildung 14.14). Beachten Sie, dass nun Das_Auto.Vorderrad im Objekt-Feld stehen muss.

Abbildung 14.14: Im Fenster ZIELPFAD EINFÜGEN kann man jede Instanz gezielt auswählen.

13. Nun müssen wir angeben, was wir der Vorderrad-Instanz befehlen wollen. Fügen Sie deshalb in die geschweiften Klammern von with die Stop-Aktion ein (siehe Abbildung 14.15).

Abbildung 14.15: Fügen Sie in den geschweiften Klammern von with die Stop-Aktion ein.

308

Aktionen verwenden

14. Wiederholen Sie diesen Prozess für die Hinterrad-Instanz. Stellen Sie sicher, dass sich die letzte with-Aktion noch vor der schließenden Klammer des Maus-Ereignisses, aber hinter der schließenden Klammer der ersten with-Aktion befindet. Das fertige Script sehen Sie in Abbildung 14.16.

Abbildung 14.16: Das fertige Script visiert die beiden Instanzen der drehenden Räder an.

15. Testen Sie nun den Film. Wenn Sie die rote Schaltfläche anklicken, stoppen die beiden Räder zusammen mit dem Auto. Sie sollten nun den ganzen Prozess noch einmal für die grüne Schaltfläche und die Play-Aktion wiederholen, damit der Anwender das Auto auch wieder weiterfahren lassen kann. Das Ganze kann jetzt etwas kompliziert erscheinen, da wir drei verschiedene Zeitleisten ansprechen mussten, nur um das Auto anzuhalten. Man kann aber den Quelltext ein wenig verkleinern, indem man die Stop-Aktion direkt in der Instanz aufruft. Wir werden uns mit dieser Methode im nächsten Kapitel noch genauer beschäftigen. Denken Sie immer daran, dass alle Befehle, die Sie an eine anvisierte Instanz weitergeben wollen, innerhalb der geschweiften Klammern von with stehen müssen. In Abbildung 14.17 habe ich in diesen Bereich mehrere Zeilen Kommentar (der nichts ausführt) geschrieben. Das Anvisieren von Filmsequenzen ist ganz einfach, wenn man diese mit Namen versieht.

309

ActionScript für die Erzeugung nichtlinearer Filme

Abbildung 14.17: Die Aktion with ist immer dann sinnvoll, wenn man mehrere Aktionen an ein Objekt senden will.

Effizienz-Tricks Da Sie nun eine Idee haben, wie man Aktionen einfügen kann, können wir am Feintuning dieser Technik arbeiten. Man kann beispielsweise eine eigene Ebene nur für die Aktionen anlegen. Da man Aktionen nicht in Bildern, sondern nur in Schlüsselbildern anbringen kann und die Ausführung einer Aktion oft auch mitten in einem Tween erfolgen soll, ist es von Vorteil, das Schlüsselbild in einer gesonderten Ebene einzubinden. So wird der Tween nicht gestört. Außerdem halten Sie Ihre Bild-Aktionen beisammen und müssen nicht in allen Ebenen nach einer bestimmten Aktion suchen. Eine verwandte Technik ist, eine eigene Ebene für die Bildmarkierungen einzurichten. Die Gründe sind die gleichen wie im Abschnitt zuvor.

14.2 Zusammenfassung Wir haben die fundamentalen Ergebnisse von Aktionen kennen gelernt. Wir haben gesehen, wie man eine Aktion platziert und wie diese durch den Abspielkopf oder durch den Anwender gestartet werden kann. Neben Schlüsselbildern und Schaltflächen haben wir aber auch Aktionen in Filmsequenzen angeordnet.

310

Workshop

Außerdem haben wir festgestellt, dass viele Aktionen zusätzliche Parameter benötigen. Wir haben zwar nur an der Oberfläche von Aktionen gekratzt. Sie haben sich aber die Grundlagen für das Verständnis von ActionScript angeeignet, das Ihnen in Flash sicher öfter begegnen wird.

14.3 Workshop F&A F

Ich habe die Aktion gotoAndPlay(5) in das letzte Bild meines Films geschrieben. Außerdem befindet sich hier ein Textblock. Dieser ist aber beim Abspielen nie zu sehen. Erst wenn ich die Aktion ein Bild später einfüge, sieht man den Text. Woran liegt das? A

F

Wieso wiederholt sich mein Film (als ob ich eine gotoAndPlay(1)-Aktion im letzten Bild ausführen würde), obwohl ich keinerlei Aktion im Film verwendet habe? A

F

Wenn der Effekt beim Testen des Films auftritt, werden Sie beim Testen wohl die Funktion STEUERUNG / WIEDERHOLUNG im Flash Player (nicht in Flash selbst) aktiviert haben. Wenn Sie das ausstellen, wird der Film am Ende anhalten (solange Sie keine Aktion einfügen, die für eine Wiederholung sorgt). Normalerweise brauchen Sie nicht einmal eine Stop-Aktion im letzten Bild, denn wenn Sie beim Veröffentlichen die Schleifen-Option deaktivieren, wird der Film auch beim Anwender nicht wiederholt.

Welche Aktion muss ich verwenden, um ein Spiel zu erschaffen, wie man es von den vielen Werbe-Videospielen kennt? A

1

Das ist eine kritische Geschichte: Eine Bild-Aktion wird immer sofort ausgeführt, wenn der Abspielkopf das Bild mit der Aktion erreicht. Der Text wird erst danach auf dem Bildschirm erscheinen. Flash springt vorher aber schon zu Bild 5.

Ich hoffe, dass Sie verstehen, warum man einen Schritt nach dem anderen machen sollte. Auch wenn wir viele interessante Dinge in diesem Kapitel gelernt haben, so brauchen Sie für derartig aufwändige Projekte noch viel mehr Wissen. Hier haben wir lediglich die Grundlagen gelegt.1

Diese Thematik füllt ein eigenes Buch. Sie können sich mit dem Titel »Jetzt lerne ich Spiele programmieren mit Flash« von Hans Jörgen Wevers, ISBN 3-8272-6211-9, die notwendigen Kenntnisse in Flash und ActionScript sowie im Spiele-Design aneignen. Das Buch ist derzeit nur für Flash 5 lieferbar. Da sich in ActionScript jedoch kaum etwas geändert hat (die größten Änderungen von ActionScript gab es schon beim Versionswechsel von Flash 4 auf Flash 5), dürfte das kein Problem sein.

311

ActionScript für die Erzeugung nichtlinearer Filme

Quiz Sie wissen Bescheid, oder? 1. Wo kann man in Flash Aktionen einfügen? a.

In Schaltflächen-Symbolen, in Schlüsselbildern und in Filmsequenz-Symbolen

b. In jedem Schlüsselbild außer in Bild 1 (und in Schaltflächen und Filmsequenzen) c. In Schlüsselbildern, Schaltflächen-Instanzen und Filmsequenz-Instanzen 2. Was ist eine Aktion überhaupt? a.

Etwas, das sich auf der Bühne bewegt

b. Eine vorgefertigte Flash-Komponente, die irgendetwas ausführt c. Was Programmierer Funktionen nennen 3. Wie viele Aktionen kann man in eine Schaltfläche einfügen? a.

Eine für jedes Maus-Ereignis

b. Nicht mehr als zwei c. So viele man will

312

T ag 1

Grundlagen

23

T ag 2

Malen und Zeichnen

53

T ag 3

Grafiken in Flash importieren

89

T ag 4

Fortgeschrittene Zeichentechniken

115

T ag 5

Die Bibliothek produktiv einsetzen

137

T ag 6

Animationen verstehen

161

T ag 7

Animationen im herkömmlichen Stil

175

T ag 8

Animationen mit Bewegungstweening

191

T ag 9

Morphing mit Formtweening

205

Tag 10

Sound einbinden

219

Tag 11

Effektiv mit Ebenen

239

Tag 12

Filmsequenzen und Grafik-Symbole

259

Tag 13

Schaltflächen zum Anklicken für den Anwender erstellen

271

AktionScript verwenden, um nichtlineare Filme zu erzeugen

289

Tag 14

Tag 15

ActionScript für mehr Interaktivität

315

Tag 16

Komponenten verwenden

333

Tag 17

Videos einsetzen

349

Tag 18

Filme ins Internet bringen

363

Tag 19

Modulare Internetseiten entwerfen

373

Tag 20

Optimierung Ihrer Flash-Site

389

Tag 21

Animationstechniken für Fortgeschrittene

417

W O C H E

W O C H E

W O C H E

ActionScript für mehr Interaktivität

5 1

ActionScript für mehr Interaktivität

Sie haben im letzten Kapitel gesehen, wie man mit ein paar strategisch platzierten Aktionen kontrollieren kann, wie der Film abspielt. Eine Aktion, die auf einer Schaltfläche liegt, lässt den Anwender in den Film eingreifen, wenn er auf die Schaltfläche klickt. Außerdem kann man Aktionen in ein Schlüsselbild einfügen, um wieder zu einem anderen Bild zurückzuspringen. Das letzte Kapitel hat Spaß gemacht, war aber nur die Spitze des Eisbergs. An diesem Tag dürfen Sie sich noch einmal mit dem Thema »Interaktivität durch ActionScript« auseinandersetzen. Sie werden nun lernen, wie man etwas komplexere Aufgaben mit dieser Programmiersprache löst. In diesem Kapitel werden Sie: 쐽

verschiebbare Objekte erstellen und

쐽

die Grundlagen der Programmierung lernen, um Benutzerinformationen zu erfassen und die visuellen Eigenschaften von Filmsequenzen zu verändern.

Sie haben eine große Aufgabe vor sich. Auch wenn Sie sich nicht als »Programmierer« sehen, wird Ihnen dieses Kapitel einen Einblick in das Potential von Flash geben. Wenn Sie sich in der Programmierung schon auskennen, werden Sie in den folgenden Abschnitten kaum eine Herausforderung finden, aber es werden die Grundzüge der Programmierung in Flash erfahren.

15.1 Drag&Drop-Interaktionen erzeugen Eine der effektivsten Methoden, wie man dem Anwender Interaktivität zugestehen kann, ist das Verschieben von Objekten auf der Bühne. Dabei handelt es sich nicht nur um eine Grundvoraussetzung in der Spiele-Programmierung, sondern auch um ein großartiges pädagogisches Hilfsmittel, da man auf diese Weise gut lernen kann. Dieser Effekt ist in Flash recht einfach zu erzeugen. Es gibt jedoch ein kleines Dilemma. Man kann in Flash ganz einfach über Schaltflächen feststellen, ob ein Anwender in einen bestimmten Bereich geklickt hat. Das ist o.k., denn man kann die startDrag-Aktion in einer Schaltfläche definieren. Das Problem ist aber, dass man bei dieser Aktion als Parameter angeben muss, welche Filmsequenz man verschieben will, weshalb startDrag nur auf Filmsequenzen wirkt. Allerdings wollen Sie diese Funktionalität ja bei einer Schaltfläche nutzen. (Es ist zwar möglich, Filmsequenz-Ereignisse statt Maus-Ereignissen zu verwenden, bedenken Sie aber, dass ein mouseDown in einer Filmsequenz alle Mausklicks abfängt, auch wenn sie nicht über der Filmsequenz ausgeführt wurden!)

316

Drag&Drop-Interaktionen erzeugen

Übung: Erzeugen Sie eine einfache, verschiebbare Filmsequenz In dieser Übung werden Sie die einfachste verschiebbare Filmsequenz erstellen, die es gibt: 1. Zeichnen Sie in einer neuen Datei ein Quadrat. Konvertieren Sie dieses in eine Schaltfläche namens Schaltfläche. 2. Wählen Sie die soeben erstellte Instanz aus und konvertieren Sie sie in eine Filmsequenz namens Sequenz-Schaltfläche. Stellen Sie sicher, dass es sich bei der Instanz auf der Bühne um die Filmsequenz und nicht um die Schaltfläche handelt. Jetzt begeben Sie sich in das Master-Symbol der Filmsequenz und fügen der Schaltfläche eine Aktion hinzu, die quasi »Zieh mich!« sagt. Doppelklicken Sie dazu zuerst auf die Instanz der Filmsequenz, um in ihr Master-Symbol zu gelangen. Wählen Sie die Instanz der Schaltfläche aus und öffnen Sie das Aktionen-Bedienfeld. Öffnen Sie hier aus der Aktionsliste die Gruppe Aktionen/Movieclipsteuerung. Nun finden Sie die Aktion startDrag, auf die Sie doppelklicken. 3. Testen Sie nun den Film und probieren Sie aus, was funktioniert und was nicht. Wenn man klickt und dann bei gedrückter Maustaste die Maus bewegt, passiert nichts. Wenn man aber auf das Quadrat klickt und die Maustaste loslässt, fängt man an zu ziehen – aber erst nach dem Loslassen! 4. Um diesen Fehler zu beheben, müssen Sie wieder zur Schaltflächen-Instanz in der Filmsequenz gehen und die eingefügte Aktion so verändern, dass sie nicht auf das Maus-Ereignis release, sondern auf press reagiert (siehe Abbildung 15.1). Wenn Sie den Film erneut testen, werden Sie feststellen, dass die Funktionalität jetzt gegeben ist. Allerdings können Sie den gezogenen Bereich nicht wieder loslassen. 5. Die Schaltflächen-Instanz muss auf zwei Ereignisse reagieren. Beim Drücken der Maustaste muss das Ziehen der Filmsequenz beginnen und beim Loslassen der Taste muss das Ziehen beendet werden. Dazu ziehen Sie bitte die stopDrag-Aktion aus der Aktionsliste unter die letzte Zeile des bisherigen Scripts im Scriptbereich (siehe Abbildung 15.2). 6. Das zweite Maus-Ereignis (das unsere stopDrag-Aktion enthält) verwendet das releaseEreignis standardmäßig. Sie sollten für das Maus-Ereignis aber noch die Option Außerhalb loslassen aktivieren, um eine Fehlerquelle zu vermeiden, denn unter bestimmten Umständen kann es passieren, dass sich der Anwender beim Loslassen außerhalb der Schaltfläche befindet. Das Ergebnis sieht dann wie in Abbildung 15.3 aus.

317

ActionScript für mehr Interaktivität

Abbildung 15.1: Wenn man die erste Zeile eines Scripts auswählt, kann man angeben, auf welches Maus-Ereignis das eingebettete Script reagieren soll.

Abbildung 15.2: Wenn man die stopDrag-Aktion unter die letzte Zeile des Scripts zieht, wird automatisch ein neues MausEreignis eingefügt.

318

Drag&Drop-Interaktionen erzeugen

Abbildung 15.3: Die fertige Version einer einfachen verschiebbaren Filmsequenz

Die anonyme Methode Wenn man eine Schaltfläche in eine Filmsequenz einfügt, kann man der Schaltfläche die Aktion startDrag(""), also ohne Parameter, zuordnen. Auf diese Weise wird die Aktion auf die unbenannte Instanz angewendet. So können Sie mehrere Instanzen auf der Bühne haben, die alle über einen eigenen Drag-Knopf verfügen.

Die Grundlagen verschiebbarer Sequenzen Ich hoffe, Sie hatten in der letzten Übung ein kleines Erfolgserlebnis. Die Konstruktion mit der Schaltfläche in der Filmsequenz war zwar etwas merkwürdig, aber dennoch recht einfach. Nun sollten wir uns mit ein paar Parametern der startDrag-Aktion beschäftigen. In Abbildung 15.5 können Sie die Option Maus zentrieren erkennen. Wenn Sie sie aktivieren, wird die Filmsequenz immer so an der Maus ausgerichtet, dass sich diese in der Mitte befindet. Testen Sie das doch einmal an der Datei, die Sie soeben erstellt haben. Dadurch wird zwar kein gravierender Unterschied erzeugt, aber das Ziehen »fühlt sich anders an«. Der Anwender bemerkt sofort, dass er die Filmsequenz bewegen kann, denn sie springt sofort in Position, wenn er darauf klickt. Wenn Sie diese Option auswählen, erscheint der Zusatz true im Scriptbereich.

319

ActionScript für mehr Interaktivität

Abbildung 15.4: Hier wird bei startDrag kein Ziel angegeben.

Abbildung 15.5: Eine startDragAktion mit aktivierter Option Maus zentrieren.

320

Drag&Drop-Interaktionen erzeugen

Eine weitere Option ist Immer als Rechteck. Hier können Sie ein Rechteck definieren, innerhalb dessen man die Filmsequenz verschieben kann. Wenn Sie die Option aktivieren, müssen Sie das Rechteck definieren, in dem verschoben werden darf. Geben Sie dazu die Angaben links (L), rechts (R), oben (O) und unten (U) an. Mit diesen Einstellungen kann man den Anwender auch davon abhalten, etwas ganz von der Bühne zu ziehen. Wenn Sie die Zahlen berechnen wollen, die Sie hier eintragen sollen, können Sie in der Hauptszene die Filmsequenz in jede extreme Position schieben und die Werte im Eigenschaften-Bedienfeld ablesen. Sie sollten (wie in Abbildung 15.6 gezeigt) sicher gehen, dass Sie den Mittelpunkt der Sequenz anzeigen lassen, denn die einzutragenden Werte im Script beziehen sich auf den diesen.

Abbildung 15.6: Hier kann man angeben, welche Koordinaten angezeigt werden sollen.

Die vorausgegangene Übung stellte eine der gängigen Varianten von verschiebbaren Filmsequenzen dar, denn der Anwender muss eine Schaltfläche drücken, um die Sequenz zu bewegen. Man kann die startDrag-Aktion aber nicht nur in Schaltflächen, sondern auch in Schlüsselbildern definieren. Wenn Sie das beispielsweise im ersten Bild einer Filmsequenz verwenden, wird diese direkt an den Mauszeiger angekoppelt. Auch wenn diese Methode nicht oft gebraucht wird, kommen wir damit doch zum letzten Parameter der startDrag-Aktion – dem Ziel-Feld. Hier kann man nämlich den Namen der Instanz angeben, die man ziehen will. In der letzten Übung haben wir hier nichts angegeben und trotzdem hat es funktioniert, denn Flash nimmt beim Fehlen dieses Parameters die Filmsequenz als Ziel, in der man sich gerade

321

ActionScript für mehr Interaktivität

befindet. Das ist ähnlich wie bei Postadressen. Wenn Sie einen Brief innerhalb Deutschlands versenden, brauchen Sie auch nicht zusätzlich »Deutschland« in die Adresse zu schreiben. Wenn man allerdings in einem Schlüsselbild startDrag ausführt, muss man angeben, welche Filmsequenz gemeint ist.

15.2 In Flash programmieren Der Rest dieses Kapitels beschäftigt sich mit der Programmierung in Flash. Da man über dieses Thema ein eigenes Buch schreiben könnte,1 kann man es leider nicht in einem halben Kapitel zusammenfassen. Ich werde Ihnen aber den Weg andeuten. Wenn Sie kein Interesse an Programmierung haben, können Sie den Rest dieses Kapitels überspringen und in Kapitel 16 weiterlesen. Sie können bei Interesse später noch einmal hierher zurückkehren. (Überspringen Sie aber bitte nicht den Rest des gesamten Buches!)

Variablen Variablen sind ein (momentan noch) sicherer Platz, um Informationen abzuspeichern. Stellen Sie sich jede einzelne Variable als separate Tafel vor. Sie können alles auf diese Tafel schreiben, es löschen und dann wieder etwas anderes darauf schreiben. Genauso ist es auch mit Variablen. Sie sind besonders nützlich, da man ab und zu Daten abspeichern will, während der Film läuft. Das Konzept von Variablen ist, dass jede einen Namen und einen zugeordneten Wert enthält. Man kann mit Variablen zwei Dinge machen: 쐽

den Wert setzen oder verändern und

쐽

ihren Wert auslesen oder prüfen.

Beachten Sie, dass ich nichts vom Erstellen von Variablen gesagt habe, denn man erstellt sie nicht. Eine Variable existiert einfach ab dem Moment, in dem man ihr einen Wert zuweist. Man kann den Wert von Variablen direkt auf der Bühne anzeigen. Dazu benötigen Sie ein Textfeld, für das Sie im Eigenschaften-Bedienfeld das Verhalten auf Dynamischer Text stellen, um Variablenwerte anzuzeigen, oder auf Texteingabe, um Informationen vom Anwender zu erfragen. Als Nächstes müssen Sie diesem dynamischen Text eine Variable zuweisen. Das können Sie im Feld Variable erledigen (siehe Abbildung 15.7). Sobald Sie 1

Zum Beispiel »Jetzt lerne ich Flash MX mit ActionScript« von Björn Walter, ISBN: 3-8272-6384-0, oder »Flash ActionScript für Designer« von Brendan Dawes, ISBN: 3-8272-5992-4, beide beim Markt+TechnikVerlag erschienen

322

In Flash programmieren

das getan haben, wird der Text mit der Variablen verknüpft. Wenn sich der Wert der Variablen also verändert, wird sich der Text entsprechend anpassen.

Abbildung 15.7: Im EIGENSCHAFTEN-Bedienfeld kann man das Verhalten des Textblocks angeben.

Wenn man das auf die Praxis umsetzt, werden Sie für folgende Anwendungen Variablen einsetzen: 쐽

Sie können den Anwender nach seinem Namen fragen, um diesen später zu verarbeiten.

쐽

Wenn der Anwender einen bestimmten Teil des Filmes mehrfach gesehen hat, können Sie einen anderen Abspielkurs einschlagen, wenn man die Variablen mitgezählt hat.

쐽

Sie können dem Anwender Quiz-Fragen stellen und seine Punktezahl ausgeben.

쐽

Sie können über Variablen Text anzeigen, der sich oft verändert.

In der folgenden Übung werden Sie lernen, wie man den Namen des Anwenders abfragt.

Übung: Verwenden Sie eine Variable, um den Namen des Anwenders zu erfassen 1. Öffnen Sie in einer neuen Datei das Eigenschaften-Bedienfeld, das normalerweise nur bereits bestehenden Text verändert, aber auch Text vorkonfigurieren kann, der noch geschrieben wird. Wählen Sie das Text-Werkzeug aus und stellen Sie das Textverhalten Texteingabe ein. Aktivieren Sie die Option Rand und klicken Sie einmal auf die Bühne, um einen Textblock zu erstellen. Sie können den Eingabebereich nun beliebig vergrößern. Es gibt eine interessante Fähigkeit bei Textblöcken mit dem Verhalten Texteingabe: Man kann sie auch ohne Inhalt erstellen. 2. Wählen Sie nun den Textblock aus und geben Sie im Eigenschaften-Bedienfeld im Feld Variable den Wert Anwendername (unseren neuen Variablennamen) ein (siehe Abbildung 15.8). 3. Fügen Sie eine Stop-Aktion in Bild 1 ein.

323

ActionScript für mehr Interaktivität

Abbildung 15.8: Eine Texteingabezeile, in die der Anwender seinen Namen schreiben kann

4. Erstellen Sie eine Schaltfläche und fügen Sie eine Instanz davon neben dem soeben erstellten Textblock ein. Fügen Sie zur Instanz eine Play-Aktion im Maus-Ereignis release hinzu. Wenn der Anwender allerdings (Enter) auf der Tastatur drückt, muss die Schaltfläche ebenfalls gedrückt werden. Dazu können Sie den Parameter Tastendruck aktivieren und den Cursor in das dahinter liegende Feld stellen, um dort (Enter) zu drücken. Es erscheint der Wert . 5. Erzeugen Sie in Bild 10 ein leeres Schlüsselbild (F7) und einen weiteren Textblock. Dieser sollte sich als Dynamischer Text verhalten, damit der Anwender ihn nicht bearbeiten kann. Verknüpfen Sie ihn mit der Variable Mitteilung. 6. Jetzt werden wir einige Aktionen in das Schlüsselbild einfügen. Öffnen Sie also das Bildaktionen-Bedienfeld. Hier fügen Sie die set variable-Aktion (aus der Untergruppe Aktionen/Variablen) ein, um den Wert der Variablen zu verändern. 7. Im Feld Variable können Sie nun Mitteilung eintragen, da diese Variable geändert werden soll. 8. Im Feld Wert wird eingetragen, welcher neue Wert der Variablen zugeordnet werden soll. Wir wollen hier aus Name (oder was auch immer der Anwender eingetragen hat) ein Willkommen Name machen. Dazu müssen wir den Text dynamisch verändern. Aktivieren Sie also die Option Ausdruck neben dem Wert-Feld. Wir werden Flash dazu bringen etwas auszuwerten und nicht den Wert in der Variablen zu speichern, den wir nun eintragen. Schreiben Sie "Willkommen "+Anwendername in das Wert-Feld. Durch das Plus-Zeichen wird der Text "Willkommen " (achten Sie auf das Leerzeichen) mit der Variablen Anwendername verbunden. Alles was sich in Anführungsstrichen befindet, wird von Flash genau so übernommen. 9. Fügen Sie in Bild 10 eine Stop-Aktion in das Schlüsselbild ein und testen Sie den Film. In der vorausgegangenen Übung haben Sie den Anwender eine Variable verändern lassen und diese dann später wieder an ihn ausgegeben. In vielen Fällen macht die Ausgabe aber keinen Sinn (wenn Sie zum Beispiel mitzählen wollen, wie oft ein Anwender auf eine Frage geantwortet hat).

324

In Flash programmieren

In der nächsten Übung werden Sie sehen, wie man den Wert einer Variablen erhöht. Das ist recht einfach, denn eine Variable namens zaehlen soll sich immer dann erhöhen, wenn der Anwender auf eine Schaltfläche drückt. Um das Ergebnis zu überprüfen, werden Sie einen dynamischen Text erstellen, der den Wert von zaehlen ausgibt.

Übung: Erhöhen Sie den Wert einer Variablen 1. Erzeugen Sie in einer neuen Datei eine Schaltfläche und einen dynamischen Textblock mit einer 0 darin. Verknüpfen Sie die Variable zaehler mit dem Text, wodurch die Variable automatisch angelegt wird. 2. Fügen Sie in die Schaltfläche eine evaluate-Aktion ein. Mit dieser Aktion können Sie alles eintragen, was Sie wollen. Tippen Sie in diesem Fall zaehler++. Das bedeutet, dass die Variable zaehler um den Wert 1 erhöht werden soll (siehe Abbildung 15.9).

Abbildung 15.9: Die Aktion, die wir der Schaltfläche zugewiesen haben, wird den Wert von zaehler erhöhen.

3. Testen Sie den Film und Sie werden sehen, wie sich bei jedem Klick auf die Schaltfläche der Wert der Variablen erhöht. Ganz einfach. Ändern Sie die Variable, die mit dem Textblock verknüpft ist in mitteilung. Testen Sie den Film erneut. Funktioniert er? Nur weil Sie den Wert von zaehler nicht mehr sehen, heißt das nicht, dass er nicht mehr erhöht wird. Lassen Sie bitte mitteilung noch eingetragen. 4. Ziehen Sie eine weitere Instanz der Schaltfläche auf die Bühne und definieren Sie in ihr die evaluate-Aktion message="Sie haben "+zaehler+" Mal geklickt!".

325

ActionScript für mehr Interaktivität

5. Testen Sie den Film und klicken Sie 7-mal auf die erste Schaltfläche. Wenn Sie nun auf die zweite Fläche klicken, erscheint der Text mit der richtigen Anzahl an Klicks. Man kann den Wert einer Variablen also auch verändern, wenn man sie nicht sieht. 6. Damit Sie keine veralteten Informationen angezeigt bekommen, können Sie mit der evaluate-Aktion message="" in der ersten Schaltfläche die Anzeige der Klicks löschen. Man kann eine Variable mit variable++ um den Wert 1 erhöhen. Das Gegenteil funktioniert mit variable--, was eine Verringerung um 1 zur Folge hat. Wenn man aber einen anderen Wert als 1 (zum Beispiel 5) verwenden will, geht das mit variable+=5 beziehungsweise variable-=5. Da Sie nicht davon ausgehen können, dass jeder Anwender die von Ihnen gewählte Schriftart installiert hat, können Sie im Eigenschaften-Bedienfeld genau festlegen, welche Zeichen in der Datei abgelegt werden sollen (siehe Abbildung 15.10). Je mehr Sie allerdings auswählen, umso größer wird die Datei!

Abbildung 15.10: Hier kann man angeben, welche Zeichen in der entsprechenden Schriftart in die fertige Datei exportiert werden sollen.

Eigenschaften Jedes Objekt besitzt Eigenschaften, die man beim Erstellen eines Films verändern kann. Man kann sich diese Eigenschaften als sichtbare Elemente vorstellen. Da gibt es zum Beispiel _x (X-Position), _y (Y-Position), _alpha (aktuelle Alpha-Einstellung) und _rotation (aktuelle Drehung). Nebenbei: Man findet alle Eigenschaften in der gleichnamigen Kategorie des Bedienfeldes für Aktionen. Filmsequenzen haben hier gegenüber anderen Objekten die besondere Eigenschaft, dass man ihre Eigenschaften auch zur Laufzeit verändern (und so beispielsweise _x und _y neu berechnen) kann.

326

In Flash programmieren

Eigenschaften setzen Man kann eine Eigenschaft einer Filmsequenz setzen, indem man die Instanz der Sequenz anvisiert und den Namen der Eigenschaft angibt. Man muss diesem Konstrukt dann nur den neuen Wert zuweisen. In der folgenden Übung sehen Sie, wie einfach das sein kann.

Übung: Verändern Sie die Alpha-Eigenschaft der Instanz einer Sequenz 1. Erzeugen Sie in einer neuen Datei eine Schaltfläche und eine Filmsequenz. Nennen Sie die Instanz der Filmsequenz dieSequenz (Eigenschaften-Bedienfeld). 2. Fügen Sie in der Schaltflächen-Instanz eine evaluate-Aktion ein, in der Sie dieSequenz._alpha=50 eintragen (siehe Abbildung 15.11).

Abbildung 15.11: Hier wird der Alpha-Wert der Filmsequenz auf 50% gesetzt.

3. Testen Sie den Film und Sie sehen, wie ein Klick auf die Schaltfläche den Alpha-Wert der Filmsequenz auf 50% setzt. Neben der soeben gezeigten Variante können Sie auch die setProperty-Aktion wie in Abbildung 15.12 verwenden. Kommen wir aber noch einmal auf die kryptische Variante zurück. Sie ist immer in der objekt.eigenschaft-Syntax gehalten. Da ein spezielles Objekt (wie zum Beispiel eine Filmsequenz in einer anderen Filmsequenz) mit einer ähnlichen Notation (der so genannten »Punktnotation«) angesprochen werden kann, ist diese Zeile z.B. zulässig: filmsequenz.filmsequenzInDerFilmsequenz._alpha=50

327

ActionScript für mehr Interaktivität

Abbildung 15.12: Bei der Aktion setProperty kann man alle Angaben in den Parametern ausfüllen (was eventuell ein wenig einfacher ist).

Eigenschaften auslesen Neben dem Setzen von Eigenschaften ist natürlich auch das Auslesen von Eigenschaften möglich. Das ist in der gleichen Notation wie im vorherigen Abschnitt möglich. Folgende Zeile funktioniert deshalb: ausgabe="Aktueller Alpha-Wert: "+filmsequenz._alpha+"%"

Bei einem Alpha-Wert der Filmsequenz filmsequenz von 20% wird dabei die Variable ausgabe auf den Wert Aktueller Alpha-Wert: 20% gesetzt. Selbstverständlich kann man auch das Setzen einer Eigenschaft mit dem Auslesen einer solchen verbinden und somit einer Eigenschaft den Wert einer anderen zuweisen (und gegebenenfalls den Wert zuvor um beispielsweise 10 verringern).

Übung: Erstellen Sie Schaltflächen, welche die Alpha-Eigenschaft einer Sequenz erhöhen und verringern In dieser Übung werden Sie Eigenschaften sowohl setzen als auch auslesen. 1. Sie benötigen zwei Schaltflächen und eine Filmsequenz auf der Bühne. Nennen Sie die Instanz der Filmsequenz (wie schon zuvor über das Eigenschaften-Bedienfeld) dieSequenz. 2. Fügen Sie in eine Schaltfläche eine evaluate-Aktion ein, in der Sie dieSequenz._alpha=dieSequenz._alpha-10 eintragen (siehe Abbildung 15.13). Durch einen Klick wird dann der Alpha-Wert der Filmsequenz um 10% verringert.

328

In Flash programmieren

Abbildung 15.13: Hier verringern wir den Alpha-Wert der Filmsequenz um 10%.

3. Fügen Sie in der anderen Schaltfläche eine evaluate-Aktion ein, in der Sie dieSequenz._alpha=dieSequenz._alpha+10 eintragen. 4. Testen Sie den Film.

»Benutzerdefinierte« Eigenschaften erstellen Die von Flash mitgelieferten Eigenschaften einer Filmsequenz sind alle sichtbar. Das gilt für die Position genauso wie beispielsweise für den Alpha-Wert. Es gibt aber noch ein anderes Prinzip, das Ihnen noch mehr Möglichkeiten gibt: Ich nenne sie »hausgemachte Eigenschaften«. Damit sind Variablen in Filmsequenzen gemeint, da sie für jede Instanz unterschiedlich sein können. Diese wirken sich nicht auf das Aussehen der Filmsequenz aus (es sei denn, Sie geben sie beispielsweise in einem Textfeld aus). Wenn Sie das Prinzip einmal verstanden haben, werden Sie es zu schätzen wissen.

Übung: Erstellen und verändern Sie eine »Benutzerdefinierte Eigenschaft« in einer Filmsequenz In dieser Übung werden Sie lernen, wie man Variablen erzeugt, die einzigartig für jede Instanz einer Filmsequenz sind. 1. Zeichnen Sie in einer neuen Datei einen Kreis, den Sie in eine Filmsequenz namens Kreis konvertieren. 2. Benennen Sie die Instanz von Kreis als Ball1 und merken Sie sich, dass dies der Name der Instanz ist, die wir ansprechen möchten.

329

ActionScript für mehr Interaktivität

3. Wählen Sie die Instanz Ball1 aus und fügen Sie im Aktionen-Bedienfeld eine onClipEvent-Aktion ein, die auf enterFrame reagieren soll. Fügen Sie nun eine evaluateAktion ein, die _x+=speed enthalten soll. Übersetzt heißt das, dass immer wenn ein Bild erreicht wird (was 12 mal die Sekunde passiert), der Ball um speed Bildpunkte nach rechts verschoben wird. Damit ist speed eine neue Variable, die wir nun beobachten müssen. 4. Jetzt müssen wir speed nur noch setzen. Das geht genau wie bei jeder anderen Eigenschaft. Erzeugen Sie eine Schaltfläche, die beim Klicken ein Ball1.speed=5 ausführt. Testen Sie den Film. Selbstverständlich kann man mit ActionScript noch viel mehr machen. An dieser Stelle sollten Sie aber lediglich dafür sensibilisiert werden, dass diese Programmiersprache die Funktionalität von Flash erheblich erweitert.

15.3 Zusammenfassung Wenn Sie es einmal verstanden haben, ist die Programmierung in Flash recht einfach. Der schwere Teil ist, zu wissen, was man eigentlich zu tun hat, um ans Ziel zu kommen. Wenn man das weiß, ist es nur noch Routine, um es in die Realität umzusetzen. Wenn Sie sich gut mit dem Prozess des Anvisierens von Variablen und Eigenschaften vertraut gemacht haben, wird man Sie beim Flash-Programmieren nicht mehr aufhalten können. Wir haben an diesem zu Ende gehenden Tag verschiebbare Filmsequenzen kennen gelernt. Außerdem haben wir uns mit zwei wichtigen Programmierkonzepten beschäftigt: Variablen und Eigenschaften.

15.4 Workshop F&A F

Ich habe in der Instanz einer Filmsequenz die Aktion startDrag im Ereignis mouseDown eingefügt und per stopDrag in mouseUp wieder aufgelöst. Das funktioniert ganz gut. Wieso haben wir das über eine Schaltfläche in der Filmsequenz gemacht? A

330

Es sieht nur so aus, als ob diese Lösung funktionieren würde. Die Filmsequenz wird hier nämlich immer, wenn der Anwender klickt, verschoben – auch wenn das außerhalb der Filmsequenz ist. Nur über eine Schaltfläche kann man kontrollieren, in welchem Bereich der Anwender klicken muss, um eine Aktion auszulösen.

Workshop

F

Ich habe einen dynamischen Text auf die Bühne gebracht und mit der Variablen zaehler verknüpft. In einer Schaltfläche steht der Code zaehler=zaehler+1. Wenn ich den Film teste, erhalte ich als Ergebnis nur eine Reihe von Einsen, die sich immer um eine Ziffer verlängert. A

F

Mit dem Plus-Zeichen werden Zeichenketten und Zahlen verknüpft. Nur wenn links und rechts vom Plus-Zeichen Variablen sind, die Zahlen beinhalten, wird eine mathematische Addition ausgeführt. Eine Variable wird erst einmal als Zeichenkette angesehen. Eine Lösung wäre, den Code zaehler++ zu verwenden. Die andere Variante wandelt die erste Variable in eine Zahl um: zaehler=Number(zaehler)+1 Zu diesem Thema werden Sie später noch mehr erfahren.

Ich habe die Eigenschaft IQ in der Instanz einer Filmsequenz auf 55 gesetzt (per dieSequenz.IQ=55). Bei einer anderen Filmsequenz habe ich den Wert dieser Eigenschaft auf 120 gesetzt. Wieso verhalten sich die beiden Instanzen nun nicht unterschiedlich? A

Wenn Sie eine eingebaute Eigenschaft (wie zum Beispiel _x) verändern, wird sich das sofort auswirken. Sollten Sie aber (wie in diesem Fall) eine selbst erstellte Eigenschaft verwenden, wird sich nichts verändern, solange die Eigenschaft nicht in irgendeiner Aktion eingesetzt wird.

Quiz Versuchen Sie bitte zuerst, selbst die Fragen zu beantworten, bevor Sie die Lösungen im Anhang nachlesen. 1. Woher weiß Flash, welche Filmsequenz Sie ziehen wollen, wenn Sie die Aktion startDrag verwenden? a.

Das ist eindeutig, da man die Filmsequenz verschiebt, auf die man klickt.

b. Flash weiß das nicht – darum muss man es immer im Ziel-Feld angeben. c. Flash wird die Filmsequenz ziehen lassen, die im Ziel-Feld eingetragen ist und wenn da nichts steht, dann die Filmsequenz, in der sich die Aktion befindet. 2. Wie erstellt man eine neue Variable? a.

Man wartet so lange, bis der Abspielkopf mindestens Bild 2 erreicht hat.

b. Man verwendet sie einfach, wenn man sie benötigt. c. Durch das Einfügen der Aktion newVariable

331

ActionScript für mehr Interaktivität

3. Muss man ActionScript verwenden, um den Alpha-Wert einer Filmsequenz zu verändern? a.

Ja, man kann das nur über die _alpha-Eigenschaft regeln.

b. Nein, man kann auch die _visibility-Eigenschaft verwenden. c. Nein, man kann das auch »von Hand« im Eigenschaften-Bedienfeld einstellen.

332

Komponenten verwenden

6 1

Komponenten verwenden

Im letzten Kapitel haben wir die Programmierung gelernt. Das mag für manche technischer gewesen sein, als Ihnen lieb war. Für andere war es nicht technisch genug. Diese Trennung ist normal. Manche drücken ihre Kreativität aus, indem sie Puzzles lösen, während andere artistische Vorlieben haben. Ein Vorteil von Flash ist, dass es sich für beide Gruppen eignet – und eine Komponente (in Flash 5 hieß sie noch »Smart-Filmsequenz«) ist ein Beispiel dafür. Eine Komponente ist eine Art von Filmsequenz, die Programmcode enthält, sodass eine technisch nicht versierte Person diese Sequenz nutzen kann, ohne wissen zu müssen, wie sie genau funktioniert. Jeder kann eine Komponente anwenden. Je nachdem, welche Funktionen Sie einbauen, können Sie mit einer solchen Sequenz unglaubliche Sachen machen. In diesem Kapitel werden Sie: 쐽

herausfinden, wie man einige der Komponenten anwendet, die mit Flash ausgeliefert wurden,

쐽

die Grundlagen erlernen, wie man eine Komponente selbst erstellt und

쐽

die Anwendung von Komponenten in Ihren eigenen Filmen üben.

Sie werden also lernen, wie man Komponenten erstellt und anwendet – allerdings mit dem Schwerpunkt auf der Anwendung.

16.1 Was ist eine Komponente? Ich habe Komponenten als Filmsequenzen mit Programmcode definiert. Allerdings wird nicht jede Filmsequenz mit einer Aktion darin sofort zu einer Komponente. Diese haben nämlich für jede Instanz separat gespeicherte Eigenschaften, die man in jeder Instanz neu belegen kann.

Übung: Verwenden Sie die ComboBox-Komponente In dieser Übung werden Sie sehen, wie man eine Komponente verwendet, die mit Flash ausgeliefert wird. 1. Öffnen Sie in einer neuen Datei das Komponenten-Bedienfeld (FENSTER / KOMPONENTEN). Es ist möglich, verschiedene Komponentensets zu installieren. Stellen Sie deshalb sicher, dass das Set Flash UI Components ausgewählt ist (siehe Abbildung 16.1). UI steht dabei für »user interface« und heißt soviel wie »Benutzeroberfläche«.

334

Was ist eine Komponente?

Abbildung 16.1: Hier werden alle vorinstallierten Komponenten angezeigt.

2. Ziehen Sie eine Instanz von ComboBox auf die Bühne. Das funktioniert genau so, als ob Sie etwas aus der Bibliothek auf die Bühne bringen würden. Wenn die Instanz der ComboBox noch ausgewählt ist, können Sie einen Blick auf das Eigenschaften-Bedienfeld werfen. Dort werden Sie die Registerkarten Eigenschaften und Parameter entdecken (siehe Abbildung 16.2).

Abbildung 16.2: Im EigenschaftenBedienfeld findet man sowohl Eigenschaften, als auch Parameter von ausgewählten Komponenten.

335

Komponenten verwenden

3. Bevor wir uns mit den Parametern beschäftigen, sollten Sie der Instanz für später einen Namen geben. Tippen Sie also meineComboBox in das Feld ein, in dem noch steht. Klicken Sie nun auf die Parameter-Registerkarte, um die ComboBox für unsere Zwecke anzupassen. 4. Wählen Sie nun die Zeile mit dem Parameter Labels aus und klicken Sie auf die Schaltfläche mit dem Vergrößerungsglas rechts daneben (siehe Abbildung 16.3). Abbildung 16.3: Jeder Parameter (der Name steht links) kann mit einem oder mehreren Werten (rechts) versehen werden.

5. Nun erscheint ein Fenster für die Werteingabe. Klicken Sie hier auf das +-Zeichen. Es erscheint eine neue Eingabezeile. Ersetzen Sie hier den Text defaultValue durch das Wort Macromedia. Das wird das erste Element unserer ComboBox werden. Erstellen Sie auf diese Weise zwei weitere Einträge mit den Werten Microsoft und Markt+Technik. Sie können übrigens die Schaltflächen mit den Pfeilen dazu verwenden, die ausgewählten Einträge nach oben oder unten zu verschieben. Klicken Sie auf OK, wenn Sie fertig sind. 6. An dieser Stelle können Sie den Film bereits testen, um die ComboBox in Aktion zu sehen. Allerdings passiert noch nichts, wenn Sie sich für einen Eintrag entscheiden. Deshalb müssen wir noch ein paar weitere Angaben tätigen. 7. Klicken Sie dazu auf die Data-Zeile in den Parametern und fügen hier die drei Einträge http://www.macromedia.com/de, http://www.microsoft.de und http://www.mut.de ein (siehe Abbildung 16.4). Bitte beachten Sie, dass diese in der passenden Reihenfolge zu den Label-Einträgen stehen müssen, denn sonst gelangt man eventuell beim Klick auf Microsoft zu Macromedia. 8. Sie können aber nicht nur Webadressen hinterlegen, sondern auch bei der Änderung des Eintrages eine Funktion aufrufen. Tragen Sie dazu zum Beispiel sprung in ein Wertefeld von Change Handler ein. (Hier ist nur ein Eintrag erlaubt.) 9. Wir sind noch nicht fertig! Die ComboBox weiß nun, dass sie eine Funktion namens sprung aufrufen soll. Diese Funktion gibt es aber noch gar nicht. Klicken Sie in das Bild 1 und öffnen Sie das Aktionen-Bedienfeld. Wechseln Sie über das Optionsmenü in den EXPERTENMODUS. Fügen Sie nun folgenden Quelltext ein: function sprung(){ }

336

Was ist eine Komponente?

Abbildung 16.4: Nun ist für jeden Eintrag eine entsprechende Webadresse vorhanden.

10. Das war erst das Grundgerüst der Funktion. Klicken Sie hinter die erste geschweifte Klammer ({). Drücken Sie (Enter)und dann( )auf die +-Schaltfläche, um eine Aktion einzufügen. Wählen Sie hier nun Flash UI-Komponenten / FcomboBox / Methoden / getSelectedIndex. Diese Funktion gibt an, welcher Eintrag gerade ausgewählt ist. Ihr Code sollte nun so aussehen: function sprung(){ .getSelectedIndex(); }

11. Der Bereich muss durch den Instanznamen der ComboBox ersetzt werden, denn Sie könnten ja mehrere Instanzen verwenden. Tragen Sie für den rot hinterlegten Bereich also meineComboBox ein (so haben Sie die Instanz zuvor ja benannt). Tragen Sie abschließend noch derEintrag= am Anfang der Zeile ein, damit das Skript so aussieht: function sprung(){ derEintrag=meineComboBox.getSelectedIndex(); }

12. Fügen Sie eine weitere Textzeile vor der schließenden Klammer ein, damit folgendes Skript entsteht: function sprung(){ derEintrag=meineComboBox.getSelectedIndex(); trace(derEintrag); }

337

Komponenten verwenden

Testen Sie nun den Film. Immer wenn Sie einen anderen Eintrag auswählen, erscheint im Ausgabefenster die Nummer des Eintrags (begonnen bei 0). Wir gehen aber noch einen Schritt weiter und möchten passend zu derEintrag die Internetadresse herausbekommen. 13. Dazu müssen wir den passenden Eintrag einer weiteren Variablen (nennen wir sie einfach derURL) zuordnen: function sprung(){ derEintrag=meineComboBox.getSelectedIndex(); trace(derEintrag); derURL=meineComboBox.getValue(derEintrag); }

14. Jetzt brauchen wir den URL nur noch aufzurufen und können gleichzeitig die traceAktion wieder löschen, da sie überflüssig ist (wir wollen den Anwender ja nicht mit Zahlen im Ausgabefenster irritieren). function sprung(){ derEintrag=meineComboBox.getSelectedIndex(); derURL=meineComboBox.getValue(derEintrag); getURL(derURL); }

15. Testen Sie den Film nun. Sie sollten nun immer zur entsprechenden Website springen. Ich weiß, dass die letzten Schritte vielleicht etwas kompliziert waren, aber ich wollte Ihnen an dieser Stelle zeigen, dass man mit relativ geringem zeitlichen Aufwand eine nette Funktionalität erzeugen kann. Außerdem können Sie das sprung-Skript selbst umbauen, um jede erdenkliche Funktionalität hineinzubringen. Stellen Sie sich vor, Sie hätten die gesamte ComboBox selbst programmieren müssen ...

Komponenten erstellen Wenn Sie eine eigene Komponente erstellen wollen, kann das eine Menge Arbeit bedeuten. Allerdings ist die Verwendung solcher Sequenzen – wie wir im letzten Abschnitt gesehen haben – sehr zeitsparend. Ich werde hier nicht auf jedes Detail der Erstellung von Komponenten eingehen, sondern nur die Grundlagen vorstellen. Zum einen werden Sie Komponenten dann nicht mehr als Mysterium ansehen und zum anderen können Sie den Prozess zur Erstellung guter Komponenten lernen. Auch wenn Sie nie selbst eine Komponente erstellen wollen, können Sie am Ende dieses Kapitels einem Kollegen erklären, wie er eine solche Sequenz für Sie entwickeln kann, damit Sie diese für Ihre Zwecke einsetzen können. Es ist wirklich so: Wenn Sie erst einmal eine genaue Vorstellung davon haben, welche Komponente Sie benötigen, ist der Rest nur noch eine Sache der Ausführung.

338

Was ist eine Komponente?

Angenommen, Sie wollen einen Kreis über den Bildschirm wandern lassen. Er soll selbstständig erkennen, wann er das Ende der Bühne erreicht hat und dann wieder an der anderen Seite starten. Dazu können Sie eine Filmsequenz erstellen, in die Sie folgenden Programmcode integrieren: onClipEvent (enterFrame) { _x = _x+10; if (_x>550) { _x = 0; } }

Wie Sie noch aus dem letzten Kapitel wissen, bezeichnet _x die Eigenschaft der X-Position. Mit diesem Code wird also jedes Mal, wenn auf ein neues Bild gesprungen wird (enterFrame) die X-Position um zehn Bildpunkte erhöht (_x = _x+10). Die darauf folgenden drei Zeilen bewirken, dass die X-Position immer auf Null zurückgesetzt wird, wenn sie größer ist als 550 (die Standard-Bühnenbreite). Wenn Sie jetzt mehrere Instanzen brauchen, müssen Sie den Code in jede weitere Instanz kopieren. Dabei können Sie aber auch die zweite Zeile in _x = _x+20;

oder _x = _x+5;

ändern. Das Problem dabei ist folgendes: Wenn sich etwas Gravierendes ändern sollte (zum Beispiel die Bühnenbreite), müssten Sie jede Instanz korrigieren, da jede Instanz eine eigene Kopie des Codes besitzt! Wenn Sie den Code allerdings in das Master-Symbol der Filmsequenz schreiben würden, wäre die Sache einfacher. Es stellt sich dann allerdings die Problematik, dass nur in Instanzen von Filmsequenzen das Ereignis enterFrame definiert ist. Die Lösung hierfür ist (noch) recht einfach, denn man kann ja eine Instanz mit dem Code versehen und diese in eine neue Filmsequenz verpacken. Das schauen wir uns einmal in der Praxis an. Danach werden wir weitere Probleme betrachten, die sich ergeben (aber mit Komponenten lösbar sind).

Übung: Beginnen Sie, Ihre erste Komponente zu erstellen In dieser Übung werden die Grundlagen für die Erstellung einer Komponente gelegt. 1. Zeichnen Sie in einer neuen Datei einen Kreis, den Sie eine Filmsequenz namens Kreis konvertieren. Wählen Sie die Instanz aus und konvertieren Sie diese erneut in eine Filmsequenz namens Sequenz mit der Kreis-Sequenz.

339

Komponenten verwenden

2. Doppelklicken Sie auf die Instanz von Sequenz mit der Kreis-Sequenz, um in das Master-Symbol zu gelangen. Hier finden Sie eine Instanz von Kreis vor. Wählen Sie diese aus und öffnen Sie das Aktionen-Bedienfeld. Fügen Sie eine evaluate-Aktion ein, die Sie nach _x = _x+10 modifizieren. Beachten Sie, dass die Aktion auf das Ereignis load reagiert. Wählen Sie die erste Zeile aus und markieren Sie die Option Bild Betreten, damit im Quelltext enterFrame erscheint (siehe Abbildung 16.5). Wenn Ihr Film mit 12 BpS abspielt, wird diese Aktion 12-mal in der Sekunde aufgerufen.

Abbildung 16.5: Durch diesen Code wird sich der Kreis nach rechts bewegen.

3. Fügen Sie eine if-Aktion (aus dem Ordner Aktionen) direkt nach der Zeile _x = _x+10 ein. Für diese Aktion müssen Sie eine Bedingung festlegen, die wahr (true) sein muss, damit der Quelltext in den geschweiften Klammern ausgeführt wird. Schreiben Sie in das Feld Bedingung also _x>550, damit die folgende Aktion ausgeführt wird, wenn der Kreis am Bühnenrand angekommen ist. Fügen Sie zwischen die geschweiften Klammern der if-Aktion eine evaluate-Aktion ein, die Sie mit dem Ausdruck _x=0 versehen. Das Ergebnis sehen Sie in Abbildung 16.6. 4. Speichern Sie die Datei ab, da wir später darauf aufbauen wollen. Testen Sie den Film. Ziehen Sie mehrere Instanzen von Sequenz mit der Kreis-Sequenz auf die Bühne und ändern Sie die Zahl im Code von 550 auf 100. Es werden alle Instanzen aktualisiert. Genauso ist das, wenn Sie die 10 in eine 20 oder 5 verwandeln.

340

Was ist eine Komponente?

Abbildung 16.6: Die fertige Version des Codes

So weit so gut. Was ist aber, wenn sich die Instanzen unterschiedlich schnell bewegen sollen? Der Code muss an der gleichen Stelle bleiben wie zuvor, da sonst unser altes Problem wieder auftritt. Allerdings können wir eine benutzerdefinierte Eigenschaft namens speed (Geschwindigkeit) einführen, die in jeder Instanz unterschiedlich sein kann.

Übung: Fügen Sie eine benutzerdefinierte Eigenschaft hinzu In dieser Übung werden Sie dem wandernden Kreis die Eigenschaft geschwindigkeit zuordnen. 1. Öffnen Sie die Datei der letzten Übung. Wählen Sie die Instanz Kreis aus, die Sie im Master-Symbol von Sequenz mit der Kreis-Sequenz finden. Öffnen Sie das AktionenBedienfeld und ändern Sie die Zeile _x = _x+10 in _x = _x+geschwindigkeit (siehe Abbildung 16.7). 2. Während Sie sich mit der Kreis-Sequenz noch im Master-Symbol von Sequenz befinden, können Sie unter der Instanz von Kreis ein dynamisches Textfeld erstellen, in das Sie eine 0 eintragen und mit der Variablen geschwindigkeit verknüpfen sollten (siehe Abbildung 16.8). Vergrößern Sie den Textblock so weit, dass er 2 Ziffern nebeneinander darstellen kann.

341

Komponenten verwenden

Abbildung 16.7: Hier wird die fest eingestellte 10 durch eine selbst definierte Variable geschwindigkeit ersetzt.

Abbildung 16.8: Erstellen Sie einen Textblock, um den Wert der Geschwindigkeit zu überwachen.

3. Wir erstellen gerade eine Komponente, die es erlaubt, die Geschwindigkeiten für jede einzelne Instanz neu festzulegen. Bevor wir so weit sind, werden wir das Verhalten testen, indem wir ein paar Zahlen einprogrammieren. 4. Kehren Sie in die Hauptszene zurück und entfernen Sie alle Instanzen von Sequenz mit der Kreis-Sequenz von der Bühne. Ziehen Sie nun eine »frische« Instanz aus der Bibliothek. Benennen Sie diese mit eineSequenz im Eigenschaften-Bedienfeld. Alles

342

Was ist eine Komponente?

was Sie wollen, ist, den Wert von geschwindigkeit einzustellen, um zu sehen, ob die Filmsequenz funktioniert. Dazu wählen Sie das erste Schlüsselbild aus und öffnen das Aktionen-Bedienfeld. Hier fügen Sie eine evaluate-Aktion ein, in die Sie den Ausdruck eineSequenz.geschwindigkeit=10 eingeben. 5. Testen Sie den Film. Der Kreis wird sich nicht über die Bühne bewegen, aber man sieht die 10 im Textfeld. Die Eigenschaft geschwindigkeit wurde also in Sequenz mit der Kreis-Sequenz richtig gesetzt. Der Kreis hat sich aber nicht bewegt, da die Aktion in Kreis definiert wurde, der aber nicht über eine geschwindigkeit-Variable verfügt. Man muss dem Kreis also beibringen, dass er so etwas ausführen kann: »Setze meine Eigenschaft _x auf _x plus den Wert der Eigenschaft geschwindigkeit der Filmsequenz, in der ich mich befinde!« Das funktioniert, indem man der Eigenschaft den Zusatz _parent voranstellt.

Übung: Verändern Sie die benutzerdefinierte Eigenschaft so, dass sie auf _parent zeigt 1. Die vorausgegangene lange Erklärung lässt sich schnell umsetzen, indem man nur die Zeile _x = _x+geschwindigkeit in _x = _x+_parent.geschwindigkeit umwandelt. Testen Sie danach den Film. 2. Es funktioniert. Nun können wir die Sequenzparameter-Funktionalität von Komponenten nutzen, um diese eigenartige Aktion im ersten Bild loszuwerden. 3. Damit eine Filmsequenz zu einer Komponente wird, brauchen Sie lediglich anzugeben, welche Parameter man durch den Autor der Anwendung verändern lassen will. Öffnen Sie dazu Ihre Bibliothek und wählen Sie die Sequenz mit der Kreis-Sequenz aus. Wählen Sie nun KOMPONENTENDEFINITION aus dem Optionsmenü. Es erscheint ein Fenster, das Sie in Abbildung 16.9 sehen. 4. Damit aus unserer Filmsequenz eine Komponente wird, müssen wir nur noch geschwindigkeit als Eigenschaft, die man von außen verändern kann, definieren. Klicken Sie dazu auf die Schaltfläche mit dem Plus-Zeichen und doppelklicken Sie danach auf varName. Ändern Sie den Variablennamen in geschwindigkeit. Außerdem können Sie den Standardwert (defaultValue) auf 10 setzen. Klicken Sie dann auf OK. 5. Löschen Sie die Aktion in Bild 1. Ziehen Sie nun mehrere Instanzen der Sequenz mit der Kreis-Sequenz auf die Bühne und verändern Sie jeweils über das EIGENSCHAFTEN-Bedienfeld die Werte für geschwindigkeit. Testen Sie den Film. Sie haben soeben eine Komponente erschaffen. Das sah nun so aus, als ob man für diese Aktion eine Menge Arbeit aufwenden muss. Aber ich habe doch einige Umwege gemacht, denn es ist von Vorteil, wenn Sie beispielsweise wissen, wie man Variablen von Sequenzen ausliest, in welche die Sequenz mit dem Script eingebunden ist (_parent).

343

Komponenten verwenden

Abbildung 16.9: Nachdem Sie hier die Eigenschaften festgelegt haben, die von außen verändert werden dürfen, ist die Filmsequenz eine Komponente.

16.2 »RadioButtons« verwenden Die so genannten RadioButtons sind Schaltflächen, die sich wie die Knöpfe an alten Autoradios verhalten, bei denen man nur einen auf einmal herunterdrücken konnte. Wenn dadurch eine Möglichkeit immer alle anderen ausschließt, kann man den Anwender auf eine Auswahl festnageln. Sie lernen das in der folgenden Übung.

Übung: Verwenden Sie »RadioButton« als Komponente In dieser Übung erstellen wir eine Abfrage nach dem Wissensstand des Anwenders (Anfänger/Fortgeschrittener/Experte). 1. Öffnen Sie in einer neuen Datei das Komponenten-Bedienfeld und ziehen Sie 3 Instanzen von RadioButton auf die Bühne. 2. Richten Sie die 3 Elemente mit dem Ausrichten-Bedienfeld aus (siehe Abbildung 16.10). Wählen Sie die oberste Instanz auf der Bühne aus und betrachten Sie das Eigenschaften-Bedienfeld (Registerkarte Parameter).

344

»RadioButtons« verwenden

Abbildung 16.10: Bei RadioButton kann man viele Einstellungen für jede Instanz vornehmen.

3. Unter Label kann man eintragen, welches Wort neben der Schaltfläche erscheinen soll. Tragen Sie hier Anfänger ein. Werfen Sie auch einen kurzen Blick auf Group Name. Diesen sollten Sie aber nicht antasten, da die anderen Schaltflächen in der gleichen Gruppe sein müssen. (Man kann bei RadioButton nämlich immer nur einen Button aus einer Gruppe aktivieren.) 4. Geben Sie für die anderen beiden RadioButtons bei Label die Werte Fortgeschrittener und Experte ein. 5. Testen Sie den Film. Lassen Sie ihn entweder geöffnet oder speichern Sie die Datei ab, da wir sie gleich noch einmal benötigen. Das ist ja schon nicht schlecht. Wenn man aber eine zweite Gruppe (zum Beispiel männlich/weiblich) benötigt, wird man zwischen allen 5 Schaltflächen auswählen müssen. Deshalb fasst man die zusammengehörigen RadioButtons in einer Filmsequenz zusammen.

Übung: Werten Sie RadioButtons aus Auch wenn unsere RadioButtons nett aussehen, bewirken sie noch nichts. Das ändern wir jetzt. 1. Verwenden Sie die Datei der Übung, die wir soeben beendet haben. Zeichnen Sie ein Rechteck mit dem Text Weiter darauf. Wandeln Sie dieses Konstrukt in eine Schaltfläche namens Weiter um.

345

Komponenten verwenden

2. Stellen Sie sicher, dass sich die Schaltfläche in Bild 1 zusammen mit den RadioButtons auf der Bühne befindet. Gehen Sie in Bild 2 und fügen Sie dort ein leeres Schlüsselbild ein (F7). Erzeugen Sie einen dynamischen Textblock, den Sie mit der Variablen mitteilung verknüpfen. Kehren Sie zu Bild 1 zurück. Dort werden wir gleich beim Druck auf die Schaltfläche die RadioButtons abfragen und eine entsprechende Mitteilung erzeugen. 3. Wählen Sie die Instanz von Weiter aus und öffnen Sie das Aktionen-Bedienfeld. Wechseln Sie über das Optionsmenü in den EXPERTENMODUS und geben Sie folgendes Script ein: on (press) { mitteilung="Sie haben nichts ausgewählt"; nextFrame(); }

4. Jetzt müssen Sie im ersten Schlüsselbild nur noch eine stop-Aktion einfügen und können den Film testen. Leider funktioniert der Film so noch nicht ganz, denn wir sehen immer nur die Meldung Sie haben nichts ausgewählt. Das ändern wir jetzt. 5. Ändern Sie das Skript einfach so ab: on (press) { mitteilung="Sie haben "+radioGroup.getValue()+" ausgewählt"; nextFrame(); }

6. Nebenbei bemerkt: radioGroup ist der Name unserer RadioButton-Gruppe. 7. Testen Sie den Film erneut und Sie werden feststellen, dass zuerst nur der Text Sie haben ausgewählt erscheint. Auch diesen Fehler werden wir noch beseitigen. 8. Dazu müssen Sie sicherstellen, dass auf jeden Fall zuerst ein RadioButton ausgewählt ist. Wählen Sie dazu den Anfänger-RadioButton aus und ändern den Parameter initial State von false auf true. Nun haben Sie Anfänger als Vorauswahl festgelegt. Testen Sie den Film erneut und Sie werden sehen, dass er wunderbar funktioniert.

16.3 Zusammenfassung Komponenten sind eine sehr schöne Neuerung in Flash. Erfahrene Flash-Programmierer können auf diese Weise ungewöhnliche Vorlagen schaffen, mit denen auch ein Flash-Anfänger ohne Programmierkenntnisse sehenswerte Effekte in seinen Film einbringen kann. Eine Komponente ist eine Filmsequenz mit Programmiercode. Sie lässt einen anderen Programmierer von außen bestimmte Eigenschaften verändern, ohne dass dieser sich mit den Skripten im Innern der Sequenz auseinandersetzen muss. Man kann es dem Autor der

346

Workshop

Anwendung sogar noch einfacher machen, wenn man ihm eine angepasste Benutzeroberfläche zur Verfügung stellt. Gute Komponenten sind zwar relativ zeitaufwändig in der Produktion, diese Zeit kann man allerdings im späteren Verlauf wieder einsparen.

16.4 Workshop F&A F

Müssen Komponenten immer so kompliziert sein? A

Natürlich nicht. Zuerst einmal waren die Beispiele hier noch nicht so kompliziert. Komponenten können viel umfangreicher sein. Allerdings machen auch sehr einfache Komponenten Sinn: Wenn man beispielsweise an mehreren Stellen im Film immer ein Überschriftenformat benötigt, kann man das über eine simple Komponente realisieren.

Quiz Warten Sie schon darauf, was ich wieder an Hinweisen auf Lager habe? Sie wissen genau, was ich sagen will. 1. Komponenten sind einfach Filmsequenzen, die Eigenschaften besitzen, welche der Autor über das Eigenschaften-Bedienfeld (Parameter-Registerkarte) verändern kann. a.

Richtig

b. Falsch, man ändert die Eigenschaften über das Komponenten-Bedienfeld. c. Falsch, Komponenten müssen in C++ oder Pascal programmiert werden. 2. Flash MX wird mit sehr wenigen Komponenten ausgeliefert. Wenn man deren Möglichkeiten erforscht hat, muss man auf die nächste Flash-Version warten, um neue Filmsequenzen verwenden zu können. a.

Richtig, es sei denn, es gibt eine Zwischenversion wie Flash 6.5.

b. Falsch, denn man kann Komponenten dazu verwenden, neue zu erschaffen (was auch als »Sequenzmutation« bekannt ist). c. Falsch, jeder begabte Flash-Anwender kann Komponenten von Grund auf neu erschaffen.

347

Komponenten verwenden

3. RadioButtons sollten nur verwendet werden, um Musikstücke auszuwählen. a.

Richtig, warum sonst sollten sie RadioButtons heißen?

b. Falsch, RadioButtons können für jeden beliebigen Zweck verwendet werden. c. Falsch, denn RadioButtons sollten für exklusive Auswahlen verwendet werden.

348

Videos einsetzen

7 1

Videos einsetzen

Als es Flash MX noch nicht gab, war ich es leid, den Leuten zu erzählen, dass man in Flash keine Videos importieren kann. O.K., es gab einige Vorgehensweisen, mit denen man so etwas simulieren konnte – das war`s dann aber auch. Heute ist das anders, denn Flash MX unterstützt den aktuellen Video-Codec und kann dabei vieles selbst optimieren, lässt einem aber genug Spielraum für eigene Einstellungen. Das garantiert gute Qualität bei kleinen Dateigrößen. In diesem Kapitel werden Sie: 쐽

Videos importieren und in Ihren Filmen verwenden,

쐽

eine Videosteuerung per ActionScript verwirklichen,

쐽

die Dateigröße und die Bildqualität in ein optimales Verhältnis rücken,

쐽

die Qualität und Performance mit Sorenson Spark verbessern. Das Wort Codec ist eine Abkürzung für compressor/decompressor, was für Komprimieren/Dekomprimieren steht. Da Videos von Natur aus recht groß sind, muss man die Dateigröße verringern, um einen schnellen Download zu gewährleisten. Um den Film nachher wieder betrachten zu können, muss man ihn wieder dekomprimieren. Flash verwendet einen Codec namens Sorenson Spark.

17.1 Videos importieren Der Import von Videos gestaltet sich in Flash genauso einfach wie der Import von Grafiken und Musik. Allerdings muss man beachten, dass es verschiedene Videoformate gibt und dass ein Video in Bezug auf Qualität und Dateigröße nicht sofort optimiert ist. Als erstes muss man sich also mit dem Quellvideo beschäftigen

Videos gut aussehen lassen Wir werden uns gleich mit den verschiedenen Videoformaten auseinandersetzen, allerdings sollten Sie sich zuvor eines klar machen: Da Sie wohl kaum eine Hollywood-Mannschaft für Ihr Video engagieren, haben Sie die gesamte Verantwortung, die sonst Tontechniker, Kameraleute, Castingagenten, Drehbuchautoren usw. haben. Außerdem werden Sie es mit technischen Details wie Hintergrundgeräuschen, Kamerawackeln und Gegenlicht zu tun bekommen. In diesem Buch gibt es leider nicht genug Platz, um all diese Punkte ausführlich durchzuarbeiten. Die Grundlagen zu erlernen lohnt sich jedoch.

350

Videos importieren

Wenn Sie am Computer mit Videos arbeiten, werden Sie einigen Einschränkungen unterliegen, denn das ganze Videoerlebnis ist nicht mit dem in Ihrem Wohnzimmer zu vergleichen. Die nachfolgenden Tipps sind immer auf Computervideos gemünzt und würden bei konventioneller Videobearbeitung sicherlich etwas anders lauten. Wir werden uns auch ausgiebig mit der Komprimierung beschäftigen. Soweit es Videos betrifft, sollten Sie sich von filigranen Elementen distanzieren (zum Beispiel von kleinem Text), denn in einem keinen Video-Wiedergabefenster erkennt man davon sowieso nichts. Auch wenn es viele Einschränkungen gegenüber konventionellen Videos gibt, kann das die Motivation beflügeln, diese Schanken zu überwinden. Außerdem gibt es einige Parameter, die bei normalen Videos beschränkt sind (zum Beispiel die Höhen-Breiten-Relation), die man bei Computervideos aber frei verändern kann. Man kann durch Masken sogar runde Videoformate erzeugen (siehe Abbildung 17.1).

Abbildung 17.1: Mit ComputerVideos kann man sogar das Wiedergabeformat nach Belieben verändern.

Unterstützte Formate Flash kann ein Quellvideo komprimieren, für sich brauchbar machen und dann in einer .swf-Datei abspeichern. Wichtig ist dabei, dass Sie immer mit einem digitalen Quellvideo

starten müssen, das sich auf Ihrem (oder einem Ihnen zugänglichen) Computer befinden muss. Wenn Sie also nur über eine VHS-Kassette mit dem Quellvideo verfügen, müssen Sie dieses erst digitalisieren. Aber auch wenn Sie über einen digitalen Datenträger (zum Beispiel DV oder DVD) verfügen, ist es etwas aufwändiger, ein so abgespeichertes Video

351

Videos einsetzen

Flash-fähig zu machen, denn Sie brauchen auf jeden Fall eines der folgenden Formate für Ihr Quellvideo: 쐽

Quicktime (.mov)

쐽

Digital Video (.dv oder .dvi)

쐽

MPEG (.mpg oder .mpeg)

쐽

Windows Media (.asf oder .wmv)

쐽

Video für Windows (.avi) Es kann sein, dass Ihnen nicht alle diese Videoformate zur Verfügung stehen. Bitte installieren Sie in diesem Fall QuickTime 4 oder höher (http://www.quicktime.com). Wenn Sie unter Windows arbeiten, sollten Sie außerdem sicherstellen, dass DirectX 7 oder höher installiert ist (http://www.microsoft.com/directx/). Bei Windows XP ist DirectX 8.1 vorinstalliert.

Auch wenn es relativ viele unterstützte Videoformate gibt, werden Sie in der Praxis wohl nur die ersten 3 verwenden. Dabei kommt es auch darauf an, für welchen Zweck Sie die Videopräsentation benötigen. Allerdings sollten Sie immer mit der höchsten Qualität starten, da Flash immer ein wenig komprimiert (mal mehr und mal weniger, aber immer ein bisschen). Wenn man ein stark komprimiertes Video weiter komprimiert, wird das Ergebnis wohl nicht sehr zufriedenstellend sein, allerdings sind gänzlich unkomprimierte Videos extrem groß. Video-Profis sollten kein Problem haben, eine QuickTime-Datei mit wenig oder keiner Komprimierung zu erstellen. Wenn Sie eine DV-Kamera verwenden, können Sie direkt mit den DV-Formaten arbeiten, allerdings kann man bei vielen Kameras optional auch ein QuickTime-Video erstellen. Auch wenn MPEG-Dateien sehr hochwertig sein können, werden Sie fast immer stark komprimierte Versionen vorfinden. In diesem Fall sollten Sie sich nach einem besseren Original umschauen. Das gilt so auch für Windows Media-Dateien. Abschließend sei gesagt, dass AVI-Dateien lange nicht so gut sind wie QuickTime-Formate. Sie sollten diesen Abschnitt nicht wie ein Regelbuch verwenden. Allerdings sollten Sie an eines denken: Starten Sie möglichst immer mit der höchsten Qualität.

Übung: Importieren Sie ein Video In dieser Aufgabe werden Sie ein QuickTime-Video in Flash importieren. 1. Damit wir schnell starten können, werden wir das Beispielvideo verwenden, das mit QuickTime installiert wurde. Wählen Sie in einer neuen Flash-Datei DATEI/IMPORTIEREN und dann die Datei sample.mov aus dem QuickTime-Ordner aus (meist C:\Programme\QuickTime).

352

Videos importieren

2. Das erste Dialogfenster will wissen, ob Sie die Datei in Ihren Flash-Film einbetten oder nur darauf verlinken möchten (siehe Abbildung 17.2). Diese Option sehen Sie nur, wenn Sie einen QuickTime-Film importieren möchten. Wichtig ist dabei, dass Sie die Verlinkungs-Option nur anwenden sollten, wenn Sie planen, den Flash-Film als QuickTime-Video zu veröffentlichen. In SWF-Dateien wird das nicht funktionieren. Weitere Informationen dazu finden Sie in Anhang C. Abbildung 17.2: Wenn Sie einen QuickTime-Film importieren, sollten Sie die zweite Option (verknüpfen) nur auswählen, wenn Sie den gesamten Flash-Film auch wieder als QuickTime-Video abspeichern möchten.

3. Das nächste Fenster beschäftigt sich mit dem Komprimierverfahren von Flash. Die Prozedur ist folgende: Sie haben ein Video zum Import ausgewählt, stellen nun die Komprimier-Optionen ein, lassen Flash komprimieren und verwenden das Video dann in der Zeitleiste. Die Einstellungen, die Sie hier vornehmen sind vergleichbar mit denen beim Import von Rastergrafiken. Allerdings erfolgt die Komprimierung hier sofort und Sie können sie in Flash nicht mehr nachträglich ändern (nur durch einen erneuten Import). Lassen Sie für diese Übung die Standardeinstellungen unverändert (siehe Abbildung 17.3) und klicken Sie auf OK.

Abbildung 17.3: Die Komprimiereinstellungen erscheinen nur beim Import eines Videos direkt.

353

Videos einsetzen

4. Das nächste (und letzte) Fenster fragt ab, ob Sie die Zeitleiste auf 61 Bilder (die Länge des Videos) expandieren möchten. Klicken Sie auf Ja. 5. Nun gelangen Sie wieder nach Flash zurück und der Film wurde in die Zeitleiste importiert. (Das erste Bild des Testfilms ist weiß. Deshalb sehen Sie hier noch nichts.) 6. Das war's schon. Testen Sie den Film, um auch den Ton zu hören. Wenn Sie nur ein Video in Flash importieren wollten, könnten Sie an dieser Stelle stoppen. Selbstverständlich können Sie das Video wie alle anderen Elemente auf der Bühne auch ausrichten und transformieren. Ich hoffe allerdings, dass Sie etwas mehr als nur ein Video in einen Flash-Film umwandeln möchten. Deshalb kommen hier einige weitere Möglichkeiten, Videos in Flash einzusetzen.

17.2 Videos einsetzen Ein Konzept von Videos in Flash sollten Sie verstehen: Sounds reagieren wie StreamingSounds und die Bilder wie Grafik-Symbole. Führen Sie sich diese Eigenschaften gegebenenfalls noch einmal vor Augen, indem Sie in den Kapiteln 10 und 12 nachschlagen. Zur Erinnerung: Stream-Sounds sind an die Zeitlinie gebunden (um z.B. Lippensynchronizität zu erzeugen). Wenn die Zeitlinie beendet ist, stoppt auch der Sound. Deshalb sollten Sie immer sicherstellen, dass die Zeitlinie lange genug existiert, um den Sound zu beenden. Den visuellen Anteil eines Videos kann man an besten mit einem Grafik-Symbol vergleichen. Allerdings kann man es nicht tweenen und auch keine Farbeffekte darauf anwenden. Aber auch hier gilt, dass die Zeitlinie lange genug sein muss, um das komplette Video zu sehen. Lassen Sie sich nicht davon abschrecken, dass Sie Videos nicht tweenen können und darauf keine Farbeffekte anwendbar sind. In der nächsten Aufgabe werden Sie sehen, wie Sie Videos in einen Movieclip einbetten können, um auch diese Techniken verwenden zu können.

Übung: Erstellen Sie eine Wiedergabe-Steuerung für Video Jetzt werden Sie einem Video einige Standardknöpfe hinzufügen, um das Abspielen zu steuern. 1. Importieren Sie ein Video in eine neue Datei (dazu können Sie gerne wieder das Beispielvideo aus der letzten Übung verwenden). Der einzige Unterschied ist, dass Sie bei der Frage nach dem Erweitern der Zeitleiste (siehe Abbildung 17.4) mit Nein beantworten.

354

Videos einsetzen

Abbildung 17.4: Lassen Sie Flash in dieser Übung die Zeitleiste nicht automatisch erweitern.

2. Da das Video nun eingebunden und komprimiert ist, können wir es in eine Filmsequenz packen. Wählen Sie dazu das Video auf der Bühne aus und konvertieren Sie es in ein Movieclip-Symbol namens meinVideo. 3. Sofort nachdem Sie das Video in ein Symbol umgewandelt haben, wird Flash erneut fragen, ob Sie die Zeitleiste erweitern möchten. Da es sich hier um die Zeitleiste der Filmsequenz handelt, klicken Sie nun bitte JA. 4. Gleich werden wir Schaltflächen für Stopp, Pause und Wiedergabe erstellen. Damit das etwas einfacher wird, bauen wir diese direkt in das meinVideo-Symbol ein. Doppelklicken Sie also auf der Bühne auf die Instanz von meinVideo, um das Master-Symbol zu bearbeiten. 5. Fügen Sie nun im meinVideo-Symbol eine zusätzliche Ebene für die Schaltflächen ein. Wählen Sie nun FENSTER / ALLGEMEINE BIBLIOTHEKEN / BUTTONS. In dieser Bibliothek finden Sie unter anderem einen Ordner namens Playback. Ziehen Sie hieraus jeweils einen Knopf von gelPause, gelRight und gelStop. Ordnen Sie diese beliebig unterhalb des Videos an.

Abbildung 17.5: Der fertige Code für jeden Knopf.

355

Videos einsetzen

6. Öffnen Sie für jeden Knopf das Aktions-Bedienfeld. Fügen Sie jeweils eine on-Aktion ein und behalten Sie das Ereignis release bei. 7. Nun fügen Sie für den gelRight-Knopf eine play-Aktion, für gelStop ein gotoAndStop(2); und für gepPause eine stop-Aktion ein (siehe Abbildung 17.5). 8. Erstellen Sie abschließend eine weitere Ebene im meinVideo-Symbol und fügen Sie dort in Bild 1 eine stop-Aktion ein. 9. Testen Sie den Film. Sie sollten den Ablauf des Videos steuern können.

Fortgeschrittene Videosteuerung Das Erstellen von einfachen Steuerelementen ist also recht simpel. Aber auch wenn Sie etwas komfortablere Steuerelemente bauen möchten, ist das nicht viel schwieriger. So könnten Sie zum Beispiel den Pause- und den Wiedergabeknopf kombinieren, denn wenn ein Video im Pause-Modus ist, braucht dieser Knopf ja nicht sichtbar sein und nur dann kann man auch die Wiedergabe fortsetzen. Eine Umsetzungsmöglichkeit dafür wäre das Kombinieren dieser beiden Knöpfe in einem eigenen Symbol mit zwei Bildern. Fügen Sie also zum Beispiel in Bild 1 den Pause-Knopf und in Bild 2 den Wiedergabeknopf ein. Jetzt fügen Sie diesen Schaltflächen wieder ihre Aktionen zu, müssen aber bedenken, dass der Film außerhalb des neuen Symbols gestoppt/wiedergegeben werden muss. Also sollten Sie der stop- bzw. der play-Funktion ein _parent. voranstellen. Jetzt müssen Sie nur noch sicherstellen, dass bei Betätigung eines Knopfes der andere angezeigt werden muss. Fügen Sie also dem Pause-Knopf noch ein gotoAndStop(2); (siehe Abbildung 17.6) und dem Wiedergabeknopf ein gotoAndStop(1); hinzu. Außerdem müssen Sie in Bild 1 des Knopfes ein stop() einfügen, damit er nicht immer flimmernd wechselt.

Abbildung 17.6: Der modifizierte Code des Pause/Wiedergabe-Umschaltknopfes.

356

Videos einsetzen

Aber man kann noch viel mehr machen. Stellen Sie sich beispielsweise eine Fortschrittsanzeige vor, die angibt, wie viel vom Video bereits abgespielt wurde. Eine schnelle Methode ist, eine weitere Ebene über der Video-Ebene zu erstellen und darin ein Rechteck zu zeichnen, das später als Fortschrittsbalken fungieren soll. Dann wandeln Sie ihn in eine Filmsequenz um, richten die Registrierung aber rechts mittig aus (siehe Abbildung 17.7). Auf diese Weise kann man das Rechteck leichter nach rechts vergrößern. Fügen Sie also ein Schlüsselbild am Ende des Videos ein (bei unserem Beispiel in Bild 61) und verkleinern Sie im ersten Bild den Balken mit dem Frei Transformieren-Werkzeug. Stellen Sie nun in Bild 1 die Option Bewegungstween ein und erzeugen Sie gegebenenfalls eine weitere Ebene mit einem Rahmen, um das Maximum des Fortschritts anzudeuten.

Abbildung 17.7: Durch diese Registrierung wird unsere Fortschrittsanzeige im Bewegungstween nach rechts wachsen.

Abbildung 17.8: Um die Fortschrittsanzeige zu verkleinern, muss man den mittleren rechten Anfasser nach links ziehen.

Sicherlich fallen Ihnen noch viele weitere Möglichkeiten ein, Ihre Videos noch spektakulärer zu machen. So können Sie beispielsweise Masken darüber legen oder den Movieclip mit dem Video darin selbst tweenen. Allerdings kann ein Video schnell die Dateigröße Ihres Flash-Films aufblähen. Deshalb sollten Sie sich noch mit den Kapiteln 19 und 20 beschäftigen, um z.B. etwas über die loadMovie-Aktion zu lernen. So können Sie nämlich den Ladezeitpunkt eines Videos bestimmen.

357

Videos einsetzen

17.3 Videos optimieren Wie schon gesagt gibt es zwei Größen, die man bei Videos optimieren sollte. Das ist zum einen die Bildqualität und zum anderen die Dateigröße (und damit Downloadzeit). Hochqualitative Videos sind meist sehr datenintensiv und ruckeln dann oft beim Abspielen. Lesen Sie dazu in Kapitel 20 mehr. Es mag sich ein wenig eigenartig anhören, dass man bei Videos auf die Downloadzeit achten muss, denn Flash kann Videos streamen (das heißt, Flash fängt schon mit der Wiedergabe an, bevor das ganze Video geladen ist). Allerdings sind 2 Minuten Downloadzeit für ein 10-Sekunden-Video zu lang. Bei 2 Minuten Abspielzeit und gleicher Downloadlänge wäre diese Downloadzeit o.k., da man diese Zeit ja nicht mit Warten verschwendet, sondern schon recht früh in den Genuss des Videos kommt. Die Vorladezeit (Zeit, die vergeht, bevor das Video abgespielt wird) berechnet sich wie folgt: Vorladezeit = Downloadzeit × Abspielzeit + Abspielzeit / 10 Somit sollte es unser Ziel sein, die Vorladezeit gering zu halten. Übrigens kann man mit dem Bandbreiten-Profiler (der in Kapitel 20 eingeführt wird) die Download- und Vorladezeit betrachten.

Einstellungen für Sorenson Spark Wie gesagt, in ist Flash der Sorenson Spark Codec für die Videokomprimierung verantwortlich. Während des Komprimierens wird das Video nach gleichen und ähnlichen Bildern und Bildausschnitte untersucht. Diese werden dann zusammengefasst abgespeichert, was die Dateigröße (ähnlich wie bei ZIP-Programmen) reduziert. Allerdings werden bei ZIP-Programmen die komprimierten Inhalte (die Dateien) 1:1 wiederhergestellt. Das nennt man »verlustfreie Komprimierung«. Bei Videos ist das anders. Hier gehen Daten verloren, weshalb man auch von »verlustbehafteter Komprimierung« spricht. Sie kennen das ja schon von JPG-Bildern und MP3-Sounds. Die goldene Regel heißt hier: Komprimieren Sie so viel wie möglich, ohne dass die Qualität unakzeptabel wird. Natürlich ist das ein subjektiver Eindruck, und dazu kommt, dass Videokomprimierung eine sehr komplexe Sache werden kann, da hier verschiedene Szenen und zusätzlich Ton mit gleichbleibenden Einstellungen gut aussehen/klingen müssen. Glücklicherweise müssen Sie sich nur mit den wenigen Videoimport-Einstellungen vertraut machen (siehe Abbildung 17.9). In diesem Fenster gibt es einige Details zu beachten. Zuerst sollten Sie sich den Daten des Quellvideos zuwenden. Hier finden Sie die Breite und Höhe in Pixel (190 x 240, siehe Abbildung 17.9). Genau diese Werte finden Sie auch bei den Angaben zum Ergebnisvideo wieder. Hier können Sie aber über den Skalieren-Regler beeinflussen, welche Größe für Ihre Zwecke gut ist. Die Werte werden dann sofort automatisch aktualisiert. Ein kleineres Video hat selbstverständlich auch eine kleinere Datei zur Folge.

358

Videos optimieren

Abbildung 17.9: Es lohnt sich, einen Blick auf die Optionen in diesem Fenster zu werfen, da sie die Videoqualität und die Downloadzeit beeinflussen.

Man kann die Qualität-Einstellung an dieser Stelle nur sehr schwer abschätzen, da man das Video in komprimierter Form erst zu Gesicht bekommt, wenn man OK gedrückt hat. Wenn Sie dann mit der Qualität nicht zufrieden sind, müssen Sie das Video erneut importieren und dann die Einstellungen entsprechend anpassen. Ich empfehle Ihnen, erst eine sehr schlechte Qualität auszuprobieren und sie dann stufenweise zu erhöhen, bis Sie mit ihr zufrieden sind. Damit Sie nicht am Reimportieren verzweifeln, können Sie diese Funktion in Flash recht zügig aus der Bibliothek aufrufen (siehe Abbildung 17.10).

Abbildung 17.10: Wenn Sie Importeinstellungen eines Videos verändern möchten, können Sie es über den Optionsmenüpunkt Eigenschaften in der Bibliothek neu importieren, um die Einstellungen zu variieren.

359

Videos einsetzen

Auch wenn die Skalierung und Qualität noch recht einfach zu verstehen sind, muss man für den Regler Schlüsselbildintervall wissen, wie Sorenson Spark komprimiert. Dabei wird zuerst das erste Bild als Schlüsselbild komplett abgespeichert. Danach werden nur die Änderungen zum nächsten Bild gesichert, bis ein neues Schlüsselbild fällig ist. Und genau das wird mit dem Schlüsselbildintervall geregelt: wie oft ein Schlüsselbild gespeichert werden soll. Wenn Sie einen Wert von 24 einstellen, ist jedes 25te Bild ein Schlüsselbild, denn der Wert gibt an, wie viele Zwischenbilder gezeigt werden sollen. Je kleiner die Zahl ist, umso mehr Schlüsselbilder erscheinen also und umso größer wird die Datei auch wieder. Es gilt folgende Regel: Je schneller sich Inhalte im Video verändern, umso kleiner sollte das Schlüsselbildintervall sein und umgekehrt. Abschließend betrachten wir das Verhältnis Video-/Flashbilder. Hier geben Sie an, wie viele Videobilder auf jedes Flashbild kommen sollen. Wählen Sie hier also ein Verhältnis von 1:2, kommt ein Videobild auf 2 Flashbilder. Deshalb wird jedes zweite Videobild, das normalerweise komprimiert würde, übersprungen. Hier ein kurzer Überblick über die Komprimieroptionen in der Reihenfolge, die ich normalerweise einhalten würde: 쐽

Wählen Sie zuerst eine Skalierung aus.

쐽

Legen Sie die Größe des Ergebnisvideos fest (abhängig davon, wie viel Ladezeit Sie dem Betrachter zumuten möchten).

쐽

Achten Sie auf die Bildrate des Flash-Films, weil das Auswirkungen auf die Synchronisation haben kann.

쐽

Denken Sie über die Natur des Materials nach, denn danach richtet sich beispielsweise das Schlüsselbildintervall.

쐽

Setzen Sie die Qualität immer zumindest ein wenig herunter (auch wenn es nur auf 99% ist), denn auch dadurch wird die Datei kleiner (bei kaum wahrnehmbaren Verlusten).

17.4 Zusammenfassung Video ist ja eine Synchronisation von bewegten Bildern uns Sound. Meiner Meinung nach gibt es nichts besseres als Video, um den Spirit von irgendetwas festzuhalten. Jede Präsentation kann durch die Verwendung von Video aufgelockert werden. Immer wenn man etwas demonstrieren möchte, kann man das über ein Video sehr einprägsam umsetzen. Der Aufwand (Extra-Arbeit für Sie und zusätzliche Downloadzeit für den Anwender) kann sich durchaus lohnen.

360

Workshop

Flash komprimiert Videos mit dem Sorenson Spark Codec. Darüber haben Sie beim Importvorgang die Kontrolle, um einen Kompromiss aus Downloadzeit und Bildqualität herbeizuführen. Es gibt eigentlich nur eine kleine Hürde bei der Videoverwendung in Flash: Sie müssen Videos wie Stream-Sound und Grafik-Symbole verwenden und somit genügend Platz in der Zeitleiste schaffen.

17.5 Workshop F&A F

Sie haben ja von AVI-Dateien abgeraten. Leider habe ich nur solche Videos zur Verfügung. Soll ich diese zuerst ins QuickTime-Format umwandeln? A

F

Ich habe ein Video mit einem grandiosen Soundtrack importiert, aber er hört sich schrecklich an, auch wenn ich nur ganz minimal komprimiere. Wieso? A

F

Passen Sie bitte die Soundeinstellungen unter DATEI / EINSTELLUNGEN FÜR VERÖFFENTLICHUNGEN in der Registerkarte Flash an.

Ich weiß, dass es lang dauern kann, wenn Flash komprimiert. Allerdings muss ich ewig warten, wenn ich einen Film veröffentliche, der ein bereits komprimiertes Video enthält. Woran liegt das? A

F

O.K., wenn Sie nur AVI-Dateien haben, nutzen Sie diese halt. Die Umwandlung in QuickTime macht sie leider auch nicht besser.

Auch das liegt meist an den Soundeinstellungen, denn Flash komprimiert den Ton immer erst beim Veröffentlichen. Dazu können Sie unter DATEI / EINSTELLUNGEN FÜR VERÖFFENTLICHUNGEN in der Registerkarte FLASH den Komprimierungstyp des Tons temporär auf RAW stellen (einfach auf die EinstellungenSchaltfläche klicken, um in das entsprechende Dialogfenster zu kommen), um im Teststadium die Veröffentlichungen zu beschleunigen. Denken Sie aber daran, das beim endgültigen Export wieder rückgängig zu machen.

Ich habe eine QuickTime-Datei importiert und dabei komprimiert. Trotzdem ist mein Flash-Film größer als die Originaldatei. Wie kommt das? A

Das sollte normalerweise nicht passieren, ist aber möglich, wenn Ihre Quelldatei bereits stark komprimiert war. Denken Sie bitte daran, mit möglichst gutem Material zu starten, damit Flash optimal komprimieren kann.

361

Videos einsetzen

Quiz Auch zum Thema Video fallen mir ein paar kniffelige Fragen ein: 1. Wenn Ihr Video eine ungerade Bildrate von 29.97 BpS hat (eine wahrscheinliche Rate, wenn das Video für`s Fernsehen bestimmt war), wird der Ton irgendwann nicht mehr zum Bild Ihres Flash-Films passen – es sei denn, sie machen was? a.

Ein Video mit amerikanischem NTFS verwenden, das exakt mit 25 BpS läuft.

b. Die Option Video mit Bildrate des Macromedia Flash-Dokuments synchronisieren beim Importieren aktivieren. c. Im Flash-Film eine Bildrate von 30 BpS verwenden, was nah genug an den 29.97 BpS ist. 2. Wie verändern Sie die Komprimierung eines bereits importierten Videos? a.

Das kann man nicht. Allerdings kann man es neu importieren und dabei andere Einstellungen wählen.

b. Man das über die Eigenschaften des Bibliothek-Symbols erledigen, indem man auf Erneut komprimieren klickt. c. Man ändert einfach die Werte unter DATEI / EINSTELLUNGEN FÜR VERÖFFENTLICHUNGEN in der Video-Registerkarte. 3. Sorenson Spark ist ... a.

... eine veraltete Technologie, die Funken (engl. sparks) aus Ihrem Monitor schlagen lässt.

b. ... das Komprimierverfahren, das kostenlos in Flash MX und als Dekomprimierverfahren im Flash Player eingebunden ist. c. ... ein optionales (kostenpflichtiges) Zusatzprogramm für Superkomprimierung.

Übung Machen Sie weiter und erstellen Sie ein Video mit Fortschrittsanzeige und wechselndem Wiedergabe-/Pause-Knopf.

362

Filme ins Internet bringen

8 1

Filme ins Internet bringen

Da Sie nun wissen, wie man Bilder, Animationen, Schaltflächen und Interaktivität erzeugt, können wir uns damit beschäftigen, wie man all diese Daten zusammenfügt, um sie ins Internet zu stellen. In diesem Kapitel werden Sie lernen, wie man Flash-Filme in Internetseiten einbindet. Selbstverständlich kann man einen Flash-Film auf einem Computer lokal abspielen (wie beim Testen eines Films). Allerdings besteht der richtige Spaß darin, den Film im Internet zu veröffentlichen, sodass jeder ihn sehen kann. In diesem Kapitel werden Sie: 쐽

Ihren Flash-Film mit dem notwendigen HTML-Dokument veröffentlichen,

쐽

Hyperlinks einbinden, damit der Anwender zu anderen Seiten weiterspringen kann oder es leichter hat, eine E-Mail zu versenden,

쐽

eine Einführung erhalten, wie man Flash-Dateien auf einen Internetserver stellen kann.

18.1 Standard-Veröffentlichung Viele Funktionen von Flash sind einfach zu bedienen. Die Veröffentlichung eines FlashFilms ist nicht nur einfach, sondern auch noch schnell. Eigentlich brauchen Sie nur DATEI / VERÖFFENTLICHEN wählen. Dabei wird nicht nur eine .swf-Datei exportiert, sondern gleichzeitig die für die Veröffentlichung notwendige HTML-Seite generiert. HTML steht für »HyperText Markup Language«. Eine HTML-Datei ist eigentlich nichts anderes als eine Text-Datei, die Informationen über das Aussehen einer Internetseite enthält. Ihr Internetbrowser wandelt diese Informationen in ein sichtbares Bild um. Hier wird auch angegeben, wo und wie ein Flash-Film eingebunden werden soll. Da Flash diese Datei für Sie anlegt, brauchen Sie nicht in den nächsten Buchladen zu laufen und sich Lektüre zu dieser Sprache zuzulegen. Allerdings kann dieses Wissen nicht schaden.1 In der folgenden Übung werden Sie die Menüpunkte VERÖFFENTLICHEN und VORSCHAU FÜR VERÖFFENTLICHUNGEN aus dem DATEI-Menü kennen lernen. 1

Wenn Sie unbedingt wollen: »HTML – M+T Easy« von Christian Wenz und Tobias Hauser, ISBN: 3-82726029-9, wäre als Einstieg empfehlenswert. Ebenso »Jetzt lerne ich HTML« von Harald Taglinger, ISBN: 3-8272-5717-4, »HTML in 21 Tagen« von Laura Lemay und Denise Tyler, ISBN: 3-8272-5784-0, oder das »HTML & Web-Publishing Handbuch« von Stefan Münz und Wolfgang Nefzger, ISBN: 3-7723-0598-9

364

Standard-Veröffentlichung

Übung: Veröffentlichen Sie einen Film 1. Erstellen Sie in einer neuen Datei eine einfache Animation. Speichern Sie diese in einen neuen Ordner (zum Beispiel test auf Ihrem Desktop) und nennen Sie die Datei testfilm. 2. Wählen Sie EINSTELLUNGEN FÜR VERÖFFENTLICHUNGEN aus dem DATEI-Menü und dort Registerkarte Formate. Stellen Sie sicher (siehe Abbildung 18.1), dass sowohl Flash als auch HTML aktiviert sind (das ist die Standardeinstellung).

Abbildung 18.1: Hier kann man einstellen, welche Dateien erstellt werden sollen, wenn Sie den Film veröffentlichen.

3. Wählen Sie nun DATEI / VERÖFFENTLICHEN aus. Es passiert noch nicht viel, dennoch können Sie ja einmal in Ihren test-Ordner schauen. Neben der Originaldatei (testfilm.fla) finden Sie die Dateien testfilm.html und eine testfilm.swf vor. Doppelklicken Sie auf die HTML-Datei und es wird sich Ihr Standardbrowser öffnen, der Ihren Flash-Film abspielt! (Aus irgendwelchen Gründen ist das Abspielen eines Flash-Filmes in einem Browser für manche Leute ein echtes Erfolgserlebnis.) 4. Wenn Sie jetzt die .swf-Datei zusammen mit der HTML-Datei auf einen Webserver hochladen, kann jeder den Film sehen, wenn er die Adresse kennt und einen Flash Player installiert hat. Ich habe Ihnen empfohlen sicherzustellen, dass die Optionen Flash und HTML aktiviert sind. Für jede dieser Optionen wird eine eigene Registerkarte eingeblendet, in der man einige Einstellungen bezüglich dieses Formats vornehmen kann. In unserem Fall finden Sie also eine Flash- und eine HTML-Registerkarte. Schauen Sie sich die Einstellungen ruhig einmal an – sie erklären sich eigentlich von selbst. Wir werden in Anhang C aber noch einmal darauf zurückkommen.

365

Filme ins Internet bringen

Wenn Sie in der letzten Übung statt DATEI / VERÖFFENTLICHEN den Weg DATEI / VORSCHAU FÜR VERÖFFENTLICHUNGEN / STANDARD (F12) gewählt hätten, wäre auch der Browser direkt geöffnet worden und Sie hätten sich einen Schritt gespart. Die Dateien in Ihrem test-Verzeichnis beginnen alle mit dem Namen der Original-Datei (testfilm). Wenn Sie die HTML-Datei zum Beispiel in index.html umbenennen wollen, ist das kein Problem. Sollten Sie aber die .swf-Datei umbenennen oder verschieben, kann das zu Komplikationen führen, da auch in der HTML-Datei der ursprüngliche Name (testfilm.swf) eingetragen wurde. Sie müssen ihn dann gegebenenfalls mit einem Editor (wie Notepad) von Hand umschreiben (er taucht an zwei Stellen auf). Damit Sie die HTML-Datei im Texteditor auch finden, müssen Sie nach DATEI / ÖFFNEN gegebenenfalls die Option Alle Dateien wählen (siehe Abbildung 18.2).

Abbildung 18.2: Wenn Sie beispielsweise auch HTMLDateien in Notepad sehen wollen, müssen Sie den Dateityp umstellen.

Der Dateiname wird in den folgenden beiden Zeilen (an verschiedenen Stellen) eingetragen, um den Flash-Film sowohl im Internet Explorer als auch im Netscape Navigator sichtbar zu machen. src="testfilm.swf" PARAM NAME=movie VALUE="testfilm.swf"

Auch wenn wir jetzt nicht HTML lernen wollen, müssen die beiden Einträge doch auf die richtige .swf-Datei zeigen.

366

Ein einfacher Hyperlink

Wenn Sie Veränderungen an der HTML-Datei vorgenommen haben, wird diese bei der nächsten Veröffentlichung wieder überschrieben (es sei denn, Sie haben die Datei zuvor umbenannt). Um das zu vermeiden, brauchen Sie nicht immer eine komplette Veröffentlichung durchzuführen, sondern es wird DATEI / FILM EXPORTIEREN reichen, wenn Sie bei Dateityp den Wert Flash-Player auswählen. Auch das Testen des Films ((Strg)+(Enter)) exportiert nur die .swf-Datei und hat den gleichen Effekt.

18.2 Ein einfacher Hyperlink Wenn wir einen Film schon ins Internet stellen, spricht eigentlich nichts dagegen, auch die Funktionalität des WWW auszunutzen und Hyperlinks zu definieren. Wie das funktioniert, haben wir ja bereits in Kapitel 14 im Abschnitt »Navigation« besprochen. In Abbildung 18.3 finden Sie aber eine kleine Gedankenstütze.

Abbildung 18.3: Mit der Aktion getURL kann man einen Hyperlink erzeugen.

Die Aktion getURL können Sie überall anwenden, wo Aktionen erlaubt sind (Schaltflächen, Filmsequenzen und Schlüsselbilder). Sie funktioniert fast wie ein goto, allerdings wird nicht zu einem Bild, sondern zu einer anderen Internetseite gesprungen. Es gibt aber noch zwei weitere Möglichkeiten, einen Hyperlink zu erzeugen. Jeder Text kann beispielsweise mit einem URL versehen werden. Wählen Sie dazu einfach den betreffenden Textblock aus und öffnen Sie das Eigenschaften-Bedienfeld. Hier finden Sie die Einstellung URL. Tragen Sie dort einfach die gewünschte Adresse ein (siehe Abbildung 18.4). Wenn Sie nun im Film auf diesen Text klicken, funktioniert er wie ein herkömmlicher Hyperlink.

367

Filme ins Internet bringen

Abbildung 18.4: Dieser Textblock ist nun als Hyperlink deklariert.

Es gibt neben der Aktion getURL und dem Eintragen eines URLs über das EigenschaftenBedienfeld noch eine dritte Möglichkeit. Diese betrifft dynamischen Text. Hier gibt es nämlich die Möglichkeit, den Text als HTML-Code zu interpretieren und so kann man selbstverständlich auch einen Hyperlink produzieren. Wie das funktioniert, sehen Sie nun:

Übung: Verwenden Sie dynamischen Text, um einen Hyperlink zu erzeugen In dieser Aufgabe werden wir HTML-Text in einen Textblock schreiben. 1. Erstellen Sie mit dem Text-Werkzeug in einer neuen Datei einen Textblock (der Typ ist egal, da er sowieso ersetzt wird). 2. Wählen Sie aus dem Eigenschaften-Bedienfeld das Verhalten Dynamischer Text aus und verknüpfen Sie den Textblock mit der Variable meinText. Aktivieren Sie die Option HTML (siehe Abbildung 18.5).

Abbildung 18.5: Auf diese Weise können Sie HTML in Flash verwenden.

3. Im ersten Schlüsselbild können Sie nun die meinText-Variable anpassen. Wählen Sie also das erste Bild aus und öffnen Sie das Aktionen-Bedienfeld. Fügen Sie die Aktion Set Variable (unter Aktionen / Variablen) ein und tragen Sie unter Variable den Text meinText ein. Bei WERT können Sie die HTML-Zeile Diese Seite ist super! eintragen. 4. Wenn Sie HTML verstehen, ist das gut. Wenn nicht, akzeptieren Sie das bitte für den Moment. Testen Sie den Film.

368

Welche Aufgaben im Internet kann Flash noch erfüllen?

18.3 Welche Aufgaben im Internet kann Flash noch erfüllen? Im Rest dieses Kapitels werden Sie einige nützliche Wege kennen lernen, wie man Flash mit normalem HTML kombinieren kann. Auch wenn Sie mit dieser Sprache nicht vertraut sind, sollten Sie daraus einige Informationen entnehmen können.

Fenster anvisieren Sicher ist Ihnen aufgefallen, dass bei der Verwendung eines Hyperlinks (zum Beispiel per getURL-Aktion) die neue Seite in dem Fenster angezeigt wurde, in dem sich zuvor noch Ihr Flash-Film befand. Dieses Standardverhalten kann man aber noch variieren. Im Aktionen-Bedienfeld wird für die Aktion getURL ein Parameterfenster angegeben. Dabei handelt es sich um das Zielfenster, in dem die anzuspringende Seite angezeigt werden soll. Allerdings gibt es noch so genannte Frames (zu dt.: Rahmen), die eine einzelne Seite unterteilen können. Sicher haben Sie so etwas schon gesehen. Wenn links beispielsweise eine Linkliste angegeben ist und rechts der eigentliche Inhalt der Seite liegt, können Sie rechts scrollen, aber links bewegt sich die Liste keinen Millimeter. Das Fenster ist also offensichtlich in zwei Teile aufgeteilt. Das sind die erwähnten Frames. Für die genaue Anvisierung, in welchem Frame die neue Seite angezeigt werden soll, ist ebenfalls die Einstellung Fenster verantwortlich (siehe Abbildung 18.6).

Abbildung 18.6: Hier kann man das Zielfenster für den Hyperlink auswählen.

369

Filme ins Internet bringen

Die Werte für die Auswahl des Zielfensters von getURL sind: 쐽

_self – lädt die nächste Seite in den Rahmen, in dem der Link liegt

쐽

_parent – lädt die Seite in den aktuellen Rahmen

쐽

_blank – zeigt die nächste Seite in einem neuen Browserfenster

쐽

_top – lädt die Seite auf die oberste Rahmen-Ebene

E-Mails senden (mit dem mailto:-Befehl) Auch wenn es bessere Wege gibt, eine E-Mail über eine Webseite zu versenden, ist hier eine schnelle Variante: Geben Sie einfach die E-Mail-Adresse im URL-Feld von getURL an. Damit Flash (oder besser: der Browser) auch weiß, dass es sich um eine E-Mail handelt, muss der Adresse noch ein mailto: vorangestellt werden. Das könnte dann so aussehen: mailto:[email protected]

Wenn der Anwender diese Aktion ausführt, wird ein neues E-Mail-Fenster geöffnet, in dem er nur noch den Text und eine Betreffzeile eintragen muss.

18.4 Auf einen Webserver hochladen Der wohl wichtigste Schritt in diesem Kapitel ist das Hochladen der Dateien auf einen Webserver. Auch wenn Sie auf Ihrem Computer den Flash-Film gut testen konnten, können andere Anwender den Film nur sehen, wenn Sie ihn zum Beispiel im Internet veröffentlichen. Der Vorgang des Hochladens ist bei Anwendern unterschiedlich. Wenn Sie beispielsweise in einem Unternehmen arbeiten, in dem sich auch ein Webserver befindet, auf den Sie direkten Zugriff haben, brauchen Sie nur die Daten darauf zu kopieren (wie auf eine andere Festplatte). In den meisten Fällen haben Sie aber einen Online-Anbieter, bei dem Sie Ihre Homepage ablegen wollen. In diesem Fall werden die Daten mit einem speziellen Protokoll (meist FTP, was für »file transfer protocol« oder »Datenübertragungsprotokoll« steht) übertragen. Dazu benötigen Sie eine spezielle Software (die meist Ihr Online-Anbieter für Sie bereithält) und sowohl einen Benutzernamen (login) als auch ein Passwort. Natürlich müssen Sie auch die FTP-Adresse kennen, auf welche die Seite geladen werden soll. Da dieser Vorgang bei allen Online-Anbietern verschieden ist, habe ich an dieser Stelle keine Chance, die Vorgehensweise im Detail zu beschreiben. Bitte nehmen Sie gegebenenfalls Kontakt mit Ihrem Online-Provider auf.

370

Zusammenfassung

18.5 Zusammenfassung Wie Sie gesehen haben, ist das Veröffentlichen einer Flash-Seite so einfach wie auf einen Knopf zu drücken. Sie wissen nun, wie man Flash-Seiten mit FTP hochladen kann. Weitere Details werden in Anhang C besprochen. Außerdem haben Sie gesehen, wie man Flash-Seiten mit HTML kombiniert, um beispielsweise Links darzustellen.

18.6 Workshop F&A F

Wenn ich eine Vorschau veröffentliche, sieht alles gut aus, wenn ich dann aber die Dateien auf einen Webserver hochgeladen habe, funktioniert nichts mehr. Wieso? A

F

Das kann an etwa einer Million Dinge liegen. Bitte vergewissern Sie sich, dass alle benötigten Dateien mit hochgeladen wurden und dass Sie sich mit dem gleichen Namen in der gleichen Ordnerstruktur befinden wie auf Ihrer Festplatte.

Kann man mehr als einen Flash-Film pro Internetseite haben? A

Selbstverständlich, diese können sogar parallel ablaufen. Sie können dazu beispielsweise Frames verwenden.

Quiz Bitte beantworten Sie die Fragen zuerst selbst, bevor Sie die Lösungen nachlesen. 1. Wenn ich den Befehl VERÖFFENTLICHEN verwende, passiert nichts. Läuft da etwas falsch? a.

Ja, denn beim Veröffentlichen gibt es einen Fehler, der in Flash MX noch nicht beseitigt wurde.

b. Möglicherweise, denn Sie müssen sich erst mit dem Internet verbinden, damit das funktioniert. c. Nein, denn diese Funktion exportiert lediglich alle nötigen Dateien.

371

Filme ins Internet bringen

2. Wenn man dieses Kapitel gelesen hat, sind die Grundlagen der Sprache HTML gelegt. Richtig oder Falsch? a.

Richtig, die Erklärung war sehr gut verständlich.

b. Falsch, denn Sie wissen immer noch nicht genau, wie HTML funktioniert, aber Sie haben einen Einblick in sein Potential bekommen. c. Falsch, denn erst wenn Sie dieses Buch komplett gelesen haben, können Sie sich einen HTML-Profi nennen. 3. Ist die Aktion getURL die einzige Möglichkeit, einen Hyperlink zu erzeugen? a.

Ja, außer man fügt ihn direkt in HTML ein.

b. Nein, denn es gibt eine ganze Sektion von Aktionen in Flash, mit denen man Hyperlinks erstellen kann. c. Nein, denn es gibt einige Textoptionen, mit denen man automatisch Hyperlinks erstellen kann.

372

Modulare Internetseiten entwerfen

9 1

Modulare Internetseiten entwerfen

Man kann eine große Website als eine riesige Flash-Datei erstellen. Allerdings gibt es einige Vorteile, wenn man die Seite in kleine Unterabschnitte aufteilt. Nur um einige zu nennen: Sie können gerade benötigte Bereiche nachladen und müssen nicht jedem Anwender alles aufzwingen, wenn er einen großen Teil gar nicht sehen will. Außerdem können mehrere Mitarbeiter gleichzeitig am gleichen Projekt arbeiten, ohne dass einer die Riesen-Datei blockiert. Bei Neuerungen muss dann nur einen Teil der Homepage überarbeitet und neu eingespielt werden. Sie können sogar mehrere Sprachversionen einer Seite erzeugen, indem Sie den sprachlich differierenden Teil austauschen. Natürlich gibt es noch einige weitere Vorteile. In diesem Kapitel lernen Sie verschiedene Wege kennen, wie man in Flash eine modulare Internetseite erstellen kann. Sie werden 쐽

lernen, wie die Aktion loadMovie es Ihnen ermöglicht, einen Film in einem anderen abzuspielen oder ein externes JPG anzuzeigen,

쐽

lernen, wie die Aktion loadSound es Ihnen ermöglicht, externe MP3-Sounds abzuspielen,

쐽

die Vorzüge und die Verwendung von geteilten Bibliotheken kennen lernen

쐽

und sehen, wie Sie Skripte außerhalb von Flash speichern und mit #include einbinden können.

Auch wenn die technischen Gegebenheiten in diesem Kapitel nicht gerade schwierig sind, verzeihen die hier erzeugten Flash-Effekte keine Fehler. Wenn sie einmal funktionieren, ist das toll. Die Schwierigkeit liegt allerdings nicht darin, wie man die Methoden anwendet, sondern wann. Deshalb werden wir zuerst besprechen, wie sie funktionieren und danach ausgiebig darauf eingehen, wann und wo man sie einsetzen sollte.

19.1 Filme und JPGs laden Man kann in Flash mit der Aktion loadMovie einen Film in einem anderen abspielen lassen. Stellen Sie sich dazu einfach einen großen Hauptfilm vor, in den ein kleineres Fenster mit einem Unterfilm eingeblendet wird. Ein Grund dafür, diese Technik anzuwenden, ist, dass Sie eventuell viele kurze Einzelfilme haben, die Sie alle hintereinander (d.h. einen nach dem anderen) abspielen wollen. Dabei können Sie dem Anwender sogar die Wahl lassen, welchen Film er abspielen will. Wenn er dann eine Schaltfläche anklickt, kann diese Flash befehlen, einen bestimmten Film nachzuladen und abzuspielen. Der Vorteil ist dann, dass der Anwender nur die Filmabschnitte herunterladen muss, die ihn wirklich interessieren. Es wird Zeit, dass wir uns mit einigen technischen Details von loadMovie auseinandersetzen; danach können Sie es gerne ausprobieren. Mit loadMovie kann man nur .swf-Dateien in .swf-Dateien laden. Deshalb müssen Sie den Film nicht nur testen, um das Ergebnis zu

374

Filme und JPGs laden

sehen, sondern beide Filme müssen schon als .swf vorliegen. Außerdem müssen Sie die Position angeben, wo der Film abspielen soll. Dafür kommt als Ziel entweder eine Filmsequenz in Frage oder Sie geben eine Stufe an. Wenn Sie einen Film in eine Filmsequenz laden, wird diese durch die .swf-Datei ersetzt. Wenn Sie als Ziel eine Stufe angeben, wird alles auf dieser Stufe durch die .swf-Datei ersetzt. Stufen sind ein Nummern-System in Flash, das angibt, in welcher Stapelanordnung sich geladene Filme befinden. Der Hauptfilm befindet sich immer in Stufe 0 (im Code heißt sie _level0). Wenn Sie einen Film nach _level1 und einen weiteren nach _level2 laden, erscheint der Film auf _level2 über allen anderen. Wenn Sie einen Film allerdings in eine Filmsequenz laden, hängt die Anordnung von der Ebene ab, in der sich die Filmsequenz befindet.

Übung: Verwenden Sie loadMovie In dieser Übung werden wir einen Film mit drei Unterfilmen erstellen und den Anwender entscheiden lassen, welchen der Filme er laden will. 1. Das Geheimnis hinter dieser Übung heißt Organisation. Denken Sie immer daran: Wer hastet, erzeugt Müll. Erzeugen Sie einen neuen, leeren Ordner, in dem Sie alle Dateien dieser Übung abspeichern. 2. Erstellen Sie einen neuen Film mit einer Breite und Höhe von 300 Bildpunkten ((Strg) +(J)). 3. Erzeugen Sie einen Tween Ihrer Wahl und färben Sie das tweenende Objekt zur Gänze rot. Speichern Sie die Datei unter dem Namen rot.fla im soeben angelegten Ordner ab. Testen Sie den Film, damit die entsprechende Datei rot.swf erzeugt wird. 4. Ändern Sie die Objektfarbe nun in Grün und speichern Sie die Datei unter gruen.fla ab. Testen Sie auch diesen Film, um die .swf-Datei zu generieren. 5. Erstellen Sie die Datei blau.fla mit einem blauen Objekt und testen Sie sie wiederum. 6. Schließen Sie alle Dateien und erstellen Sie einen neuen Flash-Film namens haupt.fla, der eine Bühnengröße von 500 x 500 Bildpunkten hat. 7. Unser Hauptfilm soll die einzelnen Unterfilme in eine Filmsequenz laden. Deshalb zeichnen Sie bitte ein Quadrat, das exakt 300 x 300 Bildpunkte groß ist (ändern Sie die Größe einfach im Eigenschaften-Bedienfeld). Stellen Sie sicher, dass eine Linie um das Quadrat vorhanden ist und entfernen Sie dann die Füllung. Konvertieren Sie den Rest des Quadrats in eine Filmsequenz namens Quadrat und nennen Sie die Instanz auf der Bühne dieSequenz.

375

Modulare Internetseiten entwerfen

8. Zeichen Sie in der Hauptszene ein Rechteck auf die Bühne, das Sie in eine Schaltfläche konvertieren. Öffnen Sie für diese Instanz das Aktionen-Bedienfeld. Fügen Sie eine loadMovie-Aktion ein und tragen Sie bei URL den Wert rot.swf ein. Bei ORT sind die Werte Ziel und dieSequenz einzutragen, damit der neue Film in unserem Quadrat angezeigt wird (siehe Abbildung 19.1).

Abbildung 19.1: So wird ein Film in eine Filmsequenz geladen.

9. Testen Sie den Film. Es wird funktionieren, allerdings wird der Film im Quadrat zu weit rechts und zu weit unten angezeigt. Auch wenn der Film die gleiche Größe wie das Quadrat hat, wird er mit der oberen linken Ecke an der Mitte des Quadrates ausgerichtet. 10. Um dieses Problem zu beheben, gehen Sie in das Master-Symbol von Quadrat. Ziehen Sie nun das Quadrat so, dass die obere linke Ecke mit dem Kreuz (das ja den Ausrichtungspunkt eines Symbols darstellt) übereinstimmt (siehe Abbildung 19.2). Sie können natürlich auch das Eigenschaften-Bedienfeld verwenden und die linke obere Ecke des Quadrates nach 0,0 ausrichten. Wenn Sie nun in die Hauptszene zurückkehren, hat sich das Quadrat verschoben. Ziehen Sie es an seine ursprüngliche Stelle zurück. Nun haben Sie den Ausrichtungspunkt angepasst. 11. Erstellen Sie nun zwei weitere Schaltflächen, mit denen man die Filme gruen.swf und blau.swf laden kann.

376

Filme und JPGs laden

Abbildung 19.2: Verändern Sie den Ausrichtungspunkt der Filmsequenz, in der ein Film geladen werden soll, damit er richtig angezeigt werden kann.

Anvisieren von Clips und Stufen Wenn Sie beim Einfügen einer loadMovie-Aktion im Optionsbereich den ORT auf Stufe statt auf Ziel stellen, können Sie einen Film auch direkt in eine Stufe laden. Tragen Sie daneben einfach die Nummer der Stufe ein (siehe Abbildung 19.3). Ich lade aus zwei Gründen nicht gerne in Stufen. Erstens ist die Ausrichtung immer die obere linke Ecke und zweitens muss man den Überblick über Stufennummern und nicht über Instanznamen behalten.

Abbildung 19.3: Man kann Filme und JPGs auch direkt in »Stufen« laden.

377

Modulare Internetseiten entwerfen

Übrigens kann man Filme in Stufen genauso ansprechen wie solche in Filmsequenzen. Wenn Sie beispielsweise bei einem in eine Filmsequenz geladenen Flash-Film dieSequenz.stop() schreiben würden, wäre das Äquivalent z.B. _level1.stop() bei einer Stufe.

19.2 Wann wurde ein Flash-Film komplett geladen, und wie entlädt man ihn wieder? Da Sie nun wissen, wie Sie einen Film laden, wäre es gut, wenn Sie wüssten, wie Sie ihn wieder entladen. Vorher will ich Ihnen aber zeigen, wie man herausbekommt, ob ein zu ladender Film auch komplett geladen wurde. Das ist besonders dann wichtig, wenn es sich um einen großen Film handelt. Außerdem ist es gut, wenn man dem Anwender mitteilt (und auch demonstriert), dass der Film wirklich heruntergeladen wird. Vielleicht wollen Sie den Anwender auch solange warten lassen, bis der Film komplett geladen wurde. Um hinter den Ladezustand zu kommen, verwenden Sie die Eigenschaften _framesloaded und _totalframes. Wenn beide den gleichen Wert haben, wissen Sie, dass der Film komplett geladen wurde. Sie könnten hier also die Anzahl der geladenen Bilder vergleichen. Eine andere Möglichkeit ist der direkte Vergleich der gesamten Dateigröße (getBytesTotal()) und der bereits geladenen Bytes (getBytesLoaded()).

Übung: Stellen Sie fest, ob ein Film komplett geladen wurde In dieser Übung werden wir die Gesamtzahl der Bilder mit den bereits geladenen Bildern vergleichen. 1. Erstellen Sie zuerst einen 300 x 300 Bildpunkte großen Film, der geladen werden soll und dann eine Bild-für-Bild-Animation, die in Bild 2 beginnt und etwa in Bild 60 endet. Wenn Sie einige Rastergrafiken haben, können Sie diese hier (ausnahmsweise) unbedacht verwenden, da eine größere Datei in dieser Übung zu Demonstationszwecken besser ist (aber bitte nicht übertreiben). 2. Fügen Sie in das erste Bild eine stop-Aktion ein, die von einer evaluate-Aktion gefolgt wird. Fügen Sie in dieser Aktion den Ausdruck waiting=true ein, um Flash mitzuteilen, dass es auf das vollständige Laden des Unterfilms warten soll (siehe Abbildung 19.4). 3. Fügen Sie in Bild 1 den statischen Text Lade... ein und erstellen Sie einen dynamischen Textblock mit einer 0 darin. Verknüpfen Sie ihn mit der Variablen percent (siehe Abbildung 19.5).

378

Wann wurde ein Flash-Film komplett geladen, und wie entlädt man ihn wieder?

Abbildung 19.4: Mit waiting=true wird Flash auf den Unterfilm warten, bis dieser komplett nachgeladen wurde.

Abbildung 19.5: Hier wird dem Anwender später angezeigt, wie weit der Ladevorgang fortgeschritten ist.

4. Fügen Sie in das letzte Bild des Films eine goto-Aktion ein, die auf Bild 2 verweist. Damit wird sich die Animation wiederholen (und das erste Bild übersprungen).

379

Modulare Internetseiten entwerfen

5. Speichern Sie diesen Film in einem neuen Ordner als unterfilm.fla. Testen Sie den Film, damit die .swf-Datei erzeugt wird. Der Film wird beim Testen bei Bild 1 hängen bleiben. Das wird aber vom ladenden Film geregelt. 6. Zeichnen Sie in einer neuen Datei ein Quadrat mit der Größe 300 x 300 Bildpunkte und entfernen Sie die Füllung. Konvertieren Sie es in eine Filmsequenz namens Quadrat und benennen Sie die Instanz auf der Bühne mit dieSequenz. Doppelklicken Sie auf die Sequenz und richten Sie die obere linke Ecke des Quadrats mit dem Plus-Zeichen aus (wie in der letzten Übung). Nach dem Verlassen des Master-Symbols müssen Sie das Quadrat neu positionieren. 7. Erzeugen Sie in der Hauptszene drei Schaltflächen. Fügen Sie in der ersten eine loadMovie-Aktion ein, die den unterfilm.swf in das Ziel dieSequenz laden soll. 8. Fügen Sie in den beiden anderen Schaltflächen je eine evaluate-Aktion ein. Eine soll den Ausdruck dieSequenz.play() und die andere den Wert dieSequenz.stop() haben. 9. Jetzt wird es Zeit, unserer Filmsequenz (dieSequenz) das Prozentrechnen beizubringen. Fügen Sie eine onClipEvent-Aktion ein, die auf EnterFrame reagieren soll. Jetzt benötigen wir eine evaluate-Aktion in diesem Ereignis. Sie soll den Ausdruck percent=int(_framesloaded/_totalframes*100) auswerten. Damit wird der Prozentwert der geladenen Bilder errechnet und das int ist in diesem Fall nur für das Runden zuständig. 10. Allerdings sind Sie damit noch nicht fertig, denn Sie müssen noch abfragen, wann der Film komplett geladen wurde und ihn dann weiter spielen lassen. Erweitern Sie das Script deshalb wie in Abbildung 19.6. Hier wird dann der Film gestartet, wenn noch gewartet wurde und der Prozentwert gleichzeitig 100 beträgt.

Abbildung 19.6: Das fertige Script

380

Geteilte Bibliotheken

11. Probieren Sie es aus. Wenn Sie etwas mehr Ladezeit provozieren wollen, können Sie die Filme ja auf einen Webserver bringen und von dort aus anzeigen lassen. Da Sie nun wissen, wie Sie einen Film laden, und auch prüfen können, wie weit er geladen wurde, fehlt Ihnen nur noch eine Aktion: das Entladen von Filmen. Dies kann auf zwei Arten erfolgen. Die erste ist, einfach etwas anderes an dieselbe Stelle (in den vorigen Übungen: dieSequenz) zu laden. Die zweite (und sauberere) Lösung wäre die unloadMovieAktion. Der einzige Trick dabei ist, dass Sie sich erinnern müssen, wohin Sie einen Film geladen haben, denn das müssen Sie beim Entladen wieder angeben.

19.3 Geteilte Bibliotheken Wenn Sie in einem Master-Symbol eine Veränderung vornehmen, wirkt sich das auf alle Instanzen aus. Stellen Sie sich einmal vor, Sie hätten eine Bibliothek, die von mehreren Dateien genutzt wird. Wenn Sie dort etwas ändern, werden alle anderen Dateien angeglichen. Das kann eine Menge Zeit sparen. Stellen Sie sich weiter vor, Sie haben 100 Filme auf Ihrer Website und alle sind mit einem Symbol (Ihrem Logo) versehen. Jetzt ändert sich das Logo. Sie haben 100 Filme nachzubearbeiten und das nur wegen einer kleinen Änderung. Wenn Sie das Logo allerdings in einer geteilten Bibliothek aufgerufen hätten, würden Sie eine einzige Änderung vornehmen müssen und alle anderen Dateien hätten das mitbekommen. Andererseits können Sie auch einen Film bauen, der (je nach Sprache) unterschiedliche Bibliotheken verwendet. So können Sie Ihre Site im Handumdrehen in eine andere Sprache übersetzen und müssen nicht alle Aktionen und Textblöcke durchsuchen. Eine geteilte Bibliothek wird im Grunde nur durch eine automatisierte loadMovie-Aktion realisiert. Sie können auch Schriftarten in eine solche Bibliothek einbetten und haben Download-Vorteile, wenn Sie mehrere Filme nachladen wollen, da die Schriftart nicht in jeder einzelnen Datei eingebunden wird, sondern nur einmal mit der geteilten Bibliothek heruntergeladen werden muss.

Geteilte Bibliotheken verwenden Die Verwendung einer geteilten Bibliothek beinhaltet zwei Schritte. Zuerst müssen Sie natürlich eine Bibliothek erstellen, die geteilt werden soll. Danach müssen Sie die Bibliothek mit jeder Datei verknüpfen, die darauf zugreifen können muss.

381

Modulare Internetseiten entwerfen

Übung: Erstellen Sie eine geteilte Bibliothek In dieser Übung werden Sie eine geteilte Bibliothek erstellen, die von anderen Dateien verwendet werden kann. 1. Erstellen Sie eine neue Datei und speichern Sie diese sofort als geteilt.fla in einen neuen Ordner namens BibTest. Importieren Sie eine Rastergrafik und löschen Sie die Instanz auf der Bühne (die Grafik bleibt ja noch in der Bibliothek). Importieren Sie auch noch eine Sound-Datei und zeichnen Sie ein Quadrat, das Sie in eine Filmsequenz namens Quadrat umwandeln. 2. In Ihrer Bibliothek befinden sich nun drei Objekte. Jede Datei kann ihre Bibliothek mit anderen teilen, wenn sie erst einmal als .swf-Datei vorliegt. Dazu müssen Sie die Datei also als .swf exportieren. Im Normalfall würden aber alle ungenutzten Bibliotheksobjekte nicht mitexportiert werden, um Speicherplatz einzusparen. Bei einer geteilten Bibliothek müssen aber alle Objekte exportiert werden, auch wenn sich der Speicherbedarf dadurch erhöht. Das machen wir dadurch wett, dass wir die Bibliothek in vielen Filmen verwenden. Damit jedes Objekt exportiert wird, erstellen wir für jedes Symbol eine Verknüpfung. 3. Um eine Verknüpfung für die Sound-Datei zu erstellen, wählen Sie diese bitte aus Ihrer Bibliothek aus und verwenden den Menüpunkt VERKNÜPFUNG... aus dem Optionsmenü. Standardmäßig ist hier Keine Verknüpfung eingestellt. Ändern Sie das auf Dieses Symbol exportieren. Nun wird der Sound immer mitexportiert. Sie müssen einen eindeutigen Namen angeben, damit Sie den Sound wiederfinden. Wählen Sie hier im Moment den Namen musik (siehe Abbildung 19.7).

Abbildung 19.7: Der Sound wird ab sofort mitexportiert.

382

Geteilte Bibliotheken

4. Machen Sie so weiter und nennen Sie die Rastergrafik bild und das Rechteck sequenz. Stellen Sie jeweils sicher, dass die Symbole exportiert werden. 5. Speichern Sie die Datei und testen Sie den Film, um die .swf-Datei zu generieren. 6. Die geteilte Bibliothek ist fertig und kann eingesetzt werden. Da Sie nun über eine geteilte Bibliothek verfügen, können Sie die Inhalte in einer anderen Datei auslesen und verwenden.

Übung: Beginnen Sie, eine geteilte Bibliothek einzusetzen Nun werden wir eine Datei erstellen, die auf die geteilte Bibliothek zurückgreift, die wir gerade erstellt haben. 1. Schließen Sie alle eventuell geöffneten Dateien. Erstellen Sie eine neue Datei und speichern Sie diese direkt als Datei1.fla im Ordner BibTest aus der letzten Übung ab. Wählen Sie nun DATEI / ALS GEMEINSAME BIBLIOTHEK ÖFFNEN. Wählen Sie die soeben erstellte Datei geteilt.fla aus. Es erscheint die Bibliothek, die wir in der letzten Übung angelegt haben. Allerdings hat sie einen grauen Hintergrund. Nun können Sie die Symbole der geteilten Bibliothek verwenden, ohne den Speicherbedarf von Datei1 zu erhöhen.

Abbildung 19.8: Wenn Sie Inhalte aus der gemeinsamen Bibliothek verwenden, scheinen diese auch in der normalen Bibliothek vorhanden zu sein.

2. Sie können nun Instanzen aus der gemeinsamen Bibliothek auf die Bühne ziehen oder auch in die Bibliothek von Datei1 verschieben. Öffnen Sie diese Bibliothek doch einmal und fügen Sie die drei Objekte ein. Es sieht wie immer aus, allerdings befinden

383

Modulare Internetseiten entwerfen

sich die Objekte nicht in der Datei1-Bibliothek. Es handelt sich hier nur um Instanzen, die auf die geteilte Bibliothek verweisen (siehe Abbildung 19.8). 3. Doppelklicken Sie auf das Symbol Quadrat in der Datei1-Bibliothek. Es erscheint die Warnung, die Sie auch in Abbildung 19.9 finden. Klicken Sie auf Nein. Abbildung 19.9: Diese Warnung erscheint, wenn Sie versuchen, ein gemeinsames Symbol zu bearbeiten.

4. Testen Sie den Film und betrachten Sie danach die Dateigröße. Die Datei geteilt.swf wird relativ groß sein, wogegen die Datei1.swf recht klein bleibt. Wenn Sie die letzte Übung noch einmal für eine Datei2.fla wiederholen würden, wäre diese auch nicht sehr groß. Ein Anwender bräuchte den Sound und das Bild nur einmal zu laden, auch wenn es mehrfach von unterschiedlichen Dateien genutzt würde.

Übung: Aktualisieren Sie den geteilten Inhalt in einer Bibliothek Jetzt sehen Sie einen weiteren Vorteil, den geteilte Bibliotheken bieten: Das Bearbeiten von Inhalten einer geteilten Bibliothek wirkt sich auf alle angeschlossenen Dateien aus. 1. Öffnen Sie die Datei geteilt.fla und schauen Sie nach, welche Bezeichnung das Bild hat (bild). Löschen Sie dieses Bild aus der Bibliothek und importieren Sie ein anderes, welches das alte ersetzen soll. 2. Öffnen Sie die Eigenschaften-Symbolverknüpfung und stellen Sie wieder sicher, dass dieses Bild exportiert wird. Geben Sie ihm den gleichen Namen wie dem zuvor gelöschten Bild (bild). 3. Speichern Sie den Film und testen Sie ihn, um die .swf-Datei zu aktualisieren. 4. Öffnen Sie die Datei1 und Sie werden die Aktualisierung bemerken. Das war doch wirklich nicht schwer! Sie haben eine Datei erzeugt, deren Bibliothek als gemeinsame Bibliothek für viele andere Dateien dienen kann. Die Vorteile liegen klar auf der Hand. Denken Sie also bei Ihren zukünftigen Projekten darüber nach, ob nicht im Einzelfall eine gemeinsame Bibliothek Sinn macht. Man kann sogar untereinander Schriftarten teilen. Das werden wir jetzt ebenfalls ausprobieren.

384

Verknüpfte Skripte

Übung: Teilen Sie eine Schriftart untereinander 1. Öffnen Sie die Datei geteilt.fla aus der letzten Übung. Öffnen Sie die Bibliothek und wählen Sie aus dem Optionsmenü den Eintrag Neue Schriftart. 2. Wählen Sie eine Schriftart aus. Geben Sie ihr einen Namen (ich schlage vor, dass Sie den Originalnamen verwenden und ein _IMPORTIERT anhängen, damit später klar ist, dass diese Schriftart aus der geteilten Bibliothek stammt (siehe Abbildung 19.10).

Abbildung 19.10: Wenn man an einen Originalnamen einen Zusatz (hier _IMPORTIERT) anfügt, kann man die geteilte Schriftart später gut von der Originalschriftart unterscheiden.

3. Jetzt müssen Sie Flash wieder überreden, die Schriftart auch zu exportieren. Das geht auf dem gewohnten Weg über die Verknüpfung. Wählen Sie als Namen bitte Schrift 1. 4. Speichern Sie die Datei und testen Sie sie auch, damit die .swf-Datei aktualisiert wird. Schließen Sie die Datei. Erstellen Sie eine neue Datei und nennen Sie diese Datei_s.swf. 5. Wählen Sie DATEI / ALS GEMEINSAME BIBLIOTHEK ÖFFNEN und hier wieder geteilt.fla aus. Jetzt können Sie die Schriftart in die Bibliothek der Datei ziehen und ab sofort dort einsetzen.

19.4 Verknüpfte Skripte Alles was Sie im Aktions-Bedienfeld eintragen, können Sie als Text abspeichern. Wählen Sie dazu aus dem Optionsmenü ALS DATEI EXPORTIEREN. So können Sie Ihre Skripte auch per Texteditor bearbeiten. Das ist aber nur der erste Schritt, verknüpfte Skripte zu verwenden. Wenn Sie also extern ein Skript vorliegen haben, können Sie es wieder einbinden, indem Sie im Aktionen-Bedienfeld auf die +-Schaltfläche klicken und dort unter Aktionen / Verschiedene Aktionen den Punkt #include auswählen. Das hat den Vorteil, dass Sie ActionScript bearbeiten können, ohne in Flash zu arbeiten. Denken Sie aber daran, dass Sie einen Film erst neu exportieren müssen, damit die Änderungen sichtbar werden, denn das ist der Zeitpunkt, an dem die ActionScript-Datei (meist mit der Dateiendung .as) eingefügt wird. Auf diese Weise können Sie sehr einfach Updates an Ihren Projekten durchführen.

385

Modulare Internetseiten entwerfen

19.5 Zusammenfassung In der heutigen Lektion haben wir mehrere Möglichkeiten kennen gelernt, Objekte zwischen mehreren Dateien zu teilen und somit Speicher zu sparen und für reibungslose Wartungen großer Projekte zu sorgen. Sie werden sicher einige Zeit benötigen, um zu lernen, wann es sinnvoll ist, eine Bibliothek zu teilen, und wann es nur unnötigen Arbeitsaufwand verursacht. Das nötige Grundwissen haben Sie jetzt allerdings. Legen Sie also los!

19.6 Workshop F&A F

Ich habe einen Unterfilm richtig verknüpft. Allerdings erhalte ich trotzdem die Meldung, dass er die Datei irgendwas.swf nicht öffnen konnte. Wo ist das Problem? A

F

Meine Website wird sehr unordentlich, wenn all die Unterfilme in ihrem Stammverzeichnis liegen. Gibt es die Möglichkeit, über Unterordner die Unterfilme einzusortieren? A

F

Ja. Wenn Sie bei loadMovie als URL einfach film.swf angeben, wird Flash direkt im gleichen Verzeichnis des Hauptfilms suchen. Sie können aber auch ein Unterverzeichnis (zum Beispiel filme/film.swf) ansprechen, indem Sie dem Dateinamen das Verzeichnis durch einen Schrägstrich / getrennt voranstellen. Wenn Sie in ein Verzeichnis einer höheren Ebene wechseln möchten, können Sie die ..-Notation aus HTML verwenden.

Wenn ich weiß, dass ich eine geteilte Bibliothek für ein Projekt einsetzen will, aber noch nicht über die fertigen Objekte (zum Beispiel Grafiken) verfüge, gibt es dann eine Möglichkeit, trotzdem schon anzufangen? A

386

Wenn Sie eine falsche Verknüpfung als Ursache ausschließen können, haben Sie eventuell vergessen, den Unterfilm als .swf-Datei zu exportieren. Testen Sie den Unterfilm – meist läuft es dann.

Klar, nehmen Sie einfach irgendeine Grafik, die Sie als Platzhalter verwenden und ersetzen Sie diese beim Eintreffen der endgültigen Grafik durch die neue (wie besprochen).

Workshop

Quiz Ich habe das Gefühl, Sie würden an dieser Stelle auf etwas ganz Besonderes warten. Naja. Vielleicht ist es auch nur ein Gefühl. Machen wir also mit den Übungsfragen weiter. 1. Wie viele Filme kann man in _level3 laden? a.

Keinen, da diese Stufe für Sounds reserviert ist

b. So viele man will c. Einen 2. Wenn man den Drehwinkel (Rotation) eines zu ladenden Films verändern will: Wohin muss man diesen dann laden? a.

In eine Filmsequenz

b. In eine _level-Nummer c. Entweder in eine Sequenz oder in ein Level 3. Wie viele Personen können gleichzeitig das Master-Symbol einer gemeinsamen Bibliothek bearbeiten? a.

Eine

b. So viele es wollen c. So viele, wie es Dateien gibt, die diese Bibliothek verwenden

387

Optimierung Ihrer Flash-Site

0 2

Optimierung Ihrer Flash-Site

Jetzt können Sie bereits zeichnen, animieren und eine Seite entwerfen, die sowohl interessant aussieht als auch einfach zu handhaben ist. Natürlich benutzen Sie entweder FILM TESTEN oder VORSCHAU FÜR VERÖFFENTLICHUNGEN, um eine genaue Vorstellung davon zu bekommen, wie Ihr Film aussehen wird. Es kann allerdings ein deutlicher Unterschied dazwischen bestehen, ob der Film auf Ihrer Festplatte oder bei Ihrem Internetpublikum abläuft. Dabei variiert nämlich nicht nur die Verbindungsgeschwindigkeit, auch das Verhalten der einzelnen Computer der Anwender kann sich unterscheiden. Das Ergebnis könnte ein Film sein, der auf dem Rechner eines Anwenders eine lange Ladezeit benötigt und dann beim Abspielen ruckelt, obwohl er auf Ihrem Computer sofort gleichmäßig läuft.Optimieren beinhaltet zwei voneinander unabhängige Angelegenheiten: das Verringern der Dateigröße eines Films, um die Ladezeit zu verkürzen, und das Verbessern der Filmwiedergabe, sodass sichergestellt ist, dass der Film unabhängig von der Geschwindigkeit des Prozessors auf verschiedenen Computern gleich gut läuft. Dieses Kapitel untersucht beide Themen in dem Versuch sicherzustellen, dass Ihr Film eine kurze Ladezeit hat und auf allen Rechnern verschiedenster Anwender gut läuft. In diesem Kapitel werden wir: 쐽

die Dateigröße Ihres Films reduzieren, ohne die Qualität in Mitleidenschaft zu ziehen,

쐽

unnötige Spezialeffekte entfernen, um die Leistung zu verbessern,

쐽

geeignete Alternativen zu Flash finden.

20.1 Überlegungen zur Dateigröße Der schnellste Weg, Ihr Publikum zu verlieren, besteht darin, sie einer langen Ladezeit auszusetzen. In Kürze werden Sie erfahren, wie Sie die Dauer der Ladezeit eines Films kalkulieren können. Die einfache Formel lautet jedoch: Je schneller ein Film geladen wird, desto besser ist es. Auch wenn Internetverbindungen schneller werden (z.B. mit Technologien wie DSL und Kabelmodems), ist es eine Tatsache, dass die Mehrheit Ihres potenziellen Publikums immer noch mit einer Wählverbindung (56 Kbit/s-Modems oder langsamer) arbeitet. Selbst wenn Sie sich dafür entscheiden, sich nur an die Anwender mit schnellen Verbindungen zu richten, gibt es keinen Grund, Filme größer zu machen als absolut notwendig. Man neigt dazu, die Technologie an ihre Grenzen zu bringen und ein bisschen darüber hinaus. Wenn Sie das Fassungsvermögen eines Schranks komplett ausnutzen und dann einen neuen, größeren Schrank bekommen, füllen Sie sehr wahrscheinlich den neuen Schrank und denken dabei, dass Sie sogar noch mehr Platz benötigen – das ist normal. Die Tatsache, dass Sie sehr große Flash-Dateien erstellen können, heißt noch lange nicht, dass Sie das auch tun sollten.

390

Überlegungen zur Dateigröße

Ladezeiten kalkulieren Man braucht keine komplizierte Formel, um einzuschätzen, wie lange eine Datei zum Laden braucht. Sie müssen nur wissen, wie groß die Datei ist und mit welcher Geschwindigkeit der Anwender sie herunterlädt. Das ist mit der Einschätzung vergleichbar, wie lange man für eine bestimmte Strecke mit dem Auto braucht. Sie müssen nur die Entfernung und die Geschwindigkeit des Autos kennen. Wenn die Entfernung z.B. 30 Kilometer beträgt und die Geschwindigkeit 60 km/h beträgt, sollte Ihre Fahrt eine halbe Stunde dauern. Die Entfernung in Kilometern dividiert durch die Geschwindigkeit in Stundenkilometern ergibt die Zeit in Stunden (Entfernung / Geschwindigkeit = Zeit). Diese Formel lässt sich einfach auf die Ladezeiten übertragen: Dateigröße / Übertragungsgeschwindigkeit = Zeit Eine Dateigröße, die 10 Einheiten enthält, benötigt bei einer Geschwindigkeit von 5 Einheiten pro Sekunde zwei Sekunden. Das ist einfach! Wir brauchen noch nicht einmal von Bits, Bytes und Kilobytes zu sprechen. All diese Begriffe beziehen sich auf verschiedene Einheiten – wie Meter und Zentimeter oder Mark und Pfennig. Die Formel funktioniert immer, vorausgesetzt, die Einheiten für die Dateigröße und die Übertragungsgeschwindigkeit sind gleich. Ein Auto, das 100 Stundenkilometer schnell fährt, wird 50 Kilometer in einer halben Stunde schaffen. Wir werden uns später mit Bits und Bytes befassen. Für den Moment merken Sie sich die Formel Größe / Geschwindigkeit = Zeit. In Wirklichkeit können Sie nur schätzen (und nicht berechnen), wie lange es dauert, mit dem Auto irgendwohin zu fahren, weil Ihre Geschwindigkeit leicht schwanken wird. Das Gleiche trifft auf Flash-Filme zu, da die Download-Geschwindigkeit schwankt. Dass Sie ein 28,8-Kbit/sek-Modem besitzen (das theoretisch 3,6 Kbyte/sek empfängt) bedeutet nicht, dass eine 100 Kbyte große Datei in 28 Sekunden geladen wird (also 100 Kbyte / 3,6 Kbyte/ Sekunden = 28 Sekunden). Abhängig von verschiedenen Faktoren wie einem hohen Datenaufkommen im Internet und der Leistungsfähigkeit des Webservers kann sich die Ladezeit der Datei verlängern. Wenn die aktuelle Übertragungsgeschwindigkeit z.B. nur 2,3 Kbyte/sek beträgt, wird die Datei von 100 Kbyte in 43 Sekunden geladen. Machen Sie sich bewusst, dass es sich immer nur um eine Schätzung handelt, wenn Sie sich an das Berechnen von Ladezeiten machen.

Was ist groß? Was ist klein? Die Formel zur Schätzung von Ladezeiten kann also wie folgt zusammengefasst werden: Je größer die Datei, desto länger ist die Ladezeit. Folglich muss die Dateigröße verringert werden, wenn eine kürzere Ladezeit das erklärte Ziel ist. In diesem Abschnitt werden Sie erfahren, welche Flash-Features dazu neigen, größere Dateien hervorzubringen, und – was entscheidender ist – Sie werden alternative Techniken kennen lernen, um den gleichen

391

Optimierung Ihrer Flash-Site

Effekt zu erzielen, dabei aber weniger Einfluss auf die Dateigröße nehmen. Obwohl manche Flash-Features um jeden Preis gemieden werden sollten (wie MODIFIZIEREN / FORM / ECKEN ABRUNDEN), brauchen Sie nicht alles zu vermeiden, was die Datei vergrößert – Sie sollten diese Features eben nur dann benutzen, wenn Sie sie wirklich benötigen.

Linien benötigen weniger Speicherplatz als Füllungen Egal ob Sie eine Füllung oder eine Linie zeichnen: Flash speichert einen Algorithmus, der zur Anzeige des Gezeichneten nötig ist. Im Fall von Füllungen (die z.B. mit dem PinselWerkzeug gezeichnet sind), wird die Information für alle Seiten der Fläche gespeichert. Sie können, wie Sie in Abbildung 20.1 sehen, nur eine Seite der Füllung verändern. Linien jedoch haben gar keine Seiten oder Tiefe – Sie haben lediglich Endpunkte. Nehmen wir an, Sie zeichnen eine grüne Linie mit einer Strichstärke von 10. Flash speichert nur die Linie, die Stärke und die Farbe. Genau genommen wird von Flash nicht die tatsächliche Stärke gespeichert, sondern nur, dass eine Stärke auf die Linie angewendet werden muss. In Flash würde die gleiche Form, wenn sie mit dem Pinsel-Werkzeug gezeichnet wäre, das Speichern von Informationen über alle Seiten der Form erforderlich machen – stellen Sie sich für diesen Fall eine einfache Linie als eine Form mit vier Seiten vor. Betrachten Sie Abbildung 20.2, in der ich zwei Linien gezeichnet, eine davon in eine Füllung umgewandelt (über MODIFIZIEREN / FORM / LINIEN IN FÜLLUNGEN KONVERTIEREN) und dann alles mit dem Unterauswahl-Werkzeug ausgewählt habe. Wie Sie sehen, gibt es in der Füllung wesentlich mehr Ankerpunkte, was bedeutet, dass sie zu einer größeren Datei führen wird.

Abbildung 20.1: Füllungen benötigen (im Gegensatz zu Linien) mehr Speicherplatz, weil Flash Informationen über alle Seiten der Form speichern muss.

392

Überlegungen zur Dateigröße

Abbildung 20.2: Die rechte Linie wurde in eine Füllung konvertiert. Das UnterauswahlWerkzeug kann benutzt werden, um die zusätzlichen Informationen der Füllung zu sehen.

Text teilen Wenn Sie ein Textfeld markieren und dann MODIFIZIEREN / TEILEN auswählen, verwandelt sich der Text in eine Form. Abgesehen davon, dass Sie einen einmal geteilten Text nicht mehr editieren können, nimmt Ihre Dateigröße in der Regel zu, weil Flash jede einzelne Biegung in jedem einzelnen Buchstaben speichert. Tatsächlich erfordert auch der reine Text, dass die Umrisse der Buchstaben gespeichert sind – dies wird allerdings von der Schrift selbst erledigt, die das im Übrigen sehr effizient tut. Der Buchstabe »i« kommt in dem Wort Phillip z.B. 2-mal vor, ist aber nur 1-mal in der Schrift gespeichert. Wenn der Text geteilt wäre, würde der Buchstabe jedes Mal wieder gespeichert. Im Allgemeinen wird geteilter Text (im Gegensatz zu normalem statischem Text) die Datei fast immer vergrößern. Stellen Sie sich einen Textabsatz vor. Wahrscheinlich wird das Teilen des Textes Ihre Datei vergrößern, da Flash die Informationen über die Form jedes einzelnen Buchstabens speichern muss. Aber angenommen, Sie haben eine besondere Schrift, die Sie nur für einen einzigen Buchstaben verwenden wollen. Wenn Sie nur diesen Buchstaben vom restlichen Text teilen, kann Ihre Datei tatsächlich kleiner werden! Das rührt daher, dass die benötigte Information, die Flash für die gesamten Schrift speichern wird, umfangreicher ist als die Information für den herausgelösten und in eine Form verwandelten Buchstaben. Die Schlussfolgerung daraus ist, dass Sie den Text nicht teilen sollten, wenn Sie die gleiche Schrift an verschiedenen Stellen Ihres Films verwenden oder einen langen Text (in der gleichen Schrift) haben. Wenn es sich nur um einen Buchstaben handelt, werden Sie ihn

393

Optimierung Ihrer Flash-Site

wahrscheinlich vom restlichen Text trennen wollen. (Zu einem späteren Zeitpunkt in diesem Kapitel werden Sie erfahren, wie Sie den Unterschied der Dateigröße messen können, sodass Sie das Ergebnis der verschiedenen Methoden einfach vergleichen können.) Natürlich müssen bei der Entscheidung zwischen geteiltem und normalem statischen Text weitere Gesichtspunkte einbezogen werden (so z.B. ob Sie absolut sicher sind, dass Sie den Text wirklich nie wieder bearbeiten müssen).

Dynamischer Text und Texteingaben mit eingebetteten Schriften können groß sein Manchmal haben Sie keine Wahl zwischen geteiltem und statischem Text. Wenn Sie dynamischen Text oder Texteingaben verwenden, gibt es keine Möglichkeit, den Text zu teilen (ansonsten wäre der Text nicht mehr veränderbar). Allerdings können Sie entscheiden, welche Schriftumrisse der Text (wenn überhaupt) enthalten soll. Abbildung 20.3 zeigt, wo Sie diese Einstellung treffen können. Weitere Angaben dazu, wie diese Einstellungen genutzt werden können, finden Sie in Kapitel 15. Es ist hier noch wichtig zu erwähnen, dass Sie nicht mehr Schriftumrisse einbetten sollten als absolut nötig, da dies die Datei bedeutend vergrößert.

Abbildung 20.3: Das Einbetten aller Schriftumrisse ist notwendig, wenn in einem dynamischen Feld eigene Schriften angezeigt werden sollen. Allerdings vergrößert dies die Datei erheblich.

394

Überlegungen zur Dateigröße

Verschachtelte Filmsequenzen sind kleiner als verschachtelte grafische Symbole Dieses Thema ist in Kapitel 12 ausführlich behandelt worden, soll aber hier trotzdem erwähnt werden. Einfach ausgedrückt sind grafische Symbole gut geeignet, wenn Sie die Vorschau ihrer Veränderung in der Zeitleiste benötigen. Filmsequenzen (die in anderen Filmsequenzen verschachtelt sind) werden jedoch zu einer kleineren Dateigröße führen.

Formtween, Bewegungstween und Schlüsselbilder Vergessen Sie für einen Moment die sichtbaren und funktionalen Unterschiede zwischen den verschiedenen Arten des Tweenings und der Benutzung von Schlüsselbildern für eine Animation. Im Allgemeinen vergrößern Formtweens die Datei am meisten. Der Unterschied zwischen Bewegungstweens und mehreren Schlüsselbildern ist nicht so eindeutig. Im Grunde möchten Sie so wenig Schlüsselbilder wie möglich. Ein Bewegungstween benötigt Flash, um dazwischenliegende Schlüsselbilder zu erstellen (obwohl Sie diese nicht sehen werden). Tatsächlich ist es so, dass es im Endeffekt das Gleiche ist, ob Sie einen Bewegungstween benutzen, um mit einem Schlüsselbild im ersten Bild und einem weiteren in Bild 10 einen Kreis über den Bildschirm zu bewegen, oder ob Sie dafür 10 einzelne Schlüsselbilder verwenden. (Natürlich würden Sie in einem solchen Fall eine Instanz des Kreis-Symbols benutzen, sodass es nicht zahlreiche Kopien der Form gäbe.) Im Grunde genommen sind die Einzelbild-Animation und das Bewegungstweening ungefähr das Gleiche. Allerdings kann es bei der Einzelbild-Animation vorkommen, dass Sie die gleichen Wirkungen auch dann erzielen, wenn Sie weniger Bilder verwenden. Das kann die Bewegung nicht nur realistischer und flüssiger machen, sondern zu einer kleineren Dateigröße führen, da weniger Bilder benutzt werden. Um es noch einmal zusammenzufassen: Vermeiden Sie Formtweens und halten Sie immer nach einer Möglichkeit Ausschau, wie Sie weniger Bilder verwenden können.

Optimieren Sie behutsam Auch wenn die vorhergehenden Hinweise (es werden in diesem Kapitel noch einige folgen) wie feste Regeln erscheinen – erinnern Sie sich daran, dass Flash über nützliche Features die Dateigröße betreffend verfügt. So gibt es beispielsweise keine bessere Art, einen Morphing-Effekt zu erzielen, als das Formtweening. Nur weil Formtweens Ihre Datei vergrößern, heißt das noch lange nicht, dass sie nicht genutzt werden können. Suchen Sie nach Alternativen, wo es angebracht erscheint, zögern Sie jedoch nicht, Formtweens zu benutzen, wenn Sie es müssen. Wenn Sie wissen, welche Features dazu neigen, die Dateigröße negativ zu beeinflussen, können Sie mit diesem Hintergrund bessere Entscheidungen treffen. Diese Hinweise stellen einen guten Ausgangspunkt dar. Zu einem späteren Zeitpunkt in diesem Kapitel werden Sie sehen, wie Sie die Auswirkung einzelner Features auf die Dateigröße berechnen können.

395

Optimierung Ihrer Flash-Site

Sound- und Bitmap-Dateien Ton-Dateien und Rastergrafiken (wie Dateien mit der Endung .jpg und .bmp) wurden im vorigen Abschnitt nicht erwähnt. Sie haben eine derart enorme Auswirkung auf die Dateigröße, dass ihnen dieser gesamte Abschnitt gewidmet ist. Die Ersparnis an Dateigröße, die Sie durch andere Tipps gemacht haben (wie z.B. Linien statt Füllungen zu benutzen und Filmsequenzen anstelle grafischer Symbole) verblasst im Vergleich zur Tragweite der Handhabung von Sound- und Bitmap-Dateien. Das soll nicht heißen, dass Text und Vektorgrafiken gar keine Rolle spielen, aber Sounds und Bitmaps sind von größerer Bedeutung. Alles, was Sie zur Verringerung ihrer Größe tun können, wird zu einer großen Einsparung der Dateigröße Ihres Films führen.

Sound-Dateien Flash bietet mehrere Möglichkeiten, Ton- und Bitmap-Dateien zu komprimieren. Sie haben bereits in Kapitel 3 und 10 gesehen, wo diese Einstellungen zur Komprimierung für jede importierte Grafik oder Ton-Datei (mithilfe des Fensters Eigenschaften in der Bibliothek) individuell getroffen werden können. In Anhang C werden Sie darüber hinaus erfahren, wie Sie die Einstellungen zur Komprimierung für alle importierten Sound- und Grafik-Dateien mithilfe der Einstellungen für Veröffentlichungen auf einmal festlegen können. Auch wenn Sie bereits wissen, wo die Einstellungen zur Kompression getroffen werden, können Sie jetzt noch nicht genau verstehen, wie das Ihre Filme beeinflusst. Es gibt verschiedene Arten der Kompression. Für Audio-Dateien sollten Sie stets MP3 benutzen. Obwohl Flash ADPCM unterstützt, sollten Sie es nur in dem Fall verwenden, wenn Sie Ihren Film in Flash 3 oder niedriger veröffentlichen. (Wenn der Sound in Ihrem Film auch bei Leuten laufen soll, die nur den Flash 3 Player besitzen.) Wenn Ihr Film nur auf Ihrer Festplatte laufen soll (vielleicht arbeiten Sie an einer besonderen Dia-Show, die nicht im Internet veröffentlicht wird), können Sie auch gar keine Kompression angeben (RAW). Abgesehen von diesen beiden Fällen ist MP3 die beste Wahl. Es gibt einen einfachen Zusammenhang zwischen der Qualität und der Größe einer Datei. Sie haben in Kapitel 10 erfahren, wie Sie die Einstellungen für die Kompression eines einzelnen Sounds vornehmen. Im Grunde probieren Sie eine Einstellung aus und hören sich das Ergebnis an. Während Sie die verschiedenen Arten der Kompression testen, können Sie sowohl den Unterschied hören als auch die sich ändernde Dateigröße beobachten. Es kommt dabei auf das Ausbalancieren zwischen diesen beiden Prioritäten (gute Qualität und kleine Datei) an. Es gibt eine Reihe zusätzlicher Möglichkeiten, Sound-Dateien zu optimieren. Die einfachste ist, sich daran zu erinnern, dass Stereo-Sounds doppelt so groß sind wie MonoSounds. Aus diesem Grund sollten Sie Flash die Sound-Dateien immer von Stereo nach

396

Überlegungen zur Dateigröße

Mono konvertieren lassen, es sei denn, Sie benötigen wirklich Stereo. Merken Sie sich, dass Sie die Stereo-Blendeffekte auch auf Mono-Sounds anwenden können. Über den Bereich Effekt und die Schaltfläche Bearbeiten auf dem Eigenschaften-Bedienfeld erreichen Sie das Fenster Hülle bearbeiten, wo Sie vordefinierte Effekte (wie z.B. Von links nach rechts) benutzen oder einen eigenen Effekt definieren können, um einem MonoSound stereoartige Effekte zuzuweisen (siehe Abbildung 20.4).

Abbildung 20.4: Das Fenster Hülle bearbeiten (das über das EIGENSCHAFTEN-Bedienfeld erreicht wird) ermöglicht die Verwendung von Blendeffekten auch bei Mono-Sounds.

Eine weitere Möglichkeit, die Dateigröße von Sound-Files zu verringern, besteht darin, übermäßige Stille an Anfang und Ende des Sounds zu entfernen. Bei Toningenieuren ist es üblich, jede Sound-Datei mit etwas Stille zu polstern. Sounds benötigen für jede Sekunde, die abgespielt wird, die gleiche Speichermenge und zwar unabhängig davon, ob sie hörbar ist oder nicht. Idealerweise sollten die Sounds geschnitten werden, bevor sie importiert werden. Sie können sie aber auch innerhalb von Flash mithilfe des Fensters Hülle bearbeiten schneiden. Sie können sich diese Methode in Kapitel 10 ansehen. An dieser Stelle sollten Sie einfach nur bedenken, dass das zu kleineren Dateien führt. So habe ich z.B. die Größe des Beam Scan-Sounds (den Sie unter FENSTER / ALLGEMEINE BIBLIOTHEKEN / SOUNDS finden) durch Entfernen der übertriebenen Stille um 10% verringert. Das hört sich vielleicht nicht nach viel an. Wenn Sie aber bedenken, dass manche Sounds sehr groß sind, können 10% einer großen Datei doch eine erhebliche Einsparung darstellen. Was aber viel wichtiger ist: Durch das Herausschneiden der Stille habe ich nichts verloren.

397

Optimierung Ihrer Flash-Site

Bitmap-Dateien Die Größe von Bitmap-Grafiken kann auf verschiedene Arten verringert werden. Vor allen Dingen sollten Sie erwägen, Bitmap-Grafiken erst gar nicht zu verwenden. Auch wenn sich dieser Tipp etwas merkwürdig anhört, denken Sie darüber nach. Auf jeden Fall sollten Sie jede unnötige Rastergrafik (mit den Endungen .jpg, .gif, .bmp usw.) vermeiden, da die Farbe jedes einzelnen Pixels in der Datei gespeichert wird. Im Gegensatz dazu wird bei Vektorgrafiken lediglich ein Algorithmus gespeichert, der das Anzeigen der Form ermöglicht, nur die allgemeine Formel sozusagen. Allerdings gibt es bestimmte Arten von Bildern (wie z.B. Fotos), die man nur als Bitmap-Grafiken verarbeiten kann. Daher haben Sie nicht immer die Wahl. Trotzdem eine Warnung: Der Befehl MODIFIZIEREN / BITMAP NACHZEICHNEN, der in Kapitel 3 erläutert wurde, konvertiert eine Bitmap-Grafik in eine Vektorgrafik. Sie sollten diesen Befehl jedoch nur verwenden, wenn die Bitmap-Grafik klar begrenzte Bereiche enthält. Wenn Sie in dem Dialogfenster Bitmap nachzeichnen einstellen, sodass viele winzige Vektorformen anstelle großer Flächen gezeichnet werden (siehe Abbildung 20.5), kann es Ihnen passieren, dass Sie eine Vektorgrafik erstellen, die größer ist als die ursprüngliche Bitmap-Grafik. Viele Leute scheinen zu glauben, dass Vektorgrafiken klein und BitmapGrafiken groß sind, aber wenn man es übertreibt, können auch Vektorgrafiken beachtliche Ausmaße im Hinblick auf Dateigrößen annehmen. Benutzen Sie Bitmap nachzeichnen also nur, wenn der Inhalt Ihrer Bild-Datei als Vektorgrafik besser gespeichert werden kann, was der Fall ist, wenn sie große geometrische Formen enthält. (Natürlich können Sie Bitmap nachzeichnen auch nutzen, um einen bestimmten Effekt zu erzielen; machen Sie sich nur die möglichen Auswirkungen auf die Dateigröße klar.)

Abbildung 20.5: Wenn Sie Bitmap nachzeichnen auf ein Foto anwenden, müssen die Werte für die Farb- und Kantenschwelle sowie für die kleinste Fläche so klein sein, dass das Bild an Größe verliert.

398

Überlegungen zur Dateigröße

Als kleinen Rückblick will ich den Unterschied zu den Exportoptionen von Bitmap-Grafiken erwähnen.

Importieren und Komprimieren von Dateien hoher Auflösung Auch wenn es widersprüchlich klingt, sollten Sie Sound- und Bitmap-Dateien zunächst in der größtmöglichen Auflösung importieren. Das wird die Größe Ihrer Flash-Datei (.fla) natürlich erhöhen. Aber natürlich können (und sollten) Sie Ihren Film vor dem Veröffentlichen komprimieren. Wie stark Flash Ihre Daten komprimiert, bestimmen Sie entweder mit den Einstellungen einzelner Sounds und Bitmap-Grafiken in der Bibliothek oder mithilfe der Einstellungen für Veröffentlichungen. Beispielsweise sollten Sie, anstatt ein Bild vor dem Importieren nach Flash in ein komprimiertes .jpg umzuwandeln, besser mit der unkomprimierten .bmp- oder .png-Datei höchster Auflösung anfangen. Wenn es einmal importiert ist, können Sie immer noch festlegen, wie Flash es zum Export komprimieren soll. Sie können auf diese Art jederzeit entscheiden, ob stärker oder geringer komprimiert werden soll. Wenn Sie mit einer komprimierten Fassung (und damit schlechterer Qualität) anfangen, können Sie diese in Flash nicht verbessern. Sound-Dateien sollten im .wav- oder .aif-Format importiert werden (MP3-Dateien sind bereits komprimiert). Rastergrafiken sollten im .bmp-, .png- oder im .pct-Format vorliegen. (Beachten Sie dabei, dass .jpgDateien immer komprimiert sind und dass .gif-Dateien nur 256 Farben unterstützen.) Wenn Sie jedoch einen bereits komprimierten Sound oder ein Bild haben (also eine .mp3oder .jpg-Datei) und Sie entweder kein höher aufgelöstes Original bekommen können oder der Meinung sind, die derzeitige Komprimierung sei ideal, besteht keine Veranlassung für die Umwandlung in ein anderes Dateiformat. Importieren Sie die Datei wie sie ist, stellen Sie aber sicher, dass Flash sie nicht dekomprimiert. Für importierte komprimierte Bilder gibt es die Option Importierte JPEG-Daten verwenden im Dialogfenster BitmapEigenschaften der Bibliothek. Wenn Sie diese Option aktivieren, verhindern Sie, dass Flash die Datei dekomprimiert. Der einzige Fall, bei dem Sie in Flash ein bereits komprimiertes Bild dekomprimieren sollten, liegt vor, wenn Sie keinen Zugang zur OriginalDatei haben. Das Komprimieren einer bereits komprimierten Datei wird zwar tatsächlich die Dateigröße verringern. Die Qualität wird dabei allerdings schlechter sein als Komprimieren einer hoch aufgelösten Datei auf die gleiche Komprimierungsstufe. Stellen Sie im Fall von MP3-Ton-Dateien sicher, dass die Dateigröße beim Auswählen einer bestimmten Kompressionseinstellung nicht zunimmt. Wenn z.B. 145% des Originals angezeigt wird, nachdem Sie im Dialogfenster Sound-Eigenschaften auf Testen geklickt haben, haben Sie die Datei vergrößert. Bei dieser Dekomprimierung wird die Datei zwar größer, die Qualität jedoch nicht verbessert.

399

Optimierung Ihrer Flash-Site

Der Bandbreiten-Profiler Jetzt, wo Sie wissen, wie Sie die Dateigröße durch Komprimieren von Sound- und BitmapDateien sowie durch die Verwendung bestimmter Zeichentechniken beeinflussen können, sollten Sie das Ausmaß der einzelnen Einsparungen wirklich nachvollziehen. Es kann sein, dass Sie Sound-Dateien verwenden wollen, auch wenn Sie wissen, dass sie die Datei vergrößern. Ihre Entscheidung sollte sich allerdings danach richten, wie sehr der Sound die Datei vergrößert. Sollte sich herausstellen, dass der Anwender nur ein paar Sekunden länger warten muss, kann sich das Hinzufügen von Sound lohnen. Wenn das Hinzufügen eines Sounds jedoch bedeutet, dass der Anwender gleich 10 Minuten länger warten muss (was bei Anwendern mit 28 Kbit/sek-Modem leicht passieren kann), sollten Sie Sound nicht verschwenderisch einsetzen. Um zu entscheiden, ob das Hinzufügen eines bestimmten Elements sinnvoll ist, müssen Sie wissen, wie stark es sich auf die Dateigröße auswirkt. Der Bandbreiten-Profiler hilft Ihnen, den genauen Wert festzustellen, den jedes einzelne Element zur Datei hinzufügt. Im Prinzip probieren Sie eine Technik zur Reduzierung der Dateigröße aus (wie z.B. Komprimieren) und nutzen dann den Bandbreiten-Profiler, um zu beurteilen, wie stark die Veränderung geholfen hat. Wenn Sie eine weitere Veränderung vornehmen, ziehen Sie den Bandbreiten-Profiler erneut zu Rate, um die Verbesserung nachzuvollziehen. Im vorigen Abschnitt ging es darum, herauszufinden, wodurch die Dateigröße zunimmt; der folgende Abschnitt wird erläutern, wie Sie die Auswirkungen von Veränderungen auf die Dateigröße messen können. Das Aufrufen des Bandbreiten-Profiler ist leicht. Etwas schwieriger ist es, die von ihm gelieferten Daten zu deuten. Die folgende Übung macht Sie mit den Basisfunktionen des Bandbreiten-Profilers vertraut.

Übung: Benutzen Sie den Bandbreiten-Profiler, um die Ladezeiten zu beurteilen In dieser Übung lernen Sie, wie der Bandbreiten-Profiler Ihnen helfen kann herauszufinden, wie ein Film voraussichtlich über das Internet abgespielt wird. Folgen Sie diesen Schritten: 1. Öffnen Sie die schon aus den früheren Kapiteln bekannte Datei keyframing.fla. Testen Sie den Film ((Strg)+(Enter)). 2. Wählen Sie ANSICHT / BANDBREITEN-PROFILER ((Strg)+(B)), während die .swfDatei abgespielt wird. Beachten Sie, dass es sich hierbei um eine Option des Flash Players handelt und nicht des Programms Flash. Daher können Sie den Profiler auch nur während des Testens sehen.

400

Überlegungen zur Dateigröße

3. Wie Sie in Abbildung 20.6 sehen, stellt der Bandbreiten-Profiler Informationen zur Verfügung, während der Film abläuft. Sie sehen auf der linken Seite Daten und eine grafische Darstellung auf der rechten Seite.

Abbildung 20.6: Im oberen linken Bereich des Bandbreiten-Profilers werden die wesentlichen Daten Ihrer exportierten .swf-Datei gezeigt.

4. Betrachten Sie nun den ersten Abschnitt der Daten mit der Bezeichnung Film. Bei den meisten dieser Informationen handelt es sich um eine kurze Zusammenfassung von Einstellungen, die Sie in Ihrem Originalfilm ändern können (wie z.B. Größe und Bildrate). Darüber hinaus werden Sie zwei veränderbare Einstellungen sehen: Größe (oder Dateigröße) und Vorausladen. Als ich diesen Film getestet habe, hatte ich eine Dateigröße von 9 Kbyte (oder genauer 9.760 Byte). Sie werden später, wenn Sie versuchen diese Datei zu optimieren, feststellen, ob sich diese Größe verringert hat. Vorausladen zeigt an, wie viele Bilder im Voraus geladen werden müssen (und wie lange das dauert), bis der Film mit dem Abspielen beginnt. Das ist natürlich von der Internetverbindung des jeweiligen Anwenders abhängig. Der Bandbreiten-Profiler kann jedoch z.B. die für das Vorausladen benötigte Zeit in Abhängigkeit vom verwendeten Modem (siehe Menü FEHLERSUCHE) einschätzen. 5. Fahren Sie fort und rufen Sie das Menü FEHLERSUCHE auf. Beachten Sie, dass ein Modemtyp (56K ist voreingestellt) aktiviert ist. Wählen Sie 14,4 aus (für 14,4 Kbyte/sekModems), und Sie werden sehen, wie sich die Vorausladezeit von weniger als einer Sekunde auf 11 Sekunden verändert! 6. Wählen Sie ANPASSEN aus dem Menü FEHLERSUCHE, woraufhin sich das Dialogfenster Benutzerdefinierte Modemeinstellungen öffnet, wie in Abbildung 20.7 zu sehen. Hier können Sie die Voreinstellungen verändern oder eigene Werte eingeben. Fügen

401

Optimierung Ihrer Flash-Site

Sie eine Einstellung für die übliche DSL-Übertragungsrate von 256 Kbit/sek hinzu. Ändern Sie dazu die Beschriftung im vierten Feld Benutzerdefiniert 4 in 256 Kbit/sek (DSL) und geben Sie unter Bit-Rate 32.000 Byte/sek ein. Klicken Sie auf OK.

Abbildung 20.7: Das Dialogfenster Benutzerdefinierte Modemeinstellungen versetzt Sie in die Lage, jede Internetverbindungsgeschwindigkeit zu simulieren.

7. Wählen Sie Ihre neuen Einstellungen aus dem Menü FEHLERSUCHE. Sie sollten feststellen können, dass die Vorausladezeit sich gegen 0 bewegt hat. 8. Der Bandbreiten-Profiler ermöglicht Ihnen eine genaue Simulation, wie lange das Laden eines Films bei einer bestimmten (aus dem Menü FEHLERSUCHE ausgewählten) Verbindungsgeschwindigkeit dauert. Wählen Sie STREAMING ANZEIGEN aus dem Menü ANSICHT. Der Film wird von vorne beginnen und oberhalb der Streaming-Grafik sehen Sie den Zeitverlauf als grünen Balken. Verändern Sie die Übertragungsrate auf 14,4 (aus dem Menü FEHLERSUCHE) und lassen Sie erneut das Streaming anzeigen. Sogar bei diesem relativ einfachen Film erreicht die Markierung, die das aktuelle Bild anzeigt (ein Pfeil), das Ende des grünen Balkens und muss gelegentlich warten, bis weiterer Inhalt geladen wird. Dies ist natürlich kein erstrebenswerter Zustand, aber es ist genau das, was ein Anwender mit einer langsamen Internetverbindung sehen wird. (Sie erfahren in der nächsten Übung, wie Sie damit umgehen können. Jetzt geht es nur darum, auftauchende Probleme zu erkennen.) 9. Es gibt eine weitere Einstellung, die Sie überprüfen sollten. Vergewissern Sie sich, dass im Menü ANSICHT die Option BILD-FÜR-BILD-GRAFIK aktiviert ist (oder drücken Sie (Strg)+(F)). Die Grafik zeigt einen vertikalen Balken für die Dateigröße jedes einzelnen Bildes an. Ein hoher Balken bedeutet, dass dieses Bild mehr Daten enthält. Die rote waagrechte Linie repräsentiert die derzeit unterstützte Übertragungsgeschwindig-

402

Überlegungen zur Dateigröße

keit, die Sie im Menü FEHLERSUCHE festgelegt haben. Mit anderen Worten heißt das, dass der Balken eines Bildes, der über die rote Linie hinausragt, dazu führen kann, dass Flash beim Abspielen an dieser Stelle anhalten muss, um auf das Laden der Daten zu warten. In dem Beispiel Keyframing.fla können Sie z.B. ein paar relativ hohe Balken entdecken, die etwa bei Bild 20 anfangen. Das macht Sinn. Schließen Sie den Testfilm und gehen Sie in die Original-Datei. Genau bei Bild 20 gibt es eine Reihe von Schlüsselbildern, die in zwei Ebenen neue Inhalte haben. All diese neuen Daten bedeuten, dass mehr Daten geladen werden müssen (siehe Abbildung 20.8).

Abbildung 20.8: In Bild 20 erscheinen erstmalig zwei Ebenen mit Schlüsselbildern. Dies erfordert das Laden einer größeren Datenmenge (wie Sie im Bandbreiten-Profiler gesehen haben).

Beachten Sie die Umrechnung von Bits in Bytes: In der vorherigen Übung haben Sie 32.000 Byte/sek für eine 256 Kbit/sek-DSL-Verbindung angegeben. Dies errechnet sich aus der Geschwindigkeit, die in Kilobit pro Sekunde (oder 256.000 Bit pro Sekunde) angegeben wird. Dateigrößen werden häufig in Kilobyte oder Megabyte angezeigt (nicht in Bit). Da ein Bit ein 8tel eines Bytes ist, können Sie Bit in Byte umrechnen, indem Sie durch 8 dividieren. Daher sind 256.000 Bit pro Sekunde so viel wie 32.000 Byte pro Sekunde. Ein 64 Kbyte großes Bild wird mit einer DSL-Verbindung in 2 Sekunden geladen. Was Sie ebenfalls beachten sollten, ist, dass eine Internetverbindung möglicherweise nicht mit einer gleich bleibenden Übertragungsrate lädt. Die voreingestellten Werte im Menü FEHLERSUCHE für das 28,8- und 56K-Modem sind niedriger, als Sie annehmen würden (2.400 und 4.800 anstatt 3.600 und 7.000). Das liegt daran, dass die Voreinstellungen von Flash von realistischen Übertragungsgeschwindigkeiten ausgehen. Im Allgemeinen werden Sie nicht besonders viel zu rechnen haben.

403

Optimierung Ihrer Flash-Site

Benutzen Sie die Option Streaming anzeigen des Bandbreiten-Profilers, um zu beobachten, wie der Film abgespielt werden wird. Analysieren Sie den Film Bild für Bild, indem Sie darauf achten, bei welchen Bildern die rote Linie überschritten wird. Übrigens muss das Überschreiten der roten Linie nicht unbedingt heißen, dass das Abspielen des Films an dieser Stelle hakt. Wenn möglich, beginnt Flash mit dem Laden der Bilder bereits, bevor die problematischen Stellen erreicht werden. So enthalten einige Bilder beispielsweise keine Veränderungen auf dem Bildschirm, die Übertragungsgeschwindigkeit wird aber von Flash aufrecht erhalten. Während diese Bilder gezeigt werden, kann Flash schon damit beginnen Bilder zu laden, die im Film an späterer Stelle vorkommen. Bilder ohne sichtbare Veränderungen brauchen keine lange Ladezeit, daher kann Flash sich schon mit dem Laden der kommenden Bilder befassen. Dieses Vorgehen ist eine Form des Streamings. Der Bandbreiten-Profiler bietet die Möglichkeit, dieses Streaming in einer ähnlichen Grafik anzuzeigen wie die Bild-für-Bild-Grafik. Wählen Sie ANSICHT / STREAMING-GRAFIK und Sie sehen, dass es für jedes Bild wieder einen Balken gibt. Im Prinzip werden die einzelnen Bilder abwechselnd als hellgraue und dunkelgraue Balken dargestellt. Die waagrechte rote Linie steht hier für die Datenmenge, die in der Zeit übertragen werden kann, in der ein Bild abgespielt wird (das ist bei einer Bildrate von 12 Bildern pro Sekunde eine 12tel Sekunde). Wenn das erste Bild (dunkelgrau) in weniger als einem 12tel einer Sekunde geladen werden kann, sehen Sie, dass der Balken des zweiten Bildes (hellgrau) auf den dunkelgrauen Balken des ersten Bildes gestapelt wird. Öffnen Sie als Beispiel noch einmal das Beispiel Keyframing.fla, wählen Sie ANSICHT / STREAMING-GRAFIK und im Menü FEHLERSUCHE den Eintrag 56K. In der Zeit, die zum Abspielen von Bild 2 benötigt wird, kann Flash mehr als 3 weitere Bilder laden (siehe Abbildung 20.9). Im Ergebnis wird der gesamte aus 81 Einzelbildern bestehende Film in der Zeit geladen, in der 40 Bilder abgespielt werden. (Wählen Sie ANSICHT / STREAMING ANZEIGEN, um diesen Effekt in Echtzeit zu beobachten.) Der Bandbreiten-Profiler ist sehr hilfreich. Er löst keine Probleme; er hilft Ihnen nur dabei, Probleme zu entdecken und zu vermeiden, vor allem zu große Dateien zu verhindern. Wir werden uns nun ansehen, wie das geht.

Übung: Verbessern Sie eine Datei mithilfe des Bandbreiten-Profilers In dieser Übung erleben Sie eine Situation, in der Ihnen der Bandbreiten-Profiler helfen kann, eine Datei zu optimieren. Folgen Sie dieser Anleitung: 1. Öffnen Sie erneut die legendäre keyframing.fla. Ermitteln Sie dann die Gesamtgröße des exportierten Films. Dazu müssen Sie lediglich den Film testen und auf die Anzeige im linken oberen Bereich des Bandbreiten-Profilers achten (drücken Sie (Strg)+(B), wenn er nicht geöffnet ist). Bei mir werden zum Beispiel 9.760 Byte angegeben. Notieren Sie sich die bei Ihnen angezeigte Größe, um sie später vergleichen zu können.

404

Überlegungen zur Dateigröße

Abbildung 20.9: Die Streaming-Grafik (nicht die Bild-fürBild-Grafik) zeigt, wie schnell Flash weitere Bilder im Voraus lädt.

2. Schließen Sie den Testfilm. Wählen Sie DATEI / EINSTELLUNGEN FÜR VERÖFFENTLICHUNGEN und rufen Sie die Registerkarte Flash auf. Beachten Sie den Schieberegler für die JPEG-Qualität. Bewegen Sie ihn ganz nach links (zur niedrigsten Qualität) und klicken Sie auf OK. 3. Testen Sie den Film erneut, um zu sehen, welche Veränderung die Komprimierung nach sich gezogen hat. Normalerweise sollten Sie keine Veränderung feststellen können, da die JPEG-Kompression nur auf Rastergrafiken angewendet wird und diese Datei keine hat. (Wenn diese Datei Rastergrafiken hätte, würden Sie wahrscheinlich sehen, dass die getroffene Veränderung die Datei verkleinert, aber auch die Qualität verschlechtert hätte.) 4. Nun werden Sie die Dateigröße ändern. Sie werden die Kurven jeder gezeichneten Form optimieren. Entsperren Sie alle Ebenen (indem Sie auf das Vorhängeschloss klicken, das sich über allen Ebenen in der Zeitleiste befindet) und klicken Sie auf das Symbol Mehrere Bilder bearbeiten (sodass Sie mehrere Bilder auswählen können). Rufen Sie dann das Menü ZWIEBELSCHALENMARKIERUNG ÄNDERN auf und wählen Sie den Punkt ALLE ZWIEBELSCHALEN (siehe Abbildung 20.10). Wählen Sie abschließend ALLES MARKIEREN aus dem Menü BEARBEITEN ((Strg)+(A)). Im Menü MODIFIZIEREN klicken Sie auf den Eintrag OPTIMIEREN, schieben den Schieberegler zum Glätten ganz nach rechts und aktivieren beide Kontrollkästchen wie in Abbildung 20.11 zu sehen. Klicken Sie auf OK und Sie werden einen Hinweis darauf erhalten, wie groß die Verringerung sein wird. In meinem Fall konnte ich sehen, dass die Verringerung (der Anzahl an Kurven) 36% betrug.

405

Optimierung Ihrer Flash-Site

Abbildung 20.10: Wählen Sie Alle Zwiebelschalen, nachdem Sie MEHRERE BILDER BEARBEITEN aktiviert haben, um alle Bilder zu markieren.

Abbildung 20.11: Das Optimieren der Kurven verringert die Dateigröße und vereinfacht die Formen.

5. Testen Sie den Film erneut und beachten Sie dabei die Verringerung der Dateigröße. Ich erhalte 7.733 Byte, was einen Unterschied von beinahe 2.000 Byte ausmacht. Das ist nicht wirklich viel, aber immerhin etwas. Wichtiger ist, dass das Bild nicht schlechter aussieht.

406

Überlegungen zur Dateigröße

Auch wenn die große Erkenntnis dieser Übung sein mag, dass MODIFIZIEREN / OPTIMIEREN die Dateigröße verringert (wobei die Formen vereinfacht werden), befinden Sie sich immer noch in der Phase des Entdeckens von Problemen. Machen Sie sich jetzt noch einmal klar, dass der Bandbreiten-Profiler bei der Suche von Problemen helfen kann, diese aber nicht notwendigerweise löst. Interessant ist auch die verwandte Option Größenbericht erstellen, die Sie über DATEI / EINSTELLUNGEN FÜR VERÖFFENTLICHUNGEN auf der Registerkarte Flash finden. Aktivieren Sie diese Option wie in Abbildung 20.12. Wenn Sie das nächste Mal einen Film exportieren (testen Sie einfach einen Film), werden Sie eine Textfassung des Bandbreiten-Profilers im Fenster AUSGABE (das Sie im Menü FENSTER aufrufen können) erhalten. Zusätzlich wird eine Text-Datei (mit einer dem Film ähnlichen Bezeichnung) im gleichen Ordner, in dem sich der Film befindet, angelegt. Diese stellt eine dauerhafte Aufzeichnung der Daten dar, die Sie auch im Bandbreiten-Profiler erhalten.

Abbildung 20.12: Die Option Größenbericht erstellen des Dialogfensters Einstellungen für Veröffentlichungen

exportiert eine Textfassung der vom Bandbreiten-Profiler erhobenen Daten.

Das Beispiel »Schlüsselbild erstellen« stockt aber immer noch bei Bild 20, wenn ein 14,4Modem simuliert wird. Wenn Sie sich nach diesem Anwender richten und keine andere Möglichkeit finden, die Dateigröße zu verringern, müssen Sie auf einen Preloader zurückgreifen. Dieser wird den Film ganz oder teilweise auf die Festplatte des Anwenders laden, bevor er abgespielt wird. Hier finden Sie eine schnelle Art, genau das zu tun.

407

Optimierung Ihrer Flash-Site

Übung: Betrachten Sie einen Preloader im Bandbreiten-Profiler Um ein Gespür dafür zu bekommen, wie der Bandbreiten-Profiler arbeitet, werden Sie in dieser Übung einen einfachen Preloader erstellen, um das Abspielen beim ersten Bild zu unterbrechen, bis der größte Teil des Films geladen ist. Nachfolgend finden Sie die erforderlichen Schritte: 1. Öffnen Sie wie vorher keyframing.fla. 2. Wählen Sie SZENE aus dem Menü EINFÜGEN. Nennen Sie die neue Szene Preloader. Führen Sie einen Doppelklick auf den Namen aus (Szene 2), um den bisherigen Namen zu verändern und ziehen Sie den Preloader nach oben, sodass er an erster Stelle steht. 3. Klicken Sie auf das erste Bild der Preloader-Ebene und fügen Sie dort zwei Schlüsselbilder ein (zweimal (F6) drücken). 4. Aktivieren Sie das erste Schlüsselbild, öffnen Sie das Fenster Aktionen – Bild und fügen Sie die if-Aktion ein. Tippen Sie dann _framesloaded>20 in das Eingabefeld Bedingung. Fügen Sie nun noch eine goto-Aktion ein und schreiben Sie eine 3 in das Eingabefeld Bild. 5. Schreiben Sie einen Text auf die Bühne, damit der Anwender das Preloading verfolgen kann. Benutzen Sie das Eigenschaften-Bedienfeld, um das Textfeld als dynamischen Text zu definieren und tippen Sie _framesloaded in das Eingabefeld Variable. Auf diese Weise wird der Anwender einen wechselnden Wert sehen, während der Film geladen wird (siehe Abbildung 20.13). 6. Aktivieren Sie das zweite Bild, fügen Sie die Aktion goto ein und aktivieren Sie das Kontrollkästchen Gehe zu und abspielen. 7. Testen Sie den Film und aktivieren Sie STREAMING ANSICHT im Bandbreiten-Profiler.

ANZEIGEN

aus dem Menü

Der Preloader, den Sie in Kapitel 19 hergestellt haben, war anspruchsvoller. Dies war jedoch eine gute Möglichkeit, mit dem Bandbreiten-Profiler zu arbeiten. Machen Sie sich abschließend klar, dass wir unseren Preloader nicht erstellt haben, um den gesamten Film zu laden. Während man auf das Laden eines großen Teils der Bilder wartet, wird Flash wahrscheinlich aufholen und die verbleibenden Bilder pünktlich laden, sodass kein Ruckeln entsteht. Es macht keinen Sinn, den Anwender warten zu lassen, bis er den gesamten Film downgeloadet hat.

408

Performance

Abbildung 20.13: Während die ersten 20 Bilder geladen werden, bleibt der Film auf einem Bild stehen, das anzeigt, wie viele Bilder bereits geladen sind.

20.2 Performance Bis jetzt ging es in diesem Kapitel um das Optimieren hin zu kleineren Dateien (damit sie schneller geladen werden können). Ein anderer Aspekt des Optimierens bezieht sich darauf, dass Ihr Film schnell abgespielt wird. Mit anderen Worten: Es geht darum sicherzustellen, dass das Abspielen des Films auf allen Anwender-Computern gleichmäßig und reibungslos funktioniert. Wenn Sie Ihre Bildrate auf sagen wir mal 12 Bilder pro Sekunde stellen, wird diese in keinem Fall überschritten werden. Auf einigen Computern wird sich die Bildrate verringern. Wie verbessern wir nun die Performance? Leider gibt es keinen »Performance-Profiler« (ähnlich dem Bandbreiten-Profiler), mit dem Sie die Leistung anderer Rechner simulieren können.

Unerwünschte Spezialeffekte Im letzten Kapitel haben Sie erfahren, wie unnötige Spezialeffekte die Anwender von Ihrem eigentlichen Anliegen ablenken können. Es gibt jedoch noch einen anderen Grund, unnötige Effekte zu vermeiden: Zu viele Effekte können dazu führen, dass der Film nur langsam läuft. So ist es z.B. nicht unbedingt nötig, jeden Textabschnitt, der auf dem Bildschirm erscheint, rotieren zu lassen und mit einem Bewegungstween zu versehen. Das mag vielleicht für den ersten Textabsatz interessant sein, aber es ist wohl eher ermüdend darauf zu warten, bis jeder Absatz seine Animation durchlaufen hat. Wenn der Rechner eines Anwenders bei jedem Tween langsamer wird, ist dies sogar noch störender.

409

Optimierung Ihrer Flash-Site

Auch wenn ein Bewegungstween, der eine Änderung des Alpha-Effekts beinhaltet, zum Transportieren einer bestimmten Botschaft erforderlich scheint, sollte diese Art des Tweenings mit Vorsicht genossen werden. Zusätzlich zu dem sich bewegenden Objekt muss der Computer auch eine halbtransparente Version des Objekts anzeigen, was bedeutet, dass er die darunter liegende Grafik mit anzeigen muss. Einfach ausgedrückt könnten langsamere Rechner nicht in der Lage sein, mit der gewünschten Bildrate Schritt zu halten. Oft ist noch nicht einmal ein Alpha-Effekt erforderlich. Wenn Ihr Hintergrund z.B. weiß ist, wird ein einfacher Helligkeits-Effekt genauso aussehen und sich nicht so sehr auf die Geschwindigkeit auswirken. Ein weiterer Aspekt, der sich negativ auf die Leistung auswirkt, sind Tweens, die ihre Größe verändern, sich bewegen oder die Alpha-Einstellung einer Bitmap-Grafik verändern. Im Allgemeinen übertrifft sich Flash nicht gerade in der Darstellung von BitmapGrafiken. Das Verändern der Größe einer Rastergrafik ist für den Computer eine Menge Arbeit. Sie können dieses Verhalten selbst mit einem schnellen Rechner nachvollziehen, indem Sie die Bildrate zuerst auf einen hohen Wert stellen (wie zum Beispiel 60 BpS) und dann ein einfaches Bewegungstweening auf eine Rastergrafik anwenden. Wählen Sie ABSPIELEN aus dem Menü STEUERUNG (nicht FILM TESTEN) und betrachten Sie das Abspielen Ihres Films innerhalb von Flash. Ändern Sie dann die Größe der Grafik in einem der Schlüsselbilder des Tweens und spielen Sie den Film erneut ab. Sie werden feststellen, dass die tatsächliche Bildrate an der Stelle zurückgeht, wo sich das Tween mit der Vergrößerung befindet. Es gibt noch weitere Effekte, welche die Leistung verringern. Solche Leistungseinbußen können Sie in der Vorschau beobachten, indem Sie die Bildrate vorübergehend sehr hoch einstellen und dann verschiedene Einstellungen ausprobieren – und feststellen, wie diese den Film verlangsamen. Vergessen Sie nicht den Vorschlag vom Anfang dieses Abschnitts, »überflüssige« Effekte einfach zu vermeiden. Wenn Sie unbedingt einen Effekt benutzen müssen, dann tun Sie das. Es ist vor allen Dingen wichtig, vorsichtig mit den Effekten umzugehen, die den Film langsamer machen, da diese dazu führen können, dass die Computer Ihrer Anwender noch langsamer werden.

Streaming von Sound-Dateien Wenn Sie Sounds in Schlüsselbilder einbinden, haben Sie die Wahl zwischen den zwei Synchronisationsoptionen Ereignis und Stream. Normalerweise sollten Sie sich immer für Ereignis (oder eine ähnliche Option wie Start oder Stop) entscheiden. Diese wirken sich am wenigsten auf die Leistung aus. Stream ist hilfreich, wenn Sie die Synchronisation aufrechterhalten wollen. Wenn Sie

Stream-Sounds benutzen, hören Sie die Sounds auch, wenn Sie über die Zeitleiste fahren. Stream-Sounds sind mit Grafik-Symbolen zu vergleichen, die ebenfalls eine Vorschau ihrer Animation zeigen, wenn Sie über die Zeitleiste fahren. Der Nachteil von Stream-

410

Performance

Sounds ist jedoch, dass die sichtbaren Bestandteile Ihres Films geopfert werden, wenn der Computer nicht Schritt halten kann. Da Stream-Sounds immer synchronisiert sind, heißt das, dass Flash Bilder überspringt, wenn der Computer sie nicht pünktlich anzeigen kann (um Schritt zu halten). Stream-Sounds können deshalb dazu führen, dass die Grafiken ruckeln oder ganz ausfallen. Das hängt einfach damit zusammen, dass Flash den Sound niemals langsamer abspielen wird (das würde sich eigenartig anhören). Ereignis-Sounds werden so bald wie möglich abgespielt – wenn der Computer mithält, wie erwartet (also dann, wenn die passenden Schlüsselbilder erreicht werden). Grafiken werden ebenfalls so bald wie möglich angezeigt. Es kann allerdings auf langsameren Rechnern passieren, dass die Grafiken langsamer sind als der Sound, sodass Grafik und Sound nicht mehr perfekt synchronisiert sind. Das soll nicht heißen, dass Sie mit Ereignis-Sounds kein annehmbares Ergebnis erzielen können. Erwägen Sie, die Sound-Dateien vor dem Importieren in kleinere Stücke zu teilen. Sie können Sounds so in der Zeitleiste platzieren, dass sie genau bei den richtigen Grafiken stehen. Das wird zwar auch nicht fehlerfrei laufen, aber wenigstens werden keine Bilder ausgelassen. Wenn Sie keine punktgenaue Synchronisation brauchen, benutzen Sie Ereignis-Sounds. Dann werden die Grafiken und der Ton reibungslos abgespielt – es könnte höchstens passieren, dass sie nicht perfekt synchronisiert sind.

Grafiken Hier sind ein paar Tipps, um die bestmögliche Leistung zu garantieren.

Grafische Symbole Trotz aller Überlegungen zu Einsparungen der Dateigröße bei Filmsequenzen (in Kapitel 12), scheinen eingebettete Grafik-Symbole besser abgespielt zu werden. Im Allgemeinen rechtfertigt die geringe Verbesserung in der Leistung nicht die signifikante Vergrößerung der Datei. Sie sollten nur dann Grafik-Symbole verwenden, wenn Sie müssen (benutzen Sie ansonsten Filmsequenzen). Die Tatsache, dass Grafik-Symbole etwas besser abgespielt werden, lohnt die Erwägung ihres Einsatzes, wenn Sie versuchen, die Leistung zu verbessern.

Verwenden Sie Kurven optimieren Sie haben gesehen, wie jede gezeichnete Form optimiert werden kann (über das Menü MODIFIZIEREN / OPTIMIEREN). KURVEN OPTIMIEREN wird Kurven aus einer Form entfernen, sodass sie glatter aussieht. Manchmal ist der sichtbare Effekt minimal, die Verringerung der Dateigröße hingegen bedeutend. Manchmal ist die sichtbare Veränderung allerdings zu groß, als dass man sie akzeptieren könnte, wie es in Abbildung 20.14 der Fall ist. Erwägen Sie das Optimieren immer, wenn die sichtbare Veränderung akzeptabel ist. Abgesehen davon, dass die Dateigröße verringert wird, wird häufig auch die Leistung verbessert (noch ein weiterer Grund, es zu verwenden).

411

Optimierung Ihrer Flash-Site

Abbildung 20.14: Sie sehen zwei Formen vor und nach der Anwendung von KURVEN OPTIMIEREN. Manchmal können die Ergebnisse unannehmbar sein.

Verwenden Sie niemals Modifizieren / Form / Ecken abrunden »Niemals« ist ein hartes Wort. In diesem Fall trifft es aber zu. Es dauert nicht länger als ein paar Minuten, um sowohl die Differenz der Dateigröße als auch den Unterschied der Leistung für eine gezeichnete Form, deren Ecken abgerundet wurden, festzustellen. Probieren Sie es aus, indem Sie ein einfaches Formtween erstellen. Testen Sie den Film und beachten Sie die Bildrate. Wählen Sie die Form dann einzeln an jedem Ende des Tweenings aus und wenden Sie MODIFIZIEREN / FORM / ECKEN ABRUNDEN an. Sie werden feststellen, dass die Dateigröße sprungartig zu- und die Leistung abnimmt. Der einzige Fall, in dem Sie die Benutzung dieser Option in Erwägung ziehen könnten, ist das Exportieren eines feststehenden Bildes (das hieße, Sie würden Flash als Grafik-Werkzeug verwenden).

Abbildung 20.15: Sie sollten versuchen, nur die Linientypen Haarlinie und Massiv zu verwenden.

412

Zusammenfassung

Vermeiden Sie bestimmte Linientypen In Kapitel 2 wurde Ihnen das Pull-down-Menü für verschiedene Linientypen im Eigenschaften-Bedienfeld vorgestellt (siehe Abbildung 20.15). Versuchen Sie, nur Massiv und Haarlinie zu verwenden. Die anderen Linienarten neigen dazu, Ihre Filme stark zu vergrößern. Ich kann nicht behaupten, dass Sie in jedem Fall eine schlechtere Leistung bekommen werden. Sie werden aber sicher eine Zunahme Ihrer Dateigröße feststellen.

20.3 Zusammenfassung In diesem Kapitel haben Sie sich mit zwei verschiedenen Möglichkeiten befasst, Ihre Flash-Filme zu optimieren. Sie sollten die Dateigröße optimieren, um das Laden Ihrer Filme zu beschleunigen und Sie sollten die Leistung optimieren, damit die Filme gleichmäßiger ablaufen. Der Bandbreiten-Profiler und die Option Größenbericht erstellen ermöglichen die Untersuchung Ihrer Filme nach mehreren Gesichtspunkten. Sie können Ladezeiten simulieren und Bereiche in Ihren Filmen erkennen, die eine besondere Beachtung erfordern. Der Prozess des Optimierens wurde auch auf die Leistung angewendet. Auch wenn Ihre Filme auf Ihrem Computer mit gleichbleibend hoher Bildrate wie zum Beispiel 30 BpS ablaufen, können sie sich auf den Rechnern Ihrer Anwender verlangsamen. Obschon es keinen sicheren Weg gibt, herauszufinden, wie Ihr Film aussehen wird (außer Sie testen ihn tatsächlich auf anderen Computern), besteht die einfache Annäherung an die Leistungsoptimierung darin, einfach zu wissen, welche Arten von Effekten und Techniken dazu neigen, Rechner zu verlangsamen, und zu versuchen, diese zu vermeiden.

20.4 Workshop F&A F

Ich habe alle Tipps zur Optimierung der Leistung befolgt, musste aber trotzdem feststellen, dass meine Animation ruckelig aussieht. Wo liegt der Fehler? A

Es kann sein, dass Sie einfach versuchen, eine Grafik über eine lange Strecke zu bewegen, dafür aber nur wenige Bilder benutzen. Versuchen Sie, die Anzahl der insgesamt verwendeten Bilder zu erhöhen. Das können Sie durch Erhöhen der Bildrate ausgleichen. Sie werden die gleiche Bewegung sehen, jedoch in mehrere (kleinere, zahlreichere) Einzelschritte zerlegt – vorausgesetzt der Computer kann mit der erhöhten Bildrate mithalten.

413

Optimierung Ihrer Flash-Site

F

Was ist die ideale Größe für einen Film? A

F

Dies ist eine häufig gestellte Frage, aber auch eine, die unmöglich beantwortet werden kann. Ich denke, die beste Antwort ist »nicht größer als unbedingt nötig«. Überlegen Sie auch, dass Sie eine lange Ladezeit auf einfallsreiche Art überbrücken können. Sie können natürlich eine einfache Nachricht verwenden wie die in einer der Übungen dieses Kapitels erstellte. Besser ist es, den Anwender mit einem kleinen interaktiven Inhalt (mit einer sehr kleinen Dateigröße) zu beschäftigen. Bringen Sie ihn dazu, etwas Interessantes (aber Kleines) zu betrachten, während er auf das Laden des Hauptteils des Films wartet. Es gibt viele Möglichkeiten, dies erfolgreich durchzuführen. Erwägen Sie schließlich auch, den Film in einzelnen Teilen zu laden (wie in Kapitel 18 behandelt). So müssen die Anwender nur auf das Laden des Teils Ihrer Site warten, den Sie wünschen.

Ich habe MODIFIZIEREN / OPTIMIEREN verwendet und die Dateigröße hat sich auch verringert, allerdings sieht mein Bild nicht besonders gut aus. Was soll ich tun? A

Es liegt auf der Hand, dass Sie MODIFIZIEREN / OPTIMIEREN nicht verwenden sollten, wenn es zu unbefriedigenden Ergebnissen führt. Im Grunde sollten Sie diese Option in jedem Einzelfall ausprobieren und die Einsparungen der Dateigröße gegen die Einbußen der Bildqualität abwägen. Ein unerwünschtes Ergebnis ist häufig nicht so schlecht, wie es den Anschein hat. Bedenken Sie, dass die betreffende Grafik im fertigen Film vielleicht nur für den Bruchteil einer Sekunde auf dem Bildschirm zu sehen sein wird. Die schlechte Qualität würde in diesem Fall nichts ausmachen.

Quiz Raten Sie mal ... Bingo! Bitte versuchen Sie sich erst selbst an den folgenden Fragen, bevor Sie dann die Lösungen nachlesen. 1. Wie schnell wird eine Datei geladen, die Sie auf die Hälfte ihrer ursprünglichen Größe reduzieren? a.

Das kann man unmöglich vorhersagen, weil die Verbindungsgeschwindigkeit jedes Anwenders anders ist.

b. Doppelt so schnell wie die ursprüngliche Datei c. Das kann man unmöglich vorhersagen, weil man die Ausmaße des Films kennen muss (Höhe und Breite). 2. Warum sollten unnötige Spezialeffekte vermieden werden? a.

414

Sie können den Anwender vom eigentlichen Inhalt ablenken.

Workshop

b. Sie können die Leistung verringern und die Ladezeiten verlängern. c. Die Antworten A und B sind beide richtig. 3. Der Bandbreiten-Profiler kann simulieren, wie ein Film auf einem langsamen Computer ablaufen wird. a.

Richtig, stellen Sie nur die Geschwindigkeit im Menü FEHLERSUCHE ein.

b. Falsch, der Bandbreiten-Profiler hilft nur dabei, die Größe eines Films zu beurteilen und wie schnell er geladen wird. c. Richtig, aber Sie müssen COMPUTER SIMULIEREN aus dem Menü ANSICHT aufrufen.

415

Animationstechniken für Fortgeschrittene

1 2

Animationstechniken für Fortgeschrittene

Im Rahmen der Kapitel dieses Buches haben Sie bisher alle in Flash eingebauten Animations-Tools kennen gelernt. Schlüsselbilder, Bewegungsabläufe, Masken und vieles mehr sollten Ihnen mittlerweile ein Begriff und ein wenig in Fleisch und Blut übergegangen sein. Was gibt es also noch zu lernen? Einen ganz wichtigen Aspekt der Animationstechniken: In diesem Kapitel werden Sie einige fortgeschrittene Techniken kennen lernen, wie Sie Ihre Animationen wesentlich effektiver und professioneller laufen und aussehen lassen und zudem den Aufwand für deren Erstellung minimieren können (wobei dies ist jedoch nicht der wichtigste Punkt im Umgang mit den erweiterten Animationstechniken ist). Vieles, was Sie auf den nächsten Seiten erfahren, sind bei weitem keine neuen Animationsmethoden, sondern Anwendungen, die traditionellen Animationstechniken entlehnt wurden und dort seit Jahren erfolgreich eingesetzt werden. In diesem Kapitel werden Sie Folgendes durchführen bzw. erarbeiten: 쐽

Animationen ohne Zuhilfenahme der Tween-Funktionen

쐽

Die Anwendung traditioneller Animationstechniken wie beispielsweise Antizipation (Voraussicht, Erwartung) und Overkill (das Ende einer Animation)

쐽

Tiefe und Perspektive simulieren

Es gibt prinzipiell zwei Wege und Betrachtungsweisen, denen Flash-Anwender folgen können – die Programmierung oder die Animation. Viele Menschen sehen in dem Programmierer eher den Techniker und im Animator den Künstler. Dies ist ein Fehler bzw. ein Missverständnis, da Programmieren eine sehr kreative Tätigkeit und die visualisierte Kommunikation (Animation) eine sehr technische Angelegenheit sein kann. Eine Spezialisierung im Voraus auf eines der beiden Gebiete ist eigentlich nicht notwendig, da FlashAnwender sehr schnell erkennen werden, was ihnen eher entspricht und Spaß macht.

21.1 Das Resultat zählt, nicht die Technologie Sicherlich haben Sie schon mal einen Zauberer im TV oder sogar live auf der Bühne gesehen, wie er seinen Assistenten in zwei Hälften zersägt und dabei niemand auch nur ansatzweise verletzt wird. Der Zauberer kreiert dabei eine Illusion, die Sie an das Resultat (in diesem Fall einen halbierten Assistenten) glauben lässt. Ähnlich verhält es sich bei einer Animation – hier bewegt sich eigentlich gar nichts. Sie sehen lediglich eine Reihe unterschiedlicher Bilder schnell hintereinander abgespielt, die bei Ihnen den Eindruck eines fließenden Bewegungsablaufes entstehen lassen. Zusätzlich zu den in Kapitel 6 beschriebenen Animationsgrundlagen kann ein Animationstechniker (einem Zauberer übrigens nicht ganz unähnlich) Tricks verwenden, um den Anwender zu täuschen und ihn glauben zu machen Dinge zu erleben, die eigentlich gar nicht existieren.

418

Das Resultat zählt, nicht die Technologie

Um jemandem beispielsweise vorzutäuschen, dass sich ein Ball über den Bildschirm bewegt, ist es nicht notwendig, diesen sich auch wirklich über den Bildschirm bewegen zu lassen. Wenn der Anwender denkt, dass sich der Ball über den Bildschirm bewegt, ist es egal, ob dieser das auch wirklich tut. Jetzt sind wir eigentlich schon mitten bei den Tricks, mit denen Sie Ihre Animationen erweitern können. Behalten Sie dabei immer im Hinterkopf, dass die Techniken bei weitem nicht so wichtig sind wie die Resultate, die Sie erreichen wollen.

Einfache Techniken – sparsam angewandt Ein Trick, dem Sie des öfteren in der Fernsehwerbung begegnen, ist, den Bildschirm sehr schnellen Bildwechseln zu unterziehen, um die Aufmerksamkeit des Betrachters auf das Gezeigte zu ziehen. Sehr oft begegnet dem Fernsehbetrachter auch ein schneller weißer Bildwechsel, was in etwa einem Stroboskop-Effekt entspricht. Dieser Trick, um Aufmerksamkeit zu erhaschen, funktioniert (wenn überhaupt) lediglich in TV-Umgebungen, da der Zuschauer oft geneigt ist, neben dem TV-Konsum noch anderen Tätigkeiten nachzugehen (lesen, schreiben, Wäsche waschen, sich unterhalten ...). Im Fall einer Website können Sie davon ausgehen, dass der Betrachter mit wesentlich mehr Aufmerksamkeit bei der Sache ist, da er ja für genau diesen Zweck zum Computer gelaufen ist, ihn angeschaltet hat, sich ins Internet eingewählt hat ... – er ist quasi freiwillig auf Du und Du mit der Website. Aus diesem Grund sollten Sie diese Blink-Effekte nur sparsam einsetzen, da die Aufmerksamkeit des Website-Besuchers sowieso schon da ist. Meinen Sie trotzdem, ihn fesseln zu müssen, können Sie einen modifizierten blinkenden Bildschirm zur Anwendung bringen. Definieren Sie dabei einfach einen kleinen Bereich Ihres Screens oder eine Schaltfläche, die dem Anwender entgegenblinkt. Vorstellbar wäre beispielsweise, dass etwas anfängt zu blinken, wenn der Anwender mit seinem Mauszeiger darüber hinwegfährt. Sie ziehen somit die Aufmerksamkeit auf dieses entsprechende Objekt. Technisch gesehen ist dies nichts anderes als ein alternierender Bildwechsel zwischen einem ausgefüllten und einem leeren Schlüsselbild. Sie haben dazu bereits einiges in Kapitel 7 kennen gelernt. Es gibt noch mehr einfache (und im schlimmstenfalls enervierende) Techniken zu entdecken. So ist etwa denkbar, Ihre Startseite nicht mit der fertigen Oberfläche zu beginnen, sondern einzelne Schaltflächen separat und eine nach der anderen zu ihrer letztendlichen Position auf dem Bildschirm »wandern« zu lassen (womit Sie nicht nur Aufmerksamkeit erregen, sondern gleichzeitig auch eine gute Möglichkeit haben, den Benutzer in Ihrem Sinne zu navigieren). Ich rate Ihnen jedoch, diesen Effekt sparsam einzusetzen und nur einmal zu bringen, da es ansonsten zu einer ziemlich zeitaufwändigen und Nerven aufreibenden Sache mutieren kann und der Anwender Ihre Site letztendlich genervt verlassen wird.

419

Animationstechniken für Fortgeschrittene

Vielleicht fallen Ihnen selbst noch Techniken ein. Wir werden uns später aber auch noch einige gemeinsam ansehen. Denken Sie aber immer daran: Diese Techniken – z.B. das Blinken und der sukzessive Aufbau der Oberfläche – sollen Ihnen dabei helfen, ein Problem (dröge Sites und wenig Besucher) zu vermeiden oder zu beheben. Setzen Sie sie nicht ihrem Ziel widerstrebend so ein, dass der User sich aus dem dem Staube macht.

Den Anwender täuschen Im Gegensatz zur Magie und Zauberei, wo der Schlüssel zum Erfolg in der Kunst der Verwirrung, Geschwindigkeit und vermeintlichen Überwindung physikalischer Gesetzmäßigkeiten besteht, braucht die Animation diese physikalischen Grenzen nicht mithilfe von Illusionen zu überwinden. Die Aufgabe der Animation besteht lediglich darin, Bewegung zu zeigen, wo eigentlich keine ist. Dies lässt Dinge sehr oft natürlich aussehen und zieht die Aufmerksamkeit des Betrachters auf die Flash-Anwendung. In Flash einen Hasen aus dem Hut zu zaubern ist kein Problem, viel schwieriger hingegen ist es, dem Hasen auch Leben einzuhauchen und ihn zu animieren. Es gibt drei große Ziele im Bereich der Animation: das Vortäuschen von Bewegung, eine natürliche Erscheinungsweise und das Ausnutzen der Erwartungshaltung des Anwenders. In diesem Kapitel werden wir alle drei Aspekte der Animation kennen lernen. Es gibt verschiedene Möglichkeiten, um Bewegung vorzutäuschen. Ein wesentlicher Bestandteil eines flüssigen Bewegungsablaufes besteht in der Tatsache, dass wir als Menschen schnelle Bewegungen unscharf wahrnehmen. Unschärfe einer Bewegung setzen wir mit einer flüssigen Bewegung gleich. Ein kleines Beispiel dazu: wenn Sie eine Linie entgegengesetzt zur Bewegungsrichtung eines Objektes zeichnen, entsteht sofort der Eindruck von Bewegung – ähnlich den Kondensstreifen, die Düsenflugzeuge am Himmel abbilden. Sehen wir diese Streifen, denken wir sofort, dass sich das Flugzeug bewegt. Es gibt verschiedene Möglichkeiten, Unschärfe zu erzeugen. Sehr gut dazu zu gebrauchen ist die in Flash integrierte Funktion MODIFIZIEREN / FORM. Behalten Sie im Hinterkopf, dass eine unscharfe Version eines bewegten Bildes nur dann gezeigt werden soll, wenn es in Bewegung ist. Den Dingen einen natürlichen Ausdruck zu verleihen, ist vielleicht die größte Herausforderung der Animation. Es ist nicht sehr einfach, eine Figur gehend zu machen und dies auch noch so natürlich wie in der Wirklichkeit. Dies liegt vor allem in der Tatsache begründet, dass der Betrachter ja aus eigener Erfahrung und dem täglichen Leben weiß, wie so etwas auszusehen hat. Leider gibt es in Flash keine Schaltfläche, die auf Knopfdruck einem Objekt einen natürlichen Bewegungsablauf beschert. Studieren Sie also das Objekt in der realen Welt eingehend in seinem Bewegungsablauf. Betrachten Sie ganz genau, wie sich Menschen bewegen. Schauen Sie dabei nicht nur auf Beine und Füße, sondern sehen Sie die Menschen als Ganzes in ihrem kompletten Bewegungsablauf.

420

Das Anwenden herkömmlicher Techniken

Es gibt einen guten Trick, um Animationen natürlich aussehen zu lassen: Fügen Sie Elemente in Ihre Animation ein, die als störend empfunden werden bzw. die Fehler simulieren, wie dies etwa aus Filmen bekannt ist. So werden oft Nebel und Kratzer absichtlich oder auch unabsichtlich in einen Film eingefügt, um eine Animation wie einen richtigen Film aussehen zu lassen. Eine weitere Möglichkeit besteht darin, einen Film flackern zu lassen, sodass er aussieht wie ein Film, der schon längere Zeit im Archiv zugebracht hat. Sie erreichen dies mit einem so genannten »Zwei-Bild-Prinzip«. Erstellen Sie dabei ein Bild mit einem großen Grauanteil und dahinter ein zweites leeres Bild. Setzen Sie beide Bilder hintereinander in eine Schleife und Sie erleben ein Flackern wie aus einem S/WSpielfilm aus anno dazumal. Die Erwartungshaltung des Anwenders können Sie auf zwei Arten für sich nutzen. Lassen Sie ihn denken, er sieht, was er zu sehen erwartet. Dabei ist es nicht notwendig, ihm alle Dinge auch wirklich visuell vorzuführen. Ein Beispiel dazu: Sieht der Betrachter eine Bowling-Kugel sich auf die Kegel zu bewegen, und hört er irgendwann das Geräusch des Crashs, können die Kegel sich ruhig schon außerhalb des Bildes, das der Betrachter sieht, befinden. Damit ist es gar nicht notwendig, jeden einzelnen Kegel so zu animieren, wie er fällt. Allein das Geräusch und die Erwartungshaltung des Anwenders genügen, damit dieser die Situation selbst zu Ende denkt und sich der Film in seinem Kopf abspielt.

21.2 Das Anwenden herkömmlicher Techniken Die Informationen in diesem Bereich des Buches beziehen sich auf traditionelle Animationstechniken, die mit Flash eigentlich gar nichts zu tun haben, in Flash aber dennoch hervorragend angewendet werden können. Für jede Technik werden Sie ein entsprechendes Beispiel bzw. eine Übung vorfinden.

Aufmerksamkeit und Spannungsaufbau (Antizipation) Die Blinktechnik, mit der wir uns vorhin beschäftigt haben, soll die Aufmerksamkeit des Betrachters auf einen bestimmten Bereich des Bildschirms oder den dargestellten Sachverhalt ziehen. Es gibt natürlich auch noch andere Möglichkeiten, dies zu tun. Ein kleines Beispiel: Stellen Sie sich ein Auto (ohne Automatik) vor, das an einer Steigung anhält und beim erneuten Anfahren ein Stück rückwärts rollt – Bergstart mit manueller Schaltung ist für viele Menschen ein Albtraum. Wir können diesen Rückroll-Effekt in unserer Animation akzentuieren, um ein wenig Dramatik und Aufmerksamkeit zu erhaschen. Der Anwender soll etwas erwarten, wenn das Auto immer mehr zurückrollt.

421

Animationstechniken für Fortgeschrittene

Übung: Nutzen Sie Erwartungshaltungen zur Verbesserung Ihrer Animation In dieser Übung nutzen wir gängige Erwartungshaltungen des Users aus, um ein effektiveres Resultat zu erhalten. Ein Kreis soll am unteren Bildschirmrand gequetscht werden (unter Druck setzen wie eine Gummikugel), sodass dieser nach dem Loslassen zum oberen Bildschirmrand springt. 1. Zeichnen Sie einen Kreis am unteren Rand der Arbeitsfläche und wandeln Sie ihn in ein Symbol namens Kreis um. 2. Fügen Sie bei Bild 10 (der Kreis soll die ersten 10 Bilder über an der definierten Position ausharren) ein neues Schlüsselbild ein. Fügen Sie dann erneut ein neues Schlüsselbild bei 15 und ein weiteres bei 25 ein. Wir werden den Kreis zwischen Bild 10 und 15 zusammendrücken und ihn anschließend aufwärts bewegen (Bild 25) 3. Gehen Sie nun zu Bild 25, halten Sie die (ª)-Taste gedrückt und bewegen Sie den Kreis zum oberen Ende Ihres Arbeitsbereiches. 4. Benutzen Sie bei Bild 15 das Transformations-Werkzeug, um den Kreis vertikal zu komprimieren (siehe Abbildung 21.1).

Abbildung 21.1: Wenn Sie den Kreis verformen (quetschen), benutzen Sie dabei bitte vertikale und horizontale Verformungsmöglichkeiten.

5. Da wir den Kreis nach unten quetschen wollen, müssen wir das Skalierungs-Werkzeug nach unten verschieben. Standardmäßig positioniert sich das Skalierungs-Werkzeug in der Mitte des entsprechenden Objektes. Siehe dazu auch Abbildung 21.2.

422

Das Anwenden herkömmlicher Techniken

Abbildung 21.2: Nachdem Sie den Kreis gequetscht haben, stellen Sie bitte sicher, dass dieser die Position nicht mehr verändert.

6. Nun ist es an der Zeit, ein Bewegungstween für Bild 10 (das Quetschen des Kreises) und Bild 15 (der Kreis springt zum oberen Bildschirmrand) zu erstellen. 7. Testen Sie Ihren kleinen Film. Er sollte ganz gut aussehen, aber es gibt etwas, was fehlt und die ganze Szenerie etwas glaubwürdiger gestalten könnte. Während der Kreis sich zum oberen Bereich bewegt, stellt er seine ursprüngliche Form wieder her – dazu benötigt er allerdings die Zeit von zehn Bildern. Viel besser wäre es, wenn er seine normale, runde Gestalt, wie in der physikalischen Welt auch, weniger stetig und unmittelbar nach dem Start zurückkehren könnte. 8. Gehen Sie zu Bild 16 und fügen Sie an dieser Stelle ein Schlüsselbild ein. Hier macht es sich positiv bemerkbar, dass wir bereits einen Bewegungstween für Bild 15 haben, da das neue Schlüsselbild dann schon die richtige Position hat. Wählen Sie den Kreis in Bild 16 und aus dem Menü MODIFIZIEREN / TRANSFORMIEREN den Eintrag TRANSFORMATION ENTFERNEN aus. Sie sehen, der Kreis erhält augenblicklich seine alte, ungestauchte Form wieder zurück. 9. Testen Sie Ihren Flash-Film und vergessen Sie nicht, ihn abzuspeichern, da wir ihn gleich wieder benötigen, um der Schlusssequenz mehr Leben zu verleihen. Die Technik des Spannungsaufbaus können Sie nach Herzenslust benutzen und mit mehreren Bildern zusätzlich ausbauen. Werden Sie sich klar über Erwartungshaltungen und nutzen Sie diese für Ihre Zwecke – die Animation zu verbessern und weniger Arbeit zu haben.

423

Animationstechniken für Fortgeschrittene

Overkill – das Ende einer Animation Während Spannungsaufbau und Vorwegnahme des Geschehenden (Antizipation) vor dem Abspielen der Animation zum Tragen kommt, bezieht sich Overkill auf das Ende einer Animation. Dazu ein kleiner Vergleich: Befinden Sie sich in einem Auto, das zum Stehen kommt, haben Sie nach dem Stillstand das Gefühl, sich für einen Moment rückwärts zu bewegen. Sie bewegen sich natürlich nicht zurück, Sie haben aber dieses Gefühl erwartet, also spüren Sie es auch. Diesen Effekt können Sie auch Ihren Animationen hinzufügen, um sie realitätsnäher zu gestalten.

Übung: Benutzen Sie den Overkill-Effekt, um die Animation zu bereichern In dieser kleinen Arbeitsaufgabe werden wir dem Projekt aus dem letzten Beispiel den Effekt des Overkills hinzufügen. 1. Öffnen Sie das im vorangegangenen Workshop erstellte Projekt des gequetschten Kreises. Wenn Sie es nicht mehr haben, erstellen Sie bitte einen einfachen Bewegungstween einer Instanz mit der Bezeichnung Kreis, der sich vom unteren Rand des Arbeitsbereiches bis zum oberen Rand des Bildschirms erstreckt. Das letzte Bild ist Bild 25. 2. Fügen Sie Schlüsselbilder bei den Bildern 26, 27, 28 und 29 ein. (Klicken Sie in Bild 26 und betätigen Sie dann die Taste (F6) 3-mal hintereinander.) 3. Diese zusätzlichen Bilder beinhalten ein Bild, in dem der Kreis über das Ziel hinausschießt und deformatiert wird. Ein weiteres Bild sorgt dafür, dass das Bild zurückgeworfen wird und sich langsamer zum letzten Bild hinbewegt. Das letzte Bild sorgt schließlich dafür, dass der Ball seine Endposition erreicht. 4. Unterziehen Sie den Kreis in Bild 26 einem vertikalen Stretchvorgang, sodass dieser extra-schmal dargestellt wird (Abbildung 21.3). 5. Bewegen Sie den Kreis in Bild 27 ein paar Bildpunkte nach unten. 6. Testen Sie den Film. Es ist wirklich erstaunlich, wie ein Quäntchen Overkill eine Animation wesentlich realistischer ausschauen lässt. Es ist wirklich eine feine Sache, den Betrachter mit einfachen Mitteln ein wenig zu täuschen. Der Kreis bewegt sich – und zwar völlig ohne Tweens. Bild 1 beinhaltet einen Kreis am unteren Ende der Bühne. Bild 10 beinhaltet ein Schlüsselbild, in dem der Kreis gequetscht wurde. Weiter geht’s mit Bild 11: Hier animiert der Kreis auf halbem Weg zum oberen Bereich der Bühne wieder in seine ursprüngliche Gestalt zurück. Bei Bild 13 wird der Kreis gestaucht und passiert seine Zielposition, um in Bild 14 sein normales, rundes Aussehen wiederzuerlangen. Bild 15 beendet die ganze Sache – der Kreis hat seine normale Form und Zielposition erreicht – und das alles ohne Tweens.

424

Das Anwenden herkömmlicher Techniken

Abbildung 21.3: Der Kreis wird einem Stretchvorgang unterzogen.

Abbildung 21.4: Der Bewegungsablauf des Kreises

Tiefe simulieren Obwohl Flash nur zweidimensional arbeitet, können Sie dem Anwender trotzdem einen Eindruck von räumlicher Tiefe vermitteln. Es gibt dazu verschiedene Möglichkeiten, um diesen Effekt zu erreichen. Ein paar werden wir uns genauer ansehen. Der Hauptweg, um Tiefe zu erzeugen, beruht auf dem Aspekt der Perspektive. Das Wichtigste dabei Gestalten Sie Objekte einfach kleiner, wenn diese weiter weg erscheinen sollen.

425

Animationstechniken für Fortgeschrittene

Übung: Versehen Sie eine einfache Animation mit Perspektive In dieser Übung werden wir der Bühne lediglich 2 Linien hinzufügen, um die Perspektive zu betonen. 1. Zeichnen Sie ein Auto und konvertieren Sie es anschließend zu einer Filmsequenz. Im Schlüsselbild 1 platzieren Sie das Auto bitte am unteren linken Rand Ihrer FlashBühne. 2. Skalieren Sie das Auto größer in Bild 1 und schmaler in Bild 40. 3. Probieren Sie den Film aus. Er sieht nicht besonders gut aus. Fügen Sie nun eine neue Ebene hinzu und zeichnen Sie 2 zusammenlaufende Linien, die eine Straßenbegrenzung symbolisieren sollen. Damit sieht die Animation schon viel besser aus (siehe Abbildung 21.5).

Abbildung 21.5: Das Hinzufügen von Linien unterstützt in diesem Beispiel die räumliche Darstellung.

4. Um den Eindruck der Überwindung großer Entfernungen zu verstärken, können Sie auf der Straßen-Ebene zusätzlich Berge oder Wolken hinzufügen. Zeichnen Sie eine Horizontlinie am oberen Rand der Flash-Bühne sowie einige Berge am Horizont (siehe Abbildung 21.6). 5. Ohne eine Referenz hat der Berg jedoch kaum Perspektive. Zeichnen Sie einen zweiten Berg (unter dem Horizont) und machen Sie diesen ein wenig größer. Erstellen Sie danach einen wesentlich größeren Berg, der die Straße auf der rechten Seite teilweise blockiert. Indem Sie den nah erscheinenden Berg in Weiß ausfüllen, erscheint das Ergebnis noch ein Stück wirklichkeitsgetreuer (siehe Abbildung 21.7).

426

Das Anwenden herkömmlicher Techniken

Abbildung 21.6: Eine Horizontlinie sowie ein kleiner Berg machen die Tiefe noch realistischer.

Abbildung 21.7: Die zusätzlichen Berge und deren farbliche Ausfüllung verstärken den Effekt von Räumlichkeit.

Stellen Sie sich nur vor, wie viel realistischer die ganze Situation erscheinen würde, wenn professionelle realistisch aussehende Grafiken zum Einsatz kämen. Wir haben in unserem Beispiel nur simple Skizzen benutzt, um einen Eindruck von Tiefe herzustellen. Die Straßenbegrenzungen und der Horizont dienen lediglich der Beschreibung der Szenerie, in welcher das Auto reist. Wir fügten Berge hinzu, die in ihrer Größe variieren, um einen

427

Animationstechniken für Fortgeschrittene

Eindruck der Entfernung zu vermitteln, die das Auto überwinden muss. Ebenso verhält es sich mit dem großen Felsen, der die Straße blockiert. Hier entsteht ein Eindruck von Tiefe, da sich das Auto hinter dem Felsen befindet. Wir können noch wesentlich mehr Spuren legen, die den Eindruck vermitteln, dass sich das Auto fortbewegt. Nicht nur, dass das Auto kleiner wird, wenn es sich wegbewegt. Es wird auch langsamer – ein weiteres Indiz für räumliche Tiefe. Des Weiteren können Sie noch Schlaglöcher in die Straße zeichnen, die ebenfalls mit zunehmender Entfernung immer kleiner werden. Lassen Sie uns ein weiteres Beispiel anschauen, wie man Tiefe simulieren kann. Diesmal werden wir in dem Auto sitzen.

Übung: Simulieren Sie perspektivische Tiefe mit Größeneinstellungen, Ebenen und relativer Geschwindigkeit Im Rahmen der folgenden Übung werden wir in einem Auto reisen und auf verschiedene Arten die Illusion von räumlicher Tiefe erzeugen. 1. Zeichnen Sie ein vertikales Rechteck, das einen Holzpfosten symbolisieren soll. Konvertieren Sie es zu einem Symbol mit der Bezeichnung ein Baum, kopieren Sie es und erstellen Sie 15 Kopien. Ordnen Sie die Kopien gleichmäßig an, sodass Sie 2-mal so lang sind wie die Flash-Bühne. Wählen Sie alle Kopien aus und konvertieren Sie diese zu einer Filmsequenz (siehe Abbildung 21.8).

Abbildung 21.8: Die Holzpfosten werden durch die Bühne laufen, sodass Sie viele Kopien des Ursprungsbaums benötigen, die weit über die Bühne hinausreichen.

428

Das Anwenden herkömmlicher Techniken

2. Positionieren Sie die Holzpfosten so, dass der am weitesten links stehende Pfosten gerade noch die linke Seite der Bühne tangiert. Skalieren Sie die Bühne ein wenig größer. Kopieren Sie die Instanz und fügen Sie diese in eine neue Ebene ein. Positionieren Sie die Kopie am linken Rand der Bühne. Skalieren Sie die Version jedoch schmaler und stellen Sie sicher, dass sie etwas höher positioniert ist (siehe Abbildung 21.9). Das werden die Pfosten für den Gartenzaun.

Abbildung 21.9: Die beiden Ebenen für die Pfosten beinhalten die großen (nahen) und kleineren (entfernteren) Bäume.

3. Zeichnen Sie in einer neuen Ebene ein sehr langes Rechteck (als Gartenzaun). Konvertieren Sie es zu einem Symbol mit der Bezeichnung Gartenzaun und kopieren Sie es in die neue Ebene. Skalieren Sie die Instanz in der zweiten Ebene proportional zu den Pfosten in der Ebene. Positionieren Sie die zwei Instanzen des Gartenzaunes in den richtigen Ebenen – die schmale ist oben und die große Instanz ist unten (großer Gartenzaun). Werfen Sie einen Blick auf Abbildung 21.10, um zu sehen, wie die Komposition aussehen kann. 4. Fügen Sie Bilder für alle Ebenen ab Bild 60 ein (klicken Sie in Bild 60 und betätigen Sie (F5)). In die beiden Ebenen mit Pfosten müssen Sie nun ein Schlüsselbild bei Bild 60 anlegen (klicken Sie auf Bild 60 und anschließend (F6)). Im Bild 60 der Ebene mit den großen Pfosten halten Sie außerdem die (ª)-Taste gedrückt, während Sie mit der Maus die Pfosten den ganzen Weg nach links bewegen. Für die Ebene mit den kleinen Pfosten verfahren Sie analog (siehe Abbildung 21.10). 5. Setzen Sie ein Bewegungstween in Bild 1 beider Pfosten-Layer. Der Gartenzaun als Ganzes braucht nicht bewegt zu werden, da die Animation der Pfosten genügt, um einen Bewegungseindruck hervorzurufen.

429

Animationstechniken für Fortgeschrittene

Abbildung 21.10: Bewegen Sie die kleinen Pfosten nicht so weit wie die großen.

6. Erstellen Sie nun eine weitere Ebene für das Auto. Zeichnen Sie ein Auto und konvertieren Sie es zu einer Filmsequenz. Wenn Sie Lust haben, können Sie eine Version erstellen, bei der die Räder des Autos rotieren. Wenn nicht, ist es auch nicht schlimm, da der Bewegungseindruck auch so entstehen wird. Das Auto benötigt keinerlei Tween, da ja die Pfosten des Gartenzauns animiert werden. Das Auto wird immer an derselben Position erscheinen. Dies ist aber durchaus in Ordnung, da sich die Pfosten des Gartenzauns ja bewegen und somit eine rauschende Autofahrt simuliert wird. 7. Testen Sie den Film. Sie können auch hier noch Berge und andere Elemente am Horizont positionieren, um einen räumlichen Eindruck der Perspektive hervorzurufen.

Kontrolle der perspektivischen Ansichten Die beiden Übungen, welche wir gerade hinter uns gebracht haben, hatten unterschiedliche perspektivische Gesichtspunkte zur Grundlage. In der ersten Aufgabe änderte sich die Perspektive nicht – wir sahen lediglich, wie sich das Auto bewegte. Im zweiten Beispiel änderte sich unser Blickwinkel mit der Autofahrt – Vorder- und Hintergrund bewegten sich ebenfalls. Dazu ein Vergleich: War im ersten Beispiel die Kamera noch fest montiert, so war sie im zweiten Beispiel in einem Helikopter untergebracht, der mit derselben Geschwindigkeit reiste wie unser Auto. Wenn Sie sich einen Film oder Animationen anschauen, werden Sie sich nur selten fragen, wo die Kamera ist – aber genau diese Frage ist häufig sehr wichtig.

430

Das Anwenden herkömmlicher Techniken

Ist die Kamera starken Erschütterungen unterworfen, erleben Sie einen anderen Eindruck, als wenn sich die Kamera mit der gleichen Geschwindigkeit, jedoch sehr ruhig, bewegt. Im Bereich der Animationen sind wir keinerlei physikalischen Grenzen ausgesetzt, was den Standpunkt der Kamera betrifft, ganz im Gegensatz zu einem Filmregisseur in der realen Welt. Lassen Sie uns dazu eine kleine Übung durchführen, um festzustellen, wie sich der Kamerastandpunkt auf eine Animation auswirkt.

Übung: Kontrollieren Sie den perspektivischen Standort 1. Erstellen Sie eine neue Datei. Zeichnen Sie ein Flugzeug auf die Bühne (vielleicht sogar einen klassischen Doppeldecker) und konvertieren Sie es in eine Filmsequenz namens Doppeldecker. 2. Fügen Sie Schlüsselbilder bei den Bildern 50 und 60 ein. Halten Sie in Bild 60 die Taste (ª) gedrückt, während Sie per Drag&Drop die Instanz des Doppeldeckers bis zum rechten Ende des Bildschirms bewegen. Setzen Sie ein Bewegungstween in das Schlüsselbild bei Bild 50. 3. Testen Sie den Film und Sie können sich ungefähr vorstellen, dass Sie den Doppeldecker von einem anderen Flugzeug aus gefilmt haben. Bei Bild 50 stoppt Ihr Flugzeug.

Abbildung 21.11: Zeichnen Sie einen Horizont voller Berge. Nachdem Sie ein Bewegungstween erstellt haben, sieht es so aus, als würde das Flugzeug fliegen.

431

Animationstechniken für Fortgeschrittene

4. Fügen Sie nun eine neue Ebene ein (Bezeichnung: Hintergrund) und verkleinern Sie diese auf 25 Prozent. Zeichnen Sie in dieser neuen Ebene eine gezackte Linie mit dem Freihand-Werkzeug und zwar weit über den Bereich der Bühne hinaus (siehe Abbildung 21.11). Wählen Sie die Linie aus, konvertieren Sie diese zu einem Symbol und nennen Sie es Berge. Positionieren Sie die Berge in der Ebene Hintergrund so weit links, dass sie gerade noch den linken Rand der Bühne berühren. 5. Fügen Sie ein Schlüsselbild bei Bild 50 in die Ebene Hintergrund ein. Bewegen Sie die Instanz der Berge in Bild 50 den ganzen Weg von der linken zur rechten Seite, sodass Sie auf der rechten Seite gerade noch die Bühne berühren. In Bild 1 der Hintergund-Ebene setzen Sie bitte einen Bewegungstween. 6. Testen Sie den Film. Der Punkt der perspektivischen Darstellung ist ein wichtiges Instrument überall da, wo Animationen eine Tiefe bekommen sollen. Dies lernen Sie leider nicht von heute auf morgen. Schauen Sie sich Filme an, und fragen Sie sich immer wieder, wo denn eigentlich die Kamera steht. Einige wirklich gute Beispiele finden Sie unter http://www.bulbo.com.

Behalten Sie immer das Ende im Auge Viele Menschen, die sich erfolgreich mit Animationen beschäftigen, haben von Anfang an immer das Ende der Animation im Auge. Dieses dürfen auch Sie nie aus dem Auge verlieren. Ein Beispiel dazu: Wenn Sie einen Zoom auf der Flash-Bühne erstellen, machen Sie bitte das End-Schlüsselbild zuerst, da am Endpunkt Ihres Flash-Filmes alles so skaliert ist, wie es auch sein soll. Gehen Sie dann Schritt für Schritt zurück, bis Sie beim ersten Schlüsselbild angelangt sind.

21.3 Zusammenfassung Im Rahmen dieses Kapitels haben Sie erfahren, wie Sie mittels weniger Handgriffe und Tricks eine einfache Animation so bereichern, dass sie wesentlich ansehnlicher und realitätsnäher wird. Natürlich sehen unsere Beispiele nicht wirklich professionell oder realitätsnah aus, aber der prinzipielle Weg hin zu diesen großen Zielen ist immer der gleiche. Mittels weniger professioneller Grafiken und Zeichnungen können aus den einfachen Beispielen schlagartig gute Animationen werden.

432

Workshop

21.4 Workshop F&A F

Ich will einen Effekt erstellen, bei dem die Bühne sehr stark herangezoomt wird, um anschließend in eine andere Szene zu wechseln. Wie kann ich diesen Zoomvorgang initiieren? A

F

Benutzen Sie das Zoom-Werkzeug, können Sie lediglich die Bühne auf die Größe des Arbeitsbereiches zoomen. Was Sie benötigen, ist ein Tween, um alles auf Ihrer Bühne zu skalieren. Dies könnte relativ schwierig werden, insbesondere dann, wenn Sie über mehrere Ebenen verfügen. Sie können das Problem auf mehreren Wegen lösen. Wenn Sie alles innerhalb einer Filmsequenz erstellen, können Sie diese Filmsequenz später als Instanz ohne Probleme nach Ihren Vorstellungen skalieren. Haben Sie alles in der Hauptzeitlinie erstellt, können Sie einen so genannten Snapshot des letzten Bildes machen und ihn überall dorthin kopieren, wo er benötigt wird. Fügen Sie ein leeres Schlüsselbild in eine neue Ebene ein und betätigen Sie dann den Menüeintrag AN POSITION EINFÜGEN.

Gibt es gute Ressourcen mit weiterführenden Informationen zum Thema Animationen in Flash? A

Sie haben jetzt eigentlich fast alles, was Sie zum Thema Animationen in Flash brauchen. Hilfreich ist es, sich mit konventionellen Animationstechniken, mit Film oder mit existierenden Flash-Animationen auseinanderzusetzen und immer im Blick zu haben, was man erreichen will und welche Tricks es gibt.

Quiz Versuchen Sie wie bisher auch die Fragen zu beantworten, bevor Sie die Antworten lesen. 1. Als wir den Kreis stauchten, benutzten wir eine vertikale Skalierung. Warum benutzten wir auch die horizontale Stauchung? a.

Sie können ein Symbol nicht nur in eine Richtung skalieren.

b. Wir taten es, weil es einfach gut aussah. c. Im wirklichen Leben verursacht die Komprimierung eines Balls in eine Richtung ebenfalls die Verformung in die andere Richtung – das Volumen des Balles wird sich nicht ändern.

433

Animationstechniken für Fortgeschrittene

2. Warum fügten wir der Bewegung des Kreises ein Zurückprallen hinzu? a.

Wir dachten, das sieht einfach nicht schlecht aus.

b. Bälle in der realen Welt zeigen dieses Verhalten. c. Wir wollten, dass sich der Ball nach den Vorstellungen des Anwenders verhält. 3. Ist es unredlich, mehrere Schlüsselbilder an Stelle eines langen Tweens zu benutzen? a.

Ja, da nicht der korrekte physikalische Bewegungsablauf dargestellt wird.

b. Vielleicht, aber da der Effekt und das Endergebnis überzeugen, ist das durchaus o.k. c. Nein, da es in der realen Welt auch nur zwei Schlüsselpunkte gibt – den Anfang und das Ende.

434

Die Arbeit in Teams und an großen Projekten

2 2

Die Arbeit in Teams und an großen Projekten

Bisher haben Sie alles ohne weitere Unterstützung durch Dritte geschafft. Sie allein haben dieses Buch Kapitel für Kapitel durchgearbeitet. Natürlich ist es möglich, eine Flash-Site als »Einzelkämpfer« im stillen Kämmerlein zu programmieren. Ein Team aus Spezialisten kann jedoch wahrscheinlich mehr erreichen. Besonders Unternehmen profitieren vom Team-Gedanken und der Bündelung verschiedener Fähigkeiten in diesen Teams. So ist es durchaus denkbar, dass sich eine Person speziell um die Thematik Audio kümmert, eine andere ist verantwortlich für das Design und die Grafiken und eine weiteres Teammitglied zeichnet für die Programmierung verantwortlich. Die Verantwortlichkeiten können auch noch weiter untergliedert und verteilt werden. Der Vorteil an dieser Stelle: Sie erreichen nicht nur bessere Endprodukte, sondern Ihr »Output« wird sich vermehren – Sie, als Team, werden wesentlich produktiver sein als die einzelnen Personen. Trotz eines Teams bleibt die Arbeit in einem Projekt kein Kinderspiel. Es gibt unzählige Gelegenheiten für Konflikte und zusätzliche Arbeit. Meist lassen sich Probleme jedoch besser und effizienter lösen. In diesem Kapitel lernen Sie verschiedene Wege kennen, um in einer Teamumgebung zu arbeiten und wie Sie Flash darin nutzen können. Genauer gesagt erfahren Sie manches über: 쐽

Traditionelle Produktionskonzepte

쐽

Das Erstellen und Benutzen gemeinsamer Bibliotheken

쐽

Das Benutzen von Komponenten als Vorlagen

쐽

Das Entwickeln von Namenskonventionen und anderen Methoden, die den Produktionsablauf glätten sollen

B1.1 Methoden Viele Menschen arbeiten seit vielen Jahren sehr erfolgreich in kreativen Teams. Sie als potentieller Flash-Benutzer können von diesen Produktionsmethoden eine ganze Menge lernen. Obwohl die Filmindustrie eine völlig eigene Welt ist, hat sie eine ganze Menge mit Flash gemein. Im Folgenden lernen Sie einige einfache, aber wirkungsvolle Konzepte kennen und wie Sie diese auf Flash anwenden können.

Rollenzuweisungen Es ist sehr wichtig, jemanden im Team zu haben, der eine Auge für die Verantwortlichkeiten hat, Aufgaben verteilt und die Übersicht über das Projekt hat. Dieser Mensch soll nicht nur verhindern, dass zwei Mitarbeiter zum gleichen Zeitpunkt am gleichen Objekt arbeiten, er soll auch Probleme, die auftreten könnten, schon weit im Vorfeld erkennen und

436

Methoden

entsprechende Gegenmaßnahmen einleiten. Die Verantwortlichkeiten sollen in der Hierarchie nach unten verteilt werden – auf so genannte Team- oder Projektleiter. Die Rollen können sich natürlich während des Projektes ändern. Es ist jedoch sehr wichtig, dass pro Teammitglied nicht mehr als eine Aufgabe zugewiesen wird. Viele Menschen denken, dass der Grund für die Zuweisung von Rollen und Verantwortlichkeiten vor allem darin liegt, zu sehen, welcher Mitarbeiter unter Stress aufgibt bzw. schwere Probleme hat. Dies mag vielleicht stimmen, der Vorteil liegt jedoch darin begründet, dass Schwachstellen bei Mitarbeitern erkannt werden und alle Teammitglieder an der Lösung des entsprechenden Problems mitarbeiten können. Letztlich sollte einfach Arbeitsteilung reibungslos und sinnvoll vonstatten gehen können.

Testen der Rollen und Strukturen Nachdem Sie Rollen definiert und den Mitarbeitern zugewiesen haben, sollten Sie überprüfen, ob die erstellte Teamstruktur und alle Aspekte des Systems auch funktionieren. Sendet beispielsweise eine Person eine Sprachaufnahme zum Mitarbeiter des Bereichs der Animationen, sollte sofort ein Test durchgeführt werden, ob die Aufnahme auch den Anforderungen entspricht. Ist dies nicht der Fall, muss eventuell der Toningenieur zu Rate gezogen werden, damit er die Aufnahme einer Nachbearbeitung unterzieht. Ist der Toningenieur in der Lage, die nachbearbeiteten Daten anschließend schnell und fehlerfrei per E-Mail an den Animator zu senden, und hat dieser in der Zwischenzeit daran gedacht, einen Platzhalter in die Website zu setzen? Es gibt viele Aspekte, die schief laufen (und natürlich auch klappen) können. Am besten ist es, Sie spielen vor dem ersten großen Projekt ein Testprojekt durch, in das alle Mitarbeiter und Abteilungen involviert sind, um Schwachstellen in der Kommunikation und Teamstruktur aufzudecken. Ein anderes Verfahren zum Aufdecken suboptimaler Abläufe nennt sich »Full-PathReview«. Dabei nehmen Sie sich einen kleinen Teil eines Projektes vor und denken sich, dass es sich um das Gesamtprojekt handelt. Anhand dieses kleinen, zum Großprojekt aufgeblasenen Teils werden nun die gesamten Teamstrukturen ausgetestet. Alle arbeiten an dem kleinen Teil, als würde es sich um das Gesamtprojekt handeln. Auf diese Weise werden Schwachstellen vor allem in der Kommunikation zwischen Teammitgliedern aufgedeckt.

Trennen von Programmiercode und Daten Ein eher technisches Konzept zur Teamarbeit in Produktionsumgebungen trägt die Bezeichnung »Code-Data-Separation«. Dabei achtet man strikt darauf, dass der Programmiercode (Skript und Struktur) weitgehend von den Daten getrennt wird. Je weiter und tiefergehend die Trennung von Code und Daten voranschreitet, umso mehr Änderungen

437

Die Arbeit in Teams und an großen Projekten

können vorgenommen werden, ohne dass dies ungewollte Auswirkungen auf Daten und Code hat. Das Entflechten des Codes einer Site trägt erheblich zur Übersichtlichkeit bei. Je besser eine Site strukturiert ist, desto besser können sich alle Beteiligten zurechtfinden. Die folgende Aufgabe demonstriert ein Feature zur Separation von Code und Daten.

Übung: Benutzen Sie die Symbol-Wechsel-Technik zur Trennung von Code und Daten Diese Übung benutzt ein eingebautes Feature von Flash, um zu demonstrieren, wie die Bewegung einer Animation von dem entsprechenden Symbol getrennt werden kann. Folgend die dazu notwendigen Schritte: 1. Erstellen Sie einen Block mit Text und konvertieren Sie diesen zu einem Symbol. Nennen Sie das Symbol Platzhalter. Generieren Sie nun ein Bewegungstween dazu. 2. Testen Sie den Film. Stellen Sie sich vor, dies wäre die perfekte Animation mit dem besten Bewegungstween aller Zeiten für eine bestimmte Sektion Ihrer zukünftigen Website. Sie wollen nun, dass diesem Tween ein anderer Text in einer anderen Szene folgt. Klicken Sie dazu auf die Ebene 1, um alle Bilder dieser Ebene auszuwählen. Wählen Sie nun aus dem Menü BEARBEITEN den Befehl BILDER KOPIEREN aus. 3. Erstellen Sie nun eine neue Szene, indem Sie aus dem Menü EINFÜGEN den Menüeintrag SZENE auswählen. Klicken Sie auf das erste Bild und wählen Sie dann aus dem Menü BEARBEITEN den Eintrag BILDER EINFÜGEN aus. Sie haben nun alles oberhalb des ersten Tweens in die neue Szene kopiert. 4. Erstellen Sie einen anderen Block mit Text. Markieren Sie den Text und konvertieren Sie ihn anschließend in ein Symbol mit der Bezeichnung Ersetzung. Löschen Sie nun die Instanz von Ersetzung auf Ihrer Bühne. Keine Sorge – das Symbol ist nach wie vor in der Bibliothek gespeichert. 5. Wechseln Sie zum Symbol mit der Bezeichnung Platzhalter. Wählen Sie in Bild 1 die Instanz von Platzhalter aus und klicken Sie im Eigenschaften-Bedienfeld auf das Symbol mit der Bezeichnung Austauschen bzw. Symbole austauschen (siehe Abbildung B1.1). Diese Schaltfläche gestattet es Ihnen, die ausgewählte Instanz zu wechseln und mit einem neuen Symbol zu versehen. 6. Die Dialogbox Symbol Wechseln (siehe Abbildung B1.2) listet alle verfügbaren Symbole der Bibliothek auf und setzt eine Markierung vor das Symbol, welches derzeit zur entsprechenden Instanz gehört und mit dieser verbunden ist. Wählen Sie das ErsetzungSymbol aus und klicken Sie dann auf OK. Für andere Bilder verfahren Sie analog zu der soeben beschriebenen Vorgehensweise.

438

Methoden

Abbildung B1.1: Das Symbol Symbole austauschen gestattet es, die Instanz zu wechseln und diese mit einem neuen Symbol zu versehen.

Abbildung B1.2: Diese Dialogbox enthält eine Liste aller für diese Instanz verfügbaren Symbole.

Die Dialogbox Symbol wechseln gestattet das Ersetzen des Symbols einer Instanz, ohne dass dabei sämtliche Attribute der entsprechenden Instanz verloren gehen. Im vorangegangenen Beispiel haben Sie lediglich die so genannte Master-Version des Textes editiert, inklusive der Daten in jeder betroffenen Instanz des Films. Dabei haben Sie bereits Daten vom Inhalt getrennt behandelt. Wenn ein Kunde Änderungen in seiner Flash-Site haben will, bedeutet dies sehr oft eine ganze Menge Arbeit für alle Beteiligten. Derartige Arbeiten bedürfen einer guten Planung im Vorfeld der anstehenden Tätigkeiten, um sich während der Umstellung nicht noch zusätzliche Arbeit aufzubürden. Sehr hilfreich ist es dabei, den Code sehr gut zu strukturieren, damit Sie auch noch Monate nach der Erstellung wissen, was Sie da eigentlich programmiert haben (siehe dazu auch Kapitel 18).

439

Die Arbeit in Teams und an großen Projekten

Die Trennung von Code und Daten ist ein sehr guter Ansatz, den Sie bei der Erstellung einer Site stets im Hinterkopf behalten sollten. Fragen Sie sich stets, ob der eigentliche Inhalt von der Struktur immer gut getrennt ist.

B1.2 Angewandte Techniken Wenn Sie diese Art von Produktionsmethoden verstanden haben, stellt sich schnell die Frage, wie diese Erfahrungen nun in Flash einfließen können. Wie ermöglicht man beispielsweise verschiedenen Mitgliedern eines Teams an einem Projekt zu arbeiten? Genau dies werden Sie unter anderem im folgenden Unterkapitel kennen lernen. Sie erlernen den Umgang mit in Flash eingebauten Features, die genau jene Anforderungen unterstützen, sowie einige generelle Techniken, die sich nicht unbedingt auf Flash beziehen.

Gemeinsame Bibliotheken In Kapitel 18 haben Sie bereits erfahren, wie gemeinsam nutzbare Bibliotheken funktionieren. Wie Sie wissen, kann ein Bibliothekseintrag dabei von vielen Anwendern benutzt werden. Ein wichtiger Aspekt bei der Erstellung einer Website ist der enorme Aufwand an Arbeit, der notwendig ist, um ein so genanntes Artwork zu erstellen. Währen der »Künstler« mit der Erstellung der Grafiken beschäftigt ist, sitzt der Programmierer mit Kribbeln in den Fingern herum und wartet auf das Resultat der Person, welche die grafischen Elemente erstellt. Sind dann endlich die Grafiken fertig, muss alles sehr schnell gehen. Diese Situation ist besonders für die Programmierer sehr unbefriedigend. Mit gemeinschaftlich nutzbaren Bibliotheken kann der Grafiker einen Platzhalter (Grafiken ohne Inhalt, nur mit den letztendlichen Ausmaßen) für die entsprechenden Grafiken erstellen, mit denen die Programmierer arbeiten können. Somit kann die Site komplett programmiert werden. Zum Schluss ersetzt der Programmierer nur noch die Platzhalter durch die entsprechenden Grafiken. Dies hat den Vorteil, dass der Programmierer von Anfang an mit den Platzhaltern arbeiten kann, ohne auf die Resultate des Grafikers warten zu müssen.

Übung: Benutzen Sie gemeinsame Bibliotheken zur Erstellung eines Films ohne die finalen Grafiken Im folgenden Szenario benutzen Sie gemeinsame Bibliotheken mit dem Ziel, dass Mitarbeiter mit dem Aufbau einer Website beginnen, bevor der Grafiker mit der Erstellung seiner Bilder fertig ist. Notwendig sind dazu die erwähnten Platzhalter.

440

Angewandte Techniken

1. Stellen Sie sich vor, der Grafiker hat mit seiner Arbeit begonnen, aber die Grafik für den Hintergrund der Website ist leider noch nicht fertig. Sie als Programmierer müssen jedoch unbedingt anfangen, die Site zu programmieren. Der Grafiker kann zu diesem Zweck eine Platzhalter-Grafik erstellen und diese in der Bibliothek ablegen. 2. Erstellen Sie eine neue Datei. Zeichnen Sie einen Kasten und einen Text mit der Bezeichnung Holder. Wählen Sie alles aus und konvertieren Sie es zu einem Symbol. Benennen Sie das Symbol mit Hintergrund und speichern Sie es als Filmsequenz ab. 3. Benutzen Sie nun das Eigenschaften-Bedienfeld und setzen Sie die X- und Y-Position jeweils auf 0.

Abbildung B1.3: Wenn man ein Symbol erstellt, kann man eine von neun Registrierungspositionen einstellen.

4. Da Sie soeben den Zentrierpunkt des Hintergrundes neu gesetzt haben, hat sich das Bild zum linken oberen Rand der Flash-Bühne bewegt. Führen Sie einen Doppelklick auf dem Hintergrund aus und rufen Sie das Bedienfeld Bibliothek auf. 5. Wählen Sie im Bedienfeld Bibliothek den Eintrag Background aus und anschließend aus dem Kontextmenü (rechte Maustaste) den Eintrag Verknüpfung. 6. Wählen Sie die zweite Option DIESES SYMBOL EXPORTIEREN und geben Sie dem Symbol die Bezeichnung Hintergrund. Klicken Sie dann auf die Schaltfläche OK (siehe Abbildung B1.4). Diese Option sichert, dass das Symbol mit dem Film exportiert wird. Der Name wird lediglich benötigt, um das Symbol in der Bibliothek zu identifizieren. 7. Speichern Sie die Datei anschließend unter der Bezeichnung geteilt.fla ab. 8. In einer neuen Datei kann nun der Programmierer diesen Platzhalter benutzen, um mit seiner Arbeit zu beginnen. Wählen Sie dazu aus dem Menü DATEI den Eintrag DATEI ÖFFNEN und öffnen Sie die Datei geteilt.fla. Ziehen Sie per Drag&Drop den Hintergrund auf die Bühne und wählen Sie aus dem EIGENSCHAFTEN-Bedienfeld den Zentrierpunkt 0,0 aus. 9. Der Programmierer kann nun fortfahren.

441

Die Arbeit in Teams und an großen Projekten

Abbildung B1.4: Mit dieser Dialogbox stellen Sie sicher, dass das Symbol exportiert werden kann.

10. Ist der Grafiker mit seiner Arbeit fertig, muss er lediglich das Symbol für Hintergrund in der Bibliothek editieren oder ein ganz neues Symbol anlegen. Erstellt der Grafiker ein neues Symbol, muss er das alte entfernen und sicherstellen, dass das neue Symbol über die Verknüpfungseigenschaften des alten Symbols verfügt.

Komponenten Wir haben Komponenten bereits in Kapitel 16 kennen gelernt. Ziel dort war es, komplizierte Skript-Aufgaben in ein leicht zu handhabendes Format zu übersetzen. Sie sind auf einige fortgeschrittene und hilfreiche Komponenten gestoßen, die standardmäßig mit Flash ausgeliefert werden. Komponenten gestatten dem Anwender die Erstellung eines konsistenten Templates (Schablone oder Vorlage), das sämtliche Teammitglieder als Grundlage ihrer Arbeit benutzen können.

Übung: Erstellen Sie eine Komponente, die ein Template bedient In dieser Übung erstellen Sie ein Template für jeden Mitarbeiter Ihres Teams. Dabei kann jeder Mitarbeiter beliebig in seinem Template arbeiten, ohne dass dabei die Gesamtstruktur zerstört wird.

442

Angewandte Techniken

1. Erstellen Sie eine neue Datei mit zwei Blöcken Text. Formatieren Sie einen Block mit Hilfe des Eigenschaften-Bedienfelds mit einer sehr großen Schriftart (ungefähr 36 Pixel). Der andere Textblock sollte von der Schrift her etwas kleiner ausfallen (24 Pixel). 2. Benutzen Sie die Registerkarte Textoptionen des Eigenschaften-Bedienfeld, um den Textblock als dynamischer Text zu markieren. Stellen Sie sicher, dass das Kontrollfeld AUSWÄHLBAR deaktiviert ist. Klicken Sie auf die Schaltfläche Umrisse für gesamte Schrift einschliessen. Ihr Bedienfeld sollte entsprechend Abbildung B1.5 aussehen.

Abbildung B1.5: Beide Textblöcke wurden dynamisch und als nicht auswählbar markiert.

3. Geben Sie im Eingabefeld jeweils für beide Textblöcke VAR Titel (großer Textblock) und Untertitel (kleiner Textblock) ein. 4. Verändern Sie nun die Position der beiden Textblöcke so, dass sich Überschrift in der Nähe der oberen linken Ecke Ihrer Bühne befindet und Untertitel genau darunter liegt. Stellen Sie die Ränder der Textblöcke so ein, dass sie sehr groß sind (siehe dazu Abbildung B1.6) und etwas über den rechten Bereich der Bühne hinausreichen. 5. Die Ausrichtung des Textes in der Box bleibt Ihnen überlassen. In unserem Beispiel habe ich die Ausrichtung der Überschrift auf links gesetzt und rechts für den Textblock mit dem Untertitel.

443

Die Arbeit in Teams und an großen Projekten

Abbildung B1.6: Verändern Sie die Ränder der Textblöcke.

6. Eine direkte Konvertierung in eine Komponente geht nur über den Umweg der Konvertierung in eine Filmsequenz. Markieren Sie beide Textblöcke und wählen Sie anschließend aus dem Menü EINFÜGEN den Menüeintrag IN SYMBOL KONVERTIEREN. Nennen Sie es Template. 7. Das Layout sollte nun schon so sein, wie Sie es haben wollen. Wählen Sie nun die Instanz Template, die Sie gerade erstellt haben und benutzen Sie das EigenschaftenBedienfeld, um die Position auf 0,0 zu setzen. 8. Wie zu erwarten, hat sich nun alles zum linken oberen Rand der Bühne bewegt. Führen Sie nun einen Doppelklick auf Template aus, um das Master-Symbol editieren zu können. 9. Um nun eine Komponente zu generieren, müssen Sie die Clip-Parameter definieren. Öffnen Sie dazu den Menüeintrag BIBLIOTHEK aus dem Menü FENSTER. Klicken Sie mit Ihrer rechten Maustaste auf das Template und wählen Sie den Kontextmenüeintrag SEQUENZPARAMETER DEFINIEREN. Klicken Sie auf das Plus-Zeichen und geben Sie in der Spalte Name die Bezeichnung Überschrift ein. In der dazugehörigen Spalte mit der Bezeichnung Wert geben Sie nun Geben Sie hier die Überschrift ein. Klicken Sie ein zweites Mal auf das Plus-Zeichen und geben Sie in der Spalte Name die Bezeichnung Untertitel ein. Im dazugehörigen Eingabefeld Wert müssen Sie nun Ihren Untertitel eingeben. Klicken Sie abschließend auf OK. 10. Nun können Sie die Komponente an alle Autoren verteilen.

444

Angewandte Techniken

11. Kehren Sie zum Hauptbildschirm zurück und löschen Sie alles, was sich auf der Bühne befindet. Ziehen Sie das Template per Drag&Drop von der Bibliothek auf die Bühne. Benutzen Sie das Eigenschaften-Bedienfeld, um die Zentrierungspunkte 0,0 einzugeben. Markieren Sie das Template und begeben Sie sich dann zum Bedienfeld Sequenzparameter. Führen Sie einen Doppelklick auf das Feld Titel aus und geben Sie Das ist die Seite 1 ein. Fügen Sie ein Schlüsselbild bei Bild 2 ein und ändern Sie den Titel und Untertitel mit Hilfe des Bedienfeldes Sequenzparameter. Fügen Sie zu guter Letzt ein anderes Schlüsselbild mit einem anderen Text für das dritte Bild ein. 12. Fügen Sie eine Stop-Aktion in das erste Bild der aktuellen Ebene ein. Wählen Sie aus dem Menü EINFÜGEN den Eintrag EBENE und zeichnen Sie einen Kasten. Wählen Sie dann aus dem Menü EINFÜGEN den Eintrag IN SYMBOL KONVERTIEREN aus. Benennen Sie es mit Schaltfläche (wählen Sie abschließend das Optionsfeld Schaltfläche). Markieren Sie die entsprechende Instanz, öffnen Sie das Bedienfeld Aktion aus dem Menü FENSTER und fügen Sie eine goto-Aktion hinzu. Modifizieren Sie die Parameter zu nächstes Bild (siehe Abbildung B1.7).

Abbildung B1.7: Mit einer simplen Aktion kann sich der Anwender durch die unterschiedlichen Bilder bewegen.

13. Testen Sie den Film. Sie werden sicherlich feststellen, dass Sie den Text ändern können, die Formatierungen bleiben jedoch immer bestehen. Werden Änderungen an der ursprünglichen Komponente vorgenommen, wirken sich diese unmittelbar auf alle anderen Templates aus.

445

Die Arbeit in Teams und an großen Projekten

Die letzte Übung versinnbildlicht eine gute Anwendung für Komponenten. Vorteile bringen Komponenten vor allem dann, wenn sie in einer Bibliothek gespeichert werden und dort mehreren Benutzern zur Verfügung stehen – und zwar mit all ihren Vorteilen. Es gibt jedoch auch einige Limitierungen. So kann der Autor etwa den Text erst sehen, wenn er einen Film erstellt und diesen testet. An dieser Tatsache kann man nichts ändern, da Flash erst während der Ausführung des Films auf die spezifizierten Parameter zurückgreift. Eine andere Einschränkung kann gelöst werden; dazu ist lediglich ein wenig Programmierung notwendig. In der letzten Übung hat der Flash-Autor jede Instanz eines Templates mittels des EIGENSCHAFTEN-Bedienfeld positioniert. Sie können jedoch auch in das ursprüngliche Template (Master Template) hineingehen und diese Notwendigkeit dort beseitigen. Fügen Sie beim ersten Schlüsselbild bei dem Dialogfeld Objektaktionen eine evaluate-Aktion mit dem Parameter _x=0 ein und danach eine weitere evaluate-Aktion mit dem Ausdruck _y=0. Wird dann das erste Schlüsselbild aufgerufen, werden die entsprechenden Eigenschaften gesetzt, und zwar auf die Koordinaten 0,0. Nun ist der Autor in der Lage, die Clips dahin zu setzen, wo er sie auch immer haben will. Die Arbeit am Code in unserem Beispiel-Template ist relativ gering. Ein Template mit wesentlich mehr Funktionen verlangt schon ein wenig mehr Zeit von Ihnen. Bedenken Sie jedoch immer, dass sich der Aufwand lohnt.

Dokumentation und Namenskonventionen Im Rahmen eines komplexen Projektes ist eine Dokumentation von sehr großer Bedeutung. Alle Media-Elemente sollten dabei klar identifiziert und, falls notwendig, zusätzlich auf Papier gebracht werden, wo alles detailliert aufgeführt und jede Funktion beschrieben wird. Denken Sie bei der Erstellung einer Dokumentation immer daran, dass diese aufgebaut sein soll wie ein gutes Handbuch. Sie sollte von jedem Teammitglied ohne Schwierigkeiten benutzt werden können. Zudem sollten auch Außenstehende des Projektes nach kurzem Studium der Dokumentation in der Lage sein, in das Projekt einzusteigen. Bedeutung hat eine Dokumentation nicht nur für andere Mitglieder des Teams, sondern auch für einen selbst. Da Änderungen an einer Site an der Tagesordnung sind, ist es sehr hilfreich, eine Dokumentation zu haben, die erklärt, was man selbst noch vor wenigen Wochen oder Monaten getan hat. Dabei brauchen Sie nicht immer auf die Papierversion zurückzugreifen. Flash bietet die Möglichkeit, Notizen direkt im Programm zu den entsprechenden Flash-Filmen abzulegen. Eine einfache Dokumentation sollte eine Beschreibung jeder Datei enthalten, die im Rahmen des Projektes verwendet wurde. Des Weiteren sollte sie Ordnerbezeichnungen haben, welche sich selbst und den Ordnerinhalt erklären. So könnte ein Ordner etwa die Bezeichnung Sounds tragen und demnach sämtliche .swf-Dateien mit Sound enthalten. Jede Datei ist einem Projekt zugewiesen und hat einen Daseinsgrund. Falls nicht, sollten Sie die entsprechenden Dateien löschen.

446

Angewandte Techniken

Eine wirklich gute Dokumentation sollte auch die Beschreibung des Gesamtprozesses enthalten, die nicht unbedingt jeden Arbeitsschritt zu enthalten braucht. Finden Sie eine geschickte Balance zwischen Detailreichtum und Transparenz. Machen Sie sich nicht mehr Arbeit, als unbedingt notwendig. Die Dokumentation sollte außerdem schon während des laufenden Projektes erstellt und geführt werden und nicht am Ende, wenn einige Details schon langsam in Vergessenheit geraten. Brillante Einfälle und Meilensteine bei der Erstellung und der Weg dahin sollten sofort dokumentiert werden. Schützen Sie die Dokumentation. Sie ist Ihr Kapital. Ein weiterer wichtiger Punkt im Rahmen der Dokumentation sind die Namenskonventionen. Symbolnamen sind wichtig, da Sie mit ihnen Bibliotheken alphabetisch sortieren lassen können und die Suche bei logischen Namen wesentlich transparenter und einfacher wird. Wenn etwa jeder Teilnehmer in Ihrem Team seine Symbole mit Initialen versieht, können Sie die entsprechenden Objekte schnell den zuständigen Mitarbeitern zuordnen. Diese Vorgehensweise finden Sie auch im HILFE-Teil von Flash (Abbildung B1.8). Alle Bitmap-Grafiken haben Bezeichnungen, die mit Bitmap- beginnen, während Schaltflächen zur Navigation mit der Bezeichnung Nav Schaltfläche versehen sind. Sie können sich diese Bezeichnungen aneignen oder neue finden – Hauptsache, Sie kommen später damit zurecht.

Abbildung B1.8: Die Bibliothek ist sofort aufgeräumt, wenn man eine durchgängige Namenskonvention befolgt.

447

Die Arbeit in Teams und an großen Projekten

Namenskonventionen sind nichts anderes als eine Menge von Gesetzmäßigkeiten, an denen sich Ordner und Dateien orientieren. Sie haben die Möglichkeit, Konventionen zu spezifizieren, ohne jeden Dateinamen einzeln anzusprechen. Ein Beispiel: Bei einer Namenskonvention SektionsNummer_UnterSektion.swf würde für die Sektion 2, Untersektion 3 der Dateiname 2_3.swf lauten. Zusätzlich zu den Namen der Symbole in der Bibliothek haben auch die Instanzen auf der Bühne Namen. Instanznamen haben einen Vorteil im Rahmen der Dokumentation, da Namenskonventionen sehr kritisch sein können. Haben Sie beispielsweise 3 Instanzen eines Symbols mit der Bezeichnung Box, so haben die 3 Instanzen nicht die gleichen Namen. Wenn Sie die Instanzen box_1, box_2 und box_3 nennen, können Sie sich ein Skript erstellen, welches die Eigenschaften für jede einzelne Box zu einer bestimmten Zeit setzt. Der folgende Code setzt eine box_x an Position 10: Function move(boxNum){ root["box_"+boxNum]._x=10; } boxNum kann die Zustände 1, 2 oder 3 annehmen. "box_"+boxNum ändert sich dynamisch zu box_1, wenn boxNum den Wert 1 hat.

B1.3 Zusammenfassung In diesem Kapitel sahen Sie verschiedene Herangehensweisen, um in Teamumgebungen zu arbeiten. Zusätzlich zu den Theorien und Methoden haben Sie einige eingebaute Features zu diesem Thema in Flash kennen gelernt, mit denen Sie Ihre Produktivität steigern können. Sie haben Features wie das Symbol wechseln oder Komponenten zum Erstellen von Templates benutzt. Lassen Sie sich vor allem Zeit, den Informationsfluss in Ihrem Teams zu studieren, um den Ablauf reibungsloser zu gestalten.

Workshop F&A F

Gibt es eine Alternative zum Symbol wechseln in jeder Instanz der Zeitlinie? A

448

Ja, Sie haben nicht die Möglichkeit, verschiedene Instanzen zu wählen und diese auf einen Schlag zu wechseln. Haben Sie die Absicht, auf diese Weise einen Tween zu ersetzen, können Sie ein kleines Feature der Bibliothek benutzen.

Zusammenfassung

Erstellen Sie in einem Film ein Symbol mit der Bezeichnung box. Halten Sie die erste Bibliothek geöffnet und erstellen Sie eine zweite Datei. Bewegen Sie box per Drag&Drop aus der ersten Bibliothek in die neue Datei. Wenn Sie nun den Inhalt von box in der neuen Datei editieren, denkt Flash, dass es sich bei box um das gleiche Symbol handelt. Editieren Sie nun den Inhalt von box in der neuen Datei. Erstellen Sie ein Tween für die erste Datei, kopieren Sie die Bilder und fügen Sie anschließend die kopierten Bilder in die zweite Datei ein. Sie haben nun das gleiche Tween für eine neue Datei. F

Wie viele Mitarbeiter sollten in einem Team arbeiten? A

Die vielleicht einfachste Situation ist jene, wenn lediglich eine Person an einem Projekt arbeitet. Dieser Einzelkämpfer wird jedoch früher oder später sehr stark überlastet sein. Teams mit bis zu 20 Mitarbeitern können sehr produktiv und effektiv arbeiten. Die Teamstärke ist natürlich sehr vom Umfang des Projektes abhängig.

Quiz Wie immer an dieser Stelle ein paar Fragen, die Ihnen bei der Vertiefung Ihres erlernten Wissens helfen sollen. 1. Welcher der folgenden Punkte ist kein Vorteil der Code-Daten-Separation? a.

Fehler im Programmcode werden minimiert und beseitigt.

b. Der Code kann ohne große Umstände in einem neuen Projekt verwendet werden. c. Das Artwork einer Seite kann ohne Probleme ersetzt werden, ohne dass dies Auswirkungen auf den Code hat. 2. Was versteht man unter Full-Path-Review? a.

Eine Situation, in die jeder Mitarbeiter eines Teams involviert ist und in der sich alle gemeinschaftlich das Projekt anschauen

b. Sie gehen Schritt für Schritt durch das ganze Projekt, um Fehler aufzudecken. c. Sie entwickeln eine Komponente von Anfang bis zum Ende komplett durch, um anhand dessen Rückschlüsse auf das gesamte Projekt zu ziehen. 3. Was passiert, wenn Sie ein Schlüsselbild auswählen und anschließend aus dem Menü BEARBEITEN den Menüeintrag KOPIEREN aufrufen? a.

Es passiert gar nichts. Sie sollten den Menüpunkt BILDER KOPIEREN aufrufen.

b. Der Inhalt der Ebene auf dem Bildschirm wird in die Zwischenablage kopiert. c. Flash wird beendet.

449

Die Flashkenntnisse vertiefen

3

Die Flashkenntnisse vertiefen

Sie sollten zum jetzigen Zeitpunkt ein solides Fundament besitzen, was den Umgang mit Flash betrifft. Das vorliegende Buch erhebt nicht den Anspruch, Flash erschöpfend behandelt zu haben. Nachdem Sie alle Lektionen und Kapitel dieses Buches durchgearbeitet haben, müssen Sie sich weiterhin in diesem Thema fit machen. Einen Schritt vorwärts bringt Sie mit Sicherheit die Wiederholung der praktischen Übungen in diesem Buch. In diesem Kapitel beschäftigen wir uns damit, wie Sie Ihre erworbenen Kenntnisse auf technischer Basis verfeinern und schneller anwenden können. In diesem Kapitel werden wir: 쐽

Lernressourcen zum Thema Flash finden,

쐽

eine Methode zum erweiterten Erwerb von Flash-Kenntnissen entwickeln,

쐽

Debugger und andere Techniken zur Steigerung der Arbeitsleistung kennen lernen.

Obwohl sich der Hauptinhalt dieses Kapitels mit der Entwicklung von Skript-Technologien befasst, sind einige der neuen Aspekte auch allgemeingültig. So gibt es beispielsweise eine Vielzahl von Webseiten, die mit guten Animationstechniken im Bereich Flash, aber auch mit allgemeinen Informationen aufwarten.

B2.1 Profitieren Sie von Beispiel-Dateien Einer der besten Wege zum Erlernen von Flash ist es, die Arbeiten anderer Flash-Programmierer anzuschauen. Werfen Sie dabei einmal einen Blick hinter die Fassade, um zu sehen, wie alles funktioniert.

Dateien, die in Flash enthalten sind Eine der besten Dateien zum Erlernen von Flash liegt direkt vor Ihrer Nase. Wählen Sie einfach HILFE / BEISPIELE, um sie zu öffnen. Die Lektionen – zu erreichen über das Menü HILFE / LEKTIONEN – benutzen verschiedene Inhalte, die man hervorragend verwenden kann, um einmal einen Blick hinter die Kulissen ihrer Funktionsweise zu werfen. Die Lektionen führen Sie Schritt für Schritt durch verschiedene Themen, ohne die entsprechende Technik aus dem Auge zu verlieren.

Online-Tutorials Die meisten Flash-Programmierer sind geneigt, ihren Erfahrungsschatz mit anderen Gleichgesinnten zu teilen. So gibt es Menschen, die der Allgemeinheit komplette Projekte zur Verfügung stellen und diese auch noch dokumentieren. Ressourcen mit diesen so

452

Profitieren Sie von Beispiel-Dateien

genannten Online-Tutorials finden Sie sehr häufig im Internet. Fast auf jeder Site zum Thema Flash gibt es derartige Lehrmaterialien. Viele dieser Internetseiten haben Artikel, Foren und Beispiel-Downloads zum Thema Flash. Zusätzlich gibt es so genannte E-Mail-Server, mit deren Hilfe Sie Fragen an die Flash-Gemeinde stellen können. Dieses Buch wäre nicht dieses Buch, hätte ich nicht viele Tipps und Ratschläge von unzähligen E-Mail-Flash-Kontakten erhalten. Haben Sie ein Problem, schreiben Sie dazu einfach eine E-Mail und senden Sie diese an die FlashGemeinde eines Flash-Servers – eine Antwort ist garantiert. Ein Listserver ist ein Rechner, auf dem sich so genannte Newsgruppen befinden, die sich mit einem ganz bestimmten Thema beschäftigen – so auch mit dem Thema Flash. Wenn Sie eine E-Mail zu diesem Listserver schicken – natürlich zur passenden Newsgroup – wird irgendein Teilnehmer eine Lösung für Ihr Problem haben. Wie bereits erwähnt, verfügen viele der Websites zum Thema Flash über Tutorials und die dazugehörigen .fla-Dateien. Hier haben Menschen eine Lösung oder einen Effekt erarbeitet und bieten diesen nun kostenlos zur Nutzung an. Indem Sie die passende .fla-Datei herunterladen, können Sie diesen Effekt direkt in Flash ausprobieren. Dank dieser Dateien erlernen Sie die Arbeitsweise eines anderen Flash-Programmierers und können sich vielleicht das eine oder andere abschauen.

Wie man aus einer abgeschlossenen Arbeit lernt Haben Sie eine .fla-Datei gefunden, die Sie beeindruckt hat und von der Sie etwas lernen wollen, so öffnen Sie diese einfach in Flash und schnüffeln ein wenig darin herum – ist ja alles ganz offiziell! Handelt es sich dabei um eine sehr komplexe Datei, kommen Sie sich vielleicht vor, als würden Sie durch einen dunklen Wald wandern. Sie benötigen einige Techniken, um sich in einer derartigen Datei zurechtzufinden. Sie sollten nicht versuchen, alles auf einmal zu begreifen und zu erfassen. Beschäftigen Sie sich lieber erst einmal mit der Identifikation eines speziellen Attributes, von dem Sie etwas lernen bzw. übernehmen wollen.

Übung: Lernen Sie von einer komplexen Beispiel-Datei 1. Öffnen Sie die Datei maze.fla im bereits mehrfach erwähnten samples/FLA-Ordner Ihrer Flash MX-Installation. Testen Sie den Film, um zu sehen, wie er abläuft. Sie können mit den Pfeiltasten das weiße Kästchen steuern, um sich durch das Labyrinth zu bewegen. Wir möchten nun den dafür zuständigen ActionScript-Code extrahieren.

453

Die Flashkenntnisse vertiefen

2. Kehren Sie zur ursprünglichen Datei auf Ihrer Bühne zurück und öffnen Sie den FILM-EXPLORER aus dem Menü FENSTER (siehe Abbildung B2.1). Der Film-Explorer gibt Ihnen eine Übersicht der aktuellen Datei inklusive aller benutzter Komponenten. Sie sehen die Schriftarten, jede Instanz, alle Aktionen und vieles mehr.

Abbildung B2.1: Der Film-Explorer zeigt eine hierachische Liste von allen Elementen, die in einem Film vorhanden sind.

3. Verändern Sie nun die Ansicht mit den Filter-Schaltflächen, sodass lediglich Aktionen dargestellt werden. Klicken Sie dazu auf das letzte Symbol (drittes von links, mit dem Pfeil) der Filter-Schaltflächen (siehe Abbildung B2.2). 4. Sie haben nun alle Skripte des Films auf einen Blick. Im Film-Explorer klicken Sie einfach auf das Plus-Zeichen, das unterhalb der Szene 1 liegt. Daraufhin öffnet sich die gesamte Struktur des Film-Explorers inklusive aller Skripte. Versuchen Sie nun den Eintrag mit dem umfangreichsten Code zu finden. Sie können jede Aktion öffnen, indem Sie auf das zugehörige Plus-Zeichen klicken. Stöbern Sie solange herum, bis Sie die Aktion mit dem umfangreichsten Code gefunden haben (Aktionen für maze). Klicken Sie einfach auf das Pfeil-Symbol rechts neben Aktionen für maze, um das Aktionen-Bedienfeld mit dem entsprechenden Code als Inhalt zu öffnen (siehe Abbildung B2.3). Hier könnten Sie den Code nun kopieren. 5. Sie können dieses nun ausdrucken. Für unsere Zwecke genügt es jedoch erst einmal, den Code zu kopieren. Führen Sie einen Doppelklick innerhalb des Codes aus, worauf das Bedienfeld Aktionen erscheint.

454

Profitieren Sie von Beispiel-Dateien

Abbildung B2.2: Wenn Sie nur die ActionScript-Elemente anzeigen lassen, können Sie alle nacheinander besichtigen, bis Sie eines mit einer Menge Code entdecken.

Abbildung B2.3: Da hier nur das ActionScript dargestellt wird, können Sie alle Elemente nach dem Eintrag mit dem umfangreichsten Code durchsuchen.

455

Die Flashkenntnisse vertiefen

6. Ohne den ganzen Code zu erklären, sei gesagt, dass er folgende Funktionen ausführt: Er reagiert auf die Tastatureingaben des Anwenders und bewegt dabei das weiße Kästchen in die entsprechende Richtung. Außerdem wird geprüft, ob eine Wand im Weg steht. Da wir nur den Bereich kopieren möchten, der das Quadrat bewegt, klicken Sie bitte auf die Zeile, die mit //keyboard controls beginnt, halten (ª) gedrückt und klicken auf die Zeile vor der Zeile, die mit //detect if... anfängt. Kopieren Sie diesen Abschnitt (Rechtsklick und KOPIEREN). Bevor wir nun eine neue Datei öffnen, schauen Sie sich noch mal die allererste Zeile des Codes an und Sie sehen, dass er dem Clip-Ereignis enterFrame zugeordnet ist. 7. Öffnen Sie eine neue Datei und zeichnen Sie ein Quadrat, das Sie in eine Filmsequenz umwandeln. Wählen Sie die Instanz auf der Bühne aus und öffnen Sie das Aktionen-Bedienfeld. Fügen Sie hier den Code ein (Rechtsklick in das Codefenster und EINFÜGEN). Wie Sie sehen, wird der Code automatisch dem Clip-Ereignis load zugeordnet. Markieren Sie die erste Zeile und ändern Sie das Ereignis auf Bild betreten, also enterFrame (wie es ja auch im Original vorkam). Das Ergebnis sollte wie in Abbildung B2.4 aussehen.

Abbildung B2.4: Die drei Zeilen Code wurden aus dem Beispiel kopiert und in die neue Datei eingefügt.

456

Der Beginn eines umfangreichen Projektes

8. Testen Sie den Film. Das Quadrat sollte sich nun je nach gedrückter Taste in die entsprechende Richtung bewegen. Man kann sogar 2 Tasten gleichzeitig drücken, um eine diagonale Bewegung zu erhalten. Durch den Programmiercode eines Flash-Kollegen zu wandern, kann sehr frustrierend sein, aber sehr oft lohnt sich die Auseinandersetzung. Man kann aus dem maze.fla-Beispiel einiges lernen. Der Film hat beispielsweise eine Bildrate von 72 BpS, was ich für viel zu hoch erachte, da er auf meinem schnellsten Computer zum Beispiel nur mit 55 BpS abspielte. Das Problem ist obendrein, dass die Abspielgeschwindigkeit ja von Computer zu Computer unterschiedlich ist und Anwender mit langsameren Maschinen gerade bei Spielen schnell die Motivation verlieren könnten.

B2.2 Der Beginn eines umfangreichen Projektes Haben Sie das große Ziel, eine komplexe Website zu erstellen, denken Sie vielleicht, dass dieses Buch und die darin enthaltenen Beispiele für Ihre Zwecke zu einfach gehalten sind. Da mögen Sie recht haben. Sie haben aber die Grundlagen erlernt, um auf Basis dieses Wissens aufzubauen. Die besten, größten und schönsten Flash-Sites, die Sie jemals gesehen haben, sind nichts weiter als das Resultat von Büchern wie diesem.

Die Philosophie der kleinen Schritte Als Sie die Datei aus dem vorangegangenen Beispiel »auseinander genommen« haben, waren Sie schon auf dem richtigen Weg der Politik der kleinen Schritte. Deshalb folgen ein paar Ratschläge, wie Sie Ihre Nerven schonen und vor allem Zeit sparen können. Zuerst einmal betrachten Sie die Seite in all ihrer Herrlichkeit. Schreiben Sie dann alle Features auf, die gut funktionierten und die Ihnen gefielen. Seien Sie dabei so genau wie möglich. Ein Beispiel dazu: »Ein Glossar ist von überall aus erreichbar. Wählt der Anwender das Glossar aus, erscheint es am oberen Rand des Bildschirms. Aus dem Glossar heraus hat der Anwender Zugriff auf eine alphabetisch sortierte Liste vieler Begriffe. Hat man sich für einen Begriff entschieden, erscheint ein Textblock mit der Definition des entsprechenden Begriffs. Zu einigen Begriffen sind zusätzlich Bilder, Sounds und andere Multimedia-Elemente hinterlegt. Diese Elemente erscheinen im gleichen Kasten wie die Begriffe des Glossars. Der Anwender verlässt das Glossar über eine Schaltfläche mit der Beschriftung Schließen.«

457

Die Flashkenntnisse vertiefen

Dies ist eine detaillierte Beschreibung eines einzigen Features. Von hier aus starten Sie Ihre Erkundung und bauen somit Stück für Stück Ihre eigene Website auf. Verzetteln Sie sich nicht, sondern wählen Sie immer Features aus, die Sie gerne für Ihre Site übernehmen möchten. Nachdem Sie alle Features für Ihr Projekt spezifiziert haben, können Sie damit beginnen, kleine Aufgaben zu definieren. Eine erste könnte sein, eine Schaltfläche zu erstellen, mit der der Anwender das Glossar aufrufen kann. Danach könnten Sie eine zweite Schaltfläche erstellen, mit der er in der Lage ist, das Glossar zu verlassen. Erledigen Sie erst die kleinen Schritte, ehe Sie mit einer neuen, großen Aufgabe beginnen. Sie könnten eine Filmsequenz erstellen, die eine Schaltfläche in Bild 1 enthält. Hier könnten Sie ebenso eine Stop-Aktion implementieren (gotoAndStop(2)). Bild 2 könnte einen großen Kasten für den Hintergrund enthalten. Eine andere Schaltfläche erscheint in Bild 2, um die Funktion des Schließens zu übernehmen (gotoAndStop(1)). Die Technik, ein existierendes Projekt anzuschauen, positive Features aufzulisten und diese dann Schritt für Schritt nachzubilden, ist eine sehr gute Vorgehensmethode, um die eigene Website sukzessive aufzubauen. Sie können nicht alles auf einmal durchführen. Lassen Sie sich Zeit. Auch mit wesentlich mehr Erfahrung in Flash sollten Sie dieser Vorgehensweise stets den Vorzug geben.

Schützen Sie sich vor Fehlern Im Verlauf eines jeden großen Software-Projektes werden Fehler auftreten. Wenn Sie sich dies immer vergegenwärtigen, sind Sie besser vorbereitet, als wenn Sie sich immer sagen, dass schon alles gut gehen werde. Sichern Sie regelmäßig Ihre Arbeit. Wollen Sie signifikante Änderungen an bestehenden Dateien durchführen, erstellen Sie sich davon erst einmal eine Arbeitskopie, mit der Sie nach Herzenslust verfahren können. Eine Strategie betrifft dabei den Dateinamen. Wenn Sie starten, können Sie die Datei beispielsweise meinProjekt_31okt2000-1.fla benennen. Jedes Mal, wenn Sie eine gravierende Veränderung vornehmen, können Sie die letzte Nummer hochzählen (meinProjekt_31okt2000-2.fla). Die aktuelle Datei wäre dann jene mit dem neuesten Datum und der höchsten Endnummer. Des Weiteren empfiehlt sich vielleicht das Anlegen eines Logbuchs in Papierform, das zusätzlich zu den Dateinamen die Spezifikationen und Features auflistet. Eine gute Dokumentation leistet an dieser Stelle ebenfalls wertvolle Dienste.

458

Man lernt niemals aus

Verlieben Sie sich nicht in Ihren Code – lernen Sie, ihn zu löschen Wächst ein Projekt, werden Ihre Dateien und der Programmcode immer umfangreicher. Letztlich funktioniert das Projekt genau nach Ihren Vorstellungen. Da jedoch im Laufe der Zeit immer wieder neuer Programmcode hinzugekommen ist bzw. bestehender Code wesentlich verändert wurde, kann es sein, dass die Datei aus viel überflüssigem Müll-Code besteht. Durchforsten Sie Ihren eigenen Code und entkernen Sie überflüssigen. Seien Sie dabei nicht allzu verliebt in Ihr Werk – Objektivität ist das Motto der Stunde! Natürlich sollten Sie nicht auf Biegen und Brechen Ihre Arbeit durchstöbern und Sachen löschen, die eigentlich gar nicht schaden. Nur wenn die entsprechenden Dateien nicht mehr zu handhaben sind, sollten Sie über ein Re-Design nachdenken. Denken Sie dabei jedoch immer an eine Datensicherung, damit Sie nach dem Re-Design immer noch eine Version in petto haben, die trotz aufgeblasenem Code immer noch funktioniert. Sie müssen nicht bis zum Ende Ihres Projektes warten, um in den Genuss der Vorteile der Entmüllungs-Technik zu kommen. Haben Sie beispielsweise einen Fehler entdeckt, speichern Sie diese Datei ab. Denken Sie, dass Sie eine Lösung für Ihren Fehler haben, wählen Sie aus dem Menü DATEI den Eintrag WIEDERHERSTELLEN aus (siehe Abbildung B2.5).

Abbildung B2.5: WIEDERHERSTELLEN stellt Ihre Original-Datei wieder her.

Ein weiterer Trick ist es, Lösungen offline zu erarbeiten. Dies bedeutet nichts anderes, als das Sie nicht jedes Feature zur Haupt-Datei hinzufügen, sondern speziell dafür eine neue Datei anlegen. Haben Sie eine Lösung, die funktioniert, können Sie den Code immer noch zur Original-Datei hinzufügen. So verfahren Sie auch im Fall von Fehlern, die Sie somit nicht in der Original-Datei lösen. Haben Sie den Fehler gelöst, können Sie den sauberen Code ebenfalls in die Original-Datei kopieren. Sie erhalten so einen sauberen, gut funktionierenden Programmcode.

B2.3 Man lernt niemals aus Eine elementare Lebensweisheit, die auch für Flash gilt. Seien Sie nicht frustriert, freuen Sie sich darüber.

459

Die Flashkenntnisse vertiefen

Software wird immer weiterentwickelt Es ist sehr wichtig, nur das zu lernen, was Sie auch wirklich benötigen. Flash MX ist ein erstaunliches Produkt, aber es wird nicht die letzte Software sein, die Ihnen während Ihrer Laufbahn in die Hände fällt. Es ist wichtig zu erlernen, wie es Flash fertig bringt, das zu tun, was Sie wollen. Nur so erlernen Sie jedes Feature in Flash MX. Wenn Sie einmal die Schritte vergleichen, die notwendig waren, um eine ganz bestimmte Aufgabe mit einem Software-Produkt von vor fünf Jahren durchzuführen, werden Sie feststellen, um wie viel komplexer und komplizierter aktuelle Produkte sind, um genau dieselbe Aufgabe heute durchzuführen. Software wird immer komplexer und umfangreicher. Noch vor wenigen Jahren war es notwendig zu wissen, wie man mit Farbpaletten umgehen musste. Heutzutage sollte man mit Millionen darstellbarer Farben umgehen können.

Auch die Praxis zählt Wenden Sie nicht nur die erlernte Theorie an, sondern stellen Sie sich reale Aufgaben, um eine Flash-Site oder aber auch nur Elemente dieser zu erstellen. Versuchen Sie dabei, Ihren Horizont zu erweitern, indem Sie sich Aufgaben stellen, die immer ein wenig über Ihren derzeitigen Fähigkeiten liegen. Nur auf diese Weise lernen Sie neue Aspekte von Flash kennen und vermehren Ihr Wissen, was letztlich zu einer Leistungssteigerung im Umgang mit Flash führt. Reale Projekte zu verwirklichen ist ein sehr guter Weg, sich neues Wissen anzueignen. Nur unter dem Druck, ein Projekt zu verwirklichen, werden Sie Ihre Grenzen kennen lernen und diese letztlich überwinden bzw. weiter nach oben verschieben. Ein anderer Weg, sein Wissen zu vertiefen ist es, andere Menschen die Aspekte zu lehren, die man gerade eben selbst erlernt hat. Teilen Sie Freunden und Bekannten Ihr Wissen mit und beobachten Sie, ob diese Ihre Erläuterungen auch verstanden haben.

Einfache Beispiele und Übungen, die Sie immer wieder brauchen können Viele Übungen, die Sie im Rahmen dieses Buches kennen gelernt haben, lassen sich auch auf andere Software-Produkte anwenden. Sie werden sich in Ihrer weiteren Karriere immer wieder mit neuer Software oder neuen Versionen auseinandersetzen müssen. Es ist immer so: Mit ganz grundlegenden Übungen erreichen Sie einen einfachen Einstieg in jede neue Software. Ich selbst habe, ehe ich bei Flash gelandet bin, mit Macromedias Authorware und anschließend mit Director gearbeitet und festgestellt, dass ich in all diesen Programmen sehr oft die gleichen Tätigkeiten vorgenommen habe. Führen Sie die folgenden Übungen durch, wenn Sie mit einem neuen Programm konfrontiert werden, um einen leichten Einstieg in diese neuen Produkte oder Updates zu bekommen.

460

Man lernt niemals aus

쐽

Der springende Ball. Wenn es eine klassische Animation gibt, dann ist es diese. Sie können sich den ganzen Tag mit ihr beschäftigen – perfekt wird diese Animation niemals werden. Versuchen Sie zusätzliche Techniken (Kapitel 21), wie dieser Animation etwa ein Stauchen hinzuzufügen (siehe Abbildung B2.6). Näheres zu dem tanzenden Ball finden Sie in Kapitel 11.

Abbildung B2.6: Das klassische Beispiel des springenden Balls mit Staucheffekt ist eine gute Übung zum Vertiefen des bereits Erlernten. 쐽

Es geht Auf und Ab. In diesem Beispiel erstellen Sie zwei Pfeiltasten. Eine zählt die angezeigte Nummer oder die Film-Instanz aufwärts, die andere Schaltfläche zählt herunter. Sie haben etwas Ähnliches bereits in Kapitel 15 kennen gelernt.

쐽

Hallo, Welt. Im Rahmen dieser Aufgabe wird der Anwender gebeten, seinen Namen einzugeben, und der Computer begrüßt den Anwender auf dem Bildschirm mit »Hallo, Phillip« (oder wen auch immer). Dieses Beispiel soll zeigen, wie Variablen gespeichert werden können. Wir haben es in Kapitel 15 besprochen.

쐽

Kreis, Linie, Quadrat. Die Idee hinter dieser Übung ist das Erstellen von 3 Schaltflächen (mit den Bezeichnungen Kreis, Linie und Quadrat), die bei Betätigung genau diese geometrischen Figuren auf dem Bildschirm darstellen.

Übung: Erstellen Sie die einen Kreis, eine Linie und ein Quadrat 1. Zeichnen Sie einen großen Kasten, entfernen Sie die Füllfarbe und wählen Sie aus dem Menü EINFÜGEN den Menüeintrag IN SYMBOL KONVERTIEREN. Bezeichnen Sie das Symbol als Inhalt und speichern Sie es mit der Option Movieclip ab.

461

Die Flashkenntnisse vertiefen

2. Führen Sie einen Doppelklick auf die Instanz aus, um anschließend den Inhalt zu editieren. 3. Innerhalb der neuen Filmsequenz gehen Sie bitte zu Bild 4 und wählen Sie den Befehl BILD (F5) aus dem Menü EINFÜGEN. Erstellen Sie dann eine neue Ebene mit der Bezeichnung Grafiken. Fügen Sie bei Bild 2 ein leeres Schlüsselbild (F6) in die Ebene Grafiken ein und zeichnen Sie einen Kreis. Bei Bild 3 müssen Sie nun ein leeres Schlüsselbild (F7) erstellen und anschließend eine Linie zeichnen. Ist dies erledigt, ist es an der Zeit, das letzte Schlüsselbild bei Bild 4 der Ebene Grafiken einzufügen, um im Anschluss daran ein Quadrat zu zeichnen. Das Ergebnis sollte wie in Abbildung B2.7 aussehen.

Abbildung B2.7: Die Filmsequenz, die Sie erstellt haben, besteht aus drei Bildern mit den entsprechenden drei Figuren.

4. Im ersten Bild unseres Films müssen Sie nun eine Stop-Aktion einfügen (egal auf welcher Ebene). 5. Gehen Sie zurück zur Hauptszene und wählen Sie unsere Filmsequenz aus. Benutzen Sie das Eigenschaften-Bedienfeld und geben Sie der Instanz den Namen derInhalt. 6. Zeichnen Sie ein Rechteck. Markieren Sie das Rechteck und wählen Sie aus dem Menü EINFÜGEN den Eintrag IN SYMBOL KONVERTIEREN aus. Bezeichnen Sie das Rechteck mit Meine Schaltfläche und stellen Sie sicher, dass die Option Schaltfläche beim Speichern aktiviert ist. 7. Kopieren und fügen Sie zwei weitere Instanzen von Meine Schaltfläche ein. Erstellen Sie nun Textblöcke für jede Schaltfläche mit den Bezeichnungen Kreis, Linie und Quadrat.

462

Fehler beheben (Debugging)

8. Markieren Sie die Schaltfläche für Kreis und fügen Sie eine evaluate-Aktion mit dem Argument derInhalt.gotoAndStop(2) ein. Beachten Sie dabei unbedingt die Schreibweise mit Groß- und Kleinbuchstaben. 9. Testen Sie den Film. Er sollte lediglich für den Bereich Kreis arbeiten. Fügen Sie nun der Schaltfläche Linie ebenfalls eine evaluate-Aktion mit dem Argument derInhalt.goto AndStop(3) hinzu. Der Quadrat-Schaltfläche weisen Sie bitte derInhalt.gotoAndStop(4) zu. 10. Sie können die Benutzerfreundlichkeit des aktuellen Designs steigern, indem Sie die gerade aktive Schaltfläche besonders markieren. Es gibt viele Wege um das zu erreichen. Am besten ist es jedoch, Sie zeichnen eine besondere Markierung für die entsprechende Schaltfläche in den Bildern 2, 3 und 4 der Filmsequenz Inhalt (siehe Abbildung B2.8).

Abbildung B2.8: Kreis, Linie und Quadrat sind klassische Übungen, um erlerntes Wissen zu vertiefen.

B2.4 Fehler beheben (Debugging) Die Suche nach Fehlern und das Entfernen dieser kann zu einer langwierigen Arbeit werden. Wenn Sie sich lediglich Schritt für Schritt durch den von Ihnen erstellten Code hangeln, besteht die Gefahr, dass Sie Fehler nicht erkennen oder diese erneut machen. Glücklicherweise bietet Flash Features, die bei dem Prozess der Fehlersuche helfen.

Traditionelle Methoden Zusätzlich zu der so genannten »Rohe-Gewalt-Methode« der »Schritt-für-Schritt-Suche« nach Fehlern im Code gibt es zwei weitere Methoden, um Fehler zu finden. Stellen Sie sich vor, Sie hätten ein Skript für eine Schaltfläche, Filmsequenz oder ein Bild, von dem Sie denken, dass es funktioniert. Sie können nun eine Trace-Aktion in Ihr Script einfügen, um festzustellen, ob es auch wirklich ausgeführt wird. Die folgende Aufgabe soll diese Vorgehensweise noch einmal aufzeigen.

463

Die Flashkenntnisse vertiefen

Übung: Benutzen Sie eine Trace-Aktion, um festzustellen, ob ein Script auch wirklich funktioniert 1. Zeichnen Sie innerhalb einer neuen Filmsequenz einen Kreis und konvertieren Sie ihn in ein Symbol. Geben Sie dem Kreis die Bezeichnung Kreis und speichern Sie ihn mit der Option Movieclip ab. Geben Sie der Instanz auf Ihrer Bühne den Namen ball. Benutzen Sie dazu das Eigenschaften-Bedienfeld. 2. Weisen Sie dem ersten Bild eine evaluate-Aktion ((Esc), (E), (V)) zu und geben Sie dann ball._x=_xmouse ein. 3. Testen Sie den Film. Sie erwarten, dass der Ball seine x-Eigenschaft verändert, solange Sie den Mauszeiger bewegen. Es funktioniert aber nicht! 4. Gehen Sie zum ersten Bild zurück, fügen Sie eine Trace-Aktion ((Esc), (T), (R)) mit der Bezeichnung bewegt im Meldungsfenster ein. Testen Sie den Film. Sie sollten nun ein Pop-up-Fenster mit Ihrer Meldung von der Trace-Aktion erhalten. Leider folgt der Ball immer noch nicht der horizontalen Bewegung des Mauszeigers. 5. Fügen Sie nun ein zweites Bild bei Frame 2 ein. Wenn Sie jetzt den Film testen, sehen Sie im erscheinenden Pop-up-Fenster den Ausdruck bewegt immer wieder erscheinen – und zwar in schneller Folge.

Abbildung B2.9: Die trace-Aktionsnachricht kann aus einer Kombination von Buchstaben und Zahlen bestehen.

464

Fehler beheben (Debugging)

Übrigens können Sie trace benutzen, um verschiedene Ausdrucke anzeigen zu lassen. Dies könnten beispielsweise trace-Nachrichten sein, die aus einer Kombination von Buchstaben und Zahlen bestehen. So zeigt trace("Die Maus befindet sich an der Position " + _xmouse) im Pop-up-Fenster Die Maus befindet sich an der Position 123,5 (oder wie auch immer Ihre aktuelle Mausposition ist). Stellen Sie sicher, dass im Dialogfenster Bildeigenschaften das Kontrollfeld Ausdruck aktiviert ist. Nur so werden auch die entsprechenden Ausdrucke im Pop-up-Fenster dargestellt (siehe Abbildung B2.9).

Verwendung des Debuggers Der in Flash integrierte Debugger ist ein professionelles Tool, um Fehlern in Ihrem Code auf die Schliche zu kommen. Sie haben nicht nur die Möglichkeit, Fehler zu suchen, sondern können den Flash-Film während seiner Laufzeit analysieren. Sie finden den Debugger im Menü FENSTER. Er funktioniert aber nur dann, wenn ein Flash-Film im Player läuft. Betrachten wir (siehe Abbildung B2.10) einmal die Bestandteile des Debugger-Fensters. Die einzelnen Funktionen werden wir in der anschließenden Aufgabe genauer durchleuchten.

Abbildung B2.10: Das DebuggerFenster beinhaltet eine Vielzahl von Funktionen, die bei der Fehlersuche behilflich sind.

465

Die Flashkenntnisse vertiefen

Übung: Schauen Sie sich Ihren Flash-Film mit dem Debugger an 1. Öffnen Sie die Datei paycheck_calculator.fla, die Sie wie gewohnt im samples/FLAOrdner Ihrer Flash-Installation finden. Wählen Sie nun STEUERUNG / FEHLERSUCHE ((Strg)+(ª)+(Enter)). Das ist vergleichbar mit dem normalen Abspielen des Films, allerdings ist das Debugger-Fenster sichtbar und man muss den grünen Abspielpfeil drücken, bevor es losgeht. 2. Bei dieser Datei handelt es sich um eine Demonstration der Fähigkeit von Flash zur Texteingabe. Allerdings sind ein paar Funktionen ausgelassen worden. Versuchen Sie herauszufinden, was nicht funktioniert. 3. Die Familienstand-Option (Married/Single) ist ausgeschaltet. Zu Übungszwecken betrachten wir das als Fehler und versuchen, das Problem zu beheben. 4. Was mir zuerst auffiel, war, dass es keine aktive Schaltfläche bei der Option Married gibt. Kehren wir zum Film zurück und beheben dies direkt. Auf der Bühne kann man die Instanz radio button in der Ebene text fields anklicken. Wenn Sie darauf doppelklicken finden Sie im Master-Symbol 2 Bilder vor. Im ersten Bild gibt es keine Schaltflächen, allerdings findet man im zweiten Bild eine unsichtbare Schaltfläche über der Option Single. Kopieren Sie diese Schaltfläche aus Bild 2 und fügen Sie sie in Bild 1 wieder ein. Schieben Sie die Schaltfläche über die Option Married. 5. Lassen Sie die kopierte Schaltfläche noch ausgewählt und öffnen Sie das AktionenBedienfeld, um einen Blick auf den Code zu werfen. Die Idee dieses unfertigen Steuerelements ist es, zu Bild 1 zu springen, wenn man in Bild 2 war und umgekehrt. Dabei soll die Variable maritalstatus (verheiratet) entsprechend auf true (wahr) oder false (falsch) angepasst werden. Ändern wir den Code also wie in Abbildung B2.11 gezeigt ab. 6. Starten Sie erneut die Fehlersuche ((Strg)+(ª)+(Enter)) und klicken Sie auf den grünen Pfeil. Schauen Sie nach, ob das Problem behoben ist. Die Schaltflächen wechseln jetzt zwar, aber die Werte verändern sich noch nicht entsprechend, wenn Sie beispielsweise eine 12000 bei Annual Salary eintragen. 7. Während Sie noch debuggen, klicken Sie auf _level0 in der Objekt-Hierarchie. Wählen Sie bei den Attributen die Registerkarte Variablen aus. Hier finden Sie alle wichtigen Variablen, die man als Programmierer für die Schaltflächen betrachten könnte (siehe Abbildung B2.12). In der Deutschen Version von Flash MX scheint ein kleiner Fehler zu sein, denn wenn man etwas in der Objekt-Hierarchie auswählt ist nicht immer sofort der Attribut-Bereich sichtbar. Allerdings ist ein recht großes Feld für den CallStack vorgesehen. Darüber befindet sich eine dünne Linie. Klicken Sie darauf und Sie sehen den Attribut-Bereich.

466

Fehler beheben (Debugging)

Abbildung B2.11: Der Code der Schaltfläche wird wie hier gezeigt verändert.

Abbildung B2.12: Während der Fehlersuche kann man alle wichtigen Variablen einsehen.

8. Unter anderem finden Sie auch unsere Variable maritalstatus wieder, die sich aber nicht verändert, wenn wir unsere Schaltfläche auf der Bühne betätigen. Testen wir doch mal, ob wir dem Problem mit einem Haltepunkt auf den Pelz rücken können. 9. Kehren Sie zur Quelldatei zurück und betrachten Sie erneut den Quellcode des Married-Knopfs (also in Bild 1). Markieren Sie die Zeile _root.actions.maritalstatus=true und wählen Sie aus dem DEBUG-OPTIONEN-Menü (Schaltfläche mit dem Stetoskop) den Eintrag BREAKPOINT SETZEN, um einen Haltepunkt einzufügen. Es erscheint ein roter Punkt vor dieser Codezeile (siehe Abbildung B2.13)

467

Die Flashkenntnisse vertiefen

Abbildung B2.13: Fügen Sie bei dieser Zeile einen Breakpoint ein, um den Debugger zu zwingen, hier zu stoppen.

10. Starten Sie abschließend erneut die Fehlersuche ((Strg)+(ª)+(Enter)) und klicken Sie auf den grünen Pfeil. Bevor Sie nun die Schaltfläche austesten, sollten Sie wieder _level0 ausgewählt haben. Klicken Sie nun auf MARRIED auf der Bühne und Sie sehen, dass im Debugger der Code der Aktion angezeigt wird und außerdem ein gelber Pfeil vor der Zeile steht, die wir mit dem Breakpoint versehen haben. Nun stehen uns 3 Optionen zur Verfügung (die Symbole oben rechts im Debugger). Man kann Überspringen wählen, um die Aktion komplett zu übergehen, ohne sie auszuführen. Mit Hineinspringen führt man zuerst die Option aus und veranlasst Flash, direkt danach wieder anzuhalten. Mit Verlassen kommen Sie aus Aktionen heraus, in die Sie zuvor hineingesprungen sind. Wählen Sie also Hineinspringen und Sie sehen, dass der Debugger bei einer Stop-Aktion anhält. An dieser Stelle wissen wir, dass die Codezeile nicht funktioniert, denn die Variable steht immer noch auf false. (Eine Theorie hätte ja sein können, dass die Zeile funktioniert hätte, aber irgendwas anderes den Wert wieder zurückgesetzt hätte. Das ist hiermit widerlegt.) 11. Da wir nun genau wissen, wo das Problem liegt, können wir uns auf die Lösung konzentrieren. Wir haben _level0 betrachtet, das effektiv mit _root identisch ist. In der Zeile wird aber _root.actions.maritalstatus auf true gesetzt. Ändern Sie die Zeile in _root.maritalstatus=true und in Bild 2 entsprechend _root.maritalstatus=false. 12. Testen Sie den Film erneut und tragen Sie 12000 bei ANNUAL SALARY ein. Wenn Sie nun den Familienstand ändern, wechseln die berechneten Beträge und der Film funktioniert endlich.

468

Zusammenfassung

B2.5 Zusammenfassung Es mag etwas merkwürdig anmuten, dass wir uns am Ende des Buches damit beschäftigen, wie Sie Flash erlernen können. Ziel sollte sein, Sie nach Beendigung dieses Buches zu motivieren, nicht mit dem Lernen in Sachen Flash aufzuhören, sondern sich tiefer in die Materie einzuarbeiten. In diesem Kapitel haben Sie erlernt, welche Wege es gibt, Ihr Flash-Wissen zu vermehren. Beschäftigen Sie sich mit den Beispiel-Dateien, die in Flash enthalten sind. Setzen Sie sich kleine Ziele und versuchen Sie nicht, eine ganze Flash-Anwendung zu verstehen, sondern nur einzelne Bestandteile dieser. Das Wissen, wie man Probleme erkennt und löst, ist viel wichtiger, als unzählige Versuche zu starten, ein Problem mittels Probierens zu lösen. Sie haben außerdem den Debugger als Werkzeug kennen gelernt, um den Status Ihres Films und aller darin enthaltenen Variablen zu überprüfen.

B2.6 Workshop F&A F

Ich habe den gesamten Inhalt einer Flash-Beispiel-Datei in meine eigene Datei kopiert – leider funktioniert sie nicht. Was könnte nicht stimmen? A

F

Meistens liegt es daran, dass Sie nicht alle Attribute der Originalanwendung kopiert haben. Vor allem scheint es wohl daran zu haken, dass der Beispielfilm Daten von einer Datenbank empfängt und auch dahin sendet, zu der Sie in Ihrem Film jedoch keine Verbindung haben. Oder der Film versucht einen Ladefilm zu laden, der nicht existiert. Schauen Sie sich den Code einmal genau an und versuchen Sie den Standort der verschiedenen Komponenten herauszufinden.

Wenn ich eine Gesamtaufgabe in kleine Schritte aufteile, ist es dabei wirklich notwendig, diese so klein zu halten? A

Je kleiner, desto besser! Denken Sie immer daran, dass Sie als Mensch immer nur eine Sache erledigen können. Auch große Projekte müssen Sie Schritt für Schritt durchführen. Je kleiner die Schritte dabei sind, desto strukturierter und letztlich erfolgreicher wird Ihre Arbeit. Auch ein Marathonläufer kann nicht zehn Schritte auf einmal machen – auch er kommt nur Schritt für Schritt zum Ziel.

469

Die Flashkenntnisse vertiefen

Quiz Auch hier finden Sie wieder Fragen, die Ihnen helfen sollen, das erworbene Wissen zu vertiefen. 1. Um sicherzustellen, dass keinerlei Fehler in Ihrem Film existieren, sollten Sie immer den Debugger zu Rate ziehen, bevor Sie die Seite veröffentlichen. a.

Das ist falsch. Sie müssen den Debugger nach jeder Änderung des Films benutzen, um Fehler zu vermeiden.

b. Das ist richtig. Solange Sie keinerlei Änderungen nach dem Debugger-Lauf machen, ist Ihr Film frei von Fehlern. c. Das ist falsch. Der Debugger schützt vor keinerlei Fehlern. Mit ihm lassen sich nur Eigenschaften und Variablen betrachten. 2. Es ist empfehlenswert, im Rahmen eines Projektes immer nur eine Aufgabe durchzuführen, um den Erfolg der Arbeit besser überprüfen zu können. a.

Das ist richtig. Es gibt natürlich noch andere Gründe, aber prinzipiell sollte man immer erst einen ganz bestimmten Teil des Gesamtprojektes daraufhin überprüfen, ob er auch richtig funktioniert.

b. Das ist falsch. Die Arbeit an einem Teil der Gesamtaufgabe zu einem bestimmten Zeitpunkt macht die entsprechende Datei wesentlich kleiner in Ihrem Umfang, und das ist der einzige Grund, weshalb auf die Art und Weise zu arbeiten ist. c. Das ist richtig. Obwohl dies nur ein Grund ist, liegt der Hauptgrund dieser Vorgehensweise in der Tatsache begründet, dass der Flash-Film beim Endanwender wesentlich schneller abläuft. 3. Das Debugging einer Flash-Anwendung, die online ist, stellt eine gute Möglichkeit dar, seine Flash-Fähigkeiten zu vertiefen. a.

Das könnte sein, aber nur jene Dateien sind mit dem Debugger online anzuschauen, bei denen das der Programmierer auch gestattet hat.

b. Das ist falsch. Es ist illegal, per Debugger in fremder Leute Flash-Site zu schnüffeln. c. Das ist richtig. Das erste, was Sie tun sollten, ist, festzustellen, wie Sie durch anderer Leute Dateien stöbern können.

470

Workshop

Übung Im Folgenden ist ein besserer Weg aufgezeigt, wie ein Film einer Mausbewegung folgt. Fügen Sie im ersten Bild Ihrer Filmsequenz eine Mouse-hide-Aktion ein. Diese Aktion verbirgt den Mauszeiger des Anwenders. Erstellen Sie eine Filmsequenz, die als neuer Cursor agieren soll. Wählen Sie die Filmsequenz aus und öffnen Sie das Bedienfeld AKTION. Markieren Sie nun eine evaluate-Aktion und geben Sie das Argument _x=_root._xmouse ein. Fügen Sie im Anschluss daran eine weitere evaluate-Aktion mit der Bezeichnung _y=_root._ymouse ein. Testen Sie den Film und Sie werden feststellen, dass das Ganze etwas ruckelig abläuft. Dieses Problem können Sie lösen, ohne die Frame-Rate zu erhöhen. Behalten Sie die aktuell eingestellte Frame-Rate von 12 bei. Kehren Sie zu den Aktionen zurück und fügen Sie am Ende eine weitere evaluate-Aktion mit dem Argument updateAfterEvent() hinzu. Diese Aktion erneuert den Bildschirminhalt, wenn sie aufgerufen wird.

471

Die Flash-Anwendung publizieren

3

Die Flash-Anwendung publizieren

Der letzte Schritt einer Flash-Produktion ist immer das Veröffentlichen, sodass sich die Internetgemeinde an Ihren Flash-Arbeiten erfreuen kann. In Kapitel 18 haben Sie bereits die Grundlagen kennen gelernt, die eine Veröffentlichung im Internet betreffen. Es gibt jedoch noch eine ganze Menge mehr, was Sie beachten müssen, wenn Sie an die Öffentlichkeit treten. Zusätzlich zum Export einer Flash-Datei in eine HTML-Seite haben Sie die Möglichkeit, unterschiedliche Medientypen in die verschiedenen Media-Player zu exportieren (RealPlayer, QuickTime etc.). Zudem gibt es unterschiedliche Formate wie etwa GIF oder JPG, die ebenfalls diskussionswürdig sind. In diesem Kapitel erlernen Sie das Folgende: 쐽

Sie erfahren alles über die Einstellungen, die notwendig sind, um eine Anwendung zu publizieren.

쐽

Sie benutzen Templates, um verschiedene Versionen des ursprünglichen Datenformats zu veröffentlichen.

쐽

Sie lernen, wie benannte Anker bei der Navigation durch Filme helfen.

쐽

Sie werden unterschiedliche Medientypen wie etwa QuickTime-Video benutzen.

B3.1 Wie publiziert man eine Seite? Wie Sie sich vielleicht noch aus Kapitel 18 erinnern können, kann man auf relativ einfache Weise einen Publizierungsvorgang starten. Wählen Sie einfach aus dem Menü DATEI den Eintrag VERÖFFENTLICHEN. Die Praxis sieht jedoch ein wenig anders aus. Sie sollten zuerst Ihre Dateien sichern und dann Schritt für Schritt durch alle Veröffentlichungsprozesse gehen. Im Folgenden lernen Sie ein Szenario kennen, mit dem Sie eine Datei publizieren können.

Übung: Setzen Sie die Publizierungseinstellungen und veröffentlichen Sie anschließend einen Film 1. Öffnen Sie einen Film, den Sie bereits erstellt haben, oder kreieren Sie auf die Schnelle eine neue Animation. Stellen Sie sicher, dass sich auf dem Bildschirm auch etwas tut – vielleicht ist noch ein Tween notwendig, um etwas Leben auf die Bühne zu bringen. 2. Wählen Sie aus dem Menü DATEI den Menüeintrag SPEICHERN UNTER und speichern Sie den Film in einem neuen Ordner, der keinerlei Daten enthält.

474

Wie publiziert man eine Seite?

3. Begeben Sie sich dann zum Menü DATEI und klicken Sie auf den Menüeintrag EINSTELLUNGEN FÜR VERÖFFENTLICHUNGEN. Sämtliche Änderungen, die Sie im Dialogfenster Einstellungen für Veröffentlichungen vornehmen, werden mit der Datei abgespeichert. 4. Klicken Sie auf die Registerkarte FORMATE. Hier können Sie jene Formate definieren, in welche die Datei exportiert werden kann. Für jedes Format, das Sie auswählen, erscheint eine zusätzliche Registerkarte mit der entsprechenden Bezeichnung (siehe Abbildung B3.1). Die Optionen werden Sie im Rahmen dieses Kapitels noch eingehender kennen lernen. Zum jetzigen Zeitpunkt wählen Sie bitte Flash, HTML und GIF. Da das Kontrollkästchen Standardnamen verwenden aktiviert ist, haben sämtliche Dateien denselben Namen. Nur die Dateiendung variiert. Sie können die Dateinamen ändern. Für unsere Zwecke ist es jedoch erst einmal besser, auf die Standardbezeichnungen zurückzugreifen.

Abbildung B3.1: Die Registerkarte Format gestattet die Einstellung des entsprechenden Exportformates.

5. Klicken Sie auf die Registerkarte FLASH, um diese in den Vordergrund zu holen. Werfen Sie einmal einen kurzen Blick auf das Pull-down-Fenster mit der Bezeichnung Version. Welche Einstellung Sie an dieser Stelle vornehmen, ist Ihre subjektive Entscheidung. Im Rahmen unserer Übungsaufgabe stellen wir uns einfach vor, dass Ihr Film für einen Anwender funktionieren soll, der in seinem Browser ein Flash 4-PlugIn hat – oder aber auch eine spätere Version. Ändern Sie die Version in Flash 4, wie aus Abbildung B3.2 ersichtlich.

475

Die Flash-Anwendung publizieren

Abbildung B3.2: Sie können sicherstellen, dass auch ältere Flash Player den Film abspielen können, wenn Sie die entsprechende Version einstellen.

6. Aktivieren Sie die Registerkarte HTML. Hier treffen Sie Einstellungen zum HTMLCode, den Flash erstellt. Wählen Sie aus der Drop-down-Liste Vorlage den Eintrag Erkennen für Flash 4. Diese Einstellung gewährleistet, dass der Flash-Film nur gespielt wird, wenn der Endanwender auch den Flash 4 Player installiert hat. Ist dies nicht der Fall, sieht er lediglich eine GIF-Version des Films. Sie können Ihre eigenen Vorlagen erstellen, wie Sie später erfahren werden. 7. Wählen Sie im Auswahlfeld GRÖßE den Eintrag Prozent aus und geben Sie unter Höhe und Breite jeweils 100 ein. Sie haben jederzeit die Möglichkeit, diese Änderungen neu zu definieren. Stellen Sie anschließend sicher, dass die Kontrollfelder Wiederholung und Menü anzeigen aktiviert sind. 8. Klicken Sie nun auf die Registerkarte mit der Bezeichnung GIF, um die Einstellungen GIFs betreffend tätigen zu können. Hier gibt es einige wenige Dinge, die Ihrer Aufmerksamkeit nicht entfallen dürfen. So darf z.B. das GIF, welches Flash exportieren soll, nur eine bestimmte Auflösung besitzen, da GIFs nicht in dem Maße skalieren, wie es Flash tut. Wollen Sie etwa ein animiertes GIF exportieren, wählen Sie auf dieser Registerkarte ANIMIERT aus. Der Rest aller verfügbarer Optionen bezieht sich mehr oder weniger darauf, wie das Bild erstellt wurde und spielt erst einmal eine untergeordnete Rolle. GIFs haben meistens 256 Farben und in wenigen Fällen ein paar mehr. Flash weiß genau, wie es mit der Farbpalette von GIFs umgehen muss. Jede Option, die Sie auf dieser Registerkarte einstellen können, hat ein bestimmtes Ereignis zur Folge. Dieses resultiert vor allem aus der Natur der entsprechenden Grafik – mit all seinen Vor- und Nachteilen.

476

Wie publiziert man eine Seite?

9. Nun da Sie schon einmal mit allen Registerkarten Bekanntschaft geschlossen haben (für die Formate, die Sie selektiert haben), klicken Sie abschließend auf OK. Wählen Sie nun aus dem Menü DATEI den Menüeintrag VERÖFFENTLICHEN. Es sieht so aus, als würde nichts passieren, es wurden jedoch alle entsprechenden Dateien in den Export-Ordner kopiert, wohin Sie auch den ursprünglichen Film kopiert haben. Öffnen Sie den Ordner und führen Sie einen Doppelklick auf die HTML-Datei aus. Wenn Sie über einen Flash 4-Plug-In für Ihren Browser verfügen, sollten Sie den Flash-Film auch starten können. Wenn Sie Flash MX benutzen und trotzdem im Flash 4-Format exportieren wollen, denken Sie bitte daran, die Einstellungen für Veröffentlichungen zu verändern, bevor Sie mit dem Export bzw. der Veröffentlichung beginnen. In diesem Fall werden alle Flash MX-Features in gelber Schrift dargestellt (siehe Abbildung B3.3). Somit können Sie schnell erkennen, welche Features Sie meiden sollten, da der Endanwender sie nicht anschauen und benutzen kann.

Abbildung B3.3: Haben Sie sich entschieden, eine ältere Flash-Version zu exportieren, werden alle nicht verfügbaren Aktionen gelb dargestellt.

Sie sehen bereits an dieser Stelle, dass es eine Menge Arbeit ist, Schritt für Schritt jedes Detail zu berücksichtigen, ob und wie es publiziert werden soll. Noch eines am Rande: Der Menüeintrag VORSCHAU FÜR VERÖFFENTLICHUNGEN aus dem Menü DATEI hat das gleiche Resultat zur Folge wie der Menüeintrag VERÖFFENTLICHEN – mit der Ausnahme, dass kein Exportvorgang stattfindet.

477

Die Flash-Anwendung publizieren

In der vorangegangenen Übung sind Sie Schritt für Schritt durch jede einzelne Registerkarte gegangen und haben dort die Änderungen vorgenommen, die notwendig waren. Das ist die typische Vorgehensweise. Hinter der Übung, die Sie soeben durchgeführt haben, verbergen sich einige interessante Dinge, die wir einmal etwas genauer unter die Lupe nehmen wollen. Das Template Erkennen für Flash 4 erstellt eine ziemlich komplizierte HTML-Seite. Hat der Endanwender einen Flash 4 Player in seinem Webbrowser integriert, kann er den Flash-Film ohne Probleme sehen. Hat er diesen nicht, sieht er lediglich eine GIF-Grafik. Öffnen Sie das HTML-Dokument in einem Texteditor, finden Sie eine Zeile vor, die var MM_contentVersion=4 lautet. Sie können simulieren, was Anwender ohne das entsprechende Flash Plug In sehen, wenn Sie beide Zahlen von 4 in 7 ändern. Sie setzen damit die Einstellungen für Flash 7, das es ja noch nicht gibt und demnach im Browser auch nicht angeschaut werden kann. Sie werden dann in Ihrem Browser ebenfalls das entsprechende GIF sehen. Obwohl Sie sehen, wie ein Anwender eine Flash-Anwendung ohne ein entsprechendes Plug-In sieht, handelt es sich dabei nur um eine Simulation. Eigentlich müssten Sie den Flash Player deinstallieren, um nachzuspielen, welche Erfahrungen der Anwender ohne ein entsprechendes Plug-In macht. Wichtig ist an dieser Stelle die Tatsache, dass es Templates gibt, die den Flash Player automatisch installieren. Überprüfen Sie zuerst die korrekte Deinstallation des Players! Weiterhin ist vorstellbar, die GIF-Grafik mit einem Hyperlink zu versehen. Fügen Sie dazu eine neue Schaltfläche innerhalb einer neuen Ebene des Filmes ein und weisen Sie der neuen Schaltfläche die getURL-Aktion hinzu. Wenn der Anwender nun auf die Grafik stößt, weil er keinen geeigneten Flash Player hat, kann er das GIF anwählen und eine Aktion ausführen, die Sie ebenfalls definieren können.

Übung: Gestalten Sie ein Template individuell 1. Zuerst sollten Sie herausfinden, wo bei Ihrem System der Konfigurationsordner liegt. Im CONFIGURATION-Ordner Ihrer Flash-Installation finden Sie eine Datei namens Configuration_ReadMe.htm, die weitere Hinweise enthält. (Auf meinem Windows-XPSystem finde ich den Ordner unter C:\Dokumente und Einstellungen\Phillip\Anwendungsdateien\Macromedia\Flash MX\Configuration\) 2. Erstellen Sie einen Film, der eine Animation einer Filmsequenz-Instanz beinhaltet (ein Kasten, der sich von der linken oberen Ecke der Bühne zur unteren linken Ecke bewegt). Benutzen Sie das Bedienfeld AUSRICHTEN, um den Kasten in beiden Frames am unteren Rand der Bühne zu positionieren.

478

Benannte Bildanker verwenden

3. Wählen Sie nun aus dem Menü DATEI den Menüeintrag EINSTELLUNGEN FÜR VERÖFFENTLICHUNGEN und aktivieren Sie die Kontrollkästchen für HTML und Flash. Klicken Sie auf der Registerkarte HTML auf die Vorlage Nur Flash. Führen Sie abschließend einen Mausklick auf OK aus. 4. Betätigen Sie dann (Strg)+(F12), um eine Vorschau für Veröffentlichungen zu erhalten. Vielleicht haben Sie bemerkt, dass der Kasten nicht den unteren linken Rand des Fensters erreicht. 5. Schließen Sie den Browser. Speichern Sie den Film und schließen Sie Flash. Auf Ihrer Festplatte finden Sie unterhalb des eben gesuchten Flash MX-KonfigurationsOrdners ein Unterverzeichnis mit der Bezeichnung HTML. Erstellen Sie hier eine Kopie der Datei Default.html. 6. Benennen Sie nun die Kopie dieser Datei in meinDefault.html um und öffnen Sie diese in Notepad von Windows. 7. Sie müssen die erste Zeile des Programmcodes von $TTNur Flash in $TTKein Rand ändern. Diese Änderung bewirkt das Umbenennen des Templates in Kein Rand. 8. Gehen Sie nun zur elften Zeile und ändern Sie die Zeile von in . Diese Änderung bewirkt, dass alle Ränder zur Größe von 0 Bildpunkten

geändert werden. 9. Speichern und schließen Sie die Datei. Starten Sie Flash und öffnen Sie den Film, welchen Sie gerade erstellt haben. 10. Wählen Sie auf der Registerkarte die Vorlage aus, die wir soeben erstellt haben (Kein Rand). Klicken Sie auf OK. 11. Betätigen Sie (Strg)+(F12). Sie sehen eine Voransicht des Films, wie Sie sein sollte.

B3.2 Benannte Bildanker verwenden In Flash MX gibt es eine neue Funktion: Benannte Anker. Passend dazu wurde auch das Template Flash mit benannten Ankern eingefügt. Damit wird eine Schwachstelle der alten Flash-Versionen ausgebügelt, da man dort bei einem Klick auf den Zurück-Knopf des Browsers ganz aus dem Flash-Film auf die zuvor betrachtete HTML-Seite gebracht wurde. Dieses Problem gibt es nun nicht mehr (na ja ... zumindest bei 90% der Browser nicht). Wenn Sie HTML kennen, sind Sie sicher schon auf Anker gestoßen, die eine bestimmte Stelle auf einer Seite markieren (zum Beispiel ). Diese kann man mit einem Link (Zur Seitenmitte) anspringen. So ähnlich geht das auch in Flash. Schauen wir uns das genauer an:

479

Die Flash-Anwendung publizieren

Übung: Verwenden Sie benannte Bildanker, um den Zurück-Knopf und Favoriten im Browser verwenden zu können Hier lernen Sie, wie man in Flash solche benannten Anker setzt, die wie in Flash funktionieren: 1. Erstellen Sie in einer neuen Datei Schlüsselbilder an den Positionen 5, 10 und 15. Gehen Sie zu Bild 5 und zeichnen Sie eine rote Form auf die Bühne. Zeichnen Sie danach in Bild 10 etwas in grün. Danach können Sie in Bild 15 etwas blaues auf der Bühne platzieren. Stellen Sie sich jede Farbe als unterschiedlichen Abschnitt Ihres Flash-Filmes vor. 2. Benennen Sie nacheinander jedes dieser Schlüsselbilder über das Eigenschaften-Bedienfeld in rot, grün und blau. Aktivieren Sie nun in jedem der drei Schlüsselbilder die Option Benannter Anker (siehe Abbildung B3.4).

Abbildung B3.4: Verwenden Sie das Eigenschaften-Bedienfeld, um benannte Anker einzufügen.

3. Erstellen Sie eine neue Ebene (die schon 15 Bilder lang sein sollte) und zeichnen Sie darin ein Rechteck, das später eine Schaltfläche werden soll. Konvertieren Sie es also in ein Schaltflächen-Symbol. Erstellen Sie zwei weitere Kopien der Schaltfläche und positionieren Sie diese in der selben Ebene. 4. Fügen Sie in jede Schaltfläche eine goto-Aktion ein, die automatisch in einem MausEreignis verpackt wird. Modifizieren Sie die Aktion so, dass sie gotoAndStop() heißt, indem Sie das im Optionsbereich einstellen. Stellen Sie nun den TYP von Bildnummer auf Bildmarkierung. Nun ordnen Sie jedem Knopf ein anderes Ziel (rot, grün und blau) zu.

480

Die Frage nach dem Medientyp

5. Fügen Sie abschließend im ersten Bild eine stop-Aktion ein. Nun kann der Anwender mit den 3 Schaltflächen die unterschiedlichen Filmteile anspringen. 6. Nutzen Sie jetzt die Vorteile der benannten Anker und veröffentlichen Sie den Film mit dem HTML-Template Flash mit benannten Ankern. Nun können Sie immer, wenn Sie irgendwohin gesprungen sind, über den Zurück-Knopf des Browsers zur vorherigen Stelle in Flash springen. Beachten Sie auch, dass die Adresszeile des Browsers wechselt. Auf diese Weise kann ein Anwender sogar eine bestimmte Stelle in Ihrem Flash-Film als Favorit ablegen. Außerdem können Sie von irgendeiner anderen Seite auf eine bestimmte Stelle mitten in Ihrem Film verlinken. Leider funktioniert das nicht in allen Browsern (zum Beispiel nicht in Netscape 6 und in manchen Macintosh-Internet-Explorern).

B3.3 Die Frage nach dem Medientyp Der Vergleich der verschiedenen Medientypen auf der Registerkarte Formate des Bedienfeldes Einstellungen für Veröffentlichungen ist eigentlich unmöglich – Sie würden Äpfel mit Birnen vergleichen. Sie können sowohl eine JPG-Grafik als auch einen QuickTimeFilm exportieren, wobei es sich beim ersten um ein statisches Bild und beim zweiten um ein digitales Video handelt. Aus diesem Grund fällt ein Vergleich sämtlicher Medienformate sehr schwer – sie sind alle zu unterschiedlich. Lediglich JPG und PNG könnte man vergleichen, da es sich bei beiden um statische Bildformate handelt. Wir betrachten sie einzeln.

Flash (.swf) Diesem Format werden Sie bei Ihrer Arbeit mit Flash stets über den Weg laufen. Sie finden einige interessante Optionen auf der Registerkarte FLASH (siehe Abbildung B3.5). Hinter der Option Ladereihenfolge verbirgt sich die Reihenfolge, in der die Ebenen des Flash-Films während eines Downloads erscheinen. Wenn Sie den Eintrag Nach unten aktivieren wählen, werden die untersten Ebenen für den Anwender zuerst während des Downloads sichtbar. Das Kontrollfeld Größenbericht erstellen exportiert bei Aktivierung eine Text-Datei, welche dieselben Informationen enthält, die Sie bereits im Kapitel 20 beim Bandbreiten-Profiler kennen gelernt haben. Wenn Sie einen Film testen, sollten Sie das Kontrollkästchen Trace-Aktionen übergehen deaktivieren, damit Sie das Pop-up-Fenster erhalten, in dem Sie alle Aktionen einsehen können. Das Fenster erscheint nur innerhalb von Flash und nicht im Browser des Endanwenders. Vor Import schützen verhindert, dass Anwender die .swf-Datei in ihre eigenen Flash-Dateien laden können. Es wird nur wenige

481

Die Flash-Anwendung publizieren

Anwender geben, die eine Flash-Anwendung Bild für Bild lokal anschauen, da dies eine Menge Arbeit mit sich bringt. Zudem kann der entsprechende Anwender nicht das ActionScript herunterladen und somit mit dem Flash-Film fast nichts anfangen.

Abbildung B3.5: Die Registerkarte FLASH enthält alle Exportoptionen zum Veröffentlichen eines Flash-Films.

Die voreingestellte Kompressionsrate für Rastergrafiken und Audio-Dateien (wie in Kapitel 20 besprochen) kann ebenfalls editiert werden. Sehr wichtig ist die Frage, in welcher Flash-Version Sie Ihren Film veröffentlichen wollen. Diese Entscheidung sollten Sie schon sehr früh treffen. Entsprechende Einstellungen tätigen Sie unter Version. Sie können Ihre Arbeit mit Flash MX so exportieren, dass Sie auch in einem Flash 5-Player abgespielt werden kann. Seien Sie sich jedoch bewusst, dass einige neue Flash MX-Features dann allerdings nicht zur Verfügung stehen. Verzichten Sie auf die Features, steht einem Abspielvorgang in einem Flash 5 Player nichts im Wege. Haben Sie sich für Flash 5 entschieden, sollten Sie den Film vorab auf einem Flash 5-Player ausgiebig testen. Eine Liste aller nicht unterstützten Funktionen wird gelb dargestellt (siehe Abbildung B3.3).

HTML Obwohl wir die Registerkarte HTML schon mehrfach besprochen haben, finden Sie hier einige zusätzliche Einstellungsmöglichkeiten, von denen Sie profitieren können (siehe Abbildung C.6). Sämtliche Einstellungen innerhalb dieser Registerkarte beziehen sich nur auf die HTML-Datei und nicht auf Flash. Sie können die HTML-Datei in jedem beliebigen Texteditor öffnen und entsprechende Änderungen vornehmen.

482

Die Frage nach dem Medientyp

Abbildung B3.6: Die Registerkarte HTML beinhaltet Einstellungsmöglichkeiten, die nur die HTML-Datei betreffen.

Im Normalfall kann der Anwender einen rechten Mausklick auf den Flash-Film ausführen, um ein Kontextmenü zu erhalten, wie es in Abbildung B3.7 zu sehen ist. Eine minimierte Version dieses Menüs ist verfügbar, wenn Sie das Kontrollkästchen Menü anzeigen deaktivieren. Das Menü wurde nicht entfernt, Flash hat es nur verkleinert. Debugger ist dabei nur bei jenen Anwendern aktiv, die Flash installiert haben.

Abbildung B3.7: Die reduzierte Version des Kontextmenüs zu einem Flash-Film

483

Die Flash-Anwendung publizieren

Das Kontrollkästchen Geräteschriftart sorgt bei Aktivierung dafür, dass bestimmte Schriftarten auf den gesamten Flash-Film angewandt werden. In der Praxis bedeutet dies, das Flash den Standard-Font des Anwenders benutzt und nicht den im Flash-Film definierten. Dies hat den Vorteil, dass die Flash-Datei sehr viel kleiner ausfällt. Für größere Texte kann diese Option jedoch nicht immer die qualitativ beste Möglichkeit darstellen (siehe Abbildung B3.8). Für kleinere Texte ist diese Option sinnvoll und hilfreich. In Abbildung C.8 sehen Sie einen kleinen Text, bei dem diese Option nicht aktiviert ist. Sie können diese Option individuell für einzelne Textblöcke setzen.

Abbildung B3.8: Für größere Schriftarten ist die Option Geräteschriftart nicht zu empfehlen.

Unter Windows können Flash-Filme mittels des Internet Explorers ab der Version 4 angeschaut werden. Obwohl diesen Browser viele Anwender einsetzen, gibt es auch Anwender anderer Betriebssysteme und Browser. Damit auch diese in den Genuss von Flash kommen, können Sie unter Fenstermodus die beiden Optionen Undurchsichtig ohne Fenster und Durchsichtig ohne Fenster aktivieren. Spielen Sie ein bisschen mit diesen Optionen, um ein Gefühl dafür zu bekommen. Zu guter Letzt bleibt noch das Kontrollkästchen Warnmeldungen anzeigen übrig. Dieses sollten Sie stets aktivieren, da es mittels Fehlermeldungen Inkompatibilitäten aufzeigt.

GIF, JPG und PNG Mit Ausnahme von GIF handelt es sich bei allen in Flash integrierten Grafikformaten um statische Bildformate. Alle drei Grafikformate haben ihre eigenen Eigenschaften. GIF verfügt im Allgemeinen über 256 Farben und ist für die meisten geometrischen Figuren sehr gut geeignet. JPG findet vor allem Einsatz, wenn es sich um fotorealistische Bilder mit einer hohen Farbanzahl handelt. Zudem verfügt JPG über sehr gute Komprimierungsmechanismen, ohne dabei allzu viel Qualitätsverlust zu erzeugen. PNG ist ein qualitativ sehr hochwertiges Format, das eine ganze Reihe zusätzlicher Informationen beinhaltet. PNG ist jedoch kein Web-Standard. Trotzdem ist PNG eine gute Wahl – erwarten Sie jedoch keine niedrige Dateigröße.

484

Die Frage nach dem Medientyp

Abbildung B3.9: Wenn man ein Bild mit #static bezeichnet, wird Flash dieses Bild (anstelle von Bild 1) dazu verwenden, um ein statisches Bild abzuspeichern.

PNG ist ein gutes Format, wenn es um große Dateien geht. Leider unterstützen Browser diesen Grafiktyp nicht wirklich. Trotzdem wartet dieses Format mit einigen Vorteilen auf. Sie können natürlich PNG-Dateien importieren, wie Sie dies bereits in Kapitel 3 kennen gelernt haben. Hier aber sprechen wir über den Export von Daten und das ist ein anderer Sachverhalt. Wollen Sie die höchste Grafikqualität exportieren, müssen Sie PNG wählen – eine andere Wahl haben Sie nicht. Dafür gibt es mehrere Gründe. So verfügen GIFs, die exportiert werden sollen, über umfangreiche Optionen, auf die der Anwender zurückgreifen und Einstellungen treffen kann. Haben Sie Veränderungen an einem GIF vorgenommen, müssen Sie dieses erst einmal publizieren, um die Veränderungen sehen zu können – eine unter Umständen relativ mühsame Methode, wenn sich Fehler eingeschlichen haben. Dann müssen Sie immer wieder von vorn beginnen (Grafik erstellen, publizieren, anschauen). Mit Macromedia Fireworks etwa können Sie die Ausgabeoptionen während der Darstellung ändern – Flash bietet diese Möglichkeit nicht. Es gibt jedoch dazu einen kleinen Trick: Exportieren Sie das GIF in Form einer 24-Bit-PNG-Datei (siehe Abbildung B3.11). Öffnen Sie dann das entsprechende PNG-Bild in einem anderen Grafikprogramm und exportieren Sie es anschließend wieder als GIF-Datei. Nur GIF besitzt die Option mit der Bezeichnung Animiert (siehe Abbildung B3.12). Sie haben mehrere Optionen, wenn es darum geht, ein animiertes GIF zu erstellen. Die meisten erklären sich von selbst. Diese Option trifft nur für die Bilder zu, denen Sie diese Eigenschaften auch zuweisen – dabei ist nicht der ganze Film betroffen. Weisen Sie etwa dem ersten und dem letzten Bild diese Option zu, wird Flash lediglich das erste und das letzte Bild Ihres Filmes benutzen. Um dies zu korrigieren, müssen Sie das Bild, welches Sie zuerst benutzen wollen mit der Bezeichnung #first und das letzte mit #last versehen.

485

Die Flash-Anwendung publizieren

Abbildung B3.10: Mit Fireworks kann man statische Grafiken (wie zum Beispiel GIFs) viel besser als mit Flash erstellen.

Abbildung B3.11: Der Export einer PNG-Datei bietet Ihnen eine wesentlich bessere Qualität als GIFs.

486

Die Frage nach dem Medientyp

Abbildung B3.12: GIF verfügt über die Option Animiert, um diese Grafik im Rahmen einer Image-Map zu verwenden.

Windows- und Macintosh-Projektor Um eine Flash-Datei abspielen zu können, benötigt der Anwender einen Flash Player. Im Rahmen der Installation des Flash-Programms wird auch der Flash Player installiert. Indem Sie einen Doppelklick auf eine Flash-Datei ausführen, starten Sie ihn. Der Anwender vor seinem Rechner zu Hause jedoch muss den Flash Player separat installieren, wenn er mit seinem Browser Flash-Filme abspielen will. Eine andere Alternative stellt der Projektor dar. Stellen Sie sich einen Projektor als eine Art modifizierten Flash Player vor, der jedoch nur in der Lage ist, einen Flash-Film abzuspielen, ohne den Flash Player zu benötigen. Der Anwender benötigt dann keinen Flash Player, sondern kann die entsprechende Flash-Datei auch ohne Player anschauen. Starten Sie dazu den Flash Player und öffnen Sie einen Flash-Film. Rufen Sie dann aus dem Menü DATEI den Menüeintrag PROJEKTOR ERSTELLEN auf. Geben Sie der Datei einen Namen und speichern Sie diese ab. Das ist alles. Der Flash Player generiert eine selbst ablaufende .exe-Datei, die sehr viel größer ist als der Originalfilm. Dies ist logisch, da noch zusätzliche Routinen zum Abspielen benötigt werden – bei der Zielperson fehlt ja ein Flash Player. Der Projektor läuft nur auf der Plattform (Windows oder Macintosh), auf der er erstellt wurde. Um einen Projektor für eine Plattform zu erstellen, über die Sie im Moment nicht verfügen und die nur die Zielperson hat, müssen Sie lediglich die entsprechenden Kontrollkästchen auf der Registerkarte Formate von Einstellungen für Veröffentlichungen markieren (siehe Abbildung B3.13).

487

Die Flash-Anwendung publizieren

Abbildung B3.13: Projektoren sind für Windows- und Macintosh-Plattformen verfügbar.

Abbildung B3.14: Die Aktion fscommand beinhaltet viele Optionen, die den Projektor betreffen.

Projektoren verwandeln Flash-Anwendungen in selbst ablaufende Demonstrationen. Sie können somit einem Publikum Präsentationen auf Flash-Basis vorführen und Flash dazu verwenden, Dias zu erstellen. Natürlich können Sie alle Funktionen und Aktionen Ihrem Projektor

488

Die Frage nach dem Medientyp

hinzufügen, wie Sie es auch aus Flash gewohnt sind. Sehr gut dafür geeignet ist die Aktion fscommand. Die dafür bereitgestellten Parameter beinhalten zum Beispiel die Darstellung im Vollbildmodus. Es gibt jedoch noch eine Vielzahl weiterer Parameter (siehe Abbildung C.14). So können Sie beispielsweise eine Aktion fscommand("fullscreen","true") beim ersten Bild erstellen, damit der Projektor den ganzen Bildschirm nutzt. Im letzten Bild können Sie dann eine Schaltfläche platzieren – fscommand("quit") – um einen Ausgang zu markieren. Unter Verwendung des Projektors können Sie auch komplette, komplexe Websites auf CD brennen, um diese als Arbeitsproben Kunden zuzusenden.

QuickTime Die Option Quicktime auf der Registerkarte Einstellungen für Veröffentlichungen ist von großer Bedeutung. Sie können einen Flash-Film mit einer speziellen Flash-Spur erstellen, die Schaltflächen und Goto-Aktionen enthält, damit der Anwender zu einer ganz speziellen Stelle des Films springen kann. Aber auch hier gibt es Grenzen. QuickTime 4 unterstützt nur die Flash-Spur von Version 3. QuickTime 5 wird aber auf jeden Fall Flash 4 in dieser Hinsicht unterstützen. Es ist relativ einfach, einen QuickTime-Film zu einer interaktiven Ebene von Flash zu machen. Importieren Sie zuerst das Video und weisen Sie ihm einen Platz in der Zeitlinie zu, indem Sie entsprechende Bilder einfügen. Erstellen Sie eine einfache Stop- und eine Play-Aktion. Veröffentlichen Sie dann das Video (stellen Sie sicher, dass Sie die Option Quicktime aktiviert haben). Wie aus Abbildung B3.15 ersichtlich, gibt es noch weitere Einstellungsmöglichkeiten.

Abbildung B3.15: Die Registerkarte Quicktime

489

Die Flash-Anwendung publizieren

B3.4 Der Export anderer Medientypen Erstaunlicherweise ist Flash in der Lage, wesentlich mehr Medientypen zu exportieren, als in Einstellungen für Veröffentlichungen verfügbar sind. Wählen Sie doch einfach mal DATEI / FILM EXPORTIEREN und Sie werden bei Dateityp eine Liste sehen, die erstaunlich lang ist (siehe Abbildung B3.16).

Abbildung B3.16: Neben den Exportformaten der Registerkarte Flash gibt es noch weitere unter dem Menü FILM EXPORTIEREN und Dateityp.

In diesem Kapitel lernen Sie zwei Formate kennen, die ebenfalls von großer Bedeutung sind.

AVI AVI ist ein anderes digitales Videoformat. Obwohl QuickTime gegenüber AVI große Vorteile hat, so ist es doch manchmal notwendig, einen Film im AVI-Format zu exportieren. Einer der Gründe liegt im Kompressionsverfahren, das bei AVI wesentlich ausgefeilter ist.

Bitmap-Sequenzen Eine Bitmap-Sequenz exportiert eine statische BMP-Datei eines jeden Frames Ihres Films. Es sind verschiedene Sequenz-Formate verfügbar, wie aus Abbildung B3.15 ersichtlich ist. Sie sind alle fast gleich bis auf das Format. Der Prozess ist genau der gleiche für jedes For-

490

Zusammenfassung

mat. Wählen Sie immer DATEI / FILM EXPORTIEREN und anschließend das entsprechende Format. Schließen Sie die Aktion mit der Benennung der Datei ab. Der Name, den Sie dabei vergeben, wird aber nur als Präfix verwendet. So wird aus myMovie in Bild 1 myMovie0001.bmp. Haben Sie den Namen ausgewählt, klicken Sie auf die Schaltfläche SPEICHERN. Ist dies geschehen, erscheint ein Dialogfenster mit Details des gewählten Grafikformats. Die Philosophie hinter der Export-Sequenz ist der Import dieser Grafiken in ein anderes Zeichenprogramm, das vielleicht über bessere Grafikmöglichkeiten verfügt als Flash bietet. Beachten Sie dabei jedoch, dass es immer zu Schwierigkeiten besonders im Bereich der Videoformate kommen kann.

B3.5 Zusammenfassung In diesem Kapitel lasen und erlernten Sie mehrere Wege, um Flash-Filme zu exportieren. Zudem lernten Sie Projektoren, statische Bilder, QuickTime-Video und andere Aspekte des Exports von Videodaten kennen. Mittels der Registerkarten des Dialogfensters Einstellungen für Veröffentlichungen bietet Flash eine nützliche Schnittstelle zum Einstellen der Exportoptionen.

B3.6 Workshop F&A F

Ich arbeite mit Leuten zusammen, die über HTML-Erfahrung verfügen. Wir wollen Flash innerhalb einiger sehr komplexer HTML-Seiten integrieren. Müssen die HTMLProgrammierer benutzerdefinierte Templates anlegen? A

Nein, es ist nicht unbedingt notwendig, ein derartiges Template zu erstellen, wenn Sie nicht den massiven Einsatz eines solchen planen. Viel besser ist es, eine .swfDatei zu importieren und in die HTML-Seiten zu integrieren. Die HTML-Programmierer sollten lediglich bei der Erstellung der Seite beachten, schon einmal Schnittstellen zu definieren, um später die Flash-Routine ohne Probleme einbinden zu können. Anstatt das Publizieren zu benutzen (was eine HTML-Datei eventuell überschreiben könnte), benutzen Sie bitte den Menüeintrag FILM EXPORTIEREN aus dem Menü DATEI.

491

Die Flash-Anwendung publizieren

F

Da ich nun weiß, wie ich einen Film publizieren kann – verfüge ich über alles für Flash nötige Wissen? A

Eigentlich nicht. Ich denke, es ist zu früh zu sagen, dass Sie nun alles über Flash wissen. Sie haben jedoch alles erfahren, um sich weiterhin sebst mit Flash beschäftigen zu können. Das Lernen hört niemals auf.

Quiz Da es sich hier um die letzten Fragen handelt, erspare ich Ihnen weitere Worte. 1. Wie lautet das beste Grafikformat für statische Bilder? a.

JPG

b. GIF c. Abhängig vom Verwendungszweck 2. Was geschieht mit Anwendern, die Ihre Flash-Site besuchen, aber über keinen Flash Player verfügen? a.

Der Rechner stürzt ab.

b. Es hängt davon ab, wie HTML die Situation abfängt. c. Der Flash Player wird automatisch installiert, mit einer kurzen Unterbrechung, die durch den Download des Players begründet ist. 3. Sind alle Datenformate, die Flash exportieren kann, innerhalb der Registerkarte Einstellungen für Veröffentlichungen sichtbar? a.

Ja, hier sind alle Exportformate aufgelistet.

b. Nein, Flash ist in der Lage, weitere Dateitypen zu exportieren. c. Nein, Flash ist nicht in der Lage, andere Dateitypen zu exportieren.

492

Figuren mit Auswahl, Andocken und den Ebenen

3

Figuren mit Auswahl, Andocken und den Ebenen

Dieser Anhang zeigt Ihnen, wie Sie verschiedene Figuren zeichnen können, indem Sie nur das Andocken, die Auswahl und die Ebenen zur Hilfe nehmen. Natürlich kann ich hier nur ein paar Beispiele zeigen, um Sie dafür zu sensibilisieren, wie Sie Flash in der Praxis einsetzen können. Die Schritt-Anleitungen sind nicht unbedingt die einzige Lösungsmöglichkeit.

A.1

Halbkreis

1. Stellen Sie sicher, dass Andocken aktiviert ist und zeichnen Sie einen Kreis und eine vertikale Linie, die hier um einiges länger ist als der Kreis.

2. Doppelklicken Sie im Zentrum des Kreises (um sowohl die Linie des Kreises als auch sein Inneres zu selektieren) und ziehen Sie diesen nun mit einem einfachen Klick von der Mitte des Kreises (Sie sollten jetzt einen Ring um Ihren Cursor haben) zur Linie hinüber. Verbinden Sie den Kreis mit der Linie.

494

Halbkreis

3. Ihre Zeichnung sollte nun wie die folgende Darstellung aussehen:

4. Klicken Sie am unteren Ende der vertikalen Linie, um die Linie zu selektieren. Mit den Cursortasten können Sie nun die Größe der Linie verändern. Verkleinern Sie sie ein bisschen.

5. Deselektieren Sie die Linie, indem Sie woanders hinklicken. Mit dem Pfeil-Werkzeug selektieren Sie nun das obere Ende der Linie (bewegen Sie den Cursor in die Nähe der Linie, bis er sich so verändert, dass Sie das Ende der Linie verschieben können). Klicken Sie und beginnen Sie mit dem Verschieben.

6. Docken Sie das Ende nicht an den Kreis an, sondern bringen Sie es zum oberen Ende der oberen Linie.

495

Figuren mit Auswahl, Andocken und den Ebenen

7. Klicken Sie auf einen Halbkreis, um ihn auszuwählen. Löschen Sie nun den ausgefüllten Bereich des Halbkreises.

8. Klicken Sie auf die Linie des vorher gelöschten Halbkreises und entfernen Sie diese.

9. Klicken Sie auf die überstehenden Bereiche der Linie und löschen Sie diese.

496

Speichen in einem Rad

10. Nun haben Sie einen Halbkreis.

A.2

Speichen in einem Rad

1. Befolgen Sie die Schritte für den Halbkreis bis zum Schritt 6, sodass Sie ein Gebilde haben, das wie in folgender Abbildung aussieht.

2. Löschen Sie die gefüllten Bereiche des Kreises und die überstehenden Linien.

497

Figuren mit Auswahl, Andocken und den Ebenen

3. Kopieren Sie die vertikale Linie und fügen Sie diese außerhalb des Kreises ein.

4. Nutzen Sie das Frei-Transformieren-Werkzeug, um die Linie um 90 Grad zu drehen.

5. Deselektieren Sie die Linie, um den Drehvorgang zu beenden. Klicken Sie einmal auf die Mitte der Linie, um sie auszuwählen und verschieben Sie die Linie dann.

498

Speichen in einem Rad

6. Verbinden Sie Ihre neue Linie mit der Mitte der vertikalen Linie.

7. Fügen Sie die Linie erneut ein, um eine weitere vertikale Linie zu halten – rotieren Sie allerdings diesmal nur bis zum ersten Einrasten (was 15 Grad Drehung entspricht). Verschieben Sie diese Linie von ihrem Mittelpunkt in die Mitte des Kreises.

8. Fahren Sie fort, erhöhen Sie die Drehung der Linien jeweils um 15 Grad und verbinden Sie alle Linien mit der Mitte des Kreises, bis er wie in der folgenden Abbildung aussieht.

9. Benutzen Sie (ª) beim Klicken, um alle Linien auszuwählen. Der Kreis sollte nicht selektiert sein.

499

Figuren mit Auswahl, Andocken und den Ebenen

10. Kopieren und ziehen Sie das untere Ende der Linien und fügen Sie diese außerhalb des Kreises ein.

11. Selektieren Sie die Linien und benutzen Sie das Frei-Transformieren-Werkzeug, um sie um 90 Grad zu drehen.

12. Wenn alle Linien wieder ausgewählt sind, können Sie diese mit der Mitte des Kreises verbinden.

500

Fünfeckiger Stern

13. Möchten Sie einen schnellen Weg wissen, wie Sie diese Übung in Sekunden absolvieren können? Zeichnen Sie einfach die erste Speiche in den Kreis und wählen sie aus. Tragen Sie nun im Transformieren-Bedienfeld (gegenbenenfalls mit (Strg)+(T) öffnen) unter Drehen eine 5 ein. Klicken Sie nun mehrfach auf die Schaltfläche Kopieren und Transformierung anwenden, bis das Rad mit Speichen gefüllt ist.

A.3

Fünfeckiger Stern

1. Zeichnen Sie eine perfekte horizontale Linie. Kopieren Sie diese und fügen sie erneut in Ihren Arbeitsbereich ein.

2. Als Erstes werden wir ein Pentagramm erzeugen. Selektieren Sie hierzu die neu eingefügte Linie. Modifizieren Sie diese nun mit dem Menübefehl MODIFIZIEREN / TRANSFORMIEREN / SKALIEREN UND DREHEN. Es sollte sich nun das Fenster Skalieren und

501

Figuren mit Auswahl, Andocken und den Ebenen

drehen öffnen. Hier können Sie die genaue Gradzahl für eine Drehung oder die pro-

zentuale Vergrößerung für das ausgewählte Objekt einstellen. Sie können den Innenwinkel jedes beliebigen Objektes ausrechnen, indem Sie 360 (Grad) durch die Nummer der Linien in dem Objekt dividieren. Im Falle eines Pentagramms (das fünf Seiten hat) würde der Innenwinkel 72 Grad (360 / 5 = 72) betragen. Also drehen wir die Linie auch um 72 Grad.

3. Selektieren Sie die Linie. Nun können Sie das untere Ende der Linie mit dem linken Ende der ersten Linie zusammenfügen.

4. Duplizieren Sie die neue Linie.

,

5. Drehen Sie die Linie um 72 Grad und verbinden sie sie wieder mit dem Ende der vorherigen Linie.

502

Fünfeckiger Stern

6. Wiederholen Sie diesen Vorgang, bis Sie ein Pentagramm haben.

7. Zeichnen Sie eine Linie innerhalb des Pentagramms, das keine andere Linie berührt.

8. Verbinden Sie einen Endpunkt der neuen Linie mit der unteren linken Ecke des Pentagramms.

9. Verbinden Sie nun das andere Ende der neuen Linie mit dem oberen Eckpunkt des Pentagramms.

503

Figuren mit Auswahl, Andocken und den Ebenen

10. Zeichen Sie eine neue Linie im Pentagramm (in der größeren Freifläche) und verbinden Sie diese mit der unteren rechten Ecke und der oberen Ecke des Fünfecks.

11. Nachdem Sie diese Linie verbunden haben, malen Sie eine kleine Linie an dem Platz, der in der unteren Abbildung dargestellt ist, und verbinden Sie einen Endpunkt dieser Linie mit der unteren rechten Ecke des Pentagramms.

12. Ziehen Sie nun in einem Zug den anderen Endpunkt der Linie auf die linke mittlere Ecke des Pentagramms (wenn Sie bei dieser Aktion schrittweise vorgehen, wird die Linie mit der nächsten Linie verbunden, auf die sie stößt).

13. Zeichnen Sie eine weitere Linie an die Stelle, die in der unteren Abbildung gezeigt ist.

504

Fünfeckiger Stern

14. Verbinden Sie die Endpunkte dieser Linie mit der mittleren linken und der mittleren rechten Ecke des Pentagramms. Genau wie im 12. Schritt gilt auch hier: Wenn Sie die Linie abschnittsweise verbinden und stoppen, bevor sie mit einer der Ecken verbunden ist, wird die Linie unterteilt.

15. Zeichnen Sie die letzte Linie wie in der folgenden Abbildung dargestellt.

16. Verbinden Sie die Ecken dieser Linie mit der mittleren rechten und der unteren linken Ecke des Pentagramms.

17. Entfernen Sie nun alle Hilfslinien, bis der Stern so aussieht wie die folgende Abbildung.

505

Figuren mit Auswahl, Andocken und den Ebenen

A.4

Ein räumlicher Würfel

1. Zeichnen Sie ein Quadrat. Löschen Sie den Inhalt des Quadrats und duplizieren Sie es.

2. Verschieben Sie ein Quadrat über das andere, sodass es rechts oberhalb des ersten Quadrates liegt.

3. Zeichnen Sie vier kurze Linien, die keines der beiden Quadrate berühren.

4. Verbinden Sie ein Ende einer Linie mit einer Ecke des hinteren Quadrates.

506

Ein räumlicher Würfel

5. Verbinden Sie nun das andere Ende der Linie mit der gleichen Ecke des vorderen Quadrates.

6. Wiederholen Sie diesen Vorgang mit allen anderen Linien.

7. Wenn Sie einen durchsichtige Würfel haben wollen, lassen Sie das jetzige Bild so wie es ist. Entfernen Sie ansonsten einfach alle Hilfslinien innerhalb der Flächen, welche die Außenseiten des Würfels darstellen sollen. Vergleichen Sie hierzu die untere Abbildung.

507

Figuren mit Auswahl, Andocken und den Ebenen

A.5

Wellen

1. Befolgen Sie die ersten sechs Anweisungen der Halbkreis-Übung, um einen Kreis zu erstellen, den eine Linie durchtrennt. Bei dieser Übung wird allerdings die Linie nicht vertikal sondern horizontal eingefügt.

2. Klicken Sie einmal auf die untere Hälfte des Kreises, um sie von der Linie wegzuziehen.

3. Entfernen Sie die horizontale Linie.

4. Klicken Sie einmal auf den unteren Halbkreis, um ihn zu markieren. Danach verbinden Sie das linke Ende des unteren Halbkreises mit dem rechten Ende des oberen Halbkreises.

508

Wellen

5. Kopieren Sie das entstandene Gebilde und fügen Sie es erneut in Ihren Arbeitsbereich ein. Verbinden Sie nun das linke Ende des neu eingeführten Objektes mit dem rechten Ende des bereits existierenden. Wiederholen Sie diesen Vorgang, um so viele Wellen zu erzeugen, wie Sie benötigen.

6. Wenn Sie hiermit fertig sind, können Sie Ihr Gebilde beliebig in der Breite variieren.

509

Figuren mit Auswahl, Andocken und den Ebenen

A.6

3D-Kugel

1. Diese Übung ist wirklich einfach, aber sie sieht genial aus. Als Erstes selektieren Sie das Ellipsen-Werkzeug (keine Linie) und einen vordefinierten Farbverlauf.

2. Malen Sie einen Kreis.

3. Wählen Sie das Füllungstransformations-Werkzeug. Wenn Sie im Kreis nun klicken, können Sie den Glanzpunkt von der Mitte zur linken oberen Hälfte verschieben (je nachdem wo sich Ihre imaginäre Lichtquelle befindet).

510

3D-Kugel

4. Selektieren Sie den Radius-Anfasser (der oberste der drei Punkte) und verschieben Sie ihn nach links, um den Radius zu verändern.

5. Wählen Sie den untersten Punkt, um die Drehung des Kreises zu bestimmen.

6. Selektieren Sie den mittleren Anfasser, um die Größe des Kreises zu verändern.

511

Figuren mit Auswahl, Andocken und den Ebenen

7. Verändern Sie all diese Einstellungen solange, bis Sie Ihren Kreis in eine 3D-Kugel verwandelt haben.

A.7

Das Farbrad

1. Als Erstes werden wir ein Dreieck generieren. Um dieses zu erstellen, zeichnen Sie eine horizontale Linie und duplizieren Sie diese. Drehen Sie die neue Linie exakt um 120 Grad und koppeln Sie sie mit einem Ende der horizontalen Linie. Wiederholen Sie diesen Vorgang für eine dritte Linie und vervollständigen Sie das Dreieck. Kopieren Sie das Dreieck, sodass es nicht mehr mit anderen Objekten verbunden ist, wenn Sie es auswählen. Malen Sie nun einen Kreis, der deutlich größer ist als das Dreieck.

2. Löschen Sie die Füllung des Kreises und konvertieren Sie ihn in ein Symbol namens Durchsichtig.

512

Das Farbrad

3. Koppeln Sie die Mitte des neu erstellten Symbols an eine Ecke des Dreiecks an. Duplizieren Sie dieses Symbol 2-mal und verbinden Sie die neu erstellten Symbole mit den anderen Ecken des Dreiecks (indem Sie die Mittelpunkte der Kreise an die Ecken andocken).

4. Löschen Sie das Dreieck und trennen Sie die einzelnen Kreise.

513

Figuren mit Auswahl, Andocken und den Ebenen

5. Nutzen Sie das Farbeimer-Werkzeug, um die Kreise mit Farbe zu füllen. Löschen Sie danach die Ränder der Kreise.

514

Ressourcen

2

Ressourcen

Hier sind hauptsächlich englischsprachige Internetseiten aufgelistet.

B.1

Einführungen und Online-Ressourcen

Director Online User Group (DOUG) http://www.director-online.com Auch wenn sich diese Seite hauptsächlich mit Director beschäftigt, finden Sie hier einige interessante Artikel zu Flash.

Macromedia http://www.macromedia.com/support/flash/ Was könnte besser sein als Informationen aus erster Hand?

Moock.Org http://www.moock.org Ressourcen, die auch über Flash hinaus gehen. Alles, was zum Thema Web gehört. Diese Site ist besonders interessant, da hier nicht nur das Thema Flash besprochen wird, sondern auch der Zusammenhang mit anderen Internet-Technologien klar wird.

The Flash Academy http://www.enetserve.com/tutorials Diese Homepage bietet Anfänger- bis Fortgeschrittenen-Einführungen in Form von FlashFilmen an.

Flash Kit http://www.flashkit.com Hier werden Einführungen als Quell-Dateien angeboten. Außerdem kann man hier Sounds herunterladen.

516

Seiten über Inhalte

Virtual-FX http://www.virtual-fx.net Hier gibt es Einführungen für jeden Wissensstand (vom Anfänger bis zum fortgeschrittenen ActionScripter). Außerdem finden Sie hier Quell-Dateien und Links auf weitere Flash-Seiten.

Flashlite http://www.flashlite.net Dies ist eine gute Quelle für Einführungen und Aktuelles zu Flash.

Flashzoom.com http://www.flashzoom.com Dies ist eine gute Quelle für Flash-Resourcen und -Nachrichten.

Flash Magazine http://www.flashmagazine.com Auf dieser Seite findet man Artikel und Nachrichten zu Flash.

We're Here http://www.were-here.com Das wahrscheinlich aktivste Forum zu Flash im Internet

B.2

Seiten über Inhalte

Im Normalfall kann man mit eigenen Grafiken und Sounds die Intention seines Flash-Filmes am besten unterstützen. Allerdings gibt es eine Vielzahl von Homepages, von denen Sie Medien herunterladen kann, die Sie zu Übungszwecken gut verwenden können. Behalten Sie im Hinterkopf, dass es nie ein »kostenloses Mittagessen« gibt, denn auch Dateien, die auf den ersten Blick kostenlos aussehen, sind es in Wirklichkeit nicht. Außerdem ist mit dem Urhebergesetz nicht zu spaßen. Bedenken Sie immer, dass Sie bei einem Flash-Film, den Sie kommerziell erstellen, für die Rechte an Sounds und Grafiken wahrscheinlich bezahlen müssen.

517

Ressourcen

Audio- und Soundseiten SoundShopper.com http://www.soundshopper.com Günstige Sounds

Wavecentral http://www.wavecentral.com Hier finden Sie viele gute .wav-Dateien.

Bilder und Fotos Clip Art http://www.clip-art.com Hier werden viele Bilder im Zeichentrick-Stil angeboten. Außerdem finden Sie wertvolle Hinweise zur Qualität-/Dateigrößenoptimierung.

Clip Art Connection http://www.clipartconnection.com Auf dieser Seite erhalten Sie kostenlose Bilder.

Corbis http://www.corbis.com Hochwertige Bilder mit anwendungsbezogenen Preisen. Hier gibt es einen Privat- und Business-Bereich.

Eyewire http://www.eyewire.com Dies ist eine Suchseite, auf der Sie Bilder in verschiedenen Preisklassen finden.

518

Schriftarten und Sonstiges

B.3

Schriftarten und Sonstiges

T-26 http://www.t26font.com Hier finden Sie kostenpflichtige Schriftarten mit hervorragender Qualität.

Emigre http://www.emigre.com Emigre ist eine großartige Site für Schriftarten. Bitte denken Sie aber daran, dass sie auch hier nicht kostenlos sind.

B.4

Drittanbieter-Produkte

Swift 3D http://www.swift3d.com Swift3D ist ein großartiger 3D-Renderer, der das Ergebnis im .swf-Format abspeichern kann.

SWfx http://www.wildform.com SWfx ist ein schönes Programm von Wildform, mit Sie einzigartige Texteffekte erzeugen können.

SWF Studio http://www.northcode.com Dieses Programm (nur für Windows) erweitert den Flash-Projektor, um bessere selbstlaufende Filmdateien zu erzeugen.

Flash Jester http://www.flashjester.com Dieses Programm ähnelt SWF Studio.

519

Ressourcen

B.5

Inspirierende Seiten

Natürlich ist »inspirierend« sehr subjektiv. Außerdem werden Seiten, die für viele Leute inspirierend sind, schnell zum Klischee, wenn sie zu oft kopiert werden. Ich stelle Ihnen hier Seiten vor, die auf Preisträgerseiten verweisen oder Dateien enthalten, von denen Sie lernen können.

Pray Station http://www.praystation.com Diese Seite ist mit Flash erstellt und bietet neben einem sehenswerten Kalender auch .flaDateien zum Download an.

Flash Challenge http://www.flashchallenge.com Hier finden Sie viele Links zu anderen Seiten, die zum größten Teil sehr sehenswert sind.

Flash Film Festival http://www.flashfilmfestival.com Diese Homepage zeigt die Gewinner der FlashForward2001-Flash-Konferenz an.

Communication Arts http://www.commarts.com/interactive Hierbei handelt es sich um die Seite eines Magazins für die Grafikgemeinde.

B.6

Statistiken

Macromedia http://www.macromedia.com/software/player_census/ Hier erfahren Sie den aktuellen Stand, wie viele Internetuser den Flash oder Shockwave Player installiert haben. Das kann besonders dann nützlich sein, wenn Sie einem Dritten darüber Bericht erstatten sollen, wie kompatibel oder verbreitet Flash ist.

520

WorkshopAuflösung

3

Workshop-Auflösung

Hier finden Sie die Antworten auf die Quizfragen, die Sie hoffentlich am Ende jedes Kapitels beantwortet haben.

Tag 1 1. Antwort A. Normalerweise kann man eine .swf-Datei nur betrachten. In Wirklichkeit kann man eine .swf-Datei wie in Antwort C auch importieren. Allerdings funktioniert das nicht, wenn man die .swf-Datei so exportiert hat, dass sie importgeschützt abgespeichert wurde. Das können Sie im Menü DATEI / EINSTELLUNGEN FÜR VERÖFFENTLICHUNGEN in der Registerkarte Flash einstellen. Wenn Sie allerdings jemals eine .swf-Datei importieren sollten, wird nur die Sequenz der Bilder importiert (und keine Interaktivität), womit Sie die Datei dann kaum noch sinnvoll nutzen können. 2. Antwort B. Obwohl das Erhöhen der Bildrate auf 120 BpS Flash veranlassen wird, sehr schnell abzuspielen, wird dies kaum auf allen Computern möglich sein. Die Antwort A ist damit nicht grundlegend falsch. Allerdings sind spezielle Animationstechniken die beste Möglichkeit. Eine Grafik muss sich nicht wirklich schnell bewegen, um eine schnelle Bewegung vorzutäuschen. 3. Antwort C. Dies ist keine Meinung: Bildpunkte (Pixel) sind der Standard.

Tag 2 1. b. Dieser Fall sollte eigentlich sehr selten vorkommen, denn nur beim Rechteck- und Oval-Werkzeug kann man überhaupt beide Farben auf Keine Farbe setzen. 2. c. Auch wenn B nicht verkehrt ist, kann man über die Tipps der Werkzeuge am schnellsten die Kurztasten feststellen. 3. b. Sie müssen sich aber nicht die ganzen Orte der Farbfelder zu merken.

Tag 3 1. c. Auch wenn Vektorgrafiken mehr Vorteile gegenüber Rastergrafiken haben, hängt es im Endeffekt vom Inhalt des Bildes ab, welchen Datentyp Sie wählen. 2. a. Jedes Bild kann mit eigenen Kompressionseinstellungen versehen werden, die nicht vom eigentlichen Format abhängen. 3. c. Abbildung 3.2 zeigt das Ergebnis, wenn man versucht, eine zu neue Illustrator-Datei zu importieren.

522

Tag 4

Tag 4 1. a. Die Adressleiste ist wirklich der beste Hinweis. Achten Sie auf diesen Bereich. 2. c. Es ist möglich, einen Farbverlauf mit nur diesem Bedienfeld zu erstellen. 3. a. Die Gruppierung eines einzelnen Objektes ist dann sinnvoll, wenn man verhindern will, dass es andere Objekte auf der Bühne »auffrisst«. Außerdem kann man die Anordnung dieser Objekte einstellen, wenn sie erst einmal gruppiert sind.

Tag 5 1. b. Man kann die Bibliothek einer anderen Datei eingeblendet haben. Außerdem kann man Symbole auch in Ordnern organisieren. 2. a. Die Adressleiste ist der Haupthinweis auf diesen Zustand. 3. c. Alpha macht nur Sinn, wenn sich etwas anderes hinter der Instanz verbirgt. Wenn das nicht der Fall ist, sollte man von Alpha absehen, da es viel Rechenzeit benötigt und ein Helligkeitseffekt an dieser Stelle viel effektiver wäre.

Tag 6 1. c. Die Anzahl der Schlüsselbilder hat eigentlich keinen Einfluss auf die Erscheinung des Films. Das hängt von vielen anderen Dingen ab (von der Bildrate usw.). 2. a. Sie können bei einer Bildrate von 2 BpS genau den Wechsel zwischen den Bildern sehen. Es handelt sich um Pausen und nicht um schwarze Lücken. 3. b. Es würde mich wundern, wenn Ihr Computer die 60 BpS schaffen würde.

Tag 7 1. b. Der Inhalt eines Schlüsselbildes bleibt auf der Bühne, bis ein weiteres Schlüsselbild erscheint. 2. b. Auch wenn man eine Animation normalerweise mit etwa 24 BpS gestaltet, kann man schon 2 unterschiedliche Bilder als Animation bezeichnen. 3. c. Eine Bild-für-Bild-Animation ist eine Animation. In den beiden folgenden Kapiteln werden wir allerdings lernen, wie man noch flüssigere Animationen erstellen kann.

523

Workshop-Auflösung

Tag 8 1. b. Speichern ist immer eine gute Idee, aber an dieser Stelle nicht notwendig. Sie benötigen allerdings Symbole, um einen Bewegungstween zu erzeugen. 2. a. So überraschend es auch klingt: Viele Leute versuchen es mit B (der TelepathieMethode). Das fällt genau unter den Punkt, den ich »wissen, wo man ist« nenne. Wenn man Bild 1 bearbeiten will, muss der Abspielkopf auf Bild 1 stehen. 3. c. Man stellt die Tweening-Eigenschaften im ersten Schlüsselbild ein.

Tag 9 1. c. Es gibt keinen Grund, mehr Formmarken zu verwenden als unbedingt nötig. Jedes Mal, wenn Sie eine Formmarke einfügen, sollten Sie sich vergewissern, ob das Ergebnis auch wirklich so zufrieden stellend ist. 2. b. Es ist definitiv richtig, »Bewegungstweening« als Erzeuger von kleineren Datenmengen zu bezeichnen. Das ist besonders dann wichtig, wenn ein gewünschter Effekt sowohl per Bewegungs- als auch per Formtweening erzeugt werden kann. 3. b. Text wird zu Beginn wie eine Gruppe behandelt. Wählen Sie MODIFIZIEREN / TEILEN.

Tag 10 1. c. Sowohl AIF als auch WAV kann gute Qualität für Sound-Quelldateien liefern. 2. b. Sounds werden immer in Schlüsselbildern abgelegt. 3. a. Auch wenn alle Antworten gleich verrückt klingen, funktioniert nur die erste Variante.

Tag 11 1. c. Auch wenn das Testen des Films die besten Ergebnisse liefert, können Sie einen Vorgeschmack auf den Effekt erhalten, wenn Sie beide Ebenen sperren. 2. b. Mit einer Maske können Sie so viele Ebenen maskieren, wie Sie wollen. 3. b. Ich denke, dass man immer effizient sein sollte, allerdings können Sie in FührungsEbenen ruhig einmal die Zügel locker lassen, da die Inhalte nicht die Dateigröße oder

524

Tag 12

die Abspielgeschwindigkeit des fertigen Films beeinflussen. Wenn Sie eine Ebene verstecken, so wird sie nur während des Arbeitens mit Flash nicht angezeigt. Im Film erscheint sie aber trotzdem.

Tag 12 1. b. Es ist egal, wie viele Bilder man in solchen Symbolen und Instanzen verwendet. Ich gebe aber zu bedenken, dass man beim Grafik-Verhalten darauf achten muss, wie lang die Hauptzeitlinie »lebt«. 2. b. Man kann Instanzen gleich benennen. Allerdings kann man diese dann nicht mehr getrennt ansprechen, sondern Aktionen wirken immer auf alle gleichnamigen Instanzen. 3. b. Man muss sich den Einsatz von Grafik-Symbolen gut überlegen, aber es gibt dennoch gute Gründe dafür.

Tag 13 1. c. Auch wenn eine Schaltfläche nur ein Bild pro Zustand zur Verfügung stellt, kann man über Filmsequenzen beliebig viele Bilder animieren. 2. a. Das lässt sich leider nur über mehrere Master-Symbole regeln, da die Einbindung des Sounds im Master-Symbol erfolgt. Aber Achtung: Die Dateigröße nimmt dabei zu! 3. b. Genau so werden unsichtbare Schaltflächen erzeugt.

Tag 14 1. c. Beachten Sie, dass man keine Aktionen in Master-Symbole einbringen kann! Natürlich kann man in Filmsequenz-Master-Symbolen Aktionen für Schlüsselbilder und Schaltflächen festlegen, aber das wird in C mit abgedeckt. 2. b. Das ist eine recht allgemeine Aussage und somit die beste Definition. Sie werden über Funktionen noch mehr im Anhang lernen. Wenn man es genau betrachtet, sind Aktionen eher Methoden. 3. c. Es gibt wirklich keine Grenze.

525

Workshop-Auflösung

Tag 15 1. c. Man gibt entweder den Namen der Instanz an oder lässt Flash die aktuelle Filmsequenz auswählen, indem man das ZIEL-Feld leer lässt. 2. b. Auch wenn Sie Variablen auf andere Weise initialisieren können, ist das nicht notwendig. Sie können einfach loslegen, wenn Sie sie brauchen. 3. c. Diese Frage war gemein, da es tatsächlich eine _visibility-Eigenschaft gibt, über die wir allerdings noch nichts gelernt haben. Wenn _visibility den Wert 0 hat, ist die Filmsequenz unsichtbar. Beim Wert 1 erscheint sie aber wieder. Was ich eigentlich nur zeigen wollte, ist, dass man viele Eigenschaften auch von Hand verändern kann.

Tag 16 1. a. Das ist eine perfekte Definition. 2. c. Jeder kann eine Komponente erstellen. 3. c. Lediglich der Name stammt von den alten Radioknöpfen, die eine exklusive Senderauswahl ermöglichten.

Tag 17 1. b. So einfach ist das. 2. a. Wenn Sie dachten, dass B richtig ist, sind Sie reingefallen, denn dort können Sie auch nur ganz neu importieren und dann muss die Datei zusätzlich noch an der gleichen Stelle liegen wie zuvor. 3. b. Je ein Teil des Codec (Kodierer und Dekodierer) ist in Flash und im Flash Player eingebaut.

Tag 18 1. c. Sie können ja einmal VORSCHAU werden Sie ein Ergebnis sehen.

FÜR

VERÖFFENTLICHUNGEN ausprobieren. Hier

2. b. Sie haben nun eine Idee, was man mit HTML machen kann.

526

Tag 19

3. c. Man kann sowohl statischen Text als Hyperlink definieren als auch in dynamischem Text HTML-Code anzeigen (wodurch Hyperlinks indirekt möglich sind).

Tag 19 1. c. Man kann nur einen Film pro Level-Nummer laden. 2. c. Ja, man kann die Rotation einer Stufe genauso verändern wie die einer Filmsequenz (Beispiel: _level1._rotation=180). 3. c. Nur eine Person kann gleichzeitig die geteilte Bibliothek zur Bearbeitung öffnen.

Tag 20 1. b. Antwort C ist eindeutig falsch, weil die Ladezeit von Flash-Filmen unabhängig von ihrer Größe ist. Antwort A ist nicht ganz falsch, weil man wirklich nicht genau sagen kann, wie lange eine Datei zum Laden braucht. Wenn Sie die Größe jedoch halbieren, können Sie sicher sagen, dass es doppelt so schnell gehen wird. Denken Sie an eine halbe Brotscheibe – es wird (im Gegensatz zu einer ganzen Scheibe) halb so lange dauern, sie zu essen. 2. c. Obwohl Spezialeffekte an der richtigen Stelle gut sein können, können sie doch ablenken, die Dateigröße erhöhen und die Leistung verringern. Dies sind alles gute Gründe, sie zu vermeiden. 3. b. Der Bandbreiten-Profiler berücksichtigt nur die Dateigröße und die Leistung. Wenn sich die Frage auf eine langsame Verbindung statt auf einen langsamen Computer bezogen hätte, wäre Antwort A richtig gewesen.

Tag 21 1. c. Das Modell wurde der Wirklichkeit entlehnt. Stauchen Sie einmal einen Ball und Sie werden sehen, wie sich der Ball ausdehnt. 2. c. Wir haben die Bewegung nicht modifiziert, weil Sie dann vielleicht ganz gut aussieht, sondern weil das Verhalten des Balls der Wirklichkeit entsprechen soll. Der Vorgang soll vor allem realistisch aussehen. 3. b. Wir sind nicht hier, um physikalische Prinzipien akkurat aufzuzeigen. Vielmehr geht es um das Resultat. Nur dieses zählt.

527

Workshop-Auflösung

Bonustag 1 1. a. Eine gute Trennung zwischen Programmcode und Daten erleichtert die Suche nach Fehlern immens und macht das Ganze sehr viel transparenter. 2. c. Es schadet zwar niemandem, die komplette Präsentation zu sehen, es ist jedoch gemeint, dass anhand eines kleinen Projektausschnittes ein kompletter Projektdurchlauf simuliert wird, um Rückschlüsse auf den Ablauf des gesamten Projektes gewinnen zu können. 3. b. KOPIEREN aus dem Menü BEARBEITEN kopiert die markierten Daten in die Zwischenablage.

Bonustag 2 1. c. Der Debugger versorgt Sie nur mit Informationen. Er kann nicht Ihren Film durchforsten. 2. a. Wenn Sie zwei Sachen gleichzeitig machen und beide funktionieren nicht, ist es sehr schwierig, das Problem in den Griff zu bekommen. 3. a. Behalten Sie im Kopf, dass nur jene Dateien das Potential haben, mit dem Debugger erforscht zu werden, denen der Programmierer auch die entsprechende Erlaubnis zugewiesen hat.

Bonustag 3 1. c. Das beste Dateiformat ist immer abhängig von der Natur der Datei und dem Einsatzzweck. Fotorealistische Grafiken sehen im JPG-Format am besten aus. Geometrische Figuren werden hingegen besser als GIF dargestellt. 2. b. Gut programmierter HTML-Code fängt die Situation ab und informiert den Anwender darüber, dass er keinen Flash Player im Browser installiert hat. 3. c. Es ist möglich, andere Export-Formate zu definieren.

528

Glossar

4

Glossar

A ActionScript Die Computersprache, die in Flash verwendet wird

Aktiv-Bereich Der Bereich, in dem eine Schaltfläche auf einen Klick reagiert

Animierte Grafiken Bewegte Bilder jeder Art. Am häufigsten findet man Flash-Animationen und animierte GIF-Bilder im Internet.

B Bibliothek Der Speicherbereich für alle Medien, die in einer Flash-Datei verwendet werden

Bild-für-Bild-Animation Eine Animation, in der jedes einzelne Bild ein Schlüsselbild ohne Tweening ist (ähnlich wie bei einem Daumenkino)

Bildrate Die Anzahl der Bilder, die in einer Sekunde wiedergegeben werden, angegeben in BpS (Bildern pro Sekunde)

Bitmap-Grafik Siehe: Rastergrafik

Bühne Das große weiße Rechteck in Flash. Nur was sich in diesem Rechteck befindet, wird der Betrachter später sehen können.

D Dateiformate .as-Datei Eine Text-Datei, die nur ActionScript verwendet und mit #include eingefügt werden kann.

.fla-Datei Eine Flash-Datei, die man bearbeiten kann

530

Glossar

.flv-Datei Diese Datei enthält ein bereits komprimiertes Flash-Video.

.swd-Datei Diese Datei wird beim Debuggen eines Flash-Films erzeugt.

.swf-Datei Eine Flash-Player-Datei, die man betrachten, aber nicht bearbeiten kann

E Ebene In Flash gibt es mehrere Ebenen. Hier können unterschiedliche Animationen zur gleichen Zeit realisiert werden.

Export Eine Datei aus Flash in einem anderen Format abspeichern als im Standardformat

F Fokus Der Aktivitätszustand. Wenn man beispielsweise ein Bild in der Zeitleiste anklickt, liegt der Fokus auf diesem Bild.

Führungsebene Eine spezielle Ebene, die im späteren Film nicht zu sehen ist. Sie wird verwendet, um Objekte genauer ausrichten zu können.

G Grafik-Symbol Ein Symbol, das nur aus Grafik besteht

H Hyperlink Ein Objekt oder Text, auf den der Anwender klicken kann, um zu einer anderen Seite im Internet zu gelangen

Hypertext Markup Language (HTML) 531

Glossar

Die Sprache, die von Internetbrowsern übersetzt wird, um Inhalte aus dem Internet anzuzeigen

I Import Ein Objekt oder eine Datei von außerhalb in eine Flash-Datei bringen

Instanz Eine Art Kopie eines Symbols, die aber nicht so viel Speicher verbraucht. Siehe auch: Bibliothek und Symbol

K Komponente Eine Filmsequenz, die spezielle Parameter annehmen kann, die wiederum einzigartig für jede Instanz dieser Sequenz sind

Koordinaten Nummern, welche die Position auf dem Bildschirm angeben

L Leeres Schlüsselbild Ein Schlüsselbild, in dem nichts auf der Bühne angezeigt wird. Siehe auch: Schlüsselbild

Lineal Mit diesem Werkzeug kann man Hilfslinien erzeugen. Siehe auch: Raster

M Maskierung Eine Art von Ebenen-Eigenschaft mit mindestens zwei Ebenen. Der grafische Inhalt der Maske gibt an, welcher Bereich der maskierten Ebene durchscheint.

Morph Die Transformation einer Form in eine andere über eine gewisse Zeit

532

Glossar

O Oberfläche Das Design, mit dem der Anwender interagiert

P Panning Dieser Effekt lässt ein Geräusch sich scheinbar von rechts nach links bewegen (oder umgekehrt).

Parameter Eine Eigenschaft, die in ActionScripts verwendet wird

Q QuickTime Ein Videoformat, das von Apple generiert wurde

R Raster Wie bei kariertem Papier wird das Raster auch in Flash dazu verwendet, Zeichen (und Zeichnungen) auszurichten. Siehe auch: Lineal

Rastergrafik Ein Bild, bei dem für jeden Bildpunkt die Farbe definiert wird

S Schaltfläche Ein Objekt, auf das der Anwender klicken kann, um eine Aktion auszulösen

Schaltflächen-Zustand Ein Zustand der Schaltfläche (beispielsweise beim Klicken oder wenn sich die Maus darüber bewegt)

Schaltflächen-Symbol Ein Symbol mit den Eigenschaften einer Schaltfläche. Siehe auch: Symbol

533

Glossar

Schlüsselbild Ein Bild, in dem man haargenau angibt, was in diesem Moment auf der Bühne zu sehen sein soll

Smart Filmsequenz Siehe: Komponente

Symbol Eine Grafik oder ein sonstiges Objekt, das sich in der Bibliothek befindet. Man kann es mehrfach als Instanz auf die Bühne bringen, ohne eine viel größere Datei zu erhalten.

Szene Ein Teil in der Zeitschiene von Flash

V Vektorgrafik Eine Grafik, die über geografische Formeln angibt, wie das Bild auszusehen hat

Z Zwiebelschalen-Werkzeug Mit diesem Werkzeug kann man ein Bild bearbeiten, während man andere leicht abgeschwächt im Hintergrund sieht.

534

Auf der Buch-CD

5

Auf der Buch-CD

Auf der CD-ROM, die Sie in diesem Buch finden, sind die Übungen als FLA-Dateien abgelegt. Im Ordner Beispiele gibt es je einen Unterordner mit der Kapitelnummer. Darin liegen die Quelldateien, die Sie einfach mit Flash MX öffnen können. Dennoch sollten Sie versuchen, die Aufgaben möglichst selbst durchzugehen, denn nur so werden Sie mit dem Umgang und der Arbeitsweise von Flash vertraut. In einigen Kapiteln werden Sie aufgefordert, Bitmap- oder Rastergrafiken zu importieren. Hierzu sind ein paar Beispiele im Ordner Grafik (oder besser gesagt in dessen Unterordnern Raster und Vektor) abgelegt. Abschließend finden Sie im Ordner Software Testversionen von Macromedia-Produkten (Macromedia-Testversionen), unter anderem auch von Flash MX. Bitte beachten Sie die Angaben des Software-Herstellers. Damit Sie Ihre Werke ausgiebig testen können, sind im Ordner Browser die gängigsten Internetprogramme abgelegt. Nicht zu vergessen: Aus dem Unterverzeichnis E_book können Die das komplette, Ihnen hier vorliegende Buch auch als pdf-datei laden, um schnell einmal was nachschlagen zu können, auch wenn das Druckwerk gerade nicht greifbar ist.

536

Stichwortverzeichnis Symbols ! Warnsymbol-Schaltfläche 194 #, goto einfügen 293 #static, Bilder bezeichnen 485 + (Pluszeichen) 454 –, Bibliothek 145 .ai-Dateinamenerweiterung 93, 99 .asf-Dateien, Videos 352 .avi-Dateien, Videos 352 .dv-Dateien, Videos 352 .dvi-Dateien, Videos 352 .fla-Datei –, Definition 178 –, Lernen aus 453 .fla-Datei (Flash-Quelldatei) 48 .fla-Quelldateien herunterladen 520 .html-Datei (Homepage-Datei) 49 .jpg-Dateien –, laden 374 .jpg-Dateinamenerweiterung –, Importieren 105 .mov-Dateien –, Videos 352 .mpeg-Dateien –, Videos 352 .mpg-Dateien –, Videos 352 .sef-Dateinamenerweiterung 93 .swf-Datei (Flash-Player-Datei) 48 .swf-Dateien –, Statistik 401 –, Veröffentlichen 481 –, Videos 351 .swf-Dateinamenerweiterung 95 .wmv-Dateien –, Videos 352 _ 419 _framesloaded-Eigenschaft 378 _parent-Eigenschaften

–, benutzerdefinierte Eigenschaften zeigen auf 343 _totalframes-Eigenschaft 378 {} (geschweifte Klammern) 337 –, Maus-Ereignisse 300 –, Stop-Aktion in with-Aktion einfügen 308

Numerics 3D-Kugel, erstellen

510

A Abbildungen siehe Grafik Abbremsen und Beschleunigen (Animationen) 200 Abdocken –, Bedienfelder 27 Abspielen –, goto-Aktion 295 –, Schaltflächen Anhalten oder Fortfahren 298 Abspielende (Hülle bearbeiten) 229 Abspielkopf 177, 178 Abspielkopf (rot) 163, 164 Abspielstart (Hülle bearbeiten) 229 Achsen –, X (horizontal) 37 –, Y (vertikal) 37 ActionScript –, Aktionen Untersuchen 455 –, Anwendungen Interaktivität 316 –, Filme 290 ADPCM-Option –, Sound-Komprimierung 235 Adressen –, E-Mail 292

537

Stichwortverzeichnis

–, von Web-Sites angeben 336 Adressierbare Filmsequenz-Instanzen 266 Adressleiste –, Bibliothek 145 –, Symbole Bearbeiten 141 Änderung der Adressleiste (Gruppen) 134 Änderung der Adressleiste in QuadratGruppe 133 AIF-Sound-Dateien 221 Aktionen –, bearbeiten 292 –, Bedienfeld Aktionen ausführen 294 Aktionsliste 291 goto-Aktion 294 Komponenten 291 Parameterbereich 291 Scriptbereich 291 Voreinstellungen 292 –, Bilder 297 –, Bild-Nummer Ziel von goto 295 –, durch Parameter spezifizieren 293 –, Einfügen Feintuning 310 –, E-Mail-Adressen 292 –, evaluate 325, 327 –, Filme 290 Wiederholung 293 –, Filmsequenz 301, 303 anvisieren 305 bearbeiten 303 getURL 304 Instanzen platzieren 301 –, fscommand Parameter 489 Projektor 489 –, getURL 304, 367 –, goto Abspielen 295 Aktionen-Bedienfeld 294 Ziele 296 –, goto einfügen 293 –, hinzufügen 292

538

–, Komponenten Syntaxfarbcodierung 292 –, Load Movie 375 –, loadMovie 357, 374 Stufen anvisieren 377 –, Maus-Ereignisse {} (geschweifte Klammern) 300 –, Play 324, 356 –, Schaltflächen 298 Hyperlinks 304 zaehler-Variable, Werte erhöhen 325 –, Schaltflächen-Instanzen 278, 279 –, set Variable 324 –, setProperty 328 –, startDrag 316, 320 Immer als Rechteck-Option 321 –, startDrag() 319 –, Stop in with-Aktion einfügen 308 –, stop-Drag 317 –, Trace Scripts 464 –, unloadMovie 381 –, Untersuchen 455 –, with 306 {} (geschweifte Klammern) Stop-Aktion einfügen 308 Einfügen 307 eingebundene Instanzen anspringen 306 Aktionen-Menü –, Variablen 324 Aktionsliste (Aktionen-Bedienfeld) 291 Aktiv-Bild –, unsichtbare Schaltflächen 285 Aktive Ebenen –, Bleistiftsymbol 242 Aktiv-Zustand von Schaltflächen –, definieren 275 –, vergrößern 276 Aktualisieren –, geteilte Bibliotheks-Einträge 384 Aktuelle Zeit –, Zeitleiste 164 Alles-markieren-Befehl (BearbeitenMenü) 405

Stichwortverzeichnis

Alle-Zwiebelschalen-Befehl (Zwiebelschalen ändern-Menü) 405 Allgemeine Bibliotheken-Befehl (FensterMenü) 355 Alpha (Eigenschaften-Bedienfeld) 151 Alpha-Einstellungen von Sequenzen –, Schaltflächen zum Erhöhen und Vermindern 328 Alpha-Farbeffekt –, Tweening 196 Alpha-Wert einer Filmsequenz-Instanz ändern 327 Als Menüelement behandeln 282 Als Schaltfläche behandeln 282 Analysieren –, Animationen 168, 170, 171 Andocken –, Bedienfelder 27 Animation 162, 176, 418 –, Abbremsen und Beschleunigen 200 –, am Beginn enden 199 –, analysieren 168, 170, 171 –, betrachten 26 –, Betrachter Aufmerksamkeit fesseln 419 Erwartungen 421 Täuschen 420 –, Bewegung Vortäuschen 420 –, Bewegungstween Abbremsen und Beschleunigen 200 Alpha-Farbeffekt, Tweening 196 am Beginn enden 199 Erstellen 192 Farbton-Effekt für Instanzen 196 Feintuning 199 Instanzen, Eigenschaften ändern 197 Instanzen, Farbe tweenen 195 Instanzen, Position tweenen 195 Instanzen, Rotation tweenen 195 Instanzen, Tweening 195 Instanzen, Vergrößerung tweenen 195 Muster 198 Niemandsland 197 Pfad-Ebenen 250 Regeln 194

Rotieren 202 Schlüsselbilder 199 –, Bewegungstweening 192 –, Bilder Ball 252 Bildrate 163, 164, 165, 166, 167 in Filmsequenzen ändern 263 effektive Geschwindigkeit 166 getweent, Blau (Bewegungstween) 209 getweent, Grün (Formtween) 209 interpoliert, Formtweens 209 Schlüsselbild 167, 168 Tweening in der Zeitleiste 193 Zeitleiste 163, 164 –, Bild-für-Bild 176, 183 bearbeiten 179 Pausen 183 –, Bildrate 163, 164, 165, 166, 167 Geschwindigkeit 47 –, blinkender Bildschirm 419 –, Daumenkino 176 –, Ebenen 35, 240 Ausgerichtet (Ebenen-Eigenschaft) 244 Ebene als Kontur anzeigen (EbenenEigenschaft) 244 Ebene einblenden/ausblenden (EbenenEigenschaft) 244 Ebene sperren/freigeben (EbenenEigenschaft) 244 Ebenen-Name (EbenenEigenschaften) 244 Eigenschaften für das Editieren 243 Eigenschaften für visuelle Effekte 247 Führungs-Ebenen 247 Führungs-Ebene (EbenenEigenschaft) 244 Führungs-Ebenen 247 Inhalte anzeigen 245 Konturen 244 Kreise animieren 240, 241 Maske (Ebenen-Eigenschaft) 244 Maskiert (Ebenen-Eigenschaft) 244 Normal (Ebenen-Eigenschaft) 244 Ordner (Ebenen-Eigenschaft) 244 Pfad (Ebenen-Eigenschaft) 244 Verstecken 244

539

Stichwortverzeichnis

–, –, –, –,

–, –,

–,

–,

–, –, –,

verwalten 246 Ebenen erzeugen 241 Einstellungen beim Exportieren 233 erstellen 24, 26 Filmsequenz 265 adressierbare Instanzen 266 Dateigröße einsparen 267 Download-Reihenfolge, Effekte 267 drehende Räder erstellen 261 erstellen 260 Symbole und Grafik-Symbole 262 Filmsequenz, Verhalten 260 Filmsequenzen 260 Instanzen, Verhalten 263 Wiederholung 264 Formtween Bewegungstweens 210 Erstellen 206 Feintuning 211 Formmarken 211 Gruppen 207 interpolierte Bilder 209 Linien und Füllungen nicht mischen 209 Morphs 206 Quadrat-Instanzen, Verformen 210 Regeln 207 Schachbretteffekt 208 Vereinfachen 208 Vermeiden 216 vertikale Linien verschieben 212 Führungs-Ebenen gesperrte Bereiche definieren 248 Objekte positionieren 247 Gegen-UZS-Rotation (gegen den Uhrzeigersinn) 202 globale Veröffentlichungseinstellungen 233 Grafik-Symbol 260 Ankoppeln an Zeitlinie 265 Filme Effekte auf Download-Reihenfolge 267 exportieren (vorrendern) 267 Schrubbertechnik 264 Vorschau 264

540

–, Holzpfosten Ebenen 429 laufend 428 –, Horizont Berge zeichnen 431 –, Jojo Abbremsen und Beschleunigen 200 erstellen 199 –, Komponenten 162 –, Kreise Quetschen 422 –, Masken Einschränkungen 256 –, maskierte Ebene Gebäude 255 –, Maskierungs-Ebene 253 Scheinwerfer-Effekt erzeugen 254 –, natürlich wirkende Bilder 420 –, Perspektive 426 –, perspektivische Ansichten Kontrolle 430 –, perspektivischer Standort Ändern 431 –, Pfad-Ebenen 250 springende Bälle erzeugen 251 –, Quadrate Quadratfilmsequenz 267 –, Registrierungs-Ebene Rahmen-Form 248 –, Resultat 418 –, roter Abspielkopf 163, 164 –, Scheinwerfer-Effekte erzeugen 254 –, Schlüsselbild 167, 168, 432 einfügen 25 –, Schrubben 164 Definition 165 –, Sound 220 AIF-Sound-Dateien importieren 221 aus Bibliotheken importieren 223 Bit-Tiefe 233 Dateien filtern 222 Digital-Audio-Grundlagen 232 Effekt-Einstellungen 227 Effizienz 236 Eigenschaften-Bedienfeld 224 Endpunkt 229

Stichwortverzeichnis

Export-Einstellungen 235 Importieren 220 Importieren, unterstützte Formate importiert, Anzeigen 223 MP3-Kompression 233 MP3-Sound-Dateien importieren Qualität und Dateigröße 232 Sample-Raten 232 Schlüsselbilder 224 Sound-Effekte 230 Startpunkt 229 Sync-Einstellungen 225 WAV-Sound-Dateien importieren Wdh-Einstellungen 229 Wellenformen anzeigen 224 –, Spannungsaufbau 421 Overkill 424 –, springende Bälle erzeugen 251 –, Strichmännchen 176 –, Tiefe simulieren 425, 428 –, Tweening 172 –, Unschärfe erzeugen 420 –, UZS-Rotation (im Uhrzeigersinn) –, visuelle Effekte Ebenen-Eigenschaften 247 Führungs-Ebenen 247 –, Zeitleiste aktuelle Bildnummer 164 aktuelle Zeit 164 Bildrate 164 Timing 164 Animationen siehe Filme Animieren –, Kreise 240, 241 Animierte Schaltflächen –, Behandlungs-Optionen 282 –, Erstellen 279 –, Sound 282 Animierter Text 280 Anker –, Benannte Bildanker 479 Favoriten 480 Zurück-Knopf 480 –, HTML (HyperText Markup Language) 479

221

221

221

202

Ankoppeln –, Grafik-Symbole an Zeitlinie 265 Anonyme Methode –, verschiebbare Objekte erzeugen 319 Anpassen-Befehl (Fehlersuche-Menü) 401 Ansicht-Menü –, Arbeitsbereich 55 –, Ausrichten 60, 132 –, Bandbreiten-Profiler 400 –, Bild-für-Bild-Grafik 402 –, Formmarken anzeigen 212, 215 –, Gitternetz-anzeigen-Befehl 30 –, Gitternetz-bearbeiten-Befehl 31 –, Streaming anzeigen 402, 404 –, Vergrößern 29 –, Vergrößern-Befehl 29 Ansicht-Werkzeuge –, Bildmaterial (original), zeichnen Hand und Vergrößerung 56, 57, 58 Anspringen –, eingebundene Instanzen with-Aktion 306 Anvisieren –, Fenster 369 –, Filmsequenzen, Aktionen 305 –, Instanzen von drehenden Rädern 309 –, Stufen 377 Anwender –, Definition 27 –, Namen mit Variablen erfassen 323 –, Texteingabezeile 324 Anwendungen –, Drag&Drop-Interaktionen erzeugen 316 –, Interaktivität 316 Anzeigen –, Ebenen-Inhalte 245 –, importierter Sound 223 –, Sound-Wellenformen 224 –, Symbol-Namen im Eigenschaften-Bedienfeld 261 –, Variablen 322 Arbeitsbereich-Befehl (Ansicht-Menü) 55 Artefakte –, JPEG-Komprimierung (Joint Photographic Experts Group) 109

541

Stichwortverzeichnis

Attribute von Verlaufsfarben –, Verändern 122 Audio –, Digitale Grundlagen 232 –, Importieren 92 Audio siehe Sound Audio/Sound-Internetseiten –, SoundShopper.com 518 –, Wavecentral 518 Auf -Zustand von Schaltflächen 277 Aufgaben in Projekten –, Aufteilen 457 –, Code verwalten 459 –, Selbstschutz 458 –, Verwalten 457 Aufteilen –, Projekt-Aufgaben 457 Auf-Zustand von Schaltflächen 274 Auge-Symbol erstellen 155 Ausgerichtet (Ebenen-Eigenschaft) 244 Ausrichten –, vertikale Linien Verschieben 212 –, von Kreisen an Quadraten 132 Ausrichten-Befehl (Ansicht-Menü) 60, 132 Aussehen von Videos verbessern 350 außerhalb der Bühne 28 AVI-Videos exportieren 490

B Bälle –, Bild 252 –, springende in Pfad-Ebenen erzeugen 251 Übungsaufgabe 461 Ball-Ebene 252 Bandbreiten-Profiler 400 –, Dateien verbessern 404 –, Größenbericht erstellen 407 –, Ladezeiten 400 –, Preloader 408 Bandbreiten-Profiler-Befehl (AnsichtMenü) 400 Bandwidth-Profiler –, .swf-Dateien, Statistik 401

542

Bearbeiten –, Filmsequenz, Aktionen 303 –, Gruppen von Objekten 131 –, Instanzen von Symbolen 149 –, Symbole, Adressleiste 141 Bearbeiten-Menü –, Alles markieren 405 –, Bilder einfügen 438 –, Bilder kopieren 438 –, Kopieren 128 Bearbeiten-Menü, Befehle –, Voreinstellungen 168, 170 Bedienfeld 35 –, Aktionen Aktionsliste 291 ausführen 294 goto-Aktion 294 Komponenten 291 Parameterbereich 291 Scriptbereich 291 Voreinstellungen 292 –, an- und abdocken 27 –, Definition 24 –, Eigenschaften 24, 35, 59 Farbeffekte von Symbol-Instanzen 150 Füllfarbe 36 Hülle bearbeiten 397 Instanzen auf der Bühne benennen 266 Instanzen von drehenden Rädern benennen 307 Schaltfläche Symbol wechseln 438 Schlüsselbilder 193 Symbol-Namen anzeigen 261 Text-Blöcke, Verhalten angeben 323 –, Fabrik-Einstellungen 39 –, Farbmischer 117 Farbverläufe ändern 121 –, Farbtöne 117 –, Film-Explorer 454 –, Informationsbereich ein/ausblenden 36 –, Komponenten 334 –, Werkzeugkasten 32 –, Werkzg 27, 32, 33 –, Zeitleiste 27 –, Bedienfeldsätze 39 Bedienfeldsätze 39

Stichwortverzeichnis

Bedienfeldsätze-Befehl (Fenster-Menü) 39 Befehle –, Aktionen-Menü Variablen 324 –, Ansicht-Menü Arbeitsbereich 55 Ausrichten 60, 132 Bandbreiten-Profiler 400 Bild-für-Bild-Grafik 402 Formmarken anzeigen 212, 215 Gitternetz anzeigen 30 Gitternetz bearbeiten 31 Streaming anzeigen 402, 404 –, Bearbeiten-Menü Alles markieren 405 Bilder einfügen 438 Bilder kopieren 438 Kopieren 128 Voreinstellungen 168, 170 –, Bilddarstellung Popup-Menü Vorschau 179 Vorschau im Kontext 179 –, Bild-exportieren-Menü Datei 99 –, Datei-Menü Einstellungen für Veröffentlichungen 365 Film exportieren 490, 491 Importieren 101, 222, 352 Neu 24 Öffnen 29, 56 Veröffentlichen 364, 365 Vorschau für Veröffentlichen 305, 364, 477 Wiederherstellen 459 –, Einfügen-Menü Ebene 231, 241 Ebenen-Ordner einfügen 246 In Symbol konvertieren 155, 444 In Symbol umwandeln 139 Neues Symbol 142, 263 Schlüsselbild 167, 176, 182 Szene 408, 438 –, Fehlersuche-Menü Anpassen 401 –, Fenster-Menü Allgemeine Bibliotheken 355

Bedienfeldsätze 39 Bibliothek 139, 230 Eigenschaften 25, 59 Komponenten 334 Werkzeuge 55 Zeitleiste 25 –, Hilfe-Menü Beispiele 452 Lektionen 452 –, mailto 370 –, Modifizieren-Menü Bitmap nachzeichnen 109 Dokument 165, 255 Form 212 Gruppieren 131 Gruppierung aufheben 131 Optimieren 405 –, Modifzieren-Menü Bitmap nachziehen 398 –, Optionen-Menü Eigenschaften 102 Füllmuster hinzufügen 118 Komponentendefinition 343 Neue Schriftart 385 –, Steuerung-Menü Fehlersuche 466 Film testen 231 Schaltflächen aktivieren 273 –, Zwiebelschalen ändern-Menü Alle Zwiebelschalen 405 Behandlungs-Optionen –, animierte Schaltflächen 282 Beispiel-Dateien –, Flash lernen 452, 453 Beispiele-Befehl (Hilfe-Menü) 452 Benannte Bildanker 479 –, Favoriten 480 –, Zurück-Knopf 480 Benennen –, Instanzen auf der Bühne 266 –, Instanzen von drehenden Rädern 307 –, Ordner 148 –, Symbole 140, 146 Benutzerdefinierte Farbtöne –, Erstellen 117

543

Stichwortverzeichnis

Benutzerdefinierte Farbverläufe –, Erstellen 120 –, Verwenden und Bearbeiten 122 Benutzerdefinierte Modemeinstellungen –, Dialogfeld 401 Bereiche –, gesperrte in Führungs-Ebenen 248 Berge –, auf Horizont zeichnen 431 Berichte –, Größenbericht erstellen 407 Betrachten –, Animationen 26 Betrachter siehe Anwender Betrachter von Animationen –, Aufmerksamkeit fesseln 419 –, Erwartungen 421 –, Täuschen 420 Bewegen –, Bühne 30 –, Holzpfosten 428 Bewegung –, Vortäuschen 420 Bewegungstween –, Alpha-Farbeffekt Tweening 196 –, Animationen Abbremsen und Beschleunigen 200 am Beginn enden 199 –, Blaue Tween-Bilder 209 –, Erstellen 192 Regeln 194 –, Farbton-Effekt Instanzen 196 –, Feintuning 199 –, Filmdateigrößen 395 –, Formtweens 210 –, Gegen-UZS-Rotation (gegen den Uhrzeigersinn) 202 –, Instanzen Eigenschaften ändern 197 Farbe tweenen 195 Position tweenen 195 Rotation tweenen 195 Tweening 195 Vergrößerung tweenen 195

544

–, Jojo Abbremsen und Beschleunigen 200 erstellen 199 –, Muster 198 –, Niemandsland 197 –, Pfad-Ebenen 250 –, Rotieren 202 –, Schlüsselbilder 199 –, UZS-Rotation (im Uhrzeigersinn) 202 Bewegungstweening 192 Bibliothek 40, 138, 145 –, + (Pluszeichen) 145 –, Adressleiste 145 –, Allgemeine Bibliotheken (FensterMenü) 355 –, Breaker-Switch-Sound 283 –, Bühne 145 –, Eigenschaften-Dialog Symbole, Verhalten ändern 154 –, Einträge geteilt, Aktualisieren 384 Teilen 381 –, Einträge teilen 381 –, Fenster 147 Öffnen 222 Werkzeuge 147 –, Filmsequenz 139, 153 –, für Schlüsselbilder öffnen 230 –, geteilte Einträge 440 Filme aufbauen 440 –, kennen lernen 145 –, Komponentendefinition (OptionenMenü) 343 –, Konzept 139 –, Kreis-Symbol-Instanzen, Effekte von Helligkeit und Skalierung 156 –, Leinwand-Ebenen Mund auswählen 157 –, Master-Symbole Inhalt erreichen 145 –, mit Ordnern organisieren 148 –, Neues Symbol 143 –, Optionen-Menü 141 –, Ordner Benennen 148 Erstellen 148

Stichwortverzeichnis

–, Organisieren 447 –, Sound in Animationen importieren 223 –, Sound-Dateien (importiert) 223 –, Symbole 148 Adressleiste 141 Arbeitsaufwand minimieren 144 Auge erstellen 155 Benennen 140, 146 betroffene Instanzen 142 Dateigrößen reduzieren 144 Erstellen 142 Erstellen und Verwenden 139 Farbeffekte von Instanzen ändern 151 Farbeffekte von Instanzen, EigenschaftenBedienfeld 150 Haus erstellen 154 Instanzen 140 auf der Bühne platzieren 148 bearbeiten 149 Farbeffekte 150 in Symbolen verwenden 154 Position, Skalierung und Drehung ändern 149 Symbole erstellen 155 Master 154 Neues Symbol 143 Sortieren 147 Umwandeln ausgewählter Objekte 139 Verhalten 140 Verhalten von Instanzen 153 –, Symbol-Verhalten im Eigenschaften-Dialog ändern 154 –, Verwalten 146, 147 Bibliothek-Befehl (Fenster-Menü) 139, 230 Bilddarstellung Popup-Menü –, Vorschau-Befehl 179 –, Vorschau-im-Kontext-Befehl 179 Bilder –, Aktionen 297 –, Aktiv unsichtbare Schaltflächen 285 –, Ball 252 –, Benannte Bildanker Favoriten 480 Zurück-Knopf 480

–, Bezeichnen #static 485 –, Bilder kopieren (Bearbeiten-Menü) –, Bilder-einfügen-Befehl (BearbeitenMenü) 438 –, Bildrate 163, 164, 165, 166, 167 in Filmsequenzen ändern 263 –, effektive Geschwindigkeit 166 –, Formen in einer Filmsequenz 462 –, getweent Blau (Bewegungstween) 209 Grün (Formtween) 209 –, goto-Aktion Abspielen 295 –, Importieren 92 –, Inhalt betrachten mit dem Zwiebelschalen-Werkzeug –, Instanzen Farbton-Effekt 196 –, interpoliert Formtweens 209 –, mehrere Bilder bearbeiten mit dem Zwiebelschalen-Werkzeug –, natürlich wirkende in Animationen –, roter Abspielkopf 163, 164 –, Schaltflächen-Symbole 274 –, Schlüsselbild 167, 168 Bewegungstweens 199 Eigenschaften-Bedienfeld 193 in Animationen 432 Sound 224 –, Schlüsselbildintervall (Videos) 360 –, Tweening in der Zeitleiste 193 –, Zeitleiste 163, 164 Timing 164 Bilder/Fotos-Internetseiten –, Clip Art 518 –, Clip Art Connection 518 Bilder-einfügen-Befehl (BearbeitenMenü) 438 Bilder-kopieren-Befehl (BearbeitenMenü) 438 Bild-exportieren-Menü –, Datei 99 Bild-für-Bild-Animation 176, 183 –, bearbeiten 179

438

181

183 420

545

Stichwortverzeichnis

–, Pausen 183 Bild-für-Bild-Grafik –, Ansicht-Menü 402 Bild-Integrität –, Vektor-Grafiken importieren 98 Bildmaterial (original) –, Werkzeuge 55 Ansicht (Hand und Vergrößern) 56, 57, 58 Bleistift 59, 60 Hand 56, 57, 58 Linie 59, 60 Vergrößern 56, 57, 58 Zeichnen 58 –, zeichnen 54 auf der Bühne 55 Bild-Nummern –, Ziel von goto 295 Bildrate 166, 167 –, Animationen 163, 164, 165, 166 –, Definition 165 –, effektive Geschwindigkeit 166 –, Geschwindigkeit 47 –, in Filmsequenzen ändern 263 –, Zeitleiste 164 Bildschirm –, blinkend 419 –, wandernde Kreise 339 Bitmap 54 –, als Füllungen Text-Effekte 126 –, Bitmap-nachziehen-Befehl (ModifizierenMenü) 398 –, Bitmap-nachziehen-Dialogfeld 398 –, Eigenschaften verändern 103 –, Filme 396, 398 –, Grafik importieren 100 –, zu Vektor-Grafiken konvertieren 108 Bitmap-Eigenschaften-Dialogfeld 102 Bitmap-nachzeichnen-Befehl (ModifizierenMenü) 109, 398 Bitmap-nachziehen-Dialogfeld 398 Bitmap –, als Füllungen 125 Bitmaps siehe Raster-Grafiken Bitmap-Sequenzen 111 –, Exportieren 490

546

Bits in Bytes umrechnen 403 Bit-Tiefe 233 Blaue getweente Bilder (Bewegungstween) 209 Bleistift-Modus 60 Bleistiftsymbol 241, 243 –, aktive Ebenen 242 Bleistift-Werkzeug –, Bildmaterial (original), zeichnen 59, 60 Blinkender Bildschirm 419 Breaker-Switch-Sound 283 Breakpoints in den Code einfügen 468 Breite-Ansicht-Schaltfläche 147 Breiten-Höhen-Relation 28, 29 –, Definition 29 Bühne 27 –, außerhalb der Bühne 28 –, Bedienfelder an- und abdocken 27 –, bewegen 30 –, Bibliothek 145 –, Bildmaterial (original) zeichnen 55 –, Breiten-Höhen-Relation 28, 29 –, Bühnengröße 28 –, Gruppen schwächer dargestellter Inhalt 134 –, Hilfslinien 32 –, Koordinatensystem 37 –, sichtbare Elemente 28 –, Skalierungsfaktor 28, 29 –, Variablen anzeigen 322 –, Vergrößerungswert 58 –, Werkzg-Bedienfeld 32 –, Zeitleiste 33 Bugs –, Code debuggen 463 –, Debugger 465 Bytes in Bits umrechnen 403

C Clip Art Connection Internetseiten Clip Art Internetseite 518 Code –, Aktionen Untersuchen 455

518

Stichwortverzeichnis

–, Breakpoints einfügen 468 –, Debuggen 463 –, Fehler beheben 463 –, für Projekt-Aufgaben verwalten 459 –, Pause/Wiedergabe-Umschaltknopf 356 –, verwalten, Projekt-Aufgaben 459 Code-Data-Separation 437 –, Symbol-Wechsel-Technik 438 ComboBox-Komponente 334 –, Web-Site-Adressen angeben 336 Communication Arts Internetseite 520 Computergrafiken erstellen 54

D Darüber-Sound –, Schaltflächen erstellen 283 Darüber-Zustand von Schaltflächen 274, 277 Datei-Befehl (Bild-exportieren-Menü) 99 Dateien –, .ai-Erweiterung 93, 99 –, .asf Videos 352 –, .avi Videos 352 –, .dv Videos 352 –, .dvi Videos 352 –, .fla Lernen aus 453 –, .fla-Quellen Herunterladen 520 –, .jpg laden 374 –, .mov Videos 352 –, .mpeg Videos 352 –, .mpg Videos 352 –, .swf Statistik 401 Veröffentlichen 481 Videos 351 –, .swf-Erweiterung 93, 95 –, .wmv

Videos 352 –, AIF-Sound 221 –, auf Web-Server hochladen 370 –, Beispiele Flash lernen 452, 453 –, EPS-Dateien (Encapsulated PostScript) Vektor-Grafiken importieren 94 –, Exportieren .swf-Option 98 –, Filme Bandbreiten-Profiler 400 Dateien verbessern 404 Ladezeiten 400 Preloader 408 Bewegungstween 395 Bitmap 396, 398 dynamischer Text 394 Eingabetext 394 Formtween 395 Größen reduzieren 390, 391, 395 Größenbericht erstellen 407 Importieren und Komprimieren 399 Ladezeiten kalkulieren 391 Linien und Füllungen Vergleich 392 Performance Ecken abrunden (niemals verwenden) 412 Form (niemals verwenden) 412 Grafik-Symbole 411 Kurven optimieren 411 Linientypen (vermeiden) 413 Modifizieren (niemals verwenden) 412 Spezialeffekte 409 Streaming-Sound 410 verbessern 409, 410 Schlüsselbilder 395 Sound 396 Text teilen 393 verschachtelte Filmsequenzen und verschachtelte Grafik-Symbole vergleichen 395 –, Filmsequenz Dateigröße einsparen 267 –, Flash-Player Vektor-Grafiken importieren 95 –, Freehand

547

Stichwortverzeichnis

Vektor-Grafiken importieren 93 –, GIF statische Grafiken 487 –, GIF (Graphical Interchange Format) Veröffentlichen 484 –, Größen reduzieren 144 –, HTML (HyperText Markup Language) Veröffentlichen 482 –, Importieren 399 –, in Notepad öffnen 366 –, JPG (Joint Photographic Experts Group) Veröffentlichen 484 –, keyframing.fla 168 –, Komprimieren 399 JPEG (Joint Photographic Experts Group) 103 Artefakte 109 verlustbehaftet 358 verlustlos 358 verlustlos (GIF/PNG) 107 –, maze.fla Flash lernen 457 –, MP3-Sound 221 –, MPEG (Moving Pictures Expert Group) 352 –, nicht-.jpg-Dateinamenerweiterung Importieren 105 –, öffnen 56 –, PNG statische Grafiken 486 Veröffentlichen 484 –, Schaltflächen-Grafiken Größe minimieren 276 –, Schriftumrisse 394 –, Sound Filtern 222 Größen und Qualität 232 –, Standardqualität-Einstellungen 105 –, Vektor-Grafiken importieren 92 –, verbessern mit Bandbreiten-Profiler 404 –, WAV-Sound 221 –, Wiederherstellen-Befehl (DateiMenü) 459 Dateiformate –, FLA 178 –, nicht unterstützte importieren 93

548

Dateigrößen –, Schaltflächen-Grafiken minimieren 276 Datei-Menü –, Einstellungen für Veröffentlichungen 365 –, Film exportieren 490, 491 –, Importieren 101, 222, 352 –, Neu 24 –, Öffnen 29, 56 –, Veröffentlichen 364, 365 –, Vorschau für Veröffentlichung 305, 364, 477 –, Wiederherstellen 459 Dateinamenerweiterungen –, .ai 93, 99 –, .asf Videos 352 –, .avi Videos 352 –, .dv Videos 352 –, .dvi Videos 352 –, .fla Lernen aus 453 –, .fla-Quelldateien Herunterladen 520 –, .mov Videos 352 –, .mpeg Videos 352 –, .mpg Videos 352 –, .swf 93, 95 Statistik 401 Veröffentlichen 481 Videos 351 –, .wmv Videos 352 –, nicht-.jpg Importieren 105 Dateitypen –, .fla (Flash-Quelldatei) 48 –, .html (Homepage-Datei) 49 –, .swf (Flash-Player-Datei) 48

Stichwortverzeichnis

Daten –, Code von Daten trennen Symbol-Wechsel-Technik 438 Daumenkino-Animation 176 Deaktivieren-Option –, Sound-Komprimierung 234 Debugger 465 –, Breakpoints in den Code einfügen 468 Debugging –, Code 463 –, Variablen in Hauptzeitlinie anzeigen 467 Definieren –, Aktiv-Zustand von Schaltflächen 275 –, gesperrte Bereiche in FührungsEbenen 248 –, Rollen für Projekt-Teamarbeit 436 Definitionen –, .fla-Datei 178 –, Anwender 27 –, Bedienfelder 24 –, Bildrate 165 –, Breiten-Höhen-Relation 29 –, effektive Geschwindigkeit 166 –, Instanz 40 –, Komponenten 334 –, Koordinatensystem 37 –, Namenskonvention 448 –, Schrubben 165 –, Skalierung 29 –, Symbol 40 –, Tweening 172 Dialogboxen –, Symbol wechseln 438 Dialogfelder –, Benutzerdefinierte Modemeinstellungen 401 –, Bitmap nachziehen 398 –, Bitmap-Eigenschaften 102 –, Ebenen-Eigenschaften 249 –, Hülle bearbeiten Abspielende 229 Abspielstart 229 Hüllenanfasser 228 Hüllenkurve 228 Linker Kanal/rechter Kanal 228 Sekunde/Bilder 229

Stopp/Abspielen 229 Vergrößern/Verkleinern 229 –, Pfad einfügen 308 –, Soundeigenschaften 233 –, Spark-Komprimierung konfigurieren 358 Digital Video –, .dv-Dateien Videos 352 –, .dvi-Dateien Videos 352 Digital-Audio-Grundlagen 232 Director Online User Group (DOUG) Internetseite 516 DirectX 7 herunterladen 352 Dokumentation –, Konventionen 446 Dokument-Befehl (Modifizieren-Menü) 165, 255 Dokumenteigenschaften 46 DOUG-Internetseite (Director Online User Group) 516 Download –, Filme mit Filmsequenz oder GrafikSymbol 267 Downloadzeit für Videos minimieren 358 Drag&Drop-Interaktionen erzeugen 316 Drehende Räder –, Instanzen anvisieren 309 Drehende Räder erstellen 261 Drehung von Symbol-Instanzen ändern 149 Drittanbieter-Produkte –, Internetseiten Flash Jester 519 SWF-Studio 519 Swift 3D 519 Wildform 519 Drücken-Ereignis (Maustaste) 317 Drücken-Zustand von Schaltflächen 274, 277 Dynamischer Text 394 –, Hyperlinks erstellen 368

E Ebene als Kontur anzeigen (EbenenEigenschaft) 244 Ebene einblenden/ausblenden (EbenenEigenschaft) 244

549

Stichwortverzeichnis

Ebene sperren/freigeben (EbenenEigenschaft) 244 Ebene-Befehl (Einfügen-Menü) 231, 241 Ebenen –, aktive Bleistiftsymbol 242 –, Animationen 35 –, editieren, Eigenschaften 243 –, erzeugen 241 –, Inhalte anzeigen 245 –, Leinwand 128 Halbmonde erstellen 128 Mund auswählen 157 –, Objekte isolieren 128 –, Pfad und Ball 252 –, Tiefe in Animationen simulieren 428 –, von Holzpfosten 429 –, Zeitleiste 34 Ebenen in Animationen 240 –, Ausgerichtet (Ebenen-Eigenschaft) 244 –, Ebene als Kontur anzeigen (EbenenEigenschaft) 244 –, Ebene einblenden/ausblenden (EbenenEigenschaft) 244 –, Ebene sperren/freigeben (EbenenEigenschaft) 244 –, Ebenen-Name (Ebenen-Eigenschaft) 244 –, Eigenschaften für das Editieren 243 –, Eigenschaften für visuelle Effekte 247 Führungs-Ebenen 247 –, Führungs-Ebene (EbenenEigenschaft) 244 –, Führungs-Ebenen 247 Objekte positionieren 247 –, Konturen 244 –, Kreise animieren 240, 241 –, Maske (Ebenen-Eigenschaft) 244 –, Maskiert (Ebenen-Eigenschaft) 244 –, maskierte Ebene Gebäude 255 –, Maskierungs-Ebene 253 Scheinwerfer-Effekt erzeugen 254 –, Normal (Ebenen-Eigenschaft) 244 –, Ordner (Ebenen-Eigenschaft) 244 –, Pfad (Ebenen-Eigenschaft) 244 –, Pfad-Ebenen 250 springende Bälle erzeugen 251

550

–, Registrierung Rahmen-Form 248 –, Verstecken 244 –, verwalten 246 Ebenen siehe Zeitlinien Ebenen-Eigenschaften-Dialogfeld 249 Ebenen-Name (Ebenen-Eigenschaft) 244 Ebenen-Ordner einfügen (EinfügenMenü) 246 Ecken abrunden (niemals verwenden) –, Film-Performance 412 Effekte –, Farben von Symbol-Instanzen 150 –, Farben von Symbol-Instanzen ändern 151 Effekt-Einstellungen (Sound) 227 effektive Geschwindigkeit (Bildrate) 166 –, Definition 166 Effizienz (Sound) 236 Effizienz siehe Feintuning Eigenschaften –, _framesloaded 378 –, _totalframes 378 –, Alpha-Wert einer Filmsequenz-Instanz ändern 327 –, auslesen 328 –, Ebenen Editieren 243 –, Geschwindigkeit (wandernde Kreise) erstellen 341 –, hausgemacht von Filmsequenz, Erzeugen und Ändern 329 –, von Bitmaps, verändern 103 –, von Ebenen für visuelle Effekte 247 Führungs-Ebenen 247 –, von Instanzen, ändern 197 –, von Komponenten benutzerdefiniert, auf _parent zeigen 343 benutzerdefiniert, Erstellen 341 –, von Sequenz-Instanzen hausgemacht 329 –, Wert von Variablen erhöhen 326 Eigenschaften-Bedienfeld 24, 35, 59 –, Alpha 151 –, Bibliothek 40 –, Erweitert 151 –, Farbton 151

Stichwortverzeichnis

–, –, –, –, –,

Füllfarbe 36 Helligkeit 151 Hülle bearbeiten 397 Instanzen auf der Bühne benennen 266 Instanzen von drehenden Rädern benennen 307 –, Schaltfläche Symbol wechseln 438 –, Schlüsselbilder 193 –, Sound anzeigen 224 –, Sound-Dateien (importiert) 223 –, Symbole Namen anzeigen 261 –, Symbol-Instanzen Farbeffekte 150 –, Text-Blöcke Verhalten angeben 323 –, Wdh 284 Eigenschaften-Befehl (Fenster-Menü) 25, 59 Eigenschaften-Befehl (Optionen-Menü) 102 Eigenschaften-Dialog –, Symbole, Verhalten ändern 154 Einfügen –, Aktionen Feintuning 310 –, Breakpoints in den Code 468 –, goto-Aktion 293 –, Schlüsselbilder 25 –, with-Aktion 307 Einfügen-Menü –, Befehle, Ebene 241 –, Ebene 231 –, Ebenen-Ordner einfügen 246 –, In Symbol konvertieren 155, 444 –, In Symbol umwandeln 139 –, Neues Symbol 142, 263 –, Schlüsselbild-Befehl 176, 182 –, Szene 408, 438 –, Befehle, Schlüsselbild 167 Eingabetext 394 Eingebettete Schriftarten –, in dynamischem Text 394 –, in Eingabetext 394 Einstellungen –, Effekt (Sound) 227 –, Export (Sound) 235 –, Exportieren (Sound) 233

–, Sync (Sound) 225 Ereignis 225 Start 226 Stoppen 226 Stream 226 –, Veröffentlichung, global (Sound) 233 –, Wdh (Sound) 229 Einstellungen für Veröffentlichung 474 –, Registerkarte Flash 475, 481 –, Registerkarte Formate 475, 487 –, Registerkarte GIF 476 –, Registerkarte HTML 476, 483 –, Registerkarte QuickTime 489 Einstellungen für Veröffentlichungen-Befehl (Datei-Menü) 365 E-Mail –, mailto-Befehl 370 –, senden 370 E-Mail-Adressen 292 Emigre-Internetseite 519 Encapsulated PostScript siehe EPS Endpunkt (Sound) 229 Entf-Kurztaste 280 Entladen –, Filme 378 Entwerfen –, Internetseiten modular 374 EPS-Dateien (Encapsulated PostScript) –, Vektor-Grafiken importieren 94 Ereignis (Sync-Einstellung) 225 Ereignisse –, Drücken (Maustaste) 317 –, Loslassen (Maustaste) 317 –, Maus {} (geschweifte Klammern) 300 ändern 318 Schaltflächen 298 –, Maus-release with-Aktion einfügen 307 Erhöhen –, Werte von Schaltflächen-zaehlerVariable 325 Erkennen für Flash 4 (Template) 478 Erstellen 354 –, 3D-Kugel 510

551

Stichwortverzeichnis

–, –, –, –, –, –, –,

–, –, –, –, –, –, –, –,

–, –, –, –, –, –, –, –, –, –, –, –, –, –,

Animationen 24, 26 animierte Schaltflächen 279 Auge-Symbol 155 benutzerdefinierte Eigenschaft einer Komponente 341 benutzerdefinierte Farbtöne 117 benutzerdefinierte Farbverläufe 120 Verwenden und Bearbeiten 122 Bewegungstweens 192 Instanzen, Tweening 195 Regeln 194 drehende Räder 261 Farbrad 512 Farbtonfelder 116 Farbverlaufsfelder 116 Figuren 494 Filmsequenz 260 Formtween Schachbretteffekt 208 Formtweens 206 Bewegungstweens 210 Gruppen 207 interpolierte Bilder 209 Linien und Füllungen nicht mischen 209 Quadrat-Instanzen, Verformung 210 Regeln 207 Vereinfachen 208 fünfeckiger Stern 501 Geschwindigkeits-Eigenschaft (wandernde Kreise) 341 Halbkreis 494 Halbmonde auf Leinwand-Ebene 128 Haus-Symbol 154 Hyperlinks mit dynamischem Text 368 Komponenten 338 Kreis-Schaltfläche 461 Linien-Schaltfläche 461 Ordner 148 Pause-Schaltfläche 355 Projektor 487 Quadrat-Schaltfläche 461 Schaltflächen 272 Darüber-Sound 283 meinVideo-Symbol 355

552

unsichtbar 284, 285 wiederholter Sound 284 –, Speichen in einem Rad 497 –, Stopp-Schaltfläche 355 –, Symbole 139, 142 mit ausgewählten Objekten 139 mit Symbol-Instanzen 155 –, Szenen 438 –, Templates 442 –, Wellen 508 –, Wiedergabe-Schaltfläche 355 –, Wiedergabe-Steuerung für Videos 354 Erwartungen von Betrachtern 421 Erweitert (Eigenschaften-Bedienfeld) 151 Erweiterte Schaltflächen 279 –, animiert Behandlungs-Optionen 282 Erstellen 279 Sound 282 Erzeugen –, Ebenen 241 –, Scheinwerfer-Effekte 254 –, springende Bälle in Pfad-Ebenen 251 –, Unschärfe 420 –, verschiebbare Objekte 317, 319 anonyme Methode 319 Erzeugen und Ändern der Eigenschaften einer Filmsequenz 329 evaluate-Aktion 325, 327 Export-Einstellungen (Sound) 233, 235 Exportieren –, .swf-Option 98 –, AVI-Videos 490 –, Bitmap-Sequenzen 490 –, Filme in Grafik-Symbol (vorrendern) 267 –, Medientypen 490

F F11-Kurztaste 139 F8-Kurztaste 139 Farbe (Instanzen-Tweening) Farbeimer-Werkzeug 32 –, Füllung sperren 122 Farben –, Alpha Tweening 196

195

Stichwortverzeichnis

–, benutzerdefinierte Farbtöne erstellen 117 –, Bitmaps als Füllungen 125 Text-Effekte 126 –, Effekte Symbol-Instanzen 150 –, Effekte ändern Symbol-Instanzen 151 –, Erweitert (Eigenschaften-Bedienfeld) 151 –, Farbmischer-Bedienfeld Farbverläufe ändern 121 –, Farbtöne Farbtonfelder erstellen 116 –, Farbton-Effekt Instanzen 196 –, Farbverläufe 116 benutzerdefinierte erstellen 120 Farbverlaufsfelder erstellen 116 Verwenden und Bearbeiten 122 –, Füllung bearbeiten 36 –, Füllung sperren (FarbeimerWerkzeug) 122 –, Füllung-transformieren-Werkzeug 122 Verläufe 124 –, Kopieren 118 –, Raster-Grafiken als Füllungen 125 Text-Effekte 126 –, RGB (Rot, Grün und Blau) 119 –, Text in Füllungen umwandeln 126 –, Verläufe Attribute verändern 122 Farbmischer-Bedienfeld 117 –, Farbverläufe ändern 121 Farbrad erstellen 512 Farbtöne –, Farbtonfelder erstellen 116 Farbtöne-Bedienfeld 117 Farbton (Eigenschaften-Bedienfeld) 151 Farbton-Effekt –, Instanzen 196 Farbtonfelder –, Farbtöne erstellen 116 Farbverläufe 116 –, Attribute verändern 122 –, Farbverlaufsfelder erstellen 116

–, Füllung-transformieren-Werkzeug 124 Farbverlaufsfelder –, Erstellen 116 Favoriten –, Benannte Bildanker 480 Fehler –, Debugger 465 –, im Code beheben 463 Fehlerbehebung –, Variablen in Hauptzeitlinie anzeigen 467 Fehlersuche-Befehl (Steuerung-Menü) 466 Fehlersuche-Menü –, Anpassen 401 Feintuning –, Aktionen einfügen 310 –, Bewegungstweens 199 –, Formtweens 211 Felder –, Variable 324 –, Wert 324 Fenster –, anvisieren 369 –, Bibliothek 147 Öffnen 222 Werkzeuge 147 Fenster-Menü –, Allgemeine Bibliotheken 355 –, Bedienfeldsätze-Befehl 39 –, Bibliothek 139, 230 –, Dokumenteigenschaften 46 –, Eigenschaften 25, 59 –, Komponenten 334 –, Werkzeuge 55 –, Zeitleiste 25 Figuren erstellen 494 File Transfer Protocol siehe FTP Filme –, Aufbauen 440 –, Bandbreiten-Profiler 400 Dateien verbessern 404 Preloader 408 –, Bibliotheken Einträge, geteilt (Aktualisieren) 381, 384 –, Bilder mit #static bezeichnen 485 –, Bitmap 396, 398

553

Stichwortverzeichnis

–, Dateien Bewegungstween 395 dynamischer Text 394 Eingabetext 394 Formtween 395 Größen reduzieren 390, 391, 395 Importieren und Komprimieren 399 Linien und Füllungen 392 Schlüsselbilder 395 Text teilen 393 verschachtelte Filmsequenzen und verschachtelte Grafik-Symbole vergleichen 395 –, Debugger 465 –, Download-Reihenfolge Effekte 267 –, entladen 378 –, Erkennen für Flash 4 (Template) 478 –, Flash-Player 476 deinstallieren 478 –, geladen Feststellen, wann 378 vollständig, feststellen ob 378 –, Größenbericht erstellen 407 –, Hauptfilme 374 –, in Grafik-Symbol exportieren (vorrendern) 267 –, laden 374 –, Ladezeiten 400 Kalkulieren 391 –, loadMovie-Aktion 374, 375 Sequenzen 377 Stufen anvisieren 377 –, mit Web-Servern verknüpfen 364 –, Optimieren 390 –, Performance Ecken abrunden (niemals verwenden) 412 Form (niemals verwenden) 412 Grafik-Symbole 411 Kurven optimieren 411 Linientypen (vermeiden) 413 Modifizieren (niemals verwenden) 412 Spezialeffekte 409 Streaming-Sound 410 verbessern 409, 410

554

–, Projektor Erstellen 487 fscommand-Aktion 489 –, Schriftarten Geräteschriftart-Kontrollkästchen 484 importiert, Identifizieren 385 Teilen 385 –, Scripts verknüpfen 385 –, Sound 396 Hülle bearbeiten (EigenschaftenBedienfeld) 397 Komprimieren 396 –, statische Grafiken GIF-Dateien 487 Macromedia Fireworks 485 PNG-Dateien 486 –, Szenen erstellen 438 –, Templates 478 –, Text teilen 393 –, Unterfilme 374 –, Veröffentlichen 364, 474 .swf-Dateien 481 AVI-Videos 490 Benannte Bildanker 479, 480 Bitmap-Sequenzen 490 Dateien auf Web-Server hochladen 370 Einstellungen für Veröffentlichung 474 Einstellungen für Veröffentlichung, Flash 475, 481 Einstellungen für Veröffentlichung, Formate 475, 487 Einstellungen für Veröffentlichung, GIF 476 Einstellungen für Veröffentlichung, HTML 476, 483 Einstellungen für Veröffentlichung, QuickTime 489 E-Mail senden 370 Fenster anvisieren 369 GIF-Dateien (Graphical Interchange Format) 484 HTML-Dateien (HyperText Markup Language) 482 Hyperlinks 367 mit dynamischem Text erstellen 368

Stichwortverzeichnis

JPG-Dateien (Joint Photographic Experts Group) 484 Medientypen exportieren 490 wählen 481 PNG-Dateien 484 Projector (Windows und Macintosh) 487 QuickTime-Videos 489 Templates individuell gestalten 478 Warnmeldungen anzeigen 484 –, veröffentlichen Dateien in Notepad öffnen 366 getURL-Aktion 367 Filme (nichtlinear) –, ActionScript 290 –, Aktionen 290 bearbeiten 292 Bedienfeld Aktionsliste 291 Komponenten 291 Parameterbereich 291 Scriptbereich 291 Bilder 297 Bild-Nummern Ziel von goto 295 durch Parameter spezifizieren 293 Einfügen Feintuning 310 Filmsequenz 301 auf Instanzen platzieren 301 bearbeiten 303 getURL 304 wiederholen 293 Filmsequenzen anvisieren 305 hinzufügen 292 Schaltflächen 298 Abspielen anhalten oder fortfahren 298 Hyperlinks 304 with eingebundene Instanzen anspringen 306 Film-Explorer 454 Film-exportieren-Befehl (Datei-Menü) 490, 491 Film-Größe (Videos) 358 Filmsequenz 139, 153, 265 –, Aktionen 301, 303

bearbeiten 303 getURL 304 platzieren 301 with 306 –, Animationen 260 –, anvisieren Aktionen 305 –, Bilder Formen 462 –, Bildraten ändern 263 –, Dateien Dateigröße einsparen 267 –, Download-Reihenfolge Effekte 267 –, drehende Räder Erstellen 261 –, Erstellen 260 –, hausgemachte Eigenschaften Erzeugen und Ändern 329 –, in Komponenten umwandeln 343 –, Instanzen adressierbar 266 Alpha-Wert ändern 327 auf der Bühne benennen 266 Eigenschaften auslesen 328 Verhalten 263 –, Komponenten 334 –, Komponentendefinition (OptionenMenü) 343 –, Quadrate Quadratfilmsequenz 267 –, Symbole und Grafik-Symbole 262 –, Verhalten 260 –, verschachtelte Filmsequenzen und verschachtelte Grafik-Symbole 395 –, Wiederholung 264 Film-testen-Befehl (Steuerung-Menü) 231 Filtern –, Sound-Dateien 222 Fireworks (Macromedia) –, statische Grafiken 485 Flash –, Lernen 452 aus .fla-Dateien 453 Beispiel-Dateien 452, 453 Code debuggen 463

555

Stichwortverzeichnis

Debugger 465 Hallo, Welt, Übungsaufgabe 461 Hilfe-Menü 452 Kreis-Schaltfläche erstellen 461 Lernen durch Praxis 460 Linien-Schaltfläche erstellen 461 maze.fla-Datei 457 Online-Tutorials 452 Pfeiltasten, Übungsaufgabe 461 Projekt-Aufgaben, aufteilen 457 Projekt-Aufgaben, Code verwalten 459 Projekt-Aufgaben, Selbstschutz 458 Projekt-Aufgaben, verwalten 457 Quadrat-Schaltfläche erstellen 461 Scripts, Trace-Aktion 464 Software 460 springender Ball, Übungsaufgabe 461 Übungsaufgaben 460 weiter Lernen 459 –, Programmieren 322 Variablen 322 –, Vektor-Programme, Zusammenspiel 99 Flash 4 –, Erkennen für (Template) 478 Flash Academy Internetseite 516 Flash Challenge Internetseite 520 Flash Film Festival Internetseite 520 Flash Jester Internetseite 519 Flash Kit Internetseite 516 Flash Magazine Internetseite 517 Flashlite-Internetseite 517 Flash-Oberfläche 27 –, Bedienfelder 35 an- und abdocken 27 –, Bedienfeldsätze 39 –, Bibliothek 40 –, Bühne 27 außerhalb der Bühne 28 Breiten-Höhen-Relation 28, 29 Bühnengröße 28 Koordinatensystem 37 sichtbare Elemente 28 Skalierung 28, 29 Zeitleiste 33 –, Dokumenteigenschaften-Fenster 46 –, Koordinatensystem 37

556

–, Werkzg-Bedienfeld 27, 32 –, Zeitleiste 27 Bilder 42 Ebenen 42 Navigation 45 Symbol 43 Szene 43 Flash-Player –, Deinstallieren 478 –, Filme 476 Flash-Player-Datei (.swf) 48 –, Vektor-Grafiken Importieren 95 Flash-Quelldatei (.fla) 48 Flash-Registerkarte (Einstellungen für Veröffentlichungen) 475, 481 Flazoom.com-Internetseite 517 Form (niemals verwenden) –, Film-Performance 412 Formate –, Dateien (nicht unterstützt), importieren 93 –, Sound in Animationen importieren 221 –, Videos importieren 351 Formate-Registerkarte (Einstellungen für Veröffentlichung) 475, 487 Formatierung von Text in FreeHand 97 Form-Befehl (Modifizieren-Menü) 212 Formeln –, Ladezeiten kalkulieren 391 Formen von Bildern (Filmsequenz) 462 Formmarken –, Formtweens 211 Formmarken-anzeigen-Befehl (AnsichtMenü) 212, 215 Formtween –, Bewegungstweens 210 –, Erstellen 206 –, Feintuning 211 –, Filmdateigrößen 395 –, Formmarken 211 –, Grüne Tween-Bilder 209 –, Gruppen 207 –, interpolierte Bilder 209 –, Linien und Füllungen nicht mischen 209 –, Morphs 206

Stichwortverzeichnis

–, Quadrat-Instanzen Verformung 210 –, Regeln 207 –, Schachbretteffekt 208 –, Vereinfachen 208 –, Vermeiden 216 –, vertikale Linien verschieben 212 Fortgeschrittene Videosteuerung 356 Fortschrittsanzeigen –, Videos 357 Fotografie siehe Grafik Fotos/Bilder-Internetseiten –, Clip Art 518 –, Clip Art Connection 518 FreeHand –, Textformatierung 97 FreeHand-Dateien –, Vektor-Grafiken importieren 93 fscommand-Aktion –, Parameter 489 –, Projektor 489 FTP (File Transfer Protocol) 370 Führungs-Ebene (Ebenen-Eigenschaft) –, Ebenen 244 Führungs-Ebenen 247 –, gesperrte Bereiche definieren 248 –, Objekte positionieren 247 Füllfarbe bearbeiten 36 Füllmuster-hinzufügen-Befehl (OptionenMenü) 118 Füllung sperren (Farbeimer-Werkzeug) 122 Füllung sperren nicht aktiviert 123 Füllungen –, Bitmaps 125 Text-Effekte 126 –, Füllung sperren (FarbeimerWerkzeug) 122 –, Füllung sperren nicht aktiviert 123 –, Linien 392 –, Raster-Grafiken 125 Text-Effekte 126 –, Text umwandeln 126 –, und Linien, nicht mischen 209 Füllung-transformieren-Werkzeug 122 –, Farbverläufe 124

Fünfeckigen Stern erstellen Full-Path-Reviews 437

501

G Gebäude (maskierte Ebene) 255 Gegen-UZS-Rotation (gegen den Uhrzeigersinn) 202 Geräteschriftart-Kontrollkästchen 484 Geschweifte Klammern ({}) 337 –, Stop-Aktion in with-Aktion einfügen 308 Geschwindigkeit –, Bildrate 47 –, relative Tiefe in Animationen simulieren 428 Geschwindigkeits-Eigenschaft (wandernde Kreise) erstellen 341 Gesperrte Bereiche definieren –, Führungs-Ebenen 248 getBytesLoaded-Methode 378 getBytesTotal-Methode 378 Geteilte Bibliothekseinträge 440 –, Filme aufbauen 440 getSelectedIndex-Methode 337 getURL –, Aktionen Filmsequenz 304 getURL-Aktion 367 Getweente Bilder –, Blau (Bewegungstween) 209 –, Grün (Formtween) 209 GIF –, Dateien veröffentlichen 484 –, statische Grafiken Macromedia Fireworks 485 –, Verlustlos (GIF/PNG) Datei-Komprimierung 107 GIF-Dateien –, statische Grafiken 487 GIF-Registerkarte (Einstellungen für Veröffentlichungen) 476 Gitternetz-anzeigen-Befehl (AnsichtMenü) 30 Gitternetz-bearbeiten-Befehl (AnsichtMenü) 31

557

Stichwortverzeichnis

Globale Veröffentlichungseinstellungen (Sound) 233 goto –, Bild-Nummern als Ziel 295 goto-Aktion –, Abspielen 295 –, Aktionen-Bedienfeld 294 –, Einfügen 293 –, Ziele 296 Grafik –, animieren 176 –, Bitmap Sequenzen 111 –, Drehende Räder Instanzen anvisieren 309 –, drehende Räder Erstellen 261 –, Exportieren .swf-Option 98 –, Farben kopieren 118 –, Farbmischer-Bedienfeld 117 Farbverläufe ändern 121 –, Farbtöne-Bedienfeld 117 –, Füllung sperren nicht aktiviert 123 –, Füllung-transformieren-Werkzeug Verläufe 124 –, Halbmonde auf Leinwand-Ebene erstellen 128 –, Import Gründe, Import zu vermeiden 91 –, Importieren 90 Bitmaps 100 Größen 98 –, JPEG (Joint Photographic Experts Group) Datei-Komprimierung 103 Artefakte 109 –, Kreise an Quadrat ausrichten 132 Bereiche auswählen und entfernen 129 Gruppieren 134 Logos Auswirkungen beim Entfernen 129 Logos mit drei Kreisen Auswirkungen beim Verschieben 130 Quetschen 422 –, Kreise animieren 240

558

–, Objekte gruppieren 129 Effekte 130 Gruppen bearbeiten 131 –, Objekte isolieren 126 Ebenen 128 Sehen und Auswählen 127 –, Pfeiltasten Übungsaufgabe 461 –, Quadrate Gruppen, Änderung der Adressleiste 133 Gruppen, Veränderungen innerhalb 133 Gruppieren 134 –, Raster Bitmap-Eigenschaften verändern 103 –, Raster importieren 101 Bitmaps zu Vektor-Grafiken konvertieren 108 –, RGB (Rot, Grün und Blau) 119 –, Schaltflächen Aktionen 278 Aktiv-Zustand definieren 275 vergrößern 276 Als Menüelement behandeln 282 Als Schaltfläche behandeln 282 animiert Behandlungs-Optionen 282 Erstellen 279 Sound 282 Auf-Zustand 274, 277 Bilder in Symbolen 274 Darüber-Sound erstellen 283 Darüber-Zustand 274, 277, 283 Dateigrößen, Auswirkung auf 276 Drücken-Zustand 272, 274, 277 Erstellen 272 erweitert 279 Instanzen 278 Aktionen 279 Interaktivität 272 Mauzeiger-Formen 273 Symbole in Symbolen 277 unsichtbar 284 Aktiv-Bild 285 Erstellen 285 wiederholten Sound erstellen 284

Stichwortverzeichnis

Zustände Hinzufügen 273 Symbole 277 –, springender Ball Übungsaufgabe 461 –, statisch GIF-Dateien 487 Macromedia Fireworks 485 PNG-Dateien 486 –, über den Bildschirm wandernde Kreise 339 –, Vektor Bitmaps konvertieren 108 Importieren 92 aus Dateien 92 aus EPS-Dateien (Encapsulated PostScript) 94 aus Flash-Player-Dateien 95 aus FreeHand-Dateien 93 aus Programmen 97 Bild-Integrität 98 Zusammenspiel zwischen Flash und Vektor-Programmen 99 –, Verlustlos (GIF/PNG) Datei-Komprimierung 107 Grafiken –, Raster 54 –, Vektor 54 –, Vektor- und Raster, Vergleich 90 Grafik-Symbol –, Animationen 260 –, Ankoppeln an Zeitlinie 265 –, Download-Reihenfolge, Effekte 267 –, Filme exportieren, vorrendern 267 –, Film-Performance 411 –, Filmsequenz-Symbole 262 –, Schrubbertechnik 264 –, verschachtelte Filmsequenzen und verschachtelte Grafik-Symbole vergleichen 395 –, Vorschau 264 Größe –, importierte Grafik 98 –, Tiefe in Animationen Simulieren 428 Größe von Dateien –, Bewegungstween 395

–, dynamischer Text 394 –, Eingabetext 394 –, Formtween 395 –, Linien und Füllungen Vergleich 392 –, reduzieren 144, 391, 395 –, Schlüsselbilder 395 –, Schriftumrisse 394 –, Text teilen 393 –, verschachtelte Filmsequenzen und verschachtelte Grafik-Symbole vergleichen 395 Größe von Text in Videos 351 Größen und Qualität von Sound-Dateien 232 Größenbericht erstellen 407 Grüne getweente Bilder (Bewegungstween) 209 Grundlagen –, Digital-Audio 232 Gruppen –, Änderungen der Adressleiste 134 –, Bühne Inhalt schwächer darstellen 134 –, Formtweens 207 –, Quadrate Veränderungen innerhalb 133 Gruppen von Objekten –, Bearbeiten 131 Gruppen von Quadraten –, Änderung der Adressleiste 133 Gruppieren –, Kreise 134 –, Quadrate 134 Gruppieren-Befehl (Modifizieren-Menü) 131 Gruppierung-aufheben-Befehl (ModifizierenMenü) 131

H Halbkreis –, erstellen 494 Halbmonde –, auf Leinwand-Ebene erstellen Handwerkzeug 30 –, Bildmaterial (original) zeichnen 56, 57, 58 Hauptfilme 374 Hauptzeitlinie

128

559

Stichwortverzeichnis

–, Variablen anzeigen 467 Hausgemachte Eigenschaften –, von Filmsequenz Erzeugen und Ändern 329 –, von Sequenz-Instanzen 329 Haus-Symbol erstellen 154 Helligkeit (Eigenschaften-Bedienfeld) 151 Herunterladen –, .fla-Quelldateien 520 –, DirectX 7 352 –, Filme Bandbreiten-Profiler 400 Zeit kalkulieren 391 –, QuickTime 221 –, QuickTime 4 352 Hilfe –, Bandbreiten-Profiler Dateien verbessern 404 Hilfe-Menü –, Beispiele 452 –, Flash lernen 452 –, Lektionen 452 Hilfslinien 32 Hinweise –, sichtbar Zeitleiste 34 Hochladen –, Dateien auf Web-Server 370 Höhen-Breiten-Relation –, Videos 351 Holzpfosten –, Ebenen 429 –, laufend 428 Homepage-Datei (.html) 49 Horizont –, Berge zeichnen 431 horizontale X-Achse 37 HTML –, Anker 479 –, Dateien veröffentlichen 482 –, Erkennen für Flash 4 (Template) 478 HTML-Registerkarte (Einstellungen für Veröffentlichungen) 476, 483 Hülle, bearbeiten (EigenschaftenBedienfeld) 397

560

Hülle bearbeiten –, Abspielende 229 –, Abspielstart 229 –, Hüllenanfasser 228 –, Hüllenkurve 228 –, linker Kanal/rechter Kanal 228 –, Sekunde/Bilder 229 –, Stopp/Abspielen 229 –, Vergrößern/Verkleinern 229 Hüllenanfasser (Hülle bearbeiten) 228 Hüllenkurven (Hülle bearbeiten) 228 Hyperlinks –, Filme veröffentlichen, getURL-Aktion 367 –, mit dynamischem Text erstellen 368 –, Schaltflächen Aktionen 304

I Illustrator siehe Adobe Illustrator Immer als Rechteck-Option (startDragAktion) 321 Importieren –, Audio 92 –, Bilder 92 –, Dateien 399 –, Grafik 90 Bitmaps 100 Bitmaps, Sequenzen 111 Gründe, Import zu vermeiden 91 Raster 101 Raster, Bitmap-Eigenschaften verändern 103 Raster, Bitmaps zu Vektor-Grafiken konvertieren 108 –, nicht unterstützte Dateiformate 93 –, nicht-.jpg-Dateinamenerweiterung 105 –, QuickTime-Videos 352 Sorenson-Spark-Komprimierung 353 –, Raster-Grafiken 101 Bitmaps zu Vektor-Grafiken konvertieren 108 –, Sound in Animationen 220 AIF-Sound-Dateien 221 aus Bibliotheken 223 MP3-Sound-Dateien 221

Stichwortverzeichnis

unterstützte Formate 221 WAV-Sound-Dateien 221 –, Vektor-Grafiken 92 aus Dateien 92 aus EPS-Dateien (Encapsulated PostScript) 94 aus Flash-Player-Dateien 95 aus FreeHand-Dateien 93 aus Programmen 97 Bild-Integrität 98 Zusammenspiel zwischen Flash und VektorProgrammen 99 –, Videos 350 Aussehen verbessern 350 unterstützte Formate 351 Importieren-Befehl (Datei-Menü) 101, 222, 352 Importierte Grafik –, Größen 98 Importierte Schriftarten –, Identifizieren 385 Individuell gestalten –, Templates 478 Informationsbereich, ein-/ausblenden 36 Inspirative Internetseiten –, Communication Arts 520 –, Flash Challenge 520 –, Flash Film Festival 520 Inspirative Seiten –, Pray Station 520 Installieren –, Flash-Player deinstallieren 478 Instanz 40 –, auf der Bühne benennen 266 –, des Kreis-Symbols, Effekte von Helligkeit und Skalierung 156 –, drehende Räder benennen 307 –, Eigenschaften ändern 197 –, Farbe tweenen 195 –, Farbton-Effekt 196 –, Filmsequenz Alpha-Wert ändern 327 Eigenschaften auslesen 328 –, Namen mit Symbolen 266

–, Pfad einfügen-Dialogfeld 308 –, Position tweenen 195 –, Quadrate Verformung 210 –, Rotation tweenen 195 –, Tweening 195 –, Vergrößerung tweenen 195 –, Verhalten in Filmsequenzen 263 –, von drehenden Rädern anvisieren 309 –, von Filmsequenz platzieren 301 –, von Schaltflächen 278 Aktionen 278, 279 –, von Sequenzen Eigenschaften, hausgemachte 329 –, von Symbolen 140 auf der Bühne platzieren 148 Bearbeiten 149 betroffene 142 Farbeffekte 150 Farbeffekte ändern 151 Farbeffekte, Eigenschaften-Bedienfeld 150 in Symbolen verwenden 154 Position, Skalierung und Drehung ändern 149 Symbole erstellen 155 Verhalten 153 Instanz (Filmsequenz) –, adressierbar 266 In-Symbol-konvertieren-Befehl (EinfügenMenü) 155, 444 In-Symbol-umwandeln-Befehl (EinfügenMenü) 139 Integrität von Bildern –, Vektor-Grafiken importieren 98 Interaktivität –, Drag&Drop-Interaktionen Erzeugen 316 –, von Anwendungen 316 Interaktivität siehe Schaltflächen Internetseiten –, .fla-Quelldateien herunterladen 520 –, .jpg-Dateien laden 374 –, Clip Art 518 –, Clip Art Connection 518 –, Communication Arts 520

561

Stichwortverzeichnis

–, DOUG (Director Online User Group) 516 –, Emigre 519 –, Filme Aufbauen 440 Bandbreiten-Profiler 400 Dateien verbessern 404 Ladezeiten 400 Preloader 408 Bibliotheken Einträge, teilen 381 geteilte Einträge (Aktualisieren) 384 teilen 381 Bitmap 396, 398 Dateien Importieren und Komprimieren 399 Dateigrößen 390 Bewegungstween 395 dynamischer Text 394 Eingabetext 394 Formtween 395 Reduzieren 391 reduzieren 395 Schlüsselbilder 395 Text teilen 393 Vergleich von Linien und Füllungen 392 verschachtelte Filmsequenzen und verschachtelte Grafik-Symbole vergleichen 395 entladen 378 geladen Feststellen wann 378 Größenbericht erstellen 407 laden 374 Ladezeiten kalkulieren 391 loadMovie-Aktion Sequenzen 377 Stufen anvisieren 377 Optimieren 390 Perfomance Spezialeffekte 409 Performance Ecken abrunden (niemals verwenden) 412 Form (niemals verwenden) 412

562

Grafik-Symbole 411 Kurven optimieren 411 Linientypen (vermeiden) 413 Modifizieren (niemals verwenden) 412 Streaming-Sound 410 verbessern 409, 410 Schriftarten teilen 385 Scripts verknüpfen 385 Sound 396 Hülle bearbeiten (EigenschaftenBedienfeld) 397 Komprimieren 396 –, Flash Challenge 520 –, Flash Film Festival 520 –, Flash Jester 519 –, Flash Kit 516 –, Flash Magazine 517 –, Flashlite 517 –, Flazoom.com 517 –, geladen feststellen, ob vollständig geladen 378 –, Macromedia 520 –, Macromedia-Exchange 516 –, modulare, entwerfen 374 –, Moock.org 516 –, Pray Station 520 –, Projekt-Aufgaben Aufteilen 457 Code verwalten 459 Selbstschutz 458 Verwalten 457 –, QuickTime Herunterladen 221 –, SoundShopper.com 518 –, SWF-Studio 519 –, Swift 3D 519 –, T-26 519 –, The Flash Academy 516 –, über Inhalte 517 –, Virtual-FX 517 –, Wavecentral 518 –, We're Here 517 –, Wildform 519 Interpolierte Bilder –, Formtweens 209

Stichwortverzeichnis

Isolieren –, Objekte 126 Ebenen 128 Sehen und Auswählen

127

J Jojo –, Abbremsen und Beschleunigen –, erstellen 199 JPEG –, Datei-Komprimierung 103 Artefakte 109 JPG –, Dateien veröffentlichen 484

200

K Kalkulieren –, Ladezeiten 391 Klammern –, {} (geschweift) 337 Maus-Ereignisse 300 Komponenten 334 –, als Templates 442 –, Animationen 162 –, ComboBox 334 Web-Site-Adressen angeben 336 –, Definition 334 –, Eigenschaften benutzerdefiniert, auf _parent zeigen 343 benutzerdefiniert, Erstellen 341 –, Erstellen 338, 339 –, Filmsequenzen umwandeln 343 –, Komponenten-Bedienfeld 334 –, Projekt-Teamarbeit 442 –, RadioButton 344 –, RadioButtons auswerten 345 Komponenten-Bedienfeld 334 Komponenten-Befehl (Fenster-Menü) 334 Komponentendefinition (OptionenMenü) 343 Komprimieren –, Dateien 399 –, Sound 396 Komprimierung –, MP3 233

–, Sorenson Spark QuickTime-Videos importieren 353 –, verlustbehaftet 358 –, verlustlos 358 Komprimierung von Dateien –, JPEG (Joint Photographic Experts Group) 103 Artefakte 109 –, Verlustlos (GIF/PNG) 107 Komprimierungseinstellungen für reimportierte Videos ändern 359 Komprimierungstechnologie, Videos 358 Konfigurieren –, Spark-Komprimierung Dialogfeld 358 Kontrollkästchen –, Geräteschriftart 484 Konturen –, Ebenen 244 Konventionen –, Dokumentation 446 –, Name 446 Bibliotheken organisieren 447 Definition 448 Konzepte –, Bibliothek 139 Koordinatensystem 37 –, Definition 37 –, X-Achse (horizontal) 37 –, Y-Achse (vertikal) 37 Kopieren-Befehl (Bearbeiten-Menü) 128 Kreise –, an Quadrat ausrichten 132 –, animieren 240, 241, 243 –, Bereiche Auswählen und Entfernen 129 –, Eigenschaft Geschwindigkeit erstellen 341 –, Gruppieren 134 –, Logos Auswirkungen beim Entfernen 129 –, Logos mit drei Kreisen Auswirkungen beim Verschieben 130 –, Quetschen 422 –, über den Bildschirm wandernde 339 Kreis-Schaltfläche –, Erstellen 461

563

Stichwortverzeichnis

Kreis-Symbol-Instanzen, Effekte von Helligkeit und Skalierung 156 Kurven optimieren –, Film-Performance 411 Kurztasten –, Entf 280 –, F11 139 –, F8 139 –, Strg+L 222

loadMovie-Aktion 357, 374, 375 –, Sequenzen 377 –, Stufen Anvisieren 377 Logos mit Kreisen –, Auswirkungen beim Entfernen 129 –, Auswirkungen beim Verschieben 130 Loslassen-Ereignis (Maustaste) 317

M L Laden –, .jpg-Dateien 374 –, Filme 374 entladen 378 feststellen, ob vollständig geladen 378 feststellen, wann geladen 378 loadMovie-Aktion 375 Lasso-Werkzeug 32 Leinwand-Ebene 128 –, Halbmonde erstellen 128 –, Mund auswählen 157 Leisten siehe Adressleiste Lektionen-Befehl (Hilfe-Menü) 452 Lernen durch Praxis –, Flash 460 Linien –, Füllungen 392 nicht mischen 209 –, verändern 59 –, vertikale Verschieben und Ausrichten 212 –, zeichnen 59 Linien-Schaltfläche –, Erstellen 461 Linientypen (vermeiden) –, Film-Performance 413 Linien-Werkzeug 32 –, Bildmaterial (original), zeichnen 59, 60 Linker Kanal/rechter Kanal (Hülle bearbeiten) 228 Links siehe Hyperlinks Loader –, Preloader Bandbreiten-Profiler 408

564

Macintosh, Projektor 487 Macromedia Fireworks –, statische Grafiken 485 Macromedia-Exchange-Internetseite 516 Macromedia-Internetseite 520 mailto 370 Marken siehe Formmarken Marquee-Technik, Mund auswählen 157 Maske (Ebenen-Eigenschaft) 244 Masken –, Einschränkungen 256 Masken-Symbol 254 Maskiert (Ebenen-Eigenschaft) 244 Maskierte Ebene –, Gebäude 255 Maskierungs-Ebene 253 –, Scheinwerfer-Effekt erzeugen 254 Master-Symbole 154 –, Inhalt in der Bibliothek erreichen 145 –, Instanzen auf der Bühne Verhalten 262 Maus –, Immer als Rechteck-Option (startDragAktion) 321 –, Maus zentrieren-Option (startDragAktion) 320 –, release-Maus-Ereignis with-Aktion, einfügen 307 Maus zentrieren-Option 320 Maus zentrieren-Option (startDragAktion) 320 Maus-Ereignisse –, {} (geschweifte Klammern) 300 –, ändern 318 –, Schaltflächen 298

Stichwortverzeichnis

Maustasten –, Drücken-Ereignis 317 –, Loslassen-Ereignis 317 Mauszeiger –, Formen auf Schaltflächen 273 maze.fla-Datei –, Flash lernen 457 Medientypen –, Exportieren 490 –, zur Veröffentlichung auswählen Meine-Schaltfläche-Symbol 273, meinVideo-Symbol –, Schaltflächen erstellen 355 Menüs –, Bibliotheks-Optionen 141 –, Hilfe Flash lernen 452 Methoden –, anonyme verschiebbare Objekte erzeugen –, getBytesLoaded 378 –, getBytesTotal 378 –, getSelectedIndex 337 –, Projekt-Teamarbeit 436 Code von Daten trennen 437 Full-Path-Review 437 Rollen testen 437 Rollendefinition 436 Strukturen testen 437 Modems –, Bits in Bytes umrechnen 403 Modi –, Bleistift 60 Modifizieren (niemals verwenden) –, Film-Performance 412 Modifizieren-Menü –, Bitmap nachzeichnen 109 –, Dokument 165, 255 –, Form 212 –, Gruppieren 131 –, Gruppierung aufheben 131 –, Optimieren 405 Modifzieren-Menü –, Bitmap nachziehen 398 Modulare Internetseiten entwerfen Moock.org-Internetseite 516

481 298

319

Morphs –, Formtweens 206 Movieclip siehe Filmsequenz MP3 –, Sound komprimieren 396 MP3-Komprimierung 233 MP3-Option –, Sound-Komprimierung 235 MP3-Sound-Dateien 221 MPEG –, .mpeg-Dateien Videos 352 –, .mpg-Dateien Videos 352 MPEG-Dateien (Moving Pictures Expert Group) 352 Mund –, Auswählen mit der Marquee-Technik Muster –, Bewegungstweens 198

157

N

374

Namen –, Anwender mit Variablen erfassen 323 –, Instanzen für Symbole 266 –, Konventionen 446 –, von Symbolen im Eigenschaften-Bedienfeld anzeigen 261 –, von Variablen 322 Namenskonventionen –, Bibliotheken organisieren 447 Natürlich wirkende Bilder in Animationen 420 Navigation 45 –, Bilder 42 –, Ebenen 42 –, Symbol. 43 –, Szene 43 Neu-Befehl (Datei-Menü) 24 Neuer-Ordner-Schaltfläche 148 Neues Symbol 143 Neue-Schriftart-Befehl (Optionen-Menü) 385 Neues-Symbol-Befehl (Einfügen-Menü) 142, 263 Nicht unterstützte Dateiformate –, Importieren 93

565

Stichwortverzeichnis

Nicht-.jpg-Dateinamenerweiterung –, Importieren 105 Niemandsland (Bewegungstweens) 197 Normal (Ebenen-Eigenschaft) 244 Notepad –, Dateien öffnen 366 Nummern –, aktuelles Bild 164 –, Bild Ziel von goto 295

O Oberfläche siehe Flash-Oberfläche Objekte –, Gruppieren 129 Effekte 130 Gruppen bearbeiten 131 –, in Symbole umwandeln 139 –, Instanzen Farbe tweenen 195 Position tweenen 195 Rotation tweenen 195 Tweening 195 –, Isolieren 126 Sehen und Auswählen 127 –, positionieren, Führungs-Ebenen 247 –, Rechteckseiten Zahlen berechnen 321 –, verschiebbar 319 anonyme Methode 319 Erzeugen 317 Öffnen –, Bibliothek für Schlüsselbilder 230 –, Bibliothek-Fenster 222 –, Dateien 56 in Notepad 366 Öffnen-Befehl (Datei-Menü) 29, 56 Online-Ressourcen siehe Internetseiten Online-Tutorials –, Flash lernen 452 Optimieren –, Videos 358 Optimieren-Befehl (Modifizieren-Menü) 405 Optionen-Menü –, Eigenschaften 102 –, Füllmuster hinzufügen 118

566

–, Komponentendefinition 343 –, Neue Schriftart 385 Optionen-Menü (Bibliothek) 141 Ordner –, benennen 148 –, Bibliothek organisieren 148 –, erstellen 148 Ordner (Ebenen-Eigenschaft) 244 Organisieren –, Bibliothek mit Ordnern 148 –, Bibliotheken 447 Originales Bildmaterial siehe Bildmaterial (original) Overkill –, Animationen 424

P Parameter –, Aktionen 293 –, fscommand-Aktion 489 Parameterbereich (Aktionen-Bedienfeld) 291 Pause/Wiedergabe-Umschaltknopf –, Code 356 Pause-Schaltfläche –, Erstellen 355 Performance von Filmen –, Ecken abrunden (niemals verwenden) 412 –, Form (niemals verwenden) 412 –, Grafik-Symbole 411 –, Kurven optimieren 411 –, Linientypen (vermeiden) 413 –, Modifizieren (niemals verwenden) 412 –, Spezialeffekte 409 –, Streaming-Sound 410 –, Verbessern 409, 410 Perspektive in Animationen 426 Perspektivische Ansichten –, in Animationen Kontrolle 430 Perspektivischer Standort –, in Animationen ändern 431 Pfad (Ebenen-Eigenschaft) 244 Pfad einfügen-Dialogfeld 308 Pfad-Ebene 250 –, hinzufügen Schaltfläche 253

Stichwortverzeichnis

–, springende Bälle erzeugen 251 –, und Ball-Ebene 252 Pfeiltasten –, Übungsaufgabe 461 Pfeilwerkzeug 32, 37 Pinselwerkzeug 36 Play-Aktion 324, 356 Player siehe Flash-Player Pluszeichen (+) 454 –, Bibliothek 145 PNG –, Dateien veröffentlichen 484 –, Verlustlos (GIF/PNG) Datei-Komprimierung 107 PNG-Dateien –, statische Grafiken 486 Position (Instanzen-Tweening) 195 Position von Symbol-Instanzen ändern PostScript siehe EPS Pray Station Internetseite 520 Preloader –, Bandbreiten-Profiler 408 Produkte (Drittanbieter) –, Internetseiten Flash Jester 519 SWF-Studio 519 Swift 3D 519 Wildform 519 Produktivität siehe Bibliothek Profiler siehe Bandbreiten-Profiler Programme –, Vektor Flash, Zusammenspiel 99 –, Vektor-Grafiken Importieren 97 Programmieren in Flash 322 –, Variablen 322 Projekte –, Aufgaben Aufteilen 457 Code verwalten 459 Selbstschutz 458 Verwalten 457 –, Teamarbeit 436 Bibliothek, geteilte Einträge 440 Code von Daten trennen 437

149

Code von Daten trennen, Symbol-WechselTechnik 438 Dokumentations-Konventionen 446 Full-Path-Review 437 Komponenten 442 Methoden 436 Namenskonventionen 446, 448 Rollen testen 437 Rollendefinition 436 Strukturen testen 437 Templates erstellen 442 Projektor –, Erstellen 487 –, fscommand-Aktion 489 –, Windows und Macintosh 487 Protokolle –, FTP (File Transfer Protocol) 370 Publikum siehe Anwender Publizieren siehe Veröffentlichen

Q Quadrate –, Gruppen Änderung der Adressleiste 133 Veränderungen innerhalb 133 –, Gruppieren 134 –, Kreise ausrichten 132 –, Quadratfilmsequenz 267 Quadratfilmsequenz 267 Quadrat-Instanzen, Verformung 210 Quadrat-Schaltfläche erstellen 461 Qualität und Dateigröße von Sounds 232 Qualität-Einstellung (Videos) 359 Quelldatei (.fla) 48 –, Herunterladen 520 QuickTime –, .mov-Dateien, Videos 352 –, Herunterladen 221 QuickTime 4, herunterladen 352 QuickTime-Registerkarte (Einstellungen für Veröffentlichung) 489 QuickTime-Videos –, Importieren 352 Sorenson-Spark-Komprimierung 353 –, Veröffentlichen 489

567

Stichwortverzeichnis

R Radiergummi-Werkzeug 32 RadioButton-Komponente 344 RadioButtons auswerten 345 Räder –, drehende Erstellen 261 –, Drehende Räder Instanzen anvisieren 309 –, Instanzen von drehenden Rädern 307 Ränder –, von Textblöcken verändern 444 Rahmen –, Rahmen-Form Registrierungs-Ebene 248 Rand-Schaltfläche 323 Raster-Grafiken 54 –, als Füllungen 125 Text-Effekte 126 –, Importieren 101 Bitmap-Eigenschaften verändern 103 Bitmaps zu Vektor-Grafiken konvertieren 108 –, Vektor-Grafiken 90 Raster-Grafiken siehe Bitmaps Raten –, Sample-Raten 232 Raw-Option –, Sound-Komprimierung 235 Rechtecke –, Seiten Zahlen berechnen 321 Regeln –, Bewegungstweens erstellen 194 –, Formtweens 207 Registrierung –, Rahmen-Form 248 Registrierungs-Ebene –, Rahmen-Form 248 Regler –, Skalieren (Videos) 358 Relation –, Höhe-Breite Videos 351 Relative Geschwindigkeit –, Tiefe in Animationen simulieren 428

568

release-Maus-Ereignis –, with-Aktion einfügen 307 Ressourcen, online siehe Internetseiten RGB (Rot, Grün und Blau) 119 Rollen –, definieren für Projekt-Teamarbeit 436 Rotation –, gegen UZS (gegen den Uhrzeigersinn) 202 –, UZS (im Uhrzeigersinn) 202 Rotation (Instanzen-Tweening) 195 Roter Abspielkopf 163, 164 Rotieren in Bewegungstweens 202

S Sample-Raten 232 Schachbretteffekt beim Formtween 208 Schaltfläche –, Abspielen Anhalten oder Fortfahren 298 –, Aktionen 298 –, Aktiv-Zustand definieren 275 vergrößern 276 –, Alpha-Einstellungen von Sequenzen Erhöhen und Vermindern 328 –, Als Menüelement behandeln 282 –, Als Schaltfläche behandeln 282 –, animiert Behandlungs-Optionen 282 Erstellen 279 Sound 282 –, Auf-Zustand 274, 277 –, Breaker-Switch-Sound 283 –, Breite Ansicht 147 –, Darüber-Sound Erstellen 283 –, Darüber-Zustand 274, 277, 283 –, Dateigrößen Auswirkung auf 276 –, Drücken-Zustand 272, 274, 277 –, Ebene einfügen 242 –, Erstellen 272 meinVideo-Symbol 355 –, erweitert 279 –, Hyperlinks Aktionen 304

Stichwortverzeichnis

–, Instanzen 278 Aktionen 278, 279 –, Interaktivität 272 –, Kreis erstellen 461 –, Linie erstellen 461 –, Maus-Ereignisse 298 –, Mauzeiger-Formen 273 –, Meine Schaltfläche-Symbol 273 –, Neuer Ordner 148 –, Pause erstellen 355 –, Pfad-Ebene hinzufügen 253 –, Pfeiltasten Übungsaufgabe 461 –, Quadrat erstellen 461 –, RadioButton-Komponente 344 –, RadioButtons auswerten 345 –, Rand 323 –, startDrag-Aktion 316 –, Stopp erstellen 355 –, Symbole bearbeiten 145 Bilder 274 in Symbolen 277 wechseln 438 –, Szene bearbeiten 145 –, unsichtbar 284 Aktiv-Bild 285 Erstellen 285 –, Warnsymbol (!) 194 –, Weiter 346 –, Wiedergabe erstellen 355 –, wiederholter Sound Erstellen 284 –, zaehler-Variable Werte erhöhen 325 –, Zurück-Knopf Benannte Bildanker 480 –, Zustände Hinzufügen 273 Symbole 277 –, Zwiebelschalen-Werkzeuge 180 Schaltflächen-aktivieren-Befehl (SteuerungMenü) 273 Scheinwerfer-Effekte erzeugen 254 Schlüsselbild 167, 168

–, Bewegungstweens 199 –, Bibliothek für Schlüsselbilder öffnen 230 –, Eigenschaften-Bedienfeld 193 –, einfügen 25 –, in Animationen 432 –, Sound 224 –, Tweening 172 Schlüsselbild-Befehl –, Einfügen-Menü 182 Schlüsselbild-Befehl (Einfügen-Menü) 167, 176 Schlüsselbildintervall (Videos) 360 Schriftarten –, eingebettet in dynamischem Text 394 in Eingabetext 394 –, Geräteschriftart-Kontrollkästchen 484 –, importierte identifizieren 385 –, Internetseiten Emigre 519 T-26 519 –, Teilen 385 –, Umrisse 394 Schrubben –, Animationen 164 –, Definition 165 Schrubbertechnik –, Grafik-Symbole 264 Scriptbereich (Aktionen-Bedienfeld) 291 Scripts –, Maus-Ereignisse ändern 318 –, Trace-Aktion 464 –, Verknüpfen 385 Sekunde/Bilder (Hülle bearbeiten) 229 Selbstschutz –, Projekt-Aufgaben 458 Senden –, E-Mail 370 Sequenzen –, Alpha-Einstellungen Schaltflächen zum Erhöhen und Verringern 328 –, Instanzen Eigenschaften, hausgemachte 329 –, loadMovie-Aktion 377

569

Stichwortverzeichnis

–, speed-Variablen, Setzen 330 –, von Bitmaps 111 Exportieren 490 Sequenzen siehe Filmsequenzen Server siehe Web-Server set variable-Aktion 324 setProperty-Aktion 328 Sichtbare Elemente der Bühne 28 Sichtbare Hinweise –, Zeitleiste 34 Simulieren –, Tiefe in Animationen 425, 428 Skalieren-Regler (Videos) 358 Skalierung 29 –, von Symbol-Instanzen ändern 149 Software –, Flash lernen 460 Sorenson Spark –, Videos komprimieren 358 Sorenson-Spark-Komprimierung –, QuickTime-Videos importieren 353 Sortieren –, Symbole 147 Sound –, Breaker Switch 283 –, Filme 396 –, Hülle bearbeiten (EigenschaftenBedienfeld) 397 –, Komprimieren 396 –, Schaltflächen animiert 282 Darüber-Sound erstellen 283 Wiederholung erstellen 284 –, Streaming Film-Performance 410 –, Video 354 Sound in Animationen 220 –, AIF-Sound-Dateien importieren 221 –, Bit-Tiefe 233 –, Dateien filtern 222 –, Digital-Audio-Grundlagen 232 –, Effekt-Einstellungen 227 –, Effizienz 236 –, Eigenschaften-Bedienfeld 224 –, Einstellungen beim Exportieren 233 –, Endpunkt 229

570

–, Export-Einstellungen 235 –, globale Veröffentlichungseinstellungen 233 –, Importieren 220 aus Bibliotheken 223 MP3-Sound-Dateien 221 unterstützte Formate 221 WAV-Sound-Dateien 221 –, importiert, Anzeigen 223 –, Komprimierung ADPCM-Option 235 Deaktivieren-Option 234 MP3-Option 235 Raw-Option 235 Sprache-Option 235 –, MP3-Kompression 233 –, Qualität und Dateigröße 232 –, Sample-Raten 232 –, Schlüsselbilder 224 –, Sound-Effekte 230 –, Startpunkt 229 –, Sync-Einstellungen 225 –, Wdh-Einstellungen 229 –, Wellenformen anzeigen 224 Sound komprimieren –, ADPCM-Option 235 –, Deaktivieren-Option 234 –, MP3-Option 235 –, Raw-Option 235 –, Sprache-Option 235 Sound siehe Audio Sound/Audio-Internetseiten –, SoundShopper.com 518 –, Wavecentral 518 Soundeigenschaften-Dialog 233 SoundShopper.com-Internetseite 518 Spannungsaufbau –, in Animationen 421 Overkill 424 Spark –, Videos komprimieren 358 Spark-Komprimierung konfigurieren Dialogfeld 358 speed-Variablen von Sequenzen setzen 330 Speichen in einem Rad erstellen 497

Stichwortverzeichnis

Spezialeffekte –, Film-Performance 409 Spielzeug –, Jojo Abbremsen und Beschleunigen 200 erstellen 199 –, springende Bälle in Pfad-Ebenen 251 Sprache-Option –, Sound-Komprimierung 235 Springender Ball –, in Pfad-Ebenen erzeugen 251 –, Übungsaufgabe 461 Standardqualität-Einstellungen 105 Start (Sync-Einstellung) 226 startDrag()-Aktion 319 startDrag-Aktion 316 –, Immer als Rechteck-Option 321 –, Maus zentrieren-Option 320 Startpunkt (Sound) 229 Statische Grafik –, GIF-Dateien 487 –, Macromedia Fireworks 485 –, PNG-Dateien 486 Statistik –, .swf-Dateien 401 –, Internetseiten Macromedia 520 Steuerung –, Videos 356 –, Wiedergabe für Videos Erstellen 354 Steuerung-Menü –, Fehlersuche 466 –, Film testen 231 –, Schaltflächen aktivieren 273 Stop-Aktion in with-Aktion einfügen 308 stopDrag-Aktion 317 Stopp/Abspielen (Hülle bearbeiten) 229 Stoppen (Sync-Einstellung) 226 Stopp-Schaltfläche erstellen 355 Stream (Sync-Einstellung) 226 Streaming-anzeigen-Befehl (AnsichtMenü) 402, 404 Streaming-Sound –, Film-Performance 410 Strg+A-Tasten-Kombination 280, 405

Strg+B-Tasten-Kombination 400 Strg+C-Tasten-Kombination 128, 241 Strg+Enter-Tasten-Kombination 193 Strg+F-Tasten-Kombination 402 Strg+G-Tasten-Kombination 131 Strg+Leertaste-Tastenkürzel 58 Strg+L-Kurztaste 222 Strg+M-Tasten-Kombination 165 Strg+Shift+Enter-Tasten-Kombination 466 Strg+Shift+H-Tasten-Kombination 212 Strg+Shift+Leertaste-Tastenkürzel 58 Strg+Shift+V-Tasten-Kombination 255 Strg+V-Tasten-Kombination 128 Stufen anvisieren 377 SWF-Studio-Internetseite 519 SWFx 519 Swift-3D-Internetseite 519 Symbol –, Animierter Text 280 –, Arbeitsaufwand minimieren 144 –, Auge erstellen 155 –, Bearbeiten Adressleiste 141 –, Benennen 140, 146 –, Bleistift 241, 243 aktive Ebenen 242 –, Dateigrößen reduzieren 144 –, Definition 40 –, Dialogbox Symbol wechseln 438 –, Erstellen 142 –, Erstellen und Verwenden 139 –, Filmsequenz und Grafik-Symbol 262 –, Grafik Animationen 260 Filme Effekte auf Download-Reihenfolge 267 exportieren (vorrendern) 267 Film-Performance 411 Filmsequenz-Symbol 262 Schrubbertechnik 264 verschachtelte Filmsequenzen und verschachtelte Grafik-Symbole 395 Vorschau 264 –, Haus erstellen 154 –, in der Bibliothek 148 –, in Symbolen, Schaltflächen 277

571

Stichwortverzeichnis

–, Instanzen 140 auf der Bühne platzieren 148 Bearbeiten 149 betroffene 142 Farbeffekte 150 Farbeffekte ändern 151 Farbeffekte, Eigenschaften-Bedienfeld 150 in Symbolen verwenden 154 Position, Skalierung und Drehung ändern 149 Verhalten 153 –, Instanzen, Symbole erstellen 155 –, Instanz-Namen 266 –, Kreis Instanzen, Effekte von Helligkeit und Skalierung 156 –, Maske 254 –, Master 154 Inhalt in der Bibliothek erreichen 145 Instanzen auf der Bühne, Verhalten 262 –, Meine Schaltfläche 273, 298 –, meinVideo Schaltflächen erstellen 355 –, Namen im Eigenschaften-Bedienfeld anzeigen 261 –, Neues Symbol 143 –, Schaltflächen Bilder 274 –, Schaltflächen-Zustände 277 –, Sortieren 147 –, Symbol-Wechsel-Technik (Code von Daten trennen) 438 –, Umwandeln ausgewählter Objekte 139 –, Verhalten 140 –, verschachteln 262 Symbole-bearbeiten-Schaltfläche 145 Symbol-wechseln-Dialogbox 438 Symbol-wechseln-Schaltfläche 438 Symbol-Wechsel-Technik (Code von Daten trennen) 438 Sync-Einstellungen (Sound) 225 –, Ereignis 225 –, Start 226 –, Stoppen 226 –, Stream 226

572

Syntaxfarbcodierung –, Aktionen 292 Szene-bearbeiten-Schaltfläche 145 Szene-Befehl (Einfügen-Menü) 408, 438 Szenen –, Erstellen 438 –, Szene-Befehl (Einfügen-Menü) 438

T T-26-Internetseite 519 Tags –, HTML (HyperText Markup Language) Anker 479 Tastenkombinationen –, Strg+A 280, 405 –, Strg+B 400 –, Strg+C 128, 241 –, Strg+Enter 193 –, Strg+F 402 –, Strg+G 131 –, Strg+Leertaste 58 –, Strg+M 165 –, Strg+Shift+Enter 466 –, Strg+Shift+H 212 –, STRG+Shift+Leertaste 58 –, Strg+Shift+V 255 –, Strg+V 128 Teams –, an Projekten arbeiten 436 Bibliothek, geteilte Einträge 440 Code von Daten trennen 437 Code von Daten trennen, Symbol-WechselTechnik 438 Dokumentations-Konventionen 446 Full-Path-Review 437 Komponenten 442 Methoden 436 Namenskonventionen 446, 448 Rollen testen 437 Rollendefinition 436 Strukturen testen 437 Templates erstellen 442 Technologie –, Komprimierung Videos 358

Stichwortverzeichnis

Teilen –, Bibliothekseinträge 381, 440 Aktualisieren 384 –, Schriftarten 385 Templates –, Erstellen 442 –, Filme 478 –, individuell gestalten 478 –, Komponenten 442 Testen –, Rollen 437 –, Strukturen 437 Text –, Bitmaps als Füllungen Effekte 126 –, dynamischer Text 394 Hyperlinks erstellen 368 –, Eingabetext 394 –, Formatierung in FreeHand 97 –, Größe in Videos 351 –, in Füllungen umwandeln 126 –, Raster-Grafiken als Füllungen Effekte 126 –, teilen 393 Textblöcke –, Ränder verändern 444 –, Verhalten angeben 323 Texteingabezeile 324 Textoptionen 38 Textwerkzeug 32, 38 The Flash Academy Internetseite 516 Tiefe in Animationen simulieren 425, 428 Timing –, Zeitleiste 164 Trace-Aktion –, Scripts 464 Trennen –, Code von Daten 437 Symbol-Wechsel-Technik 438 Tutorials –, Online Flash lernen 452 Tutorials siehe Internetseiten Tweening –, Alpha-Farbeffekt 196 –, Definition 172

–, Instanzen 195 Farbe 195 Position 195 Rotation 195 Vergrößerung 195 –, Schlüsselbild 172 –, von Bildern in der Zeitleiste 193 Tweening siehe Bewegungstweening Tweens –, Bewegungstween Filmdateigrößen 395 –, Formtween Filmdateigrößen 395 Tweens siehe Bewegungstweens Tweens siehe Formtweens Typen –, Linientypen (vermeiden) Film-Performance 413

U Übungsaufgaben –, Flash lernen 460 Umrechnung von Bits in Bytes 403 Umrisse –, Schriftarten 394 Umwandeln –, Filmsequenzen in Komponenten 343 –, Objekte in Symbole 139 unloadMovie-Aktion 381 Unschärfe erzeugen 420 Unsichtbare Schaltflächen 284 –, Aktiv-Bild 285 –, Erstellen 285 Unterauswahl-Werkzeug 32 Unterfilme 374 URLs –, getURL-Aktion 367 UZS-Rotation (im Uhrzeigersinn) 202

V Variablen –, Anwendernamen erfassen 323 –, anzeigen 322 –, Anzeigen in Hauptzeitlinie –, Namen 322

467

573

Stichwortverzeichnis

–, Programmieren in Flash 322 –, speed von Sequenzen setzen 330 –, Wert erhöhen 325 Eigenschaften 326 –, Werte 322 –, zaehler Werte erhöhen 325 Variablen-Feld 324 Vektorgrafiken 54 –, Bitmaps konvertieren 108 –, Importieren 92 aus Dateien 92 aus EPS-Dateien (Encapsulated PostScript) 94 aus Flash-Player-Dateien 95 aus FreeHand-Dateien 93 aus Programmen 97 Bild-Integrität 98 Zusammenspiel zwischen Flash und VektorProgrammen 99 –, Raster-Grafiken, Vergleich 90 Vektor-Programme –, Flash, Zusammenspiel 99 Verändern –, Attribute von Farbverläufen 122 –, Instanzen (Position, Skalierung und Drehung) 149 –, Linien 59 Verformung von Quadrat-Instanzen 210 Vergleichen –, Linien und Füllungen 392 –, Symbole Filmsequenz und Grafik 262 –, Vektor- und Raster-Grafiken 90 –, verschachtelte Filmsequenzen und verschachtelte Grafik-Symbole 395 Vergrößern/Verkleinern (Hülle bearbeiten) 229 Vergrößern-Befehl (Ansicht-Menü) 29 Vergrößern-Option (VergrößerungsWerkzeug) 57 Vergrößerung (Instanzen-Tweening) 195 Vergrößerungs-Werkzeug –, Bildmaterial (original) zeichnen 56, 57, 58

574

–, Vergrößern-Option 57 –, Verkleinern-Option 57 Vergrößerungswert auf der Bühne 58 Verhalten –, Filmsequenz 260 –, Symbol-Instanzen 153 –, von Instanzen in Filmsequenzen 263 –, von Symbolen 140 –, von Symbolen im Eigenschaften-Dialog ändern 154 –, von Textblöcken angeben 323 Verkleinern-Option (VergrößerungsWerkzeug) 57 Verknüpfen –, Filme mit Web-Servern 364 –, Scripts 385 Verläufe –, Farbmischer-Bedienfeld Ändern 121 Verlustbehaftete Komprimierung 358 Verlustlos (GIF/PNG) –, Datei-Komprimierung 107 Verlustlose Komprimierung 358 Veröffentlichen –, .swf-Dateien 481 –, Filme 474 .swf-Dateien 481 AVI-Videos 490 Benannte Bildanker 479, 480 Bitmap-Sequenzen 490 Einstellungen für Veröffentlichung 474 Einstellungen für Veröffentlichung, Flash 475, 481 Einstellungen für Veröffentlichung, Formate 475, 487 Einstellungen für Veröffentlichung, GIF 476 Einstellungen für Veröffentlichung, HTML 476, 483 Einstellungen für Veröffentlichung, QuickTime 489 GIF-Dateien (Graphical Interchange Format) 484 HTML-Dateien (HyperText Markup Language) 482

Stichwortverzeichnis

JPG-Dateien (Joint Photographic Experts Group) 484 Medientyp wählen 481 Medientypen exportieren 490 PNG-Dateien 484 Projector (Windows und Macintosh) 487 QuickTime-Videos 489 Templates 478 Templates individuell gestalten 478 Warnmeldungen anzeigen 484 –, GIF (Graphical Interchange Format) 484 –, HTML-Dateien (HyperText Markup Language) 482 –, JPG (Joint Photographic Experts Group) 484 –, PNG 484 –, QuickTime-Videos 489 Veröffentlichen (Datei-Menü) 365 Veröffentlichen von Filmen 364 –, Dateien auf Web-Server hochladen 370 in Notepad öffnen 366 –, E-Mail senden 370 –, Fenster anvisieren 369 –, Hyperlinks 367 getURL-Aktion 367 mit dynamischem Text erstellen 368 –, Schriftarten Geräteschriftart-Kontrollkästchen 484 Veröffentlichen-Befehl (Datei-Menü) 364 Verschachteln –, Symbole 262 Verschachtelte Filmsequenzen und verschachtelte Grafik-Symbole vergleichen 395 Verschiebbare Objekte 319 –, Erzeugen 317 anonyme Methode 319 Verschieben –, vertikale Linien Ausrichten 212 Verstecken –, Ebenen 244 Vertikale Linien –, Verschieben und Ausrichten 212

vertikale Y-Achse 37 Verwalten –, Bibliothek 146, 147 Symbole benennen 146 Symbole sortieren 147 –, Ebenen 246 –, Projekt-Aufgaben 457 Video –, Sound 354 Video für Windows –, .avi-Dateien Videos 352 Videos –, .asf-Dateien 352 –, .avi-Dateien 352 –, .dv-Dateien 352 –, .dvi-Dateien 352 –, .mov-Dateien 352 –, .mpeg-Dateien 352 –, .mpg-Dateien 352 –, .swf-Dateien 351 –, .wmv-Dateien 352 –, AVI Exportieren 490 –, Digital Video .dv-Dateien 352 .dvi-Dateien 352 –, DirectX 7 herunterladen 352 –, Downloadzeit minimieren 358 –, Film-Größe 358 –, Fortschrittsanzeige 357 –, Höhen-Breiten-Relation 351 –, Importieren unterstützte Formate 351 –, importieren 350 Aussehen verbessern 350 –, komprimieren mit Spark (Sorenson) –, Komprimierung verlustbehaftet 358 verlustlos 358 –, loadMovie-Aktion 357 –, meinVideo-Symbol Schaltflächen erstellen 355

358

575

Stichwortverzeichnis

–, MPEG .mpeg-Dateien 352 .mpg-Dateien 352 –, MPEG-Dateien (Moving Pictures Expert Group) 352 –, Optimieren 358 –, Pause/Wiedergabe-Umschaltknopf Code 356 –, Pause-Schaltfläche erstellen 355 –, Qualität-Einstellung 359 –, QuickTime .mov-Dateien 352 Importieren 352 Sorenson-Spark-Komprimierung 353 Veröffentlichen 489 –, QuickTime 4 herunterladen 352 –, Reimportieren Komprimierungs-Einstellungen ändern 359 –, Schlüsselbildintervall 360 –, Skalieren-Regler 358 –, Spark-Komprimierung Dialogfeld konfigurieren 358 –, Steuerung (fortgeschritten) 356 –, Stopp-Schaltfläche erstellen 355 –, Text-Größe 351 –, Video für Windows .avi-Dateien 352 –, visueller Anteil 354 –, Vorladezeit minimieren 358 –, Wiedergabe-Schaltfläche erstellen 355 –, Wiedergabe-Steuerung 354 –, Windows Media .asf-Dateien 352 .wmv-Dateien 352 Virtual-FX-Internetseite 517 Visuelle Effekte –, Ebenen-Eigenschaften 247 Führungs-Ebenen 247 Visueller Anteil –, Videos 354 Voreinstellungen –, Aktionen-Bedienfeld 292 Voreinstellungen-Befehl –, Bearbeiten-Menü 168, 170

576

Vorladezeit –, für Videos minimieren 358 Vorrendern (Filme in Grafik-Symbol exportieren) 267 Vorschau –, Grafik-Symbole 264 Vorschau für Veröffentlichen-Befehl (DateiMenü) 364 Vorschau für Veröffentlichungen (DateiMenü) 305 Vorschau-Befehl (Bilddarstellung PopupMenü) 179 Vorschau-für-Veröffentlichung-Befehl (DateiMenü) 477 Vorschau-im-Kontext-Befehl (Bilddarstellung Popup-Menü) 179 Vortäuschen von Bewegung 420

W Warnmeldungen anzeigen 484 Warnsymbol-Schaltfläche (!) 194 Wavecentral-Internetseite 518 WAV-Sound-Dateien 221 Wdh (Eigenschaften-Bedienfeld) 284 Wdh-Einstellungen (Sound) 229 We're Here-Internetseite 517 Web-Seiten –, Hyperlinks Aktions-Schaltflächen 304 –, keyframing.fla Download 168 Web-Server –, Dateien hochladen 370 –, Filme verknüpfen 364 Web-Sites –, Adressen angeben 336 –, DirectX 7 herunterladen 352 –, QuickTime 4 herunterladen 352 Weiter Flash lernen 459 Weiter-Schaltfläche 346 Wellen erstellen 508 Wellenformen anzeigen 224 Werkzeuge 33 –, Bildmaterial (original), zeichnen 55

Stichwortverzeichnis

Ansicht-Werkzeuge (Hand und Vergrößern) 56, 57, 58 Linien 59, 60 Zeichen-Werkzeuge 58 –, Farbeimer 32 Füllung sperren 122 –, Füllung transformieren 122 Farbverläufe 124 –, Hand 30 –, Lasso 32 –, Linie 32 –, Pfeil 32, 37 –, Pinsel 36 –, Text 32, 38 –, Unterauswahl 32 –, Vergrößern Vergrößern-Option 57 Verkleinern-Option 57 –, zeichnen Werkzeugkiste 55 –, Zwiebelschalen 180 2 Zwiebelschalen 183 5 Zwiebelschalen 183 Alle Zwiebelschalen 183 Anfangsmarkierung 181 Endmarkierung 181 Markierungen immer einblenden 182 Markierungen verändern 182 Markierungen verankern 182 Mehrere Bilder bearbeiten 183 Zwiebelschalenkonturen 183 Werkzeuge im Bibliotheksfenster 147 Werkzeuge-Befehl (Fenster-Menü) 55 Werkzeugkasten siehe Werkzg-Bedienfeld Werkzeugkiste –, zeichnen Werkzeuge 55 Werkzg-Bedienfeld 27, 33 Wert von Variablen erhöhen 325 –, Eigenschaften 326 –, von Schaltflächen-zaehler-Variable erhöhen 325 –, von zaehler-Variable erhöhen 325 322 Wert-Feld 324

Wiedergabe-Schaltfläche –, Erstellen 355 Wiedergabe-Steuerung für Videos –, Erstellen 354 Wiederherstellen-Befehl (Datei-Menü) Wiederholter Sound für Schaltflächen –, Erstellen 284 Wiederholung –, Filme (nichtlinear) mit Aktionen 293 –, Filmsequenzen 264 Wildform-Internetseite 519 Windows –, Projektor 487 Windows Media –, .asf-Dateien Videos 352 –, .wmv-Dateien Videos 352 with-Aktion 306 –, {} (geschweifte Klammern) Stop-Aktion einfügen 308 –, Einfügen 307 –, eingebundene Instanzen anspringen

459

306

X X-Achse (horizontal)

37

Y Y-Achse (vertikal)

37

Z zaehler-Variable –, Wert erhöhen 325 Zahlen –, Rechteckseiten Berechnen 321 Zeichen-Werkzeuge –, Bildmaterial (original) zeichnen 58 Zeichnen –, Berge auf dem Horizont 431 –, Bildmaterial (original) 54 Ansicht-Werkzeuge (Hand und Vergrößern) 56, 57, 58 auf der Bühne 55

577

Stichwortverzeichnis

Bleistift-Werkzeug 59, 60 Hand-Werkzeug 56, 57, 58 Linien-Werkzeug 59, 60 Vergrößerungs-Werkzeug 56, 57, 58 Werkzeuge 55 Zeichen-Werkzeuge 58 –, Linien 59 –, Werkzeugkiste Werkzeuge 55 Zeit –, Filme herunterladen Bandbreiten-Profiler 400 Kalkulieren 391 –, Zeitleiste aktuelle Zeit 164 Zeitleiste 27, 33 –, aktuelle Bildnummer 164 –, aktuelle Zeit 164 –, ankoppeln 33 –, Bilder 42, 163, 164 Tweening 193 –, Bildrate 164 –, Ebenen 34, 42 –, Navigation 45 –, Schlüsselbilder einfügen 25 –, sichtbare Hinweise 34 –, Symbol 43 –, Szene 43 –, Timing 164 –, Wellenformen anzeigen 224 –, Zwiebelschalen-Werkzeug 180 Zeitleiste-Befehl (Fenster-Menü) 25 Zeitlinie –, Grafik-Symbole Ankoppeln 265

578

–, Schaltfläche Ebene einfügen 242 –, Variablen anzeigen 467 Zeitlinie siehe Ebenen Ziele –, goto-Aktion 296 Zurück-Knopf –, Benannte Bildanker 480 Zustände von Schaltflächen –, Aktiv definieren 275 vergrößern 276 –, Auf 274, 277 –, Darüber 274, 277, 283 –, Drücken 272, 274, 277 –, Hinzufügen 273 –, Symbole 277 Zwiebelschalenmarkierung ändern-Menü –, Alle Zwiebelschalen 405 Zwiebelschalen-Werkzeug 180 –, 2 Zwiebelschalen 183 –, 5 Zwiebelschalen 183 –, Alle Zwiebelschalen 183 –, Angangsmarkierung 181 –, Bilder Inhalt betrachten 181 mehrere Bilder bearbeiten 183 –, Endmarkierung 181 –, Markierungen immer einblenden 182 –, Markierungen verändern 182 –, Markierungen verankern 182 –, Mehrere Bilder bearbeiten 183 –, verwenden 180 –, Zwiebelschalenkonturen 183 Zwischenablage –, FreeHand-Textformatierung 97

... aktuelles Fachwissen rund um die Uhr – zum Probelesen, Downloaden oder auch auf Papier. www.InformIT.de

InformIT.de, Partner von Markt+Technik, ist unsere Antwort auf alle Fragen der IT-Branche. In Zusammenarbeit mit den Top-Autoren von Markt+Technik, absoluten Spezialisten ihres Fachgebiets, bieten wir Ihnen ständig hochinteressante, brandaktuelle Informationen und kompetente Lösungen zu nahezu allen IT-Themen.

wenn Sie mehr wissen wollen ...

www.InformIT.de