Dobre książki do rysowania Photoshop, brat ImageReady

Aug 29, 2023

Zostaw wiadomość

Jeśli na komputerze jest zainstalowany program Photoshop w wersji 5.5 lub nowszej, z pewnością oprócz programu Photoshop na komputerze zostanie zainstalowany inny program o nazwie ImageReady. Czy wiesz, do czego się go używa?

ImageReady to specjalny program do edycji animacji, który nadrabia niedociągnięcia Photoshopa w edycji animacji i materiałów internetowych. ImageReady zawiera dużą liczbę narzędzi do tworzenia obrazów i animacji internetowych, a nawet może wygenerować część kodu HTML, co można powiedzieć, że jest potężne. Przyjrzyjmy się dwóm jego podstawowym funkcjom animacji.

1. Twórz animowane GIF-y

Animacja to tak naprawdę seria ciągłych, statycznych obrazów. Każdy statyczny obraz nazywany jest klatką. Kiedy te klatki są wyświetlane w sposób ciągły i szybki, tworzy to efekt animacji. Edycja animacji za pomocą ImageReady polega na manipulowaniu klatkami.

1. Utwórz nową ramkę

Otwórz ImageReady, utwórz nowy plik o wymiarach 244×277 pikseli o nazwie „Finger Magic”, w menu „Okno” kliknij polecenie „Pokaż warstwę” i polecenie „Pokaż animację”, aby panel warstw i panel animacji pojawiły się w interfejsie oprogramowania. Otwórz plik t1.jpg, naciśnij Ctrl+A, aby zaznaczyć całą zawartość obrazu, skopiuj i wklej go do nowego obrazu. Jest to pierwsza klatka animacji i jest to domyślny normalny stan obrazu w programie.

Kliknij przycisk „Kopiuj bieżącą klatkę” pod panelem animacji, aby utworzyć drugą klatkę. Skopiuj także całą zawartość t2.jpg do nowego pliku „Quick Finger Magic”.

Następnie użyj powyższej metody, aby wkleić t3.jpg, t4.jpg, t5.jpg, t6.jpg do ich własnych nowych ramek, tworząc w sumie 6 klatek.

2. Dopasuj warstwy i ramki

Wybierz warstwę „Tło” w panelu Warstwy i naciśnij przycisk „Usuń warstwę” (mały symbol kosza na śmieci) w prawym dolnym rogu panelu warstw, aby usunąć warstwę tła.

Kliknij, aby zaznaczyć klatkę 1 w panelu Animacja i ukryć warstwy 2, 3, 4, 5 i 6 w panelu Warstwy (usuwając „małe oczka” po lewej stronie tych warstw).

Następnie kliknij Klatkę 2 w panelu Animacja i ukryj Warstwy 1, 3, 4, 5, 6 w panelu Warstwy, tak aby widoczna była tylko zawartość warstwy 2.

W ten sam sposób pozostałe warstwy w klatkach od 3 do 6 są ukrywane osobno, tak że każda klatka pokazuje tylko zawartość warstwy z nią związaną. Wynik pokazano na rysunku 2.

3. Podgląd i przechowywanie

Na dole każdej klatki w panelu animacji kliknij mały odwrócony trójkąt po prawej stronie słowa „sekundy” i wybierz czas wyświetlania każdej klatki (0240 sekund, możesz dostosować samemu). Na koniec możesz bezpośrednio przetestować animację, klikając przycisk Odtwórz w panelu animacji. Jeśli nadal jesteś zadowolony, możesz wybrać opcję „Zapisz wyniki optymalizacji” w menu „Plik”, zapisać nasze wyniki jako „finger magic.gif” i zakończyć produkcję.

Przy okazji, możesz także otworzyć dowolny animowany GIF za pomocą ImageReady i edytować każdą klatkę. Uważam, że interfejs ImageReady jest bardziej przyjazny dla użytkownika i łatwiejszy w obsłudze niż FireWork, kolejny dobrze znany program do edycji animacji.

Po drugie, wykonaj odwracanie zdjęć

Na stronach internetowych często można spotkać różne efekty dynamiczne powodowane przez zdarzenia myszy, takie jak najczęstsze najechanie myszką na obraz, kliknięcie i odsunięcie się, a także zmiana zawartości obrazu. Chociaż edycja tego efektu za pomocą internetowego kodu HTML jest uciążliwa, ImageReady jest znacznie łatwiejszy.

Metoda tworzenia tego efektu odwracania obrazu jest w zasadzie taka sama, jak metoda tworzenia animacji powyżej, jedyną różnicą jest to, że zamiast otwierać panel animacji w celu edycji każdej klatki, otwieramy panel odwracania, aby edytować każdy inny stan myszy.

Użyj polecenia „Okno → Odwrócenie wyświetlacza”, aby otworzyć panel odwracania i kliknij przycisk „Utwórz nowy stan odwrócenia” na dole panelu, aby utworzyć różne stany odwrócenia. Jest tu łącznie 6 stanów, a mianowicie: normalny, Over, Down, Click, Out i Up. Pozostałe kroki nie wymagają wiele do powiedzenia, to samo polega na ustaleniu odpowiednich relacji między każdym stanem i każdą warstwą, a na koniec wybierz opcję „Zapisz wynik optymalizacji jako…”, zapisz w formacie HTML.