Polskie Forum Użytkowników GIMP-a

Tutoriale => Techniczne => Wątek zaczęty przez: Aleksander on 20.09.2006, 08:07:27



Tytuł: Indeksowanie i dithering w GIF-ie [formaty]
Wiadomość wysłana przez: Aleksander on 20.09.2006, 08:07:27
Tutorial Tomcat'a
[oryginał] (http://gug.sunsite.dk/tutorials/tomcat15/?PHPSESSID=ed814ea8823518f234e9f3ea1d8338a9)

Jest to pierwszy tutorial z serii poradników użytkowania GIMPa, wspaniałego narzędzia graficznego. Nie oczekujcie po nim profesjonalnego przewodnika, jak zostać wielkim grafikiem komputerowym etc. Ma on jedynie pomóc młodym użytkownikom GIMPa odnaleźć się w dżungli formatów, masek i wszelkich innych użytecznych rzeczy ;).


1. Wprowadzenie
Przejdźmy od razu do konkretów i zajmijmy się GIFem. Oto kilka przydatnych informacji technicznych o nim:
  • maksymalnie 256 indeksowanych (obsługiwanych) kolorów
  • kompresja LZW
  • możliwość wyświetlania przeźroczystości
  • możliwość wyświetlania przeplotu (http://pl.wikipedia.org/wiki/Przeplot)
  • wsparcie prawie wszystkich przeglądarek internetowych
Aby tutorial był mały i zrozumiały dla każdego, opiszę w nim tylko indeksowane kolory GIFa i sposoby na radzenie sobie z nimi. Opuściłem tematy takie jak animacje czy przeźroczystość – nimi zajmiemy się w późniejszych tutorialkach ;).

(http://www.gimpuj.info/gallery/21370_14_11_09_5_27_50_0.jpg)


To jest zdjęcie Volkswagena W12 Coupe, którego będę używał, by pokazać Wam kilka różnych jakości GIFów. Ten oto obrazek jest JPEGiem na 283x209 pikseli, przy najlepszej możliwiej jakości ma on około 37,2 kilobajtów.

Jako ograniczony do 256 kolorów GIF nie jest najlepszym formatem dla fotografii, dużych grafik wykorzystujących gradienty i obrazków z małymi detalami – konwersja obrazka powyżej na GIF okaże nam wszystkie jego zalety i wady. Ponadto, najlepszymi obiektami dla tego formatu są obrazki zawierające grafiki liniowe, tekst i przeźroczystość!
Przed zapisem obrazku w GIFie musi być przekonwertowany na indeksowane kolory – ich ilość musi zostać ograniczona do 256 lub mniej, musi także zostać stworzona paleta kolorów. W GIMPie  możesz to zrobić poprzez Obraz -> Tryb -> Indeksowany.

(http://www.gimpuj.info/gallery/21370_14_11_09_5_27_50_1.jpg)

To są parametry konwersji. Opcje są pogrupowane na opcje palety i opcje ditering'u. Zacznijmy więc konwertować nasz samochodzik na indeksowany, bez diteringu.


2. Konwersja

Indeksowanie bez ditheringu

(http://www.gimpuj.info/gallery/21370_14_11_09_5_27_50_2.jpg)(http://www.gimpuj.info/gallery/21370_14_11_09_5_27_50_3.gif)
JPEG – GIF

Nie wygląda tak źle, ale delikatna utrata jakości jest zauważalna. Wielkość obrazka została zmniejszona do 25 kilobajtów. Użyte opcje to:
  • wygenerowana optymalna paleta z 256 kolorami
  • brak ditheringu

(http://www.gimpuj.info/gallery/21370_14_11_09_5_27_50_4.jpg)(http://www.gimpuj.info/gallery/21370_14_11_09_5_32_09_0.gif)
JPEG – GIF

Jak widać na powiększonych 600% fragmentach zdjęcia, utrata kolorów prawie zniszczyła miły oku efekt gradientów na masce.


(http://www.gimpuj.info/gallery/21370_14_11_09_5_32_09_1.jpg)(http://www.gimpuj.info/gallery/21370_14_11_09_5_32_09_2.gif)
JPEG – GIF

Z kolei ten GIF ma 32 kolory. Bez użycia ditheringu, zmniejszył się do 10 kilobajtów. Użyte opcje to:
  • wygenerowana optymalna paleta z 32 kolorami
  • brak ditheringu

(http://www.gimpuj.info/gallery/21370_14_11_09_5_32_09_3.jpg)(http://www.gimpuj.info/gallery/21370_14_11_09_5_32_09_4.gif)
JPEG – GIF

Tutaj gradienty zniknęły całkowicie. Obrazek jest brzydki – poszarpany i „płaski”.


3. Dithering

(http://www.gimpuj.info/gallery/21370_14_11_09_5_34_10_0.jpg)(http://www.gimpuj.info/gallery/21370_14_11_09_5_34_10_1.gif)
JPEG – GIF

Tutaj nałożony został dithering pozycyjny. Obrazek ma 17 kilobajtów i możemy zobaczyć delikatną poprawę, lecz tu jak i na następnych obrazkach z ditheringiem możecie zauważyć dziwną dla oka rzecz. W odcienie szarości zostają wplecione pojedyncze czerwone lub innokolorowe piksele. Dzieje się tak dlatego, że dithering działa poprzez złudzenie optyczne, mające zasugerować obserwatorowi jakiś odcień poprzez kombinację kilku prostych kolorów. W każdym razie, algorytm kompresji LZW (używany w GIFach) nie lubi zmieniać wartości pikselowych i traci przez to na wydajności. Użyte tu opcje to:
  • wygenerowana optymalna paleta z 32 kolorami
  • pozycyjny dithering kolorów


(http://www.gimpuj.info/gallery/21370_14_11_09_5_34_10_2.jpg)(http://www.gimpuj.info/gallery/21370_14_11_09_5_34_10_3.gif)
JPEG – GIF

Na tym obrazku nałożony został dithering Floyd'a-Steinberg'a z organicznym zlewaniem kolorów. Widać znaczną poprawę, nawet powierzchnia samochodu i gradienty wydają się być płynne. Obraz ma teraz 18 kilobajtów. Użyte opcje:
  • wygenerowana optymalna paleta z 32 kolorami
  • organiczny dithering kolorów Floyd'a-Steinberg'a


(http://www.gimpuj.info/gallery/21370_14_11_09_5_34_10_4.jpg)(http://www.gimpuj.info/gallery/21370_14_11_09_5_36_41_0.gif)
JPEG – GIF

Tu został użyty standardowy dithering Floyd'a-Steinberg'a. Obrazek waży mniej więcej tyle samo, co przy ditheringu organicznym, jednak jakość uległa nieznacznemu pogorszeniu. Użyte opcje to:

  • wygenerowana optymalna paleta z 32 kolorami
  • zwykły dithering kolorów Floyd'a-Steinberg'a


(http://www.gimpuj.info/gallery/21370_14_11_09_5_36_41_1.jpg)(http://www.gimpuj.info/gallery/21370_14_11_09_5_36_41_2.gif)
JPEG – GIF

Ten obrazek prezentuje użyteczność dowolnych palet. Jak możesz zauważyć, palety dowolne używane są do utrzymania specjalnych efektów i pomóc konwertować grafikę na inne środowiska kolorystyczne. Użyte opcje to:
  • wygenerowana paleta użytkownika z 32 kolorami (Royal)
  • brak ditheringu

Mam nadzieję, że mój tutorialek był przydatny ;). Pamiętaj jednak: jest tyle sposobów na otrzymanie jakiegoś efektu, ilu jest użytkowników GIMPa!



Wszelkie uwagi co do tłumaczenia czy moich własnych grafik proszę pisać poniżej ;).