Pages

Sunday, November 13, 2011

Bikin animasi (.gif) pake photoshop

Hi Blogi. Saya mau share caraaaa bikin animasi .gif using Photoshop. Sebelumnya saya belum pernah sama sekali buat pake aplikasi lain (yang pernah mah buat mie goreng), jadi ujung-ujungnya baca tutorial yang bertebaran di google. Ah tapi banyak yang ngga sesuai dengan keinginan saya, terutama masalah aplikasi. Saya penginnya pake photoshop.. Kenapa ? Yah karena seringnya pake photoshop.. lagipula image/photo editor yang terinstal di sini cuma photoshop doang T,T (selain paint). Buat kamu yang ga punya potosop, mending cari dulu.. atau mungkin pengin pake aplikasi seadanya aja? ya silahkan aja mameeeen.. Tapi lumayan ga nyambung sama penjelasan yang ini, gzzz. Yaudah, gapapa, jadi pengetahuan aja yaa.. ahemmm.

Sebenernya pengin pake aplikasi animation editor, dan tadi udah coba di download. Tapi ya gitu permirsah!! ujung-ujung minta masukin serial number, minta uang (kayak gue ke emak gue), nah mending manfaatin yang ada ajaaa ~(´▽`~) lalalalala (~´▽`)~ pake photoposhop.

Next.. kembali ke inti.
Ini dia langkah-langkah membuat animasi pada photoshop (saya pake Adobe Photoshop CS5, kalo beda versi mah masih ga masalah kayanya, di coba ajaa). Oh iya, ini buatnya di resolusi 512 x 50 px.

Pertama, buat dulu gambar-gambar yang berbeda di layer photoshop kamu..
Misalnya saya pengin buat animasi semut lagi jalan-jalan..shoping, makan (eh ngga gitu ding)




Duplikat sampai semutnya hampir memenuhi bangroud. Kenapa?? lah, kan buat jadi animasi.. ada efek perpindahan gitu maksudnya.. :D




Saya kan pengin pake roti-roti gitu, jadi semutnya di duplikat sampai rotinyaa ketemu :D
Kemudian di atur-atur sehingga hasilnya seperti ini :



Sekarang tinggal makan di animasiin! Terlebih dahulu buka tab animasinya : Window - Animation


Ntar bakal muncul form Animation-nya


Kenapa?? ada masalah ?? Oh munculnya ngga kaya yang di atas???
ADUH!! HATI_HATI MELEDAK! huahahahahaha

Tenang, jangan khawatir.. tampilannya kaya gini ya? 



Supaya bisa kayak tampilan animation yang punya saya, klik 'Convert to frame animation' yaitu tombol yang ada di kanan bawah tampilan kamu. 



Udah kan? :) Buat yang udah.. berarti udah bisa lanjut ke tahap berikutnya. 
Untuk form pertama sampai akhir.. di isi dengan gambar-gambar semut dari layer yang sudah di buat tadi. Misalnya untuk frame ke-1, saya kan ingin semutnya berjalan dari arah kanan ke kiri menuju roti, berarti layer dengan nama '1' (semut yang paling kanan) di aktifkan dan yang lainnya di non-aktifkan.
Untuk cepat mengaktifkan / me-nonaktiftkannya, blok semua layer yang hanya ingin diaktifkan (layer semut 1 dan layer roti) dan klik kanan pada gambar mata (paling kiri layer), kemudian pilih 'Show/Hide all other layer'. Sehingga tampilannya akan seperti ini:


Atur delay timenya, dengan meng-klik tanda segitiga yang ada di bawah frame. Kalau saya memilih 0,1 sec.


Untuk memperbanyak frame sebanyak jumlah gerakan (gerak animasi) yang kita inginkan, pilih 'Duplicates selected frames'.


Kemudian di atur.. sampai.. sampai apa cik? hahaha (saya juga lagi mikir)
Oh sampai semua gerakannya beres.. atau sepanjang banyak gerakan yang kita inginkan tadi.


Misalnya, pada frame 2 di atas, kita akan mengaktifkan layer roti dan gerakan 2. Maka layer yang kita hidupkan (diberi tanda 'eye(mata)') adalah layer roti dan layer bernama 2.
Kemudian duplicate lagi, terus menerus, dan diatur aja setiap frame-nya sekaligus mengatur gerakan mana yang akan di aktifkan. 



Lakukan hingga semut mendekati roti..
Untuk gerakan roti yang terakhir tersebut, saya atur delay-nya 2 secon, supaya rotinya dideketinnya agak lama :D

Wph, nyaris selesai!
Sekarang kita ngatur looping-nya, gerakannya mau ulangi dari awal atau cuma sekali aja? Nah..kita atur dulu Beraaay..

Klik tanda segitiga kebawah, di bawah form animation (frames) sebelah kiri, udah dapat?? Nah.. kan ada 3 pilihan tuh, Once (satu kali), 3 times (3x), dan forever (terus-menerus diulang).
Saya penginnya di ulangi nih.. jadi pas semutnya nyampe ujung (roti), saya pengen gerakannya diulangi dari awal.. Jadi saya pilih forever.
Eh? emang dari awal udah di set forever itu mah wahahhaha
Yaudah, kita pastiin lagi aja.


Udah??
Udah deh.. beres. tinggal di SAVE aja Beraaaay..

Caranya? Pilih menu File - Save for Web & Devices atau langsung tekan di keyboard (ctrl+alt+shift+S)



Pastikan animasi ini ber-extends .gif. Pilih Save.



Pilih lokasi penyimpanan.. masukkan nama filenya, lalu Save lagi.


Yak.. sudah!!! :D
Sekarang buka file yang tadi udah di simpan!! 

Eh.. ga bisa?? Mungkin picture viewer-nya nggak mendukung .gif, zzzzz
Supaya lebih pasti, klik kanan file animasi kamu, pilih Open With.. Nah, pilih web browser mana aja (Internet Explorer, Google Chrome, Mozilla, dll).
Tadaaaaaaaa ƪ(ˆ⌣ˆ)ʃ  udah terlihat kan??


SELAMAT MENCOBA!! 
PASTI BISA JUGA DEH :)

Maaf kalo penjelasannya ada yang kurang jelas, atau ga jelas. Kalau ada, silahkan tanya lagi aja di sini..
Senang bisa membantu.

No comments:

Post a Comment