DELFAC — Melihat berbagai animasi avatar unik di atas mungkin akan memunculkan pertanyaan dalam hati: "bagaimana ya cara bikin sendiri animasi avatar bergerak seperti itu?". Makin dipendam makin penasaran, terus dipendam malah bs bikin galau, makin lama malah bisa jadi jerawat. Nah TS sebagai pengguna Photoshop amatir, ingin mencoba berbagi sedikit ilmu tentang bagaimana cara/teknik membuat animasi avatar bergerak menggunakan software grafis Photoshop atau yang lebih masyhur dikenal sebagai Sotopop. Semua pasti bisa!


Dalam tutorial singkat ini TS sengaja menggunakan teknik Photoshop yang sederhanasaja, agar semua Kaskuser dapat memahami dengan mudah dan gamblang. Harapan TS, pengguna Photoshop tingkat pemula pun dapat dengan mudah mempraktekan tutorial ini. Bagi jagoan Photoshop, silahkan tumpahkan kreasi dan teknik agan masing-masing. Birokrasi dari tutorial ini TS usahakan semudah mungkin, tidak ribet atau berbelit-belit.

Tutorial ini dapat digunakan pada Adobe Photoshop CS3, CS4 dan CS5. Sedangkan versi sebelumnya bisa menggunakan Adobe Image Ready. Untuk CS6, TS belum pernah nyoba.

Sebelum agan membaca tutorial ini, jangan lupa untuk berdoa agar dimudahkan belajarnya. Sebagai bahan 'kelinci percobaan' kita akan membuat avatar yang akan TS gunakan sebagai gambar profil. Hasil akhir dari tutorial ini adalah di bawah ini. Simpel tapi keren khan hasilnya? Hanya butuh 5 layer objek di Photoshop.

Bukti bahwa Kaskuser yang mau membaca dan praktek, hasilnya adalah bisa bikin animasi!!




Cukup 15-20 menit untuk membaca. Dan cukup 30-40 menit untuk praktek di awal belajar.

File Materi Belajar(file PSD) telah TS sediakan untuk memudahkan agan belajar: Download


Langkah 1

Buat file baru di Photoshop dengan ukuran maksimal 140 x 140 pixels. Di sini TS membuat file dengan ukuran 118 x 118 pixels, ukuran maksimal tertampilnya avatar di halaman trit. Pilih opsi background transparent.



Bisa juga diberi warna background dasar sesuai warna background letak avatar di Kaskus: #E3ECF1.




Langkah 2

Bikin layer baru di atas background dengan objek berupa simbol komentar, beri warna orange khas Kaskus. Simbol komentar bisa dibuat secara manual dengan menggunakan path tool, atau cari icon via Google Images.



Langkah 3

Bikin layer baru dengan objek tulisan "KASKUS IS BETTER". Pilih font favorit agan masing-masing. Beri warna biru khas Kaskus. Letakkan di tepat di tengah-tengah simbol komentar.



Langkah 4

Bikin layer baru dengan objek tulisan "WITHOUT PORN". Untuk layer ini, TS pilih warna pink semi ungu.



Langkah 5

Bikin layer baru dan isi dengan objek berupa icon jempol (like). Cari icon-nya via Google Images.



Stop dan Perhatikan:



3 slide di atas ketika diletakkan secara berurutan dalam satu jalur timeline yang sama dan diberi waktu delay, maka ketika ditampilkan secara berurutan akan menghasilkan visual animasi yang berubah-ubah.

Langkah 1

Dalam keadaan layer 1 (background abu-abu) dan layer 2 (simbol komentar) aktif, selanjutnya pada Menu Bar Photoshop, klik menu Window, lalu pilih menu Animation. Akan muncul tampilan menu ANIMATION (TIMELINE)di bagian bawah tampilan Photoshop





Selanjutnya, tekan tombol animation frames di bagian kanan bawah. Tampilan dari timeline akan berubah menjadi tampilan frames dan dengan keterangan yang berubah menjadi ANIMATION (FRAMES).

Langkah 2

Pada mode ANIMATION (FRAMES) dan keadaan frame pertama terseleksi atau aktif, selanjutnya tekan tombol duplikat di bagian bawah tengah sebanyak 3 kali.



Di bawah ini tampilan animation frames setelah dilakukan copying atau duplikasi frame



Langkah 3

Baik juragan, sekarang waktunya menata animasi frame demi frame. Yang pertama kali kita klik frame nomor 2, lalu selanjutnya klik layer tulisan "KASKUS IS BETTER".



Selanjutnya klik frame nomor 3, lalu kemudian klik layer tulisan "WITHOUT PORN".



Selanjutnya klik frame terakhir atau nomor 4, lalu kemudian klik layer icon like.



Langkah 4

Langkah selanjutnya hapus atau delete frame nomor 1, karena kita hanya akan menggunakan 3 tampilan frame yg sudah kita edit pada langkah sebelumnya.



Langkah 5

Sekarang kita rubah waktu delay atau waktu berapa lama tertampilnya dari masing-masing frame yang ada. TS sendiri lebih senang memilih durasi 3 sampai 5 detik untuk setiap framenya.



Di bawah ini adalah tampilan masing-masing frame dengan keterangan lama waktu delay yang telah disesuaikan.



Agan dapat melakukan testing tampilan animasi yang ada dengan menekan tombol play yang terdapat di bawah lajur frame.

Langkah 6

Setelah susunan dan setting durasi sudah dianggap pas oleh agan, maka selanjutnya animasi yang ada tinggal kita simpan menjadi sebuah file berekstensi GIF (Graphics Interchange Format).

Pada Menu Bar Photoshop, pilih Menu File, Kemudian Menu Save for Web & Devices..



Pilih jenis ekstensi file GIF. Lalu pada opsi LOOPING: pilih Forever.



Tekan tombol Save, lalu beri nama animasi buatan agan.



Dan akhirnya: "Jadilah Sebuah Animasi Avatar Bergerak". Selamat berkreasi..


Yang udah nyoba dan berhasil.. silahkan komeng kembali bersama hasil karya agan atau aganwati yah. Ditunggu lho, biar ane tahu apakah tutorial ini mudah dipahami atau tidak.