Logowanie
 Tworzenie animacji GIF w programie GiftedMotion

Autor: Mariusz Kołacz (rokko)
Strona autora: techformator.pl
Kontakt: m.kolacz(at)hotfix.pl

Głównym składnikiem stron internetowych, oczywiście oprócz tekstu (treści) są statyczne i ruchome elementy graficzne. Każdy z nas spotkał się z animacjami, ruchomymi banerami inaczej mówiąc reklamami. Spora część z nich tworzona jest w oparciu o technologię Flash (format zapisu SWF lub FLA), gdzie banery są efektowne, lecz nie koniecznie efektywne. Dlaczego? Użytkownicy będąc świadkami wszechobecnej komercji, nawału reklam, spotów i innych elementów promocyjnych w pewnym momencie mówią STOP i zaczynają stosować różnego typu dodatki zmniejszające uciążliwość surfowania po internecie. Zazwyczaj prowadzi to do wycinania bądź blokowania niepożądanych reklam (głównie Flash) przez co traci na tym reklamodawca, który nie dotrze do użytkownika (potencjalnego klienta) ze swoją ofertą. Jak temu zaradzić? Czy jest na to jakiś rozsądny sposób?

Tworząc baner reklamowy, należy poważnie zastanowić się nad jego formatem i wybrać pomiędzy klasyczną formą (animacją w formacie APNG lub GIF), lub pozostać przy modelu trendowym, czyli animacji Flash. Nie ukrywam, że ta technologia niesie ze sobą wiele dobrego, mamy znacznie większe pole manewru, możemy przygotować dowolny przekaz, zachowując przy tym niewielki rozmiar pliku. W klasycznej formie, aby osiągnąć ten sam efekt potrzeba znacznie większego wysiłku. Jest to wykonalne i może okazać się w ostatecznym rozrachunku lepszym rozwiązaniem, jednakże decyzja w tej sprawie należy do Was. Co wybierzecie? Tego nie wiem, lecz w tym artykule opiszę, w jaki sposób stworzyć animację GIF, w programie GiftedMotion.

Zabieramy się do pracy, wpierw zaopatrzymy się w darmową aplikację GiftedMotion, która posłuży do stworzenia animacji GIF. Nie wymaga ona instalacji, rozprowadzana jest w formie pliku JAR, dlatego też, aby odpalić program, będziemy musieli zainstalować biblioteki uruchomieniowe Sun Java Runtime Environment.

Przygotowujemy zestaw animacji w dowolnym programie do obróbki grafiki GIMP, Paint.NET, PhotoFiltre etc. W przykładzie wykorzystam zestaw sześciu grafik stworzonych w GIMPie i zapisanych w formacie GIF. Nie jest to baner ani reklama, zwykła sekwencja obrazków, która w rezultacie stworzenia efektu ruchu, będzie przedstawiać migoczące okręgi.

Tworzenie animacji GIF - zestaw testowy

W dogodnej lokalizacji tworzymy folder frames, do którego kopiujemy zestaw plików.

Uruchamiamy GiftedMotion i przystępujemy do stworzenia animowanego GIFa.

Z menu wybieramy File => Load (1) i wskazujemy lokalizację folderu frames. Jeżeli chcemy za jednym razem otworzyć wszystkie klatki animacji, w aktywnym oknie wciskamy skrót CTRL+A i klikamy Open.

GiftedMotion - interfejs programu

Zobaczymy dwa okna, edytor sekwencji (Sequence editor) oraz okno podglądu animacji (7). W sekcji Frame order (6) znajdziemy poszczególne klatki, które zostały ułożone zgodnie z nazewnictwem (01.gif, 02.gif itd.).

Przystępujemy do odtworzenia animacji, klikamy ikonę Play Animation (3). Zatrzymujemy animację, Pause Animation (4). Wiemy już jaki jest efekt domyślnych ustawień, modyfikujemy je wedle potrzeb. W sekcji frame settings możemy ustawić:

  • Time (ms) - czas opóźnienia w milisekundach.
  • Dispose - sposób zastępowania danej ramki, zazwyczaj ustawia się na poprzednią (previous).
  • Offset X - przesunięcie w osi X (poziomie) o zadaną liczbę pikseli. Modyfikacji można również dokonać chwytając klatkę animacji i przesuwając ją w dowolny punkt w obszarze krycia.
  • Offset Y - przesunięcie w osi Y (pionie) o zadaną liczbę pikseli.

Zaznaczamy wybraną klatkę i dokonujemy zmian. Zaznaczenie opcji Apply changes to all frames spowoduje zastosowanie jednego ustawienia do wszystkich klatek animacji.

Przyciski Swap with previous frame (8) i Swap with next frame (9) służą do zmiany położenia klatki w sekwencji, pozostałe dwa przyciski Add a copy of the frame (10) oraz Remove frame from sequence (11) pozwalają na zduplikowanie lub usunięcie wybranej klatki.

Dostęp do zaawansowanych opcji uzyskamy klikając ikonę Configure export settings (2). Ustawimy tam miedzy innymi przeźroczystości, stopień wygładzania, liczbę powtórzeń animacji (dla -1 jedno powtórzenie, dla wartości 0 nieskończenie wiele powtórzeń).

GiftedMotion - ustawienia

Po dopasowaniu wszystkich ustawień, pora na odtworzenie animacji. Wybieramy Play (3), jeżeli efekt jest zadowalający zapisujemy animację, klikamy Record animation (5).

W moim przypadku efekt końcowy wygląda mniej więcej tak...

Animacja GIF w GiftedMotion

Dzięki GiftedMotion możemy także wyodrębnić klatki z animowanego GIFa. Po załadowaniu pliku wybieramy File => Save single frames, wskazujemy docelowy folder i zapisujemy zestaw (Save). We wskazanym folderze powstaną pliki odpowiadające poszczególnym klatkom animacji.


Copyright © rokko


Wszystkie prawa zastrzeżone. Kopiowanie całości lub fragmentów niniejszego artykułu jest zabronione.

 Reklama

 Komentarze
Brak dodanych komentarzy. Może czas dodać swój?
 Dodaj komentarz
Dla wszystkich komentarzy wymagana jest ich akceptacja przez moderatora.

Nick:



AntyBOT (dla niezalogowanych): Napisz słowo hotfix wielkimi literami

/articles.php?article_id=299

 Artykuły
Polecany artykuł


Jak walczyć z pobieraczkiem? Jak odstąpić od umowy? O tym w artykule.
 Ostatnie komentarze
gryPrzez: Maciak Plock [dnia: Apr 03, 2020]
wynik jest wysoko w google, przy...
gryPrzez: MAMBA [dnia: Mar 24, 2020]
Warning: Only 61104 of 61105 MBy...
gryPrzez: Random32 [dnia: Mar 18, 2020]
Witam, u mnie na polskim Window...
gryPrzez: muffintodebil [dnia: Mar 04, 2020]
aha gosicu to niezly jestes zaaw...
gryPrzez: Maciek [dnia: Feb 20, 2020]
2 karty 512 kupione na allegro: ...
gryPrzez: xd [dnia: Feb 05, 2020]
zrobiłem sposób Vin/7 na dziesią...
gryPrzez: gtremik [dnia: Jan 25, 2020]
Dzięki seba86mu :) Działa
gryPrzez: Mirek [dnia: Jan 22, 2020]
A jest rozwiązanie dla Windowsa 10?
 Gry
Polecany artykuł


Quake

Klasyk FPS w wersji flash.
 Programy
Polecany artykuł


Tapin Radio Darmowa aplikacja służąca do słuchania i nagrywania radia internetowego
 Recenzje
Polecana recenzja


Sleeping Dogs
Policjant pod przykrywką rozpracowuje Triadę.
 Facebook