Membuat Animasi dari Photoshop CS3

Adobe Photoshop selain terkenal sebagai software pengolah gambar non-vektor yang banyak dipakai oleh para desainer grafis ternyata mempunyai fungsi tambahan lain, yaitu animasi. Fungsi ini tidak banyak yang mengetahuinya karena merasa sudah cukup menggunakan software khusus animasi seperti Adobe Flash. Fungsi ini cukup sulit jika dibandingkan hanya sekadar melukis. Namun setahu saya, seri yang sudah mendukung teknik ini baru dimulai dari CS2 (mohon dikoreksi kalau salah). Saya sendiri mencoba menjelaskan teknik ini dengan memakai seri CS3.

Animasi adalah sebuah gambar bergerak yang dibuat dari beberapa gambar mati (still images). Gambar mati ini bisa berasal dari ilustrasi, foto objek, atau foto orang-orang yang berbeda gaya. Jelas, kita membutuhkan banyak sekali gambar-gambar mati yang satu dengan lainnya harus ada korelasi agar gambar-gambar tersebut dapat menciptakan gambar bergerak yang enak dilihat. Animasi kemudian diterapkan pada film, video, dan komputer. Sobat baraya bisa membuat animasi klasik dengan cara menggambarnya pada halaman-halaman buku, lalu buku tersebut dibuka tiap-tiap halaman dengan kecepatan tertentu. Ini jadi mengingatkan saya semasa SD saat membuat gambar bergerak pada pojok kanan-kiri bawah buku pelajaran … hehehe. Nah, istilah ‘kartun’ kemudian muncul untuk menjelaskan kerja animasi di bawah 10 menit yang sifatnya menghibur.

Oke, agar mudah dipahami oleh sobat baraya semua, saya akan menjelaskan teknik ini secara bertahap. Perlu diketahui bahwa ilustrasi yang digunakan di sini dikerjakan Ella Elviana, seorang ilustrator otodidak yang saat ini bekerja sama dengan saya mengerjakan proyek rahasia (apaan tuh?). Ssst … Ella adalah adik kelas saya di Farmasi ITB yang sama-sama ‘murtad’ dari dunia obat-obatan ^_^.

1. Ilustrasi yang digunakan hanya dua, yaitu sketsa yang masih hitam putih dan ilustrasi berwarna. Usahakan kedua gambar ini di-cropping sedemikian rupa agar pas. Dari dua ilustrasi ini, buatlah beberapa gambar yang saling bersambungan (tergantung mau buat animasi yang seperti apa). Gambar-gambar tersebut diusahakan dibuat pada layer-layer yang berbeda sehingga pada saat pembuatan animasi nantinya tidak terlalu membingungkan.

2. Jika gambar-gambar yang dibutuhkan sudah cukup (usahakan selalu cek dan ricek agar tidak ada satu gambar pun yang ketinggalan, termasuk cek apakah ada layer yang saling bertumpukan karena hal ini juga berpengaruh pada besarnya file nanti), lanjutkan dengan meng-klik panel Window > Animation.

3. Akan muncul panel baru yang tertulis ‘Animation (Frames)’ pada bagian paling bawah. Masukkan tiap-tiap layer yang sudah dibuat pada panel tersebut dengan cara meng-klik tanda kotak putih yang ujungnya seperti kertas terlipat tepat di samping kiri gambar tong sampah (Duplicates selected frames) dengan hanya mencentang tanda mata pada panel layer. Pada tiap-tiap frame terdapat waktu yang ada di bawahnya dan itu bisa disetel tergantung keperluan (untuk contoh, saya menyetelnya pada 0.1 seconds). Jika sudah, klik tanda ‘play’ (segitiga ke kanan) untuk mencoba hasil animasi.

4. Animasi sudah dianggap sempurna? Jika sudah, lanjutkan dengan klik panel File > Save for Web & Devices (Alt+Shift+Ctrl+S) sehingga memunculkan jendela seperti gambar di sebelah kanan lingkaran 4. Pada keadaan default (apa adanya) akan terlihat kolom-kolom yang sudah terisi GIF, Selective, Diffusion, dan pada bagian Looping Options usahakan terisi Forever. Jika sudah, tinggal klik Save.

Nah, animasi sederhana sudah sobat baraya buat dan bisa diaplikasikan pada media internet, misalnya, dengan format GIF. Sebagai contoh, sobat baraya bisa melihat hasil animasi yang dijadikan contoh berikut ini. Tertarik? Jika kurang mengerti, silakan menghubungi saya langsung.[]

Catatan: Pada hasil contoh di atas, saya menggunakan 200 frame. Wow! Memang, semakin banyak frame yang digunakan, akan semakin baik pula hasil animasinya. Konsekuensinya, kalau sobat baraya menginginkan animasi yang mendekati sempurna, siap-siaplah untuk bercapai-capai ria ^_^ seperti halnya kisah sang nenek.