sobota, 6 Listopad 2010
Być może zwróciłeś uwagę, że strony WWW zdobywające nagrody, na przykład w organizowanym przez Macromedia konkursie Sities of the Day, zazwyczaj zawierają sekwencje wideo programu Flash. Choć istnieje wiele sposobów umieszczania animacji na stronach WWW ? choćby animacje DHTML, animowane GIFy, animacje Javy i JavaScriptu ? trudno znaleźć osobę, która nie byłaby pod wrażeniem tego typu animacji, które można uzyskać w programie Flash.
Niezależnie od tego, czy jest to wirowanie, kręcenie, zanikanie, skakanie, podskakiwanie czy nawet śpiewanie, animacja Flash jest czymś spektakularnym. Abyś był jeszcze bardziej złakniony poznania narzędzia jakim jest Flash, wspomnę choćby o możliwości łączenia interfejsu programu Flash z dynamiczną bazą danych. Oznacza to, między innymi, że witryny e-komercji przestaną być nudne, a zaczną być piękne. Z każdą nową wersją Flash coraz lepiej spełnia wymagania stawiane standardowemu narzędziu do tworzenia witryn.
Ci, którzy budują swoje witryny od początku do końca w programie Flash, unikają wielu pułapek projektowych, które od lat są zmorą projektantów stron WWW. Na przykład sekwencje wideo programu Flash dostosowują się rozmiarami do okna przeglądarki, co eliminuje obawy związane z szerokością jej okna. Ponieważ Flash jest programem wektorowym, kwestia utraty jakości obrazu praktycznie nie istnieje.
Aby zrozumieć jak działa Flash, musisz zacząć od tego, że Flash nie jest częścią składową programu Dreamweaver, ani też przeglądarki. Zanim wstawisz sekwencję wideo na stronę WWW tworzoną w programie Dreamweaver, najpierw musisz przygotować tę sekwencję w programie Flash. Programy Dreamweaver i Flash ? oba wyprodukowane przez firmę Macromedia ? można traktować jak członków jednego zespołu dążących do wspólnego celu: stworzenia wspaniałej witryny, która nie tylko doskonale wygląda, lecz także udostępnia wiele interaktywnych opcji.
Flash ewoluował od programu do tworzenia animacji typowych dla filmów rysunkowych, przez animacje dla gier elektronicznych, po prezentacje multimedialne. To, co odróżniło Flash od pozostałych programów do animacji, to możliwość wyeksportowania animacji jako plików Shockwave i stosowania ich na stronach WWW. Każda nowa wersja coraz lepiej zaspokaja potrzeby projektantów i twórców stron WWW. Obecnie jest to już nie tylko program do animacji. Chociaż nadal użytkownik programu Flash musi znać podstawy tworzenia animacji, to zakres możliwości, jakie daje program, jest znacznie szerszy.
Można na przykład przesłać zmienne z bazy danych do interfejsu Flash i zaprezentować rezultaty na stronie WWW za pomocą animacji. Można także stworzyć aplikacje e-komercji, udostępniające użytkownikom animowany interfejs, który dodatkowo pozwala śledzić stan rachunku oraz przechowuje numery kart kredytowych. Połączenie możliwości artystycznych i potencjału technicznego sprawiło, Flash stał się znany jako program do tworzenia bardziej interesujących witryn.
Jednym z terminów, który pojawia się często w połączeniu z programem Flash jest termin ?grafika wektorowa?. Obrazy wektorowe są wyświetlane na ekranie lub wysyłane do drukarki obsługującej PostScript w oparciu o dokładnie określone równania matematyczne. Projektanci dokumentów drukowanych i stron WWW są równie wielkimi wielbicielami grafiki wektorowej, bowiem cechuje ją szeroki zakres skalowalności przy zachowaniu jakości obrazu. Dotyczy to zarówno ekranu komputera, jak i wydruku na drukarkach obsługujących PostScript.
Jeśli na przykład chcesz umieścić logo firmy na tablicy ogłoszeń, projektant Twojego plakatu niewiele będzie w stanie zdziałać z przesłanym mu obrazem rastrowym o rozdzielczości 72 dpi. Żeby uzyskać sensowny efekt, najpierw musi on odtworzyć logo w postaci wektorowej ? korzystając z takich programów, jak Adobe Illustrator lub Photoshop, ewentualnie Macromedia Freehand lub Fireworks. Dopiero powstały w ten sposób obraz wektorowy można powiększyć do rozmiaru wymaganego na plakacie, bez obaw o rozmycie krawędzi i utratę koloru. Jeśli będzie to konieczne, to samo logo wektorowe można następnego dnia pomniejszyć tak, aby zmieściło się w rogu koperty, i nadać mu inny kolor. I nadal krawędzie będą ostre, a kolor prawdziwy. W tym się właśnie zawiera piękno grafiki wektorowej. Dodatkowa korzyść to niewielki rozmiar plików.
Flash jest programem wektorowym, a więc wszelkie obiekty, które powstają przy użyciu jego modułu rysunkowego automatycznie przeskalowują się, dopasowując do rozmiarów okna. Nie musisz więc ich rozciągać lub pomniejszać i nie tracą one jakości. To samo dotyczy wszelkich kształtów wektorowych, które wklejasz lub importujesz do biblioteki programu Flash. Inaczej jest jednak w przypadku fotografii i zeskanowanych grafik. Obrazy fotograficzne, takie jak obrazy JPG, to pliki zawierające ilustracje rastrowe i nie można ich skalować. Innymi przykładami grafiki rastrowej (oprócz obrazów BMP) są obrazy w formatach TIF, PICT i GIF.
Komputery nie potrafią skalować grafiki rastrowej bez utraty jakości, ponieważ obraz rastrowy stanowi zestaw pikseli, których ułożenia nie można zmienić. Dla grafiki rastrowej układ pikseli jest czymś tak trwałym, jak dla Ciebie struktura DNA. Wymuszenie zmiany rozmiarów takiego obrazu zawsze powoduje utratę jakości. Uwaga ta jest równie prawdziwa dla obrazów prezentowanych na ekranie, jak i drukowanych. Utrata jakości pojawia się także jako efekt kompresji lub usunięcia kolorów (tak jak w przypadku eksportu do formatu GIF).
Program Flash pozwala na importowanie grafiki rastrowej i stosowanie jej w animacjach. Warto jednak, abyś już teraz wiedział, że spowolni to odtwarzanie filmu tam, gdzie nie są dostępne łącza
o wysokiej przepustowości. Oczywiście wzrośnie także rozmiar pliku .swf powstałego po wyeksportowaniu do formatu Shockwave.
Obrazy rastrowe nie są wcale rzadkie w sekwencjach wideo, lecz zaleca się ograniczanie ich liczby. W przeciwnym razie efektem Twoich działań będzie bardzo wolny film. Flash daje nad tym pewną kontrolę, poprzez możliwość zmiany poziomu jakości obrazu przy eksporcie do formatu JPG. Im wyższa jakość obrazu JPG, tym większy rozmiar pliku i wyższe obciążenie łączy.
Ponieważ pliki .swf są w formacie wprowadzonym przez Macromedia, ich obsługa w przeglądarce jest możliwa dopiero po zainstalowaniu programu Macromedia Flash Player. Najnowsze wersje przeglądarek Firefox i Internet Explorer mają już wbudowany moduł Flash Player, aczkolwiek w różnych wersjach.
W przeglądarce Microsoft Internet Explorer Macromedia Flash Player występuje jako kontrolka ActiveX, do której odwołanie w kodzie HTML umieszcza się w znaczniku <OBJECT>. W Navigatorze Netscape jest to moduł dodatkowy, do którego odwołanie definiowane jest w znaczniku <EMBED>. Tak więc, aby umożliwić obsługę plików .swf w obu typach przeglądarek, w kodzie HTML należy umieścić oba znaczniki ? <OBJECT> i <EMBED>.
Aby wstawiana w dokumencie HTML sekwencja wideo mogła zostać skonfigurowana i odtworzona w przeglądarce, musi ona być w formacie Shockwave Flash (.swf). Sekwencja wideo utworzona w programie Flash zostanie zapisana jako plik .fla, a większość przeglądarek będzie miała problemy z jej odtworzeniem, dopóki wersja pliku nie zostanie przekonwertowana do postaci .swf za pomocą polecenia Export.
Być może z tego względu wyraz Shockwave stał się podstawowym źródłem nieporozumienia. Wiele osób myśli, że Shockwave to program, a tak nie jest. W rzeczywistości Shockwave to typ pliku. Tak jak .JPG czy .GIF to typy plików graficznych tworzonych przy eksporcie obrazu w programie do obróbki grafiki, tak rozszerzenie .swf (pochodzące od Shockwafe Flash) przypisywane jest plikom eksportowanym z Macromedia Flash lub Director (oraz paru innych programów). Pliki wyeksportowane w programach Flash lub Director do formatu Shockwave mogą być odtwarzane w przeglądarkach i prezentują się w nich nieźle.
Inspektor Property umożliwia zmianę najczęściej stosowanych dla sekwencji wideo programu Flash ustawień:
Flash staje się coraz bardziej popularny głównie dlatego, że umożliwia przeskalowywanie grafiki wektorowej tak, by zajmowała całe okno przeglądarki, niezależnie od jego rozmiarów. Rozmiary plików grafiki wektorowej są przy tym bardzo niewielkie, dzięki czemu czasy ładowania są krótkie. Sekwencje wideo programu Flash mogą także zawierać obrazy rastrowe, co z kolei wydłuża czas odtwarzania.
Tagi: animacje, fla, flash, swf
Kategoria: Tworzenie stron | Komentarze są wyłączone
wtorek, 2 Listopad 2010
Jeśli decydujesz się na wprowadzenie na swoich stronach WWW elementów animowanych, w procesie projektowania witryny zastanów się najpierw nad najwłaściwszym narzędziem do przygotowania takich elementów. W przypadku pasków reklamowych, tak zwanych banerów,
które będą włączać się i wyłączać wyświetlając komunikaty, najlepszym rozwiązaniem jest skorzystanie z programu Macromedia Fireworks. Daje on dostęp do rozbudowanych narzędzi tekstowych i graficznych, przy zachowaniu możliwości wyeksportowania animacji jako sekwencji GIF, którą bez trudu można przesłać ewentualnym klientom.
Jednak jeżeli chcesz zbudować porywającą witrynę, w której obok obracających się kształtów i błyszczących fotografii pojawić się mają cyfrowe klipy wideo i przesuwający się tekst, a w tle sączyć się będą dźwięki, wybór powinien paść na Macromedia Flash. Narzędzia graficzne tego programu nie są może najlepsze (aczkolwiek znacznie je poprawiono w najnowszej wersji), ale masz za to możliwość tworzenia złożonych animacji, oszczędnych pod względem objętości pliku, które można skalować do dowolnych rozmiarów okna przeglądarki.
Niewątpliwa obfitość programów do tworzenia animacji sprawia, że jest z czego wybierać. Być może zastanawiasz się, dlaczego masz korzystać akurat z programu Dreamweaver, skoro programy Flash lub Fireworks także się do tego nadają. Najważniejsze jednak, że linie czasowe pozwalają zintegrować złożone animacje oraz struktury nawigacyjne w całość. Innymi słowy, linie czasowe mogą stanowić coś w rodzaju narzędzia choreograficznego, które pozwala ?dyrygować? sposobem i momentem pojawiania się poszczególnych elementów Twojej witryny oraz ich działaniem. Jest to szczególnie użyteczne w przypadku tworzenia animowanych (rozwijanych) systemów menu, co jest obecnie jednym z najczęstszych zastosowań linii czasowych DHTML.
Po zdobyciu podstawowej wiedzy dotyczącej tworzenia animacji, nie ustawaj w poszukiwaniach nowych rozwiązań. Pomysły możesz znaleźć także w Internecie, przeglądając strony prezentujące zasoby DHTML. Poniżej przedstawiam kilka podpowiedzi przy tworzeniu animacji:
Tworzenie animacji z liniami czasowymi odbywa się poprzez organizację warstw i ich zawartości w funkcji czasu. Do tworzenia pasków animacji służy okno Timelines, a każdy z pasków może zawierać obiekt taki jak tekst, obraz i plik multimedialny, stanowiący element finalnej animacji. Język DHTML (Dynamic Hypertext Markup Language) to podstawa linii czasowych.
Tagi: animacje, flash, swf
Kategoria: Tworzenie stron | Komentarze są wyłączone