INTERAKTYWNA KOMUNIKACJA WIZUALNA. Flash - podstawy

Transkrypt

1 INTERAKTYWNA KOMUNIKACJA WIZUALNA Flash - podstawy

2 Adobe Flash (dawniej Macromedia Flash) program komputerowy, technologia tworzenia animacji z wykorzystaniem grafiki wektorowej. Powstałe pliki *.swf można odtwarzać za pomocą przeglądarki internetowej z zainstalowaną odpowiednią wtyczką (np. Adobe Flash Player) lub w oddzielnym programie do tego przeznaczonym. Od wersji Flash 5, program wyposażony został w język programowania do obsługi zdarzeń Action Script. (interaktywne animacje i programy)

3 Typy plików Flasha: Dokumenty Flasha (.fla) Filmy Flasha (.swf) Pliki skryptów Action Script (.as) Pliki Flash Video (.flv) Pliki składników Flasha (.swc)

4 Typy plików Flasha:

5 Typy plików Flasha: Dokumenty Flasha (.fla) Pliki edycyjne filmów Flasha, umożliwiają pracę w środowisku edycyjnym i tworzenie projektów Filmy Flasha (.swf) - utworzony w momencie publikowania lub testowania filmu. Zoptymalizowana wersja orginalnego dokumentu Flasha, zawierająca wyłącznie te elementy projektu, które są potrzebne. Pliki.swf są przesyłane do serwera stron www, gdzie następuje ich integracja z plikami html w celu udostępnienia ich użytkownikowi.

6 Typy plików Flasha: Pliki skryptów Action Script (.as) Pliki Flash Video (.flv) tworzone np. narzędziami: Adobe Media Encoder, Sorenson Squeeze, On2Flix. Pliki składników Flasha (.swc)

7 Możliwości Flasha: Przetwarzanie obrazów rastrowych Program wektorowy Animacje wektorowe Mechanizm odtwarzania wideo Odtwarzacz audio Multimedialne środowisko edycyjne Programowanie i obsługa baz danych Sekwenser animacyjny

8 Sekwenser animacyjny Umożliwia sprawowanie kontroli nad sposobem wyświetlania zawartości. Iluzja ruchu sekwencje klatek Animacja ruchu

9 Możliwości Flasha: Sekwenser animacyjny - Animacja kształtu

10 Symbole, instancje i biblioteka

11 Symbol- element znajdujący się w bibliotece, nadający się do wielokrotnego wykorzystania w projekcie Zaleta: oszczędność w wielkościach pliku i interaktywna użyteczność filmów Flasha Wiele instancji tego samego symbolu (bez zwiększania rozmiaru pliku!)

12 Biblioteka zbiór wszystkich powtarzających się w projekcie elementów, które zostały zdefiniowane jako symbole Bibiloteka: Importowane dźwięki i bitmapy Przyciski Klipy filmowe

13 Domyślne biblioteki Flasha: Dźwięki Klasy Przyciski (Okno->Wspólne Bibiloteki)

14 Symbole: Graficzne Klipy filmowe Przyciski

15 Symbole graficzne: Opcja Loop (Pętla) Opcja PlayOnce (Odtwórz raz) Opcja SingleFrame(Pojedyncza klatka)

16 Klipy filmowe: Do tworzenia animacji działających niezależnie od osi czasu głównego filmu Mogą zawierać akcje, inne symbole i dźwięki Można je umieszczać w innych klipach filmowych Do tworzenia np. animowanych przycisków Są odtwarzane nawet wtedy, gdy zatrzyma się główną oś czasu Mogą być sterowane za pomocą kodu actionscript znajdującego się na dowolnej osi czasu lub w zewnętrznym pliku.as

17 Symbole przycisków: Oś czasu ograniczona do 4 klatek (tzw. stanów): - Up (mysz poza obszarem symbolu) - Over (mysz ponad obszarem symbolu) - Down (kliknięcie przycisku) - Hit (obszar obsługi kliknięcia) Poszczególne stany mogą zawierać grafikę, inne symbole i dźwięk Po utworzeniu przycisku stanom można przypisać akcje

18 Elementy importowane: Mapy bitowe (traktowane jako symbole) Grafika wektorowa Dźwięki Elementy wideo Symbole czcionek

19 Symbole graficzne a klipy filmowe Symbole graficzne dostarczają statycznej informacji Klipy filmowe zawierają animacje odtwarzane na niezależnej osi czasu Symbole graficzne do przechowywania jednej lub kilku klatek z kształtami wektorowymi, jeśli potrzebny podgląd animacji podczas pracy nad projektem (kreskówki) Klipy filmowe gdy stosujemy skrypty ActionScript lub gdy animacja w obrębie symbolu musi przebiegać niezależnie od akcji głównego filmu (gry)

20 Modyfikowanie właściwości symbolu na stole montażowym Każda instancja symbolu posiada parametry, które można modyfikować: -jasność -kolor -stopień przeźroczystości Modyfikacja tych parametrów nie ma wpływu na wygląd i działanie oryginalnego symbolu w bibliotece Instancję symbolu można skalować, obracać lub pochylać Zmiana oryginalnego symbolu w bibliotece-zmiana wszystkich instancji tego symbolu

21 Modyfikowanie koloru i przeźroczystości -jasność tinta (kolor) podajemy bezpośrednio wartości RGB -alfa (stopień przeźroczystości)

22 Ustawienia predefiniowane ruchu 1. Utwórz nowy symbol - piłkę 2. Wstaw kilka kopii piłki na scenę 3. W oknie właściwości zmień np.. kolory piłek 4. Przetestuj

23 Ustawienia predefiniowane ruchu 1. Narysuj piłkę 2. Przekonwertuj na symbol (F8)(grafika, nazwa np. pilka) 3. Z menu Okno->Ustawienia predefiniowane ruchu wybierz jeden z predefiniowanych ruchów. 4. Przetestuj

24 Ustawienia predefiniowane ruchu 1. Wpisz tekst 2. Przekonwertuj na symbol (F8) 3. Z menu Okno->Ustawienia predefiniowane ruchu wybierz Przewijanie-Tekst 4. Przetestuj

25 Animacja ruchu - obroty 1. Narysuj motyla 2. Przekonwertuj na symbol (F8) 3. Stwórz animację ruchu 4. W menu właściwości ustaw liczbę obrotów 5. Przetestuj

26 Animacja kształtu 1. W klatce pierwszej narysuj pączek kwiatka 2. Wstaw pustą klatkę kluczową w klatce W klatce 30 narysuj rozwinięty kwiat 4. Stwórz animację kształtu 5. Ustaw dynamikę 6. Przetestuj