Langkah-Langkah

Langkah-Langkah

Pernah melihat gambar animasi gerak, kan? Pengin mencoba membuat sendiri? Tidak sulit, lho. Kita dapat memulainya dengan membuat animasi mobilitas gif . Maksudnya, gambar bergerak tersebut memiliki format .gif.

Kebanyakan animasi gambar bergerak nan ada dibuat dengan format gif. Berikut ialah sedikit klarifikasi mengenai gif itu sendiri.



Mengenal Gif

Struktur File

Berikut struktur arsip GIF

  1. Bagian kepala (Header): Menyimpan informasi bukti diri arsip GIF (3 bytes, harus string "GIF") dan versinya (3 bytes, harus string "87a" atau "89a")
  2. Global Screen Descriptor : Mendefinisikan logikal screen area di mana masing-masing arsip GIF ditampilkan.
  3. Global Color Table : Masing-masing gambar dalam GIF bisa menggunakan global color table atau tabel warnanya sendiri-sendiri. Penggunaan GCT akan memperkecil ukuran arsip GIF.
  4. gambar1, gambar2, gambar3, ... gambar-n: di mana masing-masing gambar memiliki struktur blok sendiri-sendiri dan terminator antar file.
  5. Trailer : Akhir dari sebuah arsip GIF.

Gif merupakan singkatan dari kepanjangan Graphics Interchange Format. Format gambar gif merupakan salah satu format gambar nan paling banyak digunakan dalam penggunaan sebuah web design. Hal tersebut dikarenakan format gambar nan menggunakan gif memiliki sedikit kombinasi rona jika dibandingkan dengan gambar nan menggunakan format jpeg.

Tidak hanya itu, kemampuan grafisnya dalam membuat latar belakang gambar (background) secara transparan maupun digunakan dalam sebuah animasi sederhana. Itulah kelebihan gambar dengan format gif jika dibandingkan dengan gambar nan memiliki format jpeg.

Gif merupakan format gambar orisinil atau bitmap nan dikompres dengan menggunakan proses compuserve. Bitmap jenis gif mampu mendukung rona sebanyak 256 dan kehadiran bitmap jenis gif sangatlah banyak digunakan di global internet atau web.

Gambar dengan format gif hanya akan mampu menyimpan gambar dalam 8 bit dan hanya dapat digunakan buat mode grayscal atau hitam-putih, bitmap, dan indeks warna.

Formta gif merupakan format standart nan biasa digunakan dalam global internet atau nan biasa digunakan dalam publikasi elektronik. Fungsi lain dari format gif ialah adanya dunkungan multiple bitmap dalam satu file. Maksudnya ialah kemampuan buat memasukkan berbagai macam gambar nan memiliki format dasar bitmap buat dijadikan dalam satu file. Pada akhirnya akan nampak sebagai semua animasi atau gambar bergerak sebab merupakan gabungan dari beberapa gambar bitmap nan digabung menjadi satu.

Format gif juga banyak digunakan sebagai pewarna pada halaman html nan ada di internet, juga digunakan pada tag, spanduk, icon, dan masih banyak nan lainnya. Penggunaan gif juga sangat baik digunakan pada kartun sebab tak terlalu menggunakan banyak komponen warna.

Walaupun format gif banyak sekali digunakan buat penggunaan pada web namun format gif juga memiliki nilai negatif atau kurang baik. Format gif tak begitu baik jika digunakan buat menampilkan sebuah foto. Hal tersebut dikarenakan foto memiliki kombinasi rona nan kompleks sedangkan gif sangat sederhana. Selain itu, gif hanya mendukung arsip dengan 8 bit saja dan tak lebih seperti nan diperlukan oleh sebuah foto.

Ukuran-ukuran arsip nan menggunakan format gif nisbi kecil jika dibandingkan dengan menggunakan jpeg atau format lainnya. Hal tersebut dikarenakan arsip dengan format gif menggunakan metode Lossless Compression.

Dengan metode Lossless Compression maka arsip nan dihasilkan dari gif akan memiliki ukuran nan sangat kecil. Lossless compression ialah proses kompresi atau pengecilan ukuran gambar nan tak mempengaruhi kualitas pada gambar tersebut. Sehingga arsip bisa dikecilkan tanpa adanya pengurangan data sekecil apapun, oleh sebab kualitas gambar masih dapat tetap terjaga.

Bagian Arsip Gif

Berikut ialah beberapa bagian arsip gif

1. Bagian Kepala

Bagian kepala juga disebut sebagai header. Bagian ini memiliki fungsi buat menyimpan informasi mengenai indentitas arsip gif

2. Dunia Color Table

Setiap gambar nan ada dalam sebuah arsip gif memiliki dunia color table sendiri-sendiri. Dengan menggunakan dunia color table maka ukuran arsip dari gif bisa diperkecil

3. Gambar 1, gambar 2,.....gambar n

Satu arsip gif mampu diisi oleh beberapa gambar. Gambar tersebut memiliki bloknya masing-masing.

4. Trailer

Trailer ialah bagian akhir dari sebuah arsip dengan format gif.

Animasi mobilitas gif cenderung mudah buat dipelajari dan didukung dengan banyaknya software nan dapat digunakan. Kita pakai software nan paling populer saja, ya? Yakni photoshop. Tahu, kan?

Gabungan Beberapa Frame

Penasaran, kenapa sebuah gambar animasi dapat bergerak? Nggak jauh beda dengan prinsip pembuatan gambar animasi, kok! Yakni beberapa gambar nan menampilkan bagian demi bagian secara berurutan, kemudian diputar dengan cepat sehingga gambar terlihat bergerak.

Nah, dalam animasi tersebut, gerakan dibentuk dari beberapa frame berisi gambar berurut dan dibuat dengan cara menghilangkan dan memunculkan elemen-elemen tiap gambar nan dipisahkan dengan layer.

Misalnya kita akan membuat animasi berupa mobil nan melintas cepat di bawah lampu merah, maka elemen-elemen frame nan menyusunnya dapat disebutkan sebagai berikut.

  1. Frame: lampu merah berkedip-kedip.
  2. Frame: mobil melintas dengan cepat.
  3. Kalau mau, kita juga dapat menambahkan frame-frame lain buat mempercantik tampilan animasi. Misalnya tulisan nan mendukung gambar, dan sebagainya.


Langkah-Langkah

Bagaimana cara membuatnya? Ikuti langkah-langkah berikut.
  1. Buka program Adobe Photoshop. Catatan, buat mendukung animasi, nan dipakai ialah versi CS3 ke atas. Kalau versi sebelumnya, kita harus mengolah gambar ini pada program Adobe ImageReady. Tapi jangan khawatir, tak ada kesulitan buat mengonversinya, kok!
  1. Buka panel animasi dengan cara memilih menu di Window > Animation . Terlihat beberapa panel dengan pilihan layer, kan?
  1. Selanjutnya, buat membuat animasi termin pertama, lakukan dengan membuka tab “Layers.” Dengan cara ini, sekaligus kita menyembunyikan semua layer kecuali background . Maka akan tampil layar putih kosong tanpa elemen apa pun. Kalau kesulitan, coba lihat ke sebelah kiri, ada ikon mata, kan? Klik saja ikon itu.
  1. Setelah itu, kita kembali ke tab “ Animation ( Frames )” buat mengatur tampilan frame pertama. Perhatikan, ada tulisan “0 seconds”, kan? Nah, klik di situ dan pilih ukuran waktu buat frame pertama. Misalnya, 1 detik.
  1. Selanjutnya kita mengolah frame kedua, berupa lampu merah nan berkedip-kedip. Langkahnya tak jauh beda dengan langkah pertama. Atur waktunya buat mengatur berapa lama lampu ini ditampilkan. Imbas lampu berkedip-kedip diatur dengan menampilkan gambar lampu dan background hitam secara berganti-ganti. Caranya, buka layer, lalu klik ikon di sebelah kiri layer.
  1. Langkah berikutnya dengan mengulang langkah sebelumnya buat menampilkan imbas lampu berkedip beberapa kali. Buat pula frame buat lampu kuning agar tampak lebih bagus.
  1. Kalau mau, dapat ditampilkan frame berisi teks nan memperkuat gambar, misalnya bunyi: “NGUUUUNG…!!!” Caranya seperti langkah sebelumnya. Jangan lupa mengatur waktu tampilan.
  1. Lanjutkan dengan mengatur frame mobil. Dibutuhkan beberapa layer buat memberi imbas mobil bergerak. Duplikasi frame ini, dan atur posisi mobil, berupa posisi awal mobil muncul, dan posisi akhirnya. Atur waktu tampilan menjadi 0 detik atau ‘ No delay ’.
  1. Gabungkan kedua frame dengan menekan dan menahan tombol shift, lalu klik kedua layernya. Setelah itu, beri imbas tweening . Imbas ini berfungsi memberi animasi perubahan posisi. Imbas ini pada dasarnya ialah photoshop membuat beberapa frame transparansi berpola nan dibuat secara otomatis. Caranya: klik ikon tweening, dan masukkan nilai ‘ Frames to Add ’ buat mengatur jumlah frame nan akan dibuat photoshop sebagai frame transparansi berpola.
  1. Efek cahaya mobil nan melaju kencang dapat dibuat dengan cara menurunkan capacity secara berangsur-angsur dari 100% menjadi 0%. Caranya: klik frame mobil pada awal posisi, atur capacity di layer ‘ light ’ pada posisi 100%. Kemudian, klik frame mobil pada posisi akhir, dan atur capacity menjadi 0%. Lakukan hal nan sama pada frame mobil di tengah posisi dengan gradasi transparansi.
  1. Cara nan sama digunakan buat mengatur kemunculan teks “NGUUUUNG…!!!” nan hilang perlahan-lahan.

Setelah itu, coba klik panel “play” pada tab. Kita akan melihat animasi mobil bergerak. Bagaimana? Sudah cukup puas dengan animasi tersebut? Kita dapat mempercantik lagi dengan menambahkan elemen-elemen lain. Mengasyikkan, bukan?