Membuat Animasi GIF

Dalam modul ini kita akan belajar membuat animasi gif sederhana menggunakan Photoshop dan ImageReady.


Sebelumnya Anda pasti sudah mengetahu animasi GIF bukan? Animasi sederhana yang biasanya ada dalam ponsel Anda ataupun yang sering Anda lihat pada sebuah website, seperti banner. Cara membuat animasi GIF tidaklah sulit, ada banyak sekali software yang bisa Anda gunakan untuk membuat animasi GIF namun kali ini kita akan menggunakan perpaduan Photoshop dan ImageReady.Meskipun animasi yang akan kita buat sangat sederhana namun ini merupakan dasar dalam membuat animasi gif yang lain.

Ikuti langkah-langkah berikut ini :

1. Buat file baru dengan ukuran 90 x 90 atau terserah selera Anda. Caranya pilih menu File > New atau tekan Ctrl + N.
2. Buat lingkaran menggunakan Elliptical Marquee Tool atau tekan M. Jangan lupa menekan tombol Shift + Alt untuk membuat lingkaran.
Membuat Animasi GIF
3. Isi lingkaran tersebut dengan warna merah. Caranya : Tekan tombol Alt+Del untuk memasukkan warna yang sudah Anda pilih di Foreground Color.
4. Duplikasi layer pertama ini dan buat 2 layer sejenis dengan warna kuning dan hijau sehingga nantinya kita akan memiliki 3 layer yang berisi lingkaran dengan warna merah, kuning dan hijau.
Membuat Animasi GIF
5. Buat agar ketiga layer terebut tidak terlihat/invisible. Caranya : Klik ikon mata yang ada di sebelah kiri layer.
6. Setelah ini kita akan berlanjut menggunakan ImageReady. Pada toolbox bagian paling bawah, pilih Edit in ImageReady atau tekan Shift + Ctrl + M.
Membuat Animasi GIF
7. Setelah membuka ImageReady pastikan Anda sudah menampilkan Window Animation. Jika belum pilih menu Window > Animation atau tekan F7. Pastikan juga Window Layers telah muncul dan bila belum pilih menu Window > Layers atau tekan F11.
8. Sekarang kita akan membuat animasi dari ketiga layer yang telah kita buat di Photoshop sebelumnya. Cara membuatnya tidak jauh beda dengan animasi pada umumnya namun disini kita akan membuat sebuah animasi sederhana. Perlu diketahui, inti dari apa yang akan kita lakukan adalah permainan layer.
Sekarang lihat pada Window Animation, disana ada sebuah layer, pada layer pertama inilah kita akan memulai membuat animasi. Tampilkan layer lingkaran berwarna merah pada Window Layers, caranya tinggal klik untuk menampilkan ikon mata.
Membuat Animasi GIF
Maka tampilan frame pertama dalam Window Animation adalah seperti gambar berikut :Membuat Animasi GIF
9. Sekarang kita akan menambahkan frame pada Window Animation, caranya klik icon Duplicates current frame dan sebuah duplikasi dari frame pertama telah terbuat. Selanjutnya pada Window Layers, tampilkan layer lingkaran berwarna kuning dan nonaktifkan layer berwarna merah.
10. Langkah terakhir, buat lagi frame baru pada Window Animation, pada Window Layers aktifkan layer lingkaran berwarna hijau dan nonaktifkan layer lingkaran berwarna kuning.
11. Atur timing dari masing-masing frame di Window Animation dengan meng-klik tulisan waktu yang ada di bagian bawah frame.
Membuat Animasi GIF
12. Coba Anda jalankan animasi sederhana yang telah Anda buat dengan cara klik ikon Plays/stops animation.
Membuat Animasi GIF
13. Setelah semuanya selesai jangan lupa untuk menyimpan hasil kerja Anda.

Ingat!
Untuk menyimpan file PSD dari latihan Anda kali ini, jalankan cara seperti biasa, File > Save.
Untuk menyimpan hasil kerja Anda menjadi animasi GIF, jalankan File > Save Optimized As…

sep.. udah pernah nyoba gan.. PERTAMAX ane....

salah tempat............

hahaha.. maklum sindrome KASKUS..hahahaha

Qwee wrote:

hahaha.. maklum sindrome KASKUS..hahahaha

mksud ane...
topiknya yg slah tmpat, sharusnya d designing . . . .

Ckckckck
judul topik kok indra wahyudi...

@Atas
ini kan bagian bebas
nmanya pun bleh la bebas
yg pnting isinya bro.

@atas
anda yg logo ! !
Ini hrusny d designing , ,
bkn d bebas . .

Maaf.
Saya tdk bcra dngn anda.
G' ush kpdean ya..

@atas
Anda tu klu komen pke otak lha..
Klu anda sdah komen, komen anda tu bsa dtnggapi smw org..

Psti anda anggota bru kn ?
Wajar lh . .
Msih kadik2 ! ! !

Sok kli atas..
Ilmu ctek udah ngrasa pling pntar..

Bca dlu komen saya.
Saya g' bahas tntang bnar tdknya posisi.
Saya bhas judulnya bung..
Mksd saya krna di truh di bebas,jdlnya pun trsrah pnulis la..
Tp mmg lbh bgus klo nymbung..
Saya g' blang klo posisi post nya ini bnar..
Jdulnya bung!
Jdulnya!

@kid_D
anda klu posting ko bdoh bgd sih ?
Room bebas tu bkn jdlny yg blh bbs, tpi isiny
Wlaupun saya msh anggota bru, tpi saya tdk sedangkal anda dlm brpikir

@mit-Nick
stuju gw bro,
gag sia2 lo pke nick gw. .
Hahahah..

@atas
ckckck
mmanfaatkan smw yg bs d manfaatkan . . .

@atas
it cerdik nmany..

@mit-Nick
malangnya nasibmu. . . .

@atas
hahah..
-NO JUNK-

@atas
ktwa??

mntap2....
tpi ttap aja gk ngerti aku...