Tentang GIF, Sang Trend Animasi Display Picture

Akhir-akhir ini, banyak orang rata-rata menggunakan gambar GIF sebagai display picture BBM-nya. Kalau ditanya  “Apa sih gambar GIF?” , kebanyakan orang menjawab kalau bukan “Itu loh, gambar yang bisa bergerak-gerak” pasti jawabannya “Animasi..”.

            Memang tidak salah, jika kita mengatakan bahwa gambar GIF itu gambar yang bergerak atau animasi. Tetapi, apakah GIF itu sebenarnya? Karena itu, sebagai lanjutan dari tulisan saya minggu lalu, saya akan mencoba mengkaji lebih dalam mengenai gambar GIF.

            GIF merupakan kependekan dari Graphics Interchanged Format. Format ini pertama kali diperkenalkan oleh Unisys sebagai penerapan dari Algoritma LZW (Lempel Zev Welch). Awalnya, tepatnya pada tahun 1987, format ini dapat digunakan secara gratis. Hingga pada tahun 1995, Unsys akhirnya menarik royaltinya pada setiap penggunanya sehingga format ini kemudian menjadi berbayar. Sekarang ini, hak cipta GIF dipegang oleh CompuServ.

Dalam perkembangannya sendiri, GIF sudah 2 kali mengalami perubahan, yaitu versi pertama (GIF87a) yang hanya dapat menampilkan gambar secara bergantian, dan mengatur posisi gambarnya. Kemudian pada tahun 1998, muncul GIF98a yang memiliki fitur lebih banyak, antara lain mangatur waktu tampil dari masing-masing gambar, mengatur masukan dari pengguna, menyesuaikan transparancy  warna, menyisipkan komentar dan teks, dan tambahan-tambahan lainnya.

GIF sebenarnya tergolong gambar Raster (lihat tulisan sebelumnya), hanya saja memorinya lebih kecil. Lebih kecil, karena gambar dalam format ini hanya dapat menyimpan gambar dalam 8 bit per pixelnya saja. Artinya, format ini hanya mengenal 256 warna saja. Karena hal ini pula lah, format GIF tidak dapat digunakan untuk keperluan fotografi ataupun untuk file-file gambar yang kaya warna, sehingga terkesan lebih kaku dari format raster sejenisnya. Walau begitu, GIF efektif digunakan untuk logo, icons, image tombol, apalagi untuk keperluan web.

GIF hanya mengenal 3 mode warna, yaitu grayscale, bitmap dan Index color. Index color maksudnya ialah warna dalam sebuah gambar GIF disimpan dalam bentuk indeks (tabel) warna sebanyak 256 baris, dimana setiap barisnya mewakili warna-warna apa saja yang terdapat dalam gambar GIF tersebut. Jika ingin melihat tabel warna ini, kita dapat menggunakan tools Matlab, dengan mengetikkan perintah :

[<gambar>,<warna>] = imread(‘<namafile>.gif’)

Nantinya, akan muncul daftar warna-warna yang mewakili setiap warna yang digunakan dalam file GIF kita dalam format (red – green – blue).

Contoh gambar GIF

Contoh tabel warna GIF gambar di atas

GIF memiliki kelebihan antara lain men-support penggunaan Multiple Bitmap, sehingga, seperti yang telah dikatakan di atas, dapat membuat animasi/gambar bergerak walaupun sebenarnya itu hanyalah gambar yang berganti-ganti. GIF juga mendukung perekaman transparency gambar sehingga baik untuk digunakan pada halaman web.

Satu lagi kelebihan dari GIF, yaitu menggunakan teknik LossLess Compression, sehingga gambar yang dikompres tidak ada bagian yang rusak. Hal ini dikarenakan teknik kompres dalam GIF bekerja dengan mengompres area-area yang sewarna, sehingga ukurannya dapat dibuat sekecil mungkin.

Dari semua hal yang dapat dilakukan oleh GIF, tentu kita bertanya mengapa GIF dapat melakukan hal-hal di atas? Jawabannya ada pada struktur file GIF. Berikut penjelasannya :

-          Header : Bagian paling atas yang menjelaskan tentang identitas data yang ada dalam file dan versinya. Misalnya GIF87a.

-          Global Screen Descriptor : Bagian yang mendefinisikan logical area dimana masing-masing file GIF ditampilkan.

-          Global Color Table : Penggunaan GCT inilah yang tadi saya maksudkan sebagai Tabel/Indeks warna dari GIF yang hanya ada 256 warna saja. Penerapan dari GCT inilah yang memperkecil ukuran file.

-          Gambar-gambar dalam file GIF yang masing-masing memiliki struktur blok dan terminator antar file. (Yang kita masukkan agar terganti-ganti)

-          Trailer : Akhir/penutup dari file GIF.

Aplikasi-aplikasi yang dapat mengolah gambar GIF sekarang ini cukup beragam, antara lain Adobe Photoshop (CS3 keatas), GIMP, InkScape, Ms. Paint, Ulead GIF Animator 5, dan masih banyak lagi.

Bila dibandingkan dengan format sejenis misalnya PNG (Portable Network Graphic), walaupun sama-sama menggunakan teknik kompresi LZW dan sama-sama mendukung transparency, tetapi tetap saja GIF memiliki keunggulan dapat menyimpan serangkaian frame gambar yang dapat dianggap sebagai animasi, sedangkan PNG tidak. Memang, PNG umumnya lebih kaya warna, sebab format ini dapat mendukung 24 bit, atau sekitar 16 juta warna, berbeda dengan GIF yang hanya mengenal 256 warna saja. Selain itu, format ini penggunaannya juga free alias gratis. Format PNG memang dikembangkan sebagai alternatif pilihan untuk mengompres gambar dengan teknik LZW selain GIF. Hal ini terjadi setelah format GIF mulai ditarik royaltinya sehingga penggunaannya harus berbayar.

Contoh gambar PNG

Selain PNG, ada juga format gambar yang punya kemiripan dengan GIF, yaitu sama-sama menggunakan teknik kompresi LZW, yaitu TIFF. Hanya saja, TIFF memiliki tingkat kedalaman warna yang lebih banyak dibandingkan PNG dan GIF. Karena itu, format TIFF kebanyakan dipakai di percetakan. Disamping itu, TIFF juga dapat menyimpan gambar dari format lain seperti JPEG, atau bahkan gambar vector (yang berbasis clipping path) tanpa mengurangi kualitas gambar tersebut (lossless).

Satu lagi keunikan GIF, ialah bahwa file video pun bisa diconvert menjadi file gambar GIF, walaupun ukurannya menjadi sangat kecil dan hanya sedikit saja frame yang dapat diambil dari video tersebut untuk dijadikan gambar GIF. Nantinya, hasil dari convert ini akan menjadi GIF animasi, walaupun durasinya cenderung sangat pendek.

           Jadi, jika kita ingin memasang gambar-gambar dalam website kita atau untuk logo, GIF bisa jadi alternatif yang pas untuk keperluan tersebut, selain sebagai Display Picture saja.. 

Vector vs Raster

Di tulisan sebelumnya, saya sempat menyinggung bahwa grafik dalam komputer terbagi atas 2, yaitu vector dan bitmap.  Vector terdiri atas kurva dan garis, serta bitmap terdiri atas ttik-titik (pixel). Kedua hal inilah yang ingin saya bahas secara mendalam ditulisan kali ini.

            Sesungguhnya, gambar terbagi atas 2 bagian besar yaitu Raster dan Vector. Raster inilah yang di tulisan saya sebelumnya saya sebut sebagai bitmap. Saya akan mulai membahas dari Raster ini terlebih dahulu.

a.       Raster

Disebut gambar Raster, karena gambar tipe ini terdiri atas raster-raster (kotak-kotak kecil) yang biasa kita kenal dengan istilah pixel. Pada jenis ini, gambar terdiri atas titik-titik yang dipetakan dalam memori, yang kemudian ditampilkan ke layar monitor. Karena sistem pemetaan inilah, gambar Raster mendapatkan sebutan bitmap (peta bit), sebab yang dipetakan memang ialah jumlah-jumlah bit dalam satu pixel yang akan menyatakan warna dari pixel tersebut. (misalnya 255 = putih, dsb)

Semakin rapat jumlah titik-titik ini, maka semakin halus pula gambar/citra yang dihasilkan. Karena hal inilah, muncul istilah resolusi, yaitu tingkat kerapatan dari pixel-pixel tersebut yang nantinya akan sangat mempengaruhi kualitas gambar raster.

Gambar Raster biasanya terdapat pada foto, ataupun gambar-gambar yang diolah dengan menggunakan Adobe Photoshop, Corel Photopaint, Paint, dan sebagainya.

Format yang dihasilkan, diantaranya BMP, ICO, JPEG, GIF, PNG, PSD, TIFF, ART, dan masih banyak lagi. Mengenai format ini, sebenarnya format gambar Raster bergantung pada pembuat/pengembang hardware (kamera, dll) yang membuat teknik kompresi datanya sendiri-sendiri. Hal inilah yang kemudian membuat terciptanya berbagai macam format data, yang tentu menyulitkan ketika kita ingin membuka file yang isinya memiliki format yang berbeda dengan yang dapat dibuka oleh perangkat keras kita. Untuk itu, para peneliti membuat satu macam format data yang dapat digunakan secara umum, yaitu JPEG. JPEG memiliki kelebihan, diantaranya dapat dikompres sehingga ukurannya berubah secara signifikan, berbeda dengan format BMP yang memiliki ukuran yang sangat besar dan bila dikompres tidak terlalu signifikan perubahannya. 

Sayangnya, gambar Raster tetap saja memiliki ukuran memori yang cukup besar, dikarenakan ukurannya sangat bergantung pada berapa banyak pixelnya atau dengan kata lain seberapa tinggi resolusi yang dimiliki gambar tersebut. Ini terjadi, karena seluruh pixel dalam area gambar tersebut harus dipetakan satu persatu dalam memori. Jika ukurannya diperkecil (kompres) pun, akan ada bagian pixel yang hilang sehingga gambar yang asli tidak akan sama lagi seperti yang dikompres.

Contoh Raster

Berbicara mengenai kompresi, ada dua teknik kompresi dalam gambar Raster, yaitu LossLess dan Lossy. Lossy ialah kompresi yang mengakibatkan hilangnya beberapa pixel dalam gambar, sehingga gambar yang dikompres tidak akan sama lagi dengan aslinya. Hal ini seperti yang tadi dibahas. Sedangkan Lossless ialah teknik kompresi yang tidak menurunkan kualitas gambar. Artinya, gambar sebelum dan sesudah dikompres akan sama saja kualitasnya. 

Lossy Compression

LossLess Compression

b.      Vector

Mengenai vector, telah saya katakan bahwa vector adalah satuan yang memiliki nilai dan juga arah. Prinsip inilah yang digunakan dalam membuat gambar vector. Artinya, data yang disimpan oleh gambar vector hanya berupa titik awal dan arah (sudut) dari garis atau kurva yang digambar. Karena itu, gambar vector selalu diolah di dalam processor untuk dihitung nilai dan arahnya sebelum digambar. Berbeda dengan gambar raster yang tidak melalui processor karena bit-bit dalam gambar langsung dipetakan dalam memori untuk kemudian ditampilkan. Hal inilah yang membuat gambar vektor menjadi lebih efisien karena ukuran filenya lebih kecil dari gambar raster.

Selain itu, gambar vector memiliki kelebihan lain yaitu tidak bergantung pada resolusi. Baik untuk gambar yang diperbesar maupun diperkecil tetap memiliki detail yang sama, sebab digambar berdasarkan nilai dan arahnya, bukan berdasarkan jumlah pixelnya.

Walaupun relatif lebih kaku dari Raster, yaitu gambar vector tidak dapat digunakan untuk foto dan gambar nyata lainnya, tetapi gambar vector lebih flexibel digunakan untuk berbagai keperluan dan ukuran karena sifatnya yang tidak tergantung pada resolusi tadi, misalnya saja untuk membuat logo, dsb.

Mengenai aplikasi yang dapat menangani vector, terdapat CorelDraw, Adobe Illustrator, Canvas 8, Zoner Draw, dan sebagainya. Berbeda dengan gambar Raster, format gambar vector dikembangkan oleh masing-masing pengembang softwarenya dan belum ada generalisasi seperti halnya JPEG pada raster. Jadi, satu format gambar vector hanya dapat dibuka oleh software pembuatnya sendiri. Format-formatnya antara lain CDR, EPS, AI, SVG dan masih banyak lagi.

Gambar Vektor

Komputer dalam Mengolah Grafik dan Warna

            Dewasa ini, pemanfaatan grafik/gambar dalam kehidupan sehari-hari makin beragam. Misalnya untuk keperluan komunikasi visual (Iklan), hiburan, dokumentasi, proteksi dokumen (watermark) ataupun dalam dunia medis untuk keperluan diagnosa dan lain sebagainya. Sebagian besar dari contoh penggunaan grafik tersebut dilakukan dengan menggunakan komputer. Dari sinilah muncul istilah komputer grafik, yaitu bagaimana kita mengolah gambar dengan memanfaatkan teknologi komputer.

            Komputer grafik sendiri memiliki beberapa komponen, yaitu :

-          Image Display

-          Mass Storage

-          Hardcopy

-          Image Processing Software

-          Specialized Image Processing Hardware (Image Sensor)

Untuk mengolah suatu gambar/image dengan komputer, maka gambar/image tersebut harus direpresentasikan terlebih dahulu menggunakan teknik sampling. Teknik Sampling maksudnya ialah bagaimana merepresentasikan suatu citra/gambar kedalam susunan pixel-pixel dalam komputer yang nantinya menyerupai gambar aslinya. Alat untuk melakukan teknik sampling ini misalnya scanner, barcode scanner, rontgen, dan sebagainya.

Dalam teknik sampling dikenal 2 istilah, yaitu Spatial Resolution dan Grayscale Resolution. Dalam Spatial Resolution jumlah sampel per satuan luas dinyatakan sebagai Dot per Inch (DPI) sedangkan Grayscale Resolution dinyatakan sebagai jumlah bit per pixel. Spatial Resolution contohnya digunakan untuk mengolah gambar/foto, sedangkan Grayscale Resolution contohnya digunakan untuk keperluan X-Rays dalam dunia medis. 

Grayscale Resolution

Spatial Resolution

Grafik dalam komputer terbagi atas 2 jenis, yaitu Vector dan Bitmap. Perbedaannya ialah Vector terdiri atas garis atau kurva yang memiliki nilai dan juga arah, sedangkan bitmap terdiri atas titik-titik (array 2 dimensi dari komponen gambar).

Selain grafik, komputer dalam pemanfaatannya juga digunakan untuk pengolahan warna. Sesungguhnya, warna merupakan panjang gelombang elektromagnetik tertentu yang dapat kita lihat, yaitu 380 – 780 nm. Hal ini dikarenakan panjang gelombang tersebut dapat mengubah susunan protein pada sel cones di mata kita sehingga dapat kita bedakan. Warna terdiri atas 3 unsur utama, yaitu panjang gelombang yang dominan, Luminance (Kecerahan), dan Purity (Kemurnian dari warna itu sendiri).

Dalam komputer, warna dibedakan atas 3 jenis mode, yaitu :

-          Red-Green-Blue (RGB)

-          Cyan-Magenta-Yellow (CMY)

-          Lighness-Chroma-Hue (LCH)

Prinsip RGB digunakan untuk warna-warna additive, yaitu warna yang tercipta dari pancaran langsung, misalnya dari layar monitor atau dari cahaya lampu. Sedangkan prinsip CMY digunakan untuk warna-warna Subtractive, yaitu warna yang tercipta dari pantulan cahaya. Maksudnya ialah, warna yang kita lihat adalah hasil dari pantulan cahaya yang mengenai lapisan permukaan benda yang menyerap dan memantulkan panjang gelombang tertentu. Sehingga, panjang gelombang yang terpantul itulah yang kita lihat. Prinsip warna CMY digunakan misalnya untuk hasil cetakan printer dan sebagainya.

RGB

CMY

Prinsip warna LCH digunakan untuk membaca data warna, karena prinsip ini mengenali warna berdasarkan ketiga elemen utamanya, yaitu tingkat kecerahan, kemurnian, dan hue-nya.

LCH

Sekian tulisan dari saya, jika ada yang salah tolong dimaafkan..

Terima kasih..

Well, this is it..
Blogku yang isinya semua tugas-tugasku..
Hope it can help u guys..