Photoshop Animasi E-mail
Ditulis Oleh Kelik   
Saturday, 01 August 2009
Tutorial photoshop untuk membuat animasi. Photoshop merupakan pragram desain grafis yang berbasis bitmap. Biasanya program ini untuk mengolah gambar seperti foto dan lain-lain. Akan tetapi untuk photoshop CS3 sudah dilengkapi untuk pembuatan suatu animasi, tentunya animasi yang sederhana. Tidak sebagus jika dibuat di adobe macromedia flash atau program untuk composetting seperti adobe after effect atau pun combustion dan lain-lain.

Animasi di photosop ini diantaranya meliputi pergerakan suatu obyek, transparasi suatu obyek, wrap atau bentuk suatu obyek dan perubahan warna atau style pada suatu obyek. Mengenai animasi yang lain saya belum tahu. Di sini saya akan mencontohkan animasi perubahan warna atau style pada tulisan, di mana animasi ini juga dapat diaplikasikan untuk membuat banner. Banner untuk tukar link juga boleh. 

Pertama yang saya lakukan adalah menuliskan kata “banner” pada area di adobe photoshop dengan warna background hitam.

tulisan banner

Setelah itu aktifkan timeline animasi lewat menu window pilih animation.

timeline 

Untuk mengubah durasi klik pada bagian yang ditujukkan pada nomor satu gambar di atas. Ada baiknya Anda menset durasi tidak terlalu panjang karena dengan panjangnya durasi maka file yang dihasilkan juga akan besar. Untuk mengubah tampilan frame dapat Anda klik pada bagian yang ditunjukkan pada nomor dua. Karena yang akan saya animasi adalah perubahan warna atau style-nya, maka saya aktifkan layer style dan klik pada gambar stopwatch. Gambar di atas ditujukkan pada nomor tiga. Di layer stye akan muncul keyframe di frame pertama yang ditandai dengan munculnya kotak kecil berwarna kuning. Geserlah head ke kanan ke frame tertentu yang Anda kehendaki lalu ubahlah warna atau style tulisan banner tadi lewat menu Layer – layer style – blending options. Ubahlah parameter-paremeter yang tersedia dari parameter shadow, glow, emboss sampai stroke sesuai dengan keinginan Anda.

blending opiton 

Perubahan style juga dapat dilakukan dengan memilih pada panel style. klik thumbnail style yang anda suka.

style 

Geser head ke kanan lagi ke frame yang anda kehendaki dan lakukan perubahan lagi. Lakukanlah berulang-ulang sampai frame terakhir.

Untuk melihat hasil dari animasi, klik pada tombol play yang terletak pada kiri bawah timeline animation. 
Langkah terakhir adalah menyimpan animasi dalam format gif lewat menu File - save for web and devices. Pilihlah dalam format gif (pada gambar di bawah ditunjukkan dengan huruf “a”), jika anda ingin mengubah ukuran banner dapat anda pilih tab image size, isikan parameternya dan jangan lupa klik tombol apply (ditunjukkan dengan huruh “b”). pada looping options pilih forever (ditunjukkan dengan huruf “c”), setelah itu klik tombol play. Jika sudah sesuai keinginan lanjutkan klik save.

save for web 

Nah sekarang file banner berformat gif telah selesai dibuat dan bukalah file gif tersebut menggunakan web browser.

gambar animasi di bawah ini menggunakan durasi yang terlalu panjang, sehingga file menjadi besar dan load animasi juga jadi lebih lama. 

banner animasi 

Untuk download file PSD nya silakan akses alamat http://www.ziddu.com/download/5859776/animasi.rar.html

Comments
Add New
+/-
Tulis Komentar
Nama:
Email:
 
Website:
Judul:
UBBCode:
[b] [i] [u] [url] [quote] [code] [img] 
 
 
:D:):(:0:shock::confused:8):lol::x:P:oops::cry:
:evil::twisted::roll::wink::!::?::idea::arrow:
 
Silakan masukkan kode anti-spam.
Babesajabu  - Thanks     |125.161.136.xxx |18-08-2009 18:02:33
Wah , boleh juga nih di coba. thanks atas info nya, mas.
Sobirin Nur  - Wus Keren Oy!...     |125.165.159.xxx |03-08-2009 21:49:33
Waah keren banget, nanti coba ah! Makasih!
kelik  - OK   |202.162.215.xxx |04-08-2009 11:30:42
OK Mas Nur..
suwung  - bukti     |116.66.205.xxx |03-08-2009 15:59:20
terbukti to pak kalo diriku gaptek... mau komentar kalo diriku gaptek dan inilah
salah satunya... ngak bisa komentar
kelik     |202.162.215.xxx |03-08-2009 16:06:22
tapi aku salut blog pak soewoeng pageranknya 4
kelik  - balasan komentar   |202.162.215.xxx |03-08-2009 09:03:40
@ electronic cigar : thanks...
@pujangga: klik yang telah ditandai
lingkaran yang nomor 2
Electronic Cigar  - Great Information     |122.161.72.xxx |01-08-2009 20:56:48
Wonderful blog. Thanks.

Electronic Cigar

3.26 Copyright (C) 2008 Compojoom.com / Copyright (C) 2007 Alain Georgette / Copyright (C) 2006 Frantisek Hliva. All rights reserved."

Pemutakhiran Terakhir ( Wednesday, 11 November 2009 )
 
Berikutnya >

Sedikit Tentang Saya

kelik erlambangKelik Erlambang namaku, lahir di magelang, besar di yogyakarta, sekarang balik lagi ke magelang. Sudah berkeluarga dengan satu orang anak. Ketika masih di bangku SMA paling malas belajar, sekarang giliran kemampuan otak berkurang, semangat belajar malah meningkat. Belajar dan belajar… , em... cari duit juga dan jangan lupa berdoa dan ibadahnya..

Jam

Yang Online

Saat ini ada 35 tamu online

My Portfolios

Port folio

Komentar




ShoutMix chat widget

Variasi Design

Tersedia Pilihan Warna  : 

style style style style style style style style

Tersedia Jenis Huruf : Arial Verdana Tahoma Trebuchet Georgia Optima Times New Roman Lucida Lucida Sans
Tersedia Ukuran Font : small Standard Big

... of blog

coreldraw, photoshop, quran, tips dan triks, erlambangPersonal Blogs - BlogCatalog Blog DirectoryBloglisting.net - The internets fastest growing blog directoryBlog Flux DirectoryGoogle bot last visit powered by Gbotvisit.comYahoo bot last visit powered by Ybotvisit.comMsn bot last visit powered by MyPagerank.NetCounter Powered by Freshcounter.comSEO Marketing, SEO ServicesBlogFlux ToolsCool Text: Logo and Graphics GeneratorGrowUrl.com - growing your websiteSubmit Your Site To The Web's Top 50 Search Engines for Free!Free Meta Tag AnalyzerPage Rank