DZWON

Są tacy, którzy czytają tę wiadomość przed tobą.
Zapisz się, aby otrzymywać najnowsze artykuły.
E-mail
Imię
Nazwisko
Jak chcesz przeczytać The Bell
Bez spamu

Darmowe oprogramowanie do tworzenia animacji flash za pomocą gotowych apletów.

Myślę, że wielu z was próbowało kiedyś stworzyć własne witryny (a może nawet posiadacie bardzo popularny portal).

Tak czy inaczej, każdy stanął przed problemem efektywnego projektowania swoich stron internetowych. A ponieważ statyczny kod HTML stopniowo odchodzi w przeszłość, wielu dzisiaj zwraca na niego uwagę popularne technologiejak JavaScript i Flash. Pozwalają tworzyć piękne animowane dynamiczne strony z zaawansowaną funkcjonalnością.

Specjaliście nie będzie trudno zrobić mały animowany baner flashowy, ale co powinna zrobić reszta niewtajemniczonych? Jeśli w twoich bezpośrednich planach nie uwzględniono dokładnej nauki języków programowania, możesz, jak zawsze, skorzystać ze specjalistycznego oprogramowania. Dziś zapoznamy się z podstawami pracy w programie Zaawansowany kreator efektów.

To narzędzie umożliwia tworzenie wszelkiego rodzaju efektów flash i JavaScript, zarówno własnych „od zera”, jak i na podstawie gotowe szablony! Advanced Effect Maker występuje w kilku edycjach, które różnią się ilością gotowych efektów oraz stopniem swobody użytkownika. Porównajmy konfigurację maksymalną i darmową:

Porównanie darmowej wersji edytora flash Advanced Effect Maker Free Edition z komercyjną wersją Commercial Edition

Największa wada darmowa wersja programy - obecność swoistego preapploadera, który pozwala przejść do obejrzenia niektórych gotowych efektów dopiero po kliknięciu w utworzony baner. Na tym wszystkie różnice w zasadzie się kończą :).

Instalacja programu

Instalacja Advanced Effect Maker odbywa się w standardowy sposób, przejdźmy więc bezpośrednio do pracy z programem:

Przy pierwszym starcie będziemy mogli się z nią zapoznać umowa licencyjna... Aby ją zaakceptować, kliknij przycisk „Zgadzam się”. Następnie możesz zacząć studiować interfejs narzędzia:

Interfejs i praca z edytorem

Pomimo język angielskitutaj wszystko jest proste i jasne. Okno Advanced Effect Maker jest podzielone na dwie części. Po lewej są tylko dwa duże przyciski: pierwsza to wejście do galerii dostępnych efektów, a druga to dodanie dodatkowych apletów (jeśli chcesz je kupić;)). Po prawej stronie widzimy katalog dostępnych szablonów wraz z podsekcjami i oknem podglądu oraz polem edycji efektu.

Aby rozpocząć edycję żądanego szablonu, wystarczy kliknąć na jego obrazek, a jeśli chcesz tylko zobaczyć, jak to działa, kliknij napis „Podgląd” pod zdjęciem:

Po otwarciu żądanego efektu może pojawić się komunikat o istniejącym pliku. Jeśli tak się stanie, po prostu zignorujemy to, klikając przycisk „OK”:

Jeśli szablon został pomyślnie otwarty, będziemy mogli zobaczyć kilka zakładek, które zawierają różnego rodzaju ustawienia:

Ustawienia programu i tworzenie animacji

Pierwsza zakładka to „Ogólne”. Zawiera ogólne ustawienia projektu. Zwykle są to wymiary (szerokość - szerokość i wysokość - wysokość), nazwa (nazwa pliku), jakość przyszłego pliku (jakość), a także tryb okna filmu flash (tryb okienkowy).

Druga zakładka - „Kolor”, jak sama nazwa wskazuje, odpowiada za kolory użyte w projekcie. Tutaj wszystko jest bardzo jasne, przejdźmy więc do następnego - „Wiadomości”:

Tutaj mamy dwa pola. W pierwszym polu (po lewej) wpisujemy tekst, który mamy wyświetlić ze specjalnym efektem, aw drugim - link, który użytkownik będzie podążał klikając w nasz baner. Zaletą Advanced Effect Maker jest to, że możemy wprowadzić nieograniczoną liczbę linii tekstu (a także linków), ale główną wadą jest brak wsparcia dla języka rosyjskiego :(.

Kolejne dwie zakładki służą odpowiednio do zarządzania czcionkami (Czcionki) i właściwościami animacji (Inne). Jedno zastrzeżenie: jeśli chcesz użyć alternatywnych czcionek TTF, musisz je najpierw przekonwertować w celu zapewnienia zgodności z Advanced Effect Maker. Aby to zrobić, wywołaj narzędzie Konwertuj czcionki z menu Narzędzia i po wybraniu żądanej czcionki naciśnij przycisk Konwertuj:

Po wprowadzeniu wszystkich zmian możemy kliknąć przycisk „Utwórz aplet”. Następnie w folderze docelowym projektu zostaną utworzone dwa pliki: SWF (bezpośrednia animacja) i HTML (zawiera instrukcje dotyczące osadzania powstałej animacji w kodzie strony:

Zapisywanie wyników pracy

Jednak to nie wszystko. Dzięki Advanced Effect Maker możesz stworzyć swój własny efekt na podstawie już istniejącego lub całkowicie „od zera”! Aby to zrobić, przejdź do menu „Narzędzia” i aktywuj element „Plugin Maker”:

Tutaj musisz najpierw ustawić nazwę nowego projektu, a także kilka innych parametrów (opcjonalnie). Następnie możesz kliknąć przycisk „Utwórz aplet”, a przejdziemy bezpośrednio do okna edytora efektów:

Jest tutaj kilka przycisków, które umożliwiają wprowadzenie niektórych funkcje standardowe... Jedynym problemem jest to, że wszystkie niezbędne zmienne i wartości będą musiały zostać wprowadzone ręcznie samodzielnie, a tutaj już potrzebujesz umiejętności programowania w ActionScript lub JavaScript :(.

wnioski

Advanced Effect Maker może spodobać się początkującym projektantom stron internetowych, ponieważ pozwala bez wysiłku tworzyć całkiem skuteczne banery, animowane menu, pokazy slajdów, a nawet małe gry (takie jak tagi). Wadę w postaci preapploadera (jeśli taki jest w wybranym efekcie) można wyeliminować za pomocą specjalnych programów-dekompilatorów plików SWF (w tym darmowych);).

Powodzenia we wszystkich twoich przedsięwzięciach i twórczych sukcesach!

P.S. Dozwolone jest dowolne kopiowanie i cytowanie tego artykułu pod warunkiem wskazania otwartego aktywnego linku do źródła i zachowania autorstwa Rusłana Tertyshnego.

Nieustannie mamy do czynienia z animacją flash - w Internecie oraz w programach telewizyjnych. Tworzenie prostych animacji Flash przy użyciu technologii Flash jest dość prostym zadaniem, ponieważ Flash oferuje wiele. użyteczne narzędziaktóre upraszczają cały proces. Jeśli chcesz stworzyć animację flash lub kreskówkę, możesz ją naszkicować w ciągu zaledwie kilku godzin.

Kroki

Część 1

Animacja flash klatka po klatce

    Podstawy animacji poklatkowej. Ta metoda jest uważana za główną metodę tworzenia animacji „tradycyjnej”, w której każda kolejna klatka zawiera jeden, ale nieco zmodyfikowany obraz. Po odtworzeniu wszystkich klatek obraz ożywa. Jest to ta sama technika, której używają animatorzy odręczne i jest bardziej czasochłonna niż animacja (patrz następna sekcja).

    • Domyślnie Flash odtwarza 24 klatki na sekundę (FPS). Oznacza to, że 24 klatki zostaną wyświetlone w ciągu jednej sekundy, ale nie wszystkie muszą się różnić. Możesz zmienić to ustawienie (jeśli chcesz) na 12 klatek na sekundę, ale przy 24 klatkach na sekundę animacja będzie odtwarzana płynniej.
  1. Zainstaluj Flash Professional. Dostępnych jest wiele programów do animacji flash, ale najpotężniejszy jest Adobe Flash Profesjonalne CC. Możesz zainstalować za darmo wersja próbna ten program lub użyj innego produktu (jeśli nie chcesz rejestrować się w Adobe Creative Cloud). W pozostałej części tego artykułu opisano, jak pracować z programem Flash Professional.

    Ponieważ animacja klatka po klatce wymaga wielu obrazów (które nieznacznie się od siebie różnią), należy utworzyć te obrazy ręcznie. Aby to zrobić, użyj programu Adobe Flash Professional lub narysuj obrazy w dowolnym edytorze graficznym.

    • Jeśli chcesz, aby obrazy można było łatwo zmieniać bez utraty jakości, twórz obrazy w formacie wektorowym, a nie w formacie grafika rastrowa. Obrazy wektorowe przerysują się po zmianie rozmiaru (to znaczy unikasz pikselizacji lub wygładzania krawędzi). Mapy bitowe - Są to tradycyjne obrazy, na przykład fotografie, obrazy malowane itd. Jeśli spróbujesz powiększyć takie obrazy, otrzymasz mocno zniekształcony obraz.
  2. Utwórz pierwszą klatkę. Po pierwszym uruchomieniu Adobe Flash Professional zobaczysz puste płótno (warstwę) i pustą oś czasu. W miarę dodawania klatek oś czasu wypełni się automatycznie. Z warstwami można pracować tak samo, jak w programie Photoshop.

    • Przed dodaniem obrazu utwórz podstawowe tło dla swojej animacji. Zmień nazwę „Warstwa 1” na „Tło”, a następnie zadokuj ją. Utwórz drugą warstwę i nadaj jej dowolną nazwę. To będzie warstwa, na której utworzysz swoją animację.
    • Dodaj rysunek do płótna pierwszej klatki. Możesz zaimportować rysunek z komputera lub możesz użyć narzędzi do rysowania, aby utworzyć rysunek bezpośrednio w programie.
    • Pierwsza ramka to ramka „kluczowa”. Klatka kluczowa to klatka zawierająca obraz i tworząca szkielet animacji. Stworzysz nowy klatka kluczowa za każdym razem, gdy obraz jest zmieniany.
    • Klatki kluczowe na osi czasu są oznaczone czarną kropką.
    • Nie potrzebujesz klatki kluczowej w każdej kolejnej klatce. Utwórz klatkę kluczową co cztery do pięciu klatek, aby uzyskać dobrą animację.
  3. Przekonwertuj obraz na symbol. W takim przypadku możesz dodać obraz do ramki kilka razy. Jest to szczególnie przydatne, jeśli chcesz szybko dodać kilka zdjęć tego samego typu w jednej ramce (na przykład ryby w akwarium).

    • Wybierz zdjęcie. Kliknij prawym przyciskiem myszy obraz i wybierz „Konwertuj na symbol”. Obraz zostanie dodany do biblioteki, dzięki czemu będzie łatwiejszy w użyciu w przyszłości.
    • Usuń rysunek. Nie martw się - możesz dodać go do ramki, po prostu przeciągając i upuszczając z biblioteki. W ten sposób możesz wielokrotnie dodać ten sam obraz do ramki.
  4. Dodaj puste ramki. Gdy pierwsza klatka kluczowa będzie gotowa, wstaw puste klatki, a następnie przystąp do tworzenia drugiej klatki kluczowej. Naciśnij klawisz F5 (cztery lub pięć razy), aby dodać puste klatki po pierwszej klatce kluczowej.

    Utwórz drugą klatkę kluczową (po dodaniu kilku pustych klatek). Istnieją dwa różne sposoby zrób to: możesz skopiować istniejącą klatkę kluczową i wprowadzić w niej drobne zmiany lub możesz utworzyć pustą klatkę kluczową i dodać do niej nowy obraz. Jeśli używasz rysunku utworzonego w innym programie, użyj drugiej metody. Jeśli wklejasz obraz utworzony za pomocą narzędzi do rysowania Adobe Flash Professional, użyj pierwszej metody.

    • Aby utworzyć klatkę kluczową na podstawie zawartości poprzedniej klatki kluczowej, naciśnij klawisz F6. Aby utworzyć pustą klatkę kluczową, kliknij prawym przyciskiem myszy ostatnią klatkę na osi czasu i wybierz opcję Wstaw pustą klatkę kluczową.
    • Po utworzeniu drugiej klatki kluczowej musisz zmodyfikować jej obraz, aby ożywić animację. Jeśli korzystałeś z narzędzi do rysowania Adobe Flash Professional, wybierz narzędzie Przekształcanie, aby zaznaczyć element na rysunku (na przykład dłoń postaci) i zmodyfikować go.
    • Jeśli wstawiasz nowy obraz w każdej klatce kluczowej, upewnij się, że znajduje się on we właściwym miejscu (zgodnie z logiczną sekwencją klatek).
  5. Powtórz proces. Po utworzeniu dwóch klatek kluczowych powtórz ten proces - dodaj kilka pustych klatek między każdą klatką kluczową i upewnij się, że animacja odtwarza się „płynnie”.

    • Wprowadź małe zmiany. Im mniejsze (bardziej subtelne) zmiany, tym płynniejsza animacja. Na przykład, jeśli chcesz, aby postać podniosła rękę, druga klatka kluczowa nie powinna zawierać rysunku, na którym postać jest przedstawiona z podniesioną ręką. Zamiast tego użyj kilku klatek kluczowych, aby przejść z opuszczonego ramienia do podniesionego ramienia. W takim przypadku animacja będzie płynniejsza.
  6. Przekonwertuj rysunek. Jeśli utworzyłeś klatki kluczowe i ścieżkę, możesz przekształcić obraz tak, aby zmieniał się płynnie podczas poruszania się po ścieżce bliźniaka. Możesz zmienić kształt, kolor, pochylenie, rozmiar i inne parametry obrazu.

    • Wybierz ramkę, w której obraz zostanie przekształcony.
    • Otwórz panel właściwości obrazu. Aby to zrobić, naciśnij klawisz F3.
    • Zmień wartości parametrów w oknie właściwości obrazu. Na przykład możesz zmienić odcień lub kolor, dodać filtry, zmienić rozmiar.
    • Możesz także użyć narzędzia Przekształcanie swobodne, aby zmienić obraz w dowolny sposób.
  7. Dodaj ostatnie poprawki. Przetestuj utworzoną animację, naciskając Ctrl + Enter. Upewnij się, że rysunek (postać) zmienia się poprawnie i że animacja jest odtwarzana z odpowiednią prędkością. Jeśli animacja odtwarza się zbyt szybko, zmniejsz FPS lub zwiększ czas trwania bliźniaka.

    • Domyślna liczba klatek na sekundę to 24, więc spróbuj zmniejszyć tę wartość do 12. Zmień wartość klatek na sekundę na pasku właściwości. Jednak przy FPS \u003d 12 animacja może nie odtwarzać się wystarczająco płynnie.
    • Aby zmienić czas trwania bliźniaka, wybierz warstwę zawierającą bliźniak i użyj suwaka, aby zmienić czas trwania bliźniaka. Jeśli chcesz podwoić czas trwania bliźniaka, przesuń suwak o 48 klatek. Pamiętaj, aby wstawić tło do pustych ramek, aby nie znikało w środku animacji. Aby to zrobić, wybierz pho nowa warstwa, kliknij ostatnią klatkę animacji (na osi czasu), a następnie naciśnij klawisz F5.

Część 3

Dodawanie efektów dźwiękowych i muzyki
  1. Nagrywaj lub pobieraj efekty dźwiękowe i muzykę. Możesz dodać efekty dźwiękowe do swojej animacji, aby była bardziej efektywna. Muzyka uczyni animacje bardziej ekscytującymi i może zamienić dobre animacje w świetne. Flash obsługuje różne formaty pliki audio, w tym AAC, MP3, WAV i AU. Wybierz format, który gwarantuje wysoka jakość dźwięk przy minimalnym rozmiarze pliku.

    • Format MP3 gwarantuje wysoką jakość dźwięku przy najmniejszym rozmiarze pliku. Pliki WAV są duże.
  2. Importuj pliki audio do biblioteki, aby móc szybko dodawać dźwięki i muzykę do animacji. Kliknij „Plik” - „Importuj” - „Importuj do biblioteki”. Znajdź plik audio na swoim komputerze. Upewnij się, że plik audio ma łatwą do zapamiętania nazwę, aby można go było szybko znaleźć.

    Utwórz nową warstwę dla każdego pliku audio. Jest to opcjonalne i możesz dodać dźwięk do istniejących warstw, ale wstawienie pliku audio na osobnej warstwie zapewni lepszą kontrolę nad ścieżką dźwiękową animacji.

    Utwórz klatkę kluczową, w której rozpocznie się odtwarzanie dźwięku. Na warstwie dźwiękowej wybierz klatkę animacji, od której zacznie się odtwarzanie dźwięku. Naciśnij klawisz F7, aby wstawić pustą klatkę kluczową. Na przykład, jeśli chcesz wstawić plik audio, który będzie odtwarzany przez całą animację, wybierz pierwszą klatkę na warstwie pliku audio. Jeśli dodajesz głos postaci, wybierz ramkę, w której postać zaczyna mówić.

W tym artykule dowiesz się, jak używać proste kroki zacznij korzystać z Adobe Flash CS5. Temat lekcji prosta animacja, stworzymy go bez zagłębiania się w złożoność interfejsu i programu.

Tworzenie nowego dokumentu flash

Otwieramy program i tworzymy nowy dokument ActionScript 3.0.

Narysujmy obiekt do dalszej animacji

Teraz narysujmy okrąg. Wybierz narzędzie „owalne” na prawym panelu i przytrzymaj lewy przycisk myszy oraz przycisk „shift” na klawiaturze i narysuj okrąg na białym tle.

Używając narzędzia Zaznaczanie, wybierz nowo utworzony obiekt, klikając go myszą lub chwytając go do kwadratowego zaznaczenia.

Konwertuj obiekt na symbol, aby uzyskać prostą animację

Aby kontynuować pracę, musisz przekształcić obiekt w symbol. Ponieważ okrąg jest już zaznaczony, naciśnij prawy przycisk myszy i wejdź menu kontekstowe wybierz opcję „Konwertuj na symbol”.

Z listy „Typ” wybierz „Grafika”

Wokół naszego obiektu powinien teraz pojawić się niebieski kwadrat.

Jak stworzyć klasyczną animację

Aby stworzyć animację, musisz wyznaczyć „klatkę kluczową”.

Na dolnym panelu znajduje się skala animacji, wybieramy dwudziestą piątą klatkę i wciskamy prawy klawisz myszki, w pojawiającym się menu kontekstowym wybieramy „Wstaw klatkę kluczową”.

Wybierz okrąg i przytrzymując lewy przycisk myszy, przesuń go w prawo.

Zaznacz pierwszą klatkę na skali animacji iw głównym menu u góry, w pozycji „Wstaw” wybierz „Klasyczna animacja”.

Przeglądanie utworzonej animacji

Teraz możemy obejrzeć animację. W menu głównym w pozycji „Sterowanie” wybierz „Odtwórz”.

Dodajmy do koła efekt „znikania”. W tym celu ponownie zaznacz obiekt iw prawym panelu w menu „efekt koloru” wybierz „alfa”, ustaw wartość na „0”.

Zobaczmy co się stało. Przejdź do elementu „Sterowanie”, wybierz „Odtwórz”.

DZWON

Są tacy, którzy czytają tę wiadomość przed tobą.
Zapisz się, aby otrzymywać najnowsze artykuły.
E-mail
Imię
Nazwisko
Jak chcesz przeczytać The Bell
Bez spamu