Instrukcja wykonania
animowanego tekstu AUTOREKLAMA
Uwaga: animacja jest zaprogramowana na 3 odtworzenia.
Aby powtórzyć odtwarzanie musisz ponownie wejść na stronę.
Widok panelu Warstwy
w programie Photoshop.

Przygotuj nowy obrazek w Photoshopie (350x60
pikseli, 72 ppi, RGB). Powinien zawierać warstwy tekstowe (w kolejności
od góry) na -Stosie Warstw:
USŁUGI, 5, NA, TO TU !!! czerwone, TO
TU !!! białe cienkie, TO TU !!! białe grube, Tło.
Warstwa -Usługi- zostanie wypełniona tekstem USŁUGI, czcionką Bookman
Old Style -Bold - 24 pkt. biel.
Warstwa -5- zostanie wypełniona cyfrą 5, czcionką Bookman Old Style
-Bold- 150 pkt biel.
Warstwa -To tu !!!- zostanie wypełniona tym tekstem, czcionką Bookman
Old Style- Italic - 36 pkt. czerwień.
Warstwę -To tu !!!- będziemy modyfikować, więc musimy ją renderować,
a następnie powielić.
Na kopię wprowadzimy zaznaczenie z oryginału i poszerzymy zaznaczenie
o 1 piksel. Zawartość zaznaczenia wypełnimy bielą. Z oryginału tworzymy
drugą kopię i poszerzamy zaznaczenie tym razem o 2 piksele. Zawartość zaznaczenia
wypełnimy bielą. Plik z obrazkiem, w formacie PSD (a więc z warstwami)
jest do wglądu. Tytuł pliku -Tekst animowany 1A-.
- Wykonaj: -Extensis- PhotoAnimator- oraz -File- Open- (Vertical Grouped, Top
to Bottom, Layer Images)
-
Ukryj wszystkie warstwy oprócz -Tło- (na Layer Pane zgaś oczka).
-
Uaktywnij warstwę -Tło- i zleć: - Animation - Resize Cell - (Number of
Frames = 32 - ilość klatek). Animacja będzie posiadać 32 klatki.
-
Uaktywnij tylko warstwę -Usługi-
(na Leyer Pane) i zleć: - Animation - Resize - Cell - (Number of Frames
= 6). Zajmiemy się 6 pierwszymi klatkami napisu Usługi. Kliknij dwukrotnie
na Frame 1. W otwartym okienku Image Repeat Settings ustaw pozycje
klatek wg załączonego rysunku. Wpisz w Location (czyli początkowej
klatce) na osi X wartość 11 pikseli, co zapewni brak widoku napisu, w okienku
-Move To-, X=25, gdyż taka będzie odległość litery (skrajnej, lewej)
od krawędzi klatki.
Rysunek 36. Extensis. Image Repeat Settings

-
Mając podświetlone klatki od 1 do 6 wciśnij CTRL+C (kopiowanie klatek),
następnie kliknij w 7 klatkę i wklej (CTRL+V).
-
Na klatkach 7 do 12 wykonamy stopniowe ściśnięcie napisu, aż do 40% jego
długości. Kliknij w 7 klatkę i zleć: -Effect- Image- Scale-. Usuń zaznaczenie:
MoveTo.
Rysunek 37. Extensis. Image Scale Settings.

-
Skopiuj (CTRL+C) klatki 7 - 12, kliknij w klatkę 13 i wklej (CTRL+V).
-
Zleć: - Animation - Resize Cell - (Number of Frames czyli ilość klatek=14).
Animacja w części trzeciej będzie posiadać
14 klatek.
Wykonamy w niej stopniowy powrót (rozszerzenie ściśniętego napisu) do pierwotnego
wyglądu.
-
Kliknij podwójnie w 13 klatkę (lub zleć: -Effects- Image- Scale-) i zmień
wartości Horizontal: From = 40%, To = 100%.
-
Skopiuj klatki 7-12 i wklej klikając w klatkę 27. Wpisz wszędzie wartości
100%, bez -Move To-. Uzyskaliśmy 6 klatek nie animowanych, ustawionych
docelowo.
-
Uaktywnij warstwę -Na- , kliknij w klatkę nr 1 i zleć: -Animation- New-
Cell-. Kliknij Frame 2 i przeciągnij kursorem w miejsce Frame 1.
Należy tak postąpić, gdyż PhotoAnimator kopiuje i wkleja nowe komórki zawsze
jako ciąg dalszy animacji, a my zaczynamy pracę nad nową warstwą. Utworzymy
teraz klatki 1-12. - Animation -Resize Cell- (12 klatek)
Zaczniemy wyświetlać napis od 13 klatki. Kliknij w klatkę 13 i zleć:
-Animation- Resize Cell- (8 klatek). Kliknij podwójnie na klatce 13 i ustaw
parametry: Locations X=157, Y=0; zaznacz -Move To- i wpisz X=122, Y=0.
To samo uzyskasz stosując wersję z drugiego rysunku (zmieniło się ułożenie
kwadratu i namiary).
Rysunek 38. Extensis. Image Repeat
Setting.
-
Kliknij w klatkę 13, skopiuj (klatki 13-20 ) CTRL+C. Następnie kliknij
w klatkę 21 i wklej (CTRL+V).
-
Zleć: -Animation - Resize Cell- (12 klatek). Kliknij w 21 klatkę podwójnie
lub zleć: - Effect- Image -Repeat-.
Rysunek 39. Extensis. Image Repeat Setting.

-
Mamy gotowe animacje 2 warstw: -Usługi-, -Na-. Wykonamy teraz
animację z cyfrą 5.
-
Uaktywnij warstwę 5 i zleć: -Animation- New- Cell-.
-
Kliknij Frame 2 i przeciągnij ją kursorem na lewo, na Frame 1. -Animation
- Resize Cell- (6 klatek). Nie będziemy na nich wykonywać zleceń, więc
zostaną puste.
-
Kliknij w Frame 7 i zleć: -Animation- Resize Cell- (10 ramek). -Effect-
Image- Scale- i ustaw parametry klatek 7-16 wg załączonego rysunku.
Rysunek 40. Extensis. Image Scale Setting.

Wyjaśnienia.
Ponieważ cyfra 5 jest zdecydowanie za duża, należy ustalić parametry,
czyli proporcje od jej naturalnej wielkości do docelowej, poprzez próby.
Ja wybrałem zmniejszenie do 25%. Wartość X=5 wynika z konieczności przesunięcia
cyfry 5 pikseli w prawo (w poziomie na osi X), tak aby nie osadziła się
zbyt blisko napisu z lewej strony.
-
Wypełnij klatki 17 - 32. Kliknij w klatkę 16 i skopiuj ją (CTRL+C), kliknij
w klatkę 17 (CTRL+V). -Animation- Resize Cell- (wpisz ilość klatek od 17
do 32 czyli 16 ). Kliknij podwójnie w klatkę 17 i wpisz wszędzie 25% (nie
będzie modyfikacji). X=5.
-
Wprowadzenie następnego napisu jest powielaniem użytych już zleceń, więc
opiszę tą część skrótowo.
-
Uaktywnij warstwę -To tu czerwona- i kliknij w klatkę -nr1. Wykonaj zlecenie:
-Animation- New Cell- musimy to zrobić, gdyż zaczynamy nową warstwę. -
Przesuń kursorem klatkę 2 na miejsce klatki 1. -Animation- Resize Cell-
(22 klatki) Nic nie będziemy na nich zlecać, więc zostaną puste. Kliknij
w Frame 23 i zleć: -Animation- Resize Cell- (8 klatek).
-
-Animator- New Layer- Nazwij nową warstwę Warstwa X i wróć -Warstwa X-
i wróć -Animation - New Cell - oraz -Animation -Resize Cell- (22). Kliknij
w klatkę 22 i skopiuj (CTRL+C). Kliknij w klatkę 23 i wklej (CTRL+V)
i zleć: -Animation Resize- Cell (5 klatek). Kliknij na klatce 23 i zleć:
-Effect- Transition- Fade- (inter, od 0 do 100%).
-
Uaktywnij warstwę -To TU białe cienkie-, wykonaj zlecenie: -Animation-
New Cell- musimy to zrobić, gdyż zaczynamy nową warstwę. Przesuń
kursorem klatkę 2 na miejsce klatki 1. -Animation- Resize Cell- (26 klatki).
Nic nie będziemy na nich zlecać, więc zostaną puste. Kliknij w Frame 27
i zleć: -Animation- Resize Cell- (4 klatki).
-
Uaktywnij warstwę To TU białe grube. -Animation- New Cell - musimy to zrobić,
gdyż zaczynamy nową warstwę. Przesuń kursorem klatkę 2 na miejsce klatki
1. -Animations- Resize Cell- (27 klatki) Nic nie będziemy na nich zlecać,
więc zostaną puste. Kliknij w Frame 28 i zleć: -Animation -Resize Cell-
(5 klatek). Następnie: -Animation -FrameRate- (Ustaw ilość ramek
na sekundę - 4). eraz można zapisać animowanego GIFa. Skorzystamy ze zlecenia:
- File - Eksport-. Wybieramy format pliku, ustalimy ile razy animacja ma
się powtórzyć. Wybieramy opcję Dither , jeżeli obrazek zawiera subtelne
przejścia między kolorami. Rodzaj Ditheru wybierz eksperymentując, ja wybrałem
kropkowany. W zleceniu: -File- Save- zapiszemy plik w formacie Extensis
PhotoAnimatora, aby w przyszłości łatwo wprowadzić poprawki do animacji.
W powyższej animacji użyliśmy rozjaśnienie klatek przy pomocy warstwy wypełnionej
zleceniem: -Efekt- Transition- Fade-.
|