Arba’in – The Fourth

Sci,Tech and Ent

Cara Bikin Animasi GIF dengan Adobe ImageReady

Page copy protected against web site content infringement by Copyscape

Udah pada tau format file GIF kan ? GIF (Graphics Interchange Format) adalah salah satu format gambar yg paling populer penggunaannya di dunia, terutama dalam dunia internet. Pasalnya, ukuran file dengan format GIF termasuk mini bila dibandingkan dengan format file lainnya seperti JPEG atau BMP, tentu saja dengan mengorbankan kualitas gambar yg dihasilkan. Salah satu kelebihan lain dari format GIF adalah kemampuannya untuk menghasilkan animasi gambar, walaupun dengan kualitas lumayan rendah.

File-file animasi GIF biasanya banyak ditemui di forum-forum internet dalam bentuk avatar yg menyatakan representasi pengguna dalam bentuk grafis. Kasarnya, avatar dipakai sebagai "foto" pengenal untuk pengguna (user) dalam suatu forum. Banyak yg menggunakan file gambar dengan format GIF untuk dijadikan avatar tadi, alasannya ya karena file GIF bisa dibuat animasi, sehingga seolah-olah si user terlihat lebih "keren" di forum tersebut (… walaupun kenyataannya avatar juga bisa digunakan untuk menipu pengguna lainnya emoticon).

Terus bagaimana caranya bikin file animasi GIF ? Ada banyak cara, tentunya dengan menggunakan software khusus. Sekarang persoalannya, pake software yg mana ? Nah, khusus untuk masalah pemilihan software, ada baiknya anda berhati-hati. Umumnya, karena nggak tau, orang langsung buka Google untuk mencari software-software yg bisa membuat animasi GIF. Sayangnya, kebanyakan yg muncul di halaman pertama adalah software-software "asing" alias nggak terlalu terkenal di kalangan pengguna PC, udah gitu banyak yg minta bayaran alias nggak free.

Kali ini saya mau berbagi sedikit pengetahuan untuk membuat animasi GIF dengan menggunakan software yg seharusnya nggak asing lagi di telinga para pengguna PC, Adobe ImageReady. Kalo anda pernah install Adobe Photoshop di PC anda, seharusnya Adobe ImageReady juga ikut terinstall bersamanya. Walaupun tidak memiliki fitur sekaya Photoshop, ImageReady sangat cocok bila anda ingin melakukan penyuntingan gambar secara cepat, khususnya untuk gambar-gambar yg biasanya ditampilkan di halaman web, termasuk membuat animasi GIF.

Sebelum membuat animasi, anda harus sudah menyiapkan gambar dengan format GIF, minimal 2 gambar. Kalo ada gambar yg sama dan memang terlihat "berurutan" bakal lebih bagus lagi. Kalo emang beda gambar juga nggak apa-apa, yg penting ukurannya harus sama, misal keduanya punya ukuran 200×200 pixel. Berikutnya langkah-langkahnya :

1. Jalankan Adobe ImageReady. Lalu buka file-file yg mau dibuat animasi.

Buka semua file yg mau dibuat animasi 

2. Pilih (klik) jendela gambar yg akan dijadikan klip awal dari animasi (istilah kerennya Starting Frame). Gambar ini akan dijadikan gambar yg pertama kali ditampilkan dalam animasi. Semua proses editing juga akan dilakukan pada jendela gambar ini.

3. Setelah gambar pertama dipilih, klik dua kali Layer gambar tersebut pada palet layer (palet layer biasanya terletak di sebelah kanan bawah workframe). Ganti nama layer dengan nama yg mudah diingat. Misalnya untuk Starting Frame, tulis saja namanya Gambar1.

Ganti nama starting frame layer. Toolbox

4. Pilih (klik) jendela gambar kedua (urutan kedua animasi). Lalu pada toolbox (biasanya di sebelah kiri workframe), pilih Move Tool, lalu klik dan seret gambar kedua ke atas jendela gambar pertama. Kalo anda melakukannya dengan benar, di palet layer gambar pertama akan muncul layer baru yg berisi gambar kedua. Atur posisi layer untuk gambar kedua di atas layer gambar pertama (kalo dibawah gambar pertama, ntar animasinya jadi terbalik urutannya). Ganti nama layer untuk gambar kedua menjadi Gambar2 (lihat langkah 3).

Taruh layer baru di atas layer sebelumnya. 

5. Kalo anda punya lebih dari dua gambar, lakukan hal yg sama dengan gambar-gambar berikutnya seperti pada langkah 4. Jadi, gambar ketiga diseret ke gambar pertama, lalu posisikan layer untuk gambar ketiga di atas layer gambar kedua. Jadi ntar urutan layer di gambar pertama (dari bawah) menjadi : Gambar1, Gambar2, Gambar3 dst. Ingat. Jendela gambar aktif harus tetap gambar pertama. Setelah anda memindahkan gambar-gambar lain ke jendela gambar pertama, anda bisa menutup jendela untuk gambar yg lain, seperti gambar ke dua, ketiga dst.

6. Pada palet Animation (Kalo nggak ada, pada menu pilih Window -> Animation untuk menampilkan palet Animation), klik submenu (yg seperti tanda panah ke kanan). Di submenu pilih, Make Frames Form Layers. Bila anda melakukannya dengan benar, layer-layer pada gambar pertama akan dipindahkan ke palete Animation.

Buat animasi dari layer 

7. Dibagian bawah tiap frame akan nampak timing dari tiap gambar. Ubahlah tiap frame sesuai selera anda, dengan mengklik tanda panah bawah. Misalnya timingnya menjadi 1 detik untuk tiap frame, artinya tiap gambar akan ditampilkan secara berurutan setiap 1 detik. Anda juga bisa menguji animasi dengan mengklik tombol Play di bagian bawah palet Animation. Jangan lupa, di kiri bawah palet Animation, ganti Once dengan Forever supaya animasinya bisa diulang setelah selesai.

 

8. Setelah anda mengatur timing tiap frame, simpan animasi tersebut dengan mengklik menu File -> Save Optimized As. Tulis nama file GIF yg anda inginkan.

 

Di atas adalah contoh animasi GIF yg saya buat dari citra radar dengan menggunakan 10 gambar dasar GIF. Selamat mencoba emoticon.

December 10, 2007 - Posted by | Bhs Indonesia, Guide, IT

57 Comments »

  1. lah… ini yg saya cari… thx om atas tutorialnya.. sep dah…

    Comment by fajar | December 24, 2007 | Reply

  2. @fajar : Makasih jg sudah mampir🙂

    Comment by A3 | December 27, 2007 | Reply

  3. mas gmbna cranya upload web di blogspot

    Comment by ryan chrisandro | January 4, 2008 | Reply

  4. Wkt muw d save, kuQ kata nya JPEG bla bla not supported.. T__T
    padahal udah seneng2.. hix..
    TqU anyway.. ^^

    Comment by ^^ | January 13, 2008 | Reply

  5. Wkt muw d save, kuQ kata nya JPEG bla bla not supported.. T__T
    padahal udah seneng2.. hix..
    TqU anyway.. ^^

    Comment by ^^ | January 13, 2008 | Reply

  6. Wkt muw d save, kuQ kata nya JPEG bla bla not supported.. T__T
    padahal udah seneng2.. hix..
    TqU anyway.. ^^

    Comment by ^^ | January 13, 2008 | Reply

  7. @ ^^ : Di menu pilih ‘Window’, terus liat, kasih tanda centang di ‘Optimize’ (kalo blom ada tanda centangnya). Kalo udah, di palet Optimize, dibagian settings, pilih GIF (dither/no dither). Kalo udah, coba save optimize as lg, ntar pasti udah bisa di save sebagai GIF. Cobain deh.

    Comment by A3 | January 14, 2008 | Reply

  8. thanks om…..

    Comment by alung | January 18, 2008 | Reply

  9. Aduh kk ribet amat kan katro jadinya kan aq gak ngerti pake bahasa planet donk jangan pake bahasa manusia OK !!!!!!

    Comment by UDZANG | February 1, 2008 | Reply

  10. wah suwun mas, aku sudah lama pingin belajar bikin gambar dengan format gif. tutorial yang dijual jarang ada yang membahas masalah ini. mingkin dianggap remeh kali ya… yang lebih mengagetkan sofwarenya sudah ada di komputerku sejak dulu, karena aku sangat suka otak-atik gabar dengan adobe photoshop. suwun bos!

    Comment by yoyok | April 1, 2008 | Reply

  11. @ Yoyok : Trims kembali🙂

    Comment by A3 | April 2, 2008 | Reply

  12. sip tutorialnya mantap… thx anyway

    Comment by syamsu | April 17, 2008 | Reply

  13. Keren… Udah lama cari-cari info kaya gini. Thanks buanget ya (om). Oiya nih kutinggalin bonus :
    “Rahasia Tersembunyi Metode Mencari Uang di Internet Akhirnya Diungkap…” Lebih lanjut, klik http://www.formulabisnis.com/?id=shey

    Comment by Shemma | May 2, 2008 | Reply

  14. Bagus, penjelasannya mudah dipahami. Semoga saya bisa menerapkannya. Thanks.

    Comment by Olala | May 6, 2008 | Reply

  15. @ syamsu, Shemma & Olala : Thanx kembali🙂

    Comment by A3 | May 7, 2008 | Reply

  16. makasi bror,gw selama ini bikin animasi gif ga tau cara atur timing hohoho……tq bgtyah

    Comment by Jinpenyu | May 29, 2008 | Reply

  17. Wah trnyta bikin animasi gmpank ya, pa lg skrg aku dah punya punya aplikasi java yg bsa bikin animasi, jdi bsa bkn animasi langsung di hp (Sony Ericson), mklum Aq gak pnya komptr, klo mau nma aplikasinya ‘PaintCAD’ bisa didwnlod gratis di http://www.Getjar.com atawa http://www.mobile9.com.

    Comment by Fuckhtul | June 16, 2008 | Reply

  18. Thank’s yha ardhi, saya mau coba dulu cek ke tkp.

    Ardhi Says :
    “Thanx kembali🙂 “

    Comment by Aa Plamoen | August 3, 2008 | Reply

  19. KEnapa aku nggak bisa nge-save pake save optimized as ya? Kenapa jadinya malah jpg bukan gif? Jadi nggak gerak deh

    Comment by Chemicaisy | August 5, 2008 | Reply

  20. makasi y tutorialny🙂

    Comment by synna | October 6, 2008 | Reply

  21. makasih ya tutornya….. jd pingin cepet bisa nih…

    Comment by sulis | October 21, 2008 | Reply

  22. Ok thanks bro buat ilmunya…….

    Comment by aji | November 1, 2008 | Reply

  23. koq uda di save k format .gif malah tetap ga bisa gerak yaa?
    ada apakah itu? >.

    Comment by evi | November 26, 2008 | Reply

  24. thx sangadd.!!

    Comment by fha | December 5, 2008 | Reply

  25. thanks banget mas, emang topik ini yang lagi aku cari2. ajarin buat tombol bergerak dengan javascript bisa gak? thanks

    Comment by Febry | December 7, 2008 | Reply

  26. wah sangat membantu mas…
    thanks banget ya…sukses selalu..

    Comment by Aden | December 11, 2008 | Reply

  27. uuuh …. mo coba ach… biznya gw lom p’nah coba bikin
    animasi GIF. do’akan gw yupz biar berhasil …

    Comment by hikmat | December 21, 2008 | Reply

  28. aq mau tnya ne cra bwt animasi tntang moral sosial gmna crax ya??

    sbgai cntohx animasi buanglah smpah pda tempatx….

    Comment by hady | January 16, 2009 | Reply

  29. ikak nhe asak d pade org tua ngelawan
    hahaay……

    Comment by dizt | January 18, 2009 | Reply

  30. gw baru bikin blog dihosting nih coba teman2 kasih kritik dan sarannya dunk, langsung aja ke http://www.asep09.co.cc
    solae gw masih pemula.

    Comment by asep | January 24, 2009 | Reply

  31. langsung tak COpas ini tutorialnya
    membantu banget
    ntar langsung praktek ah
    abiesnya aku pengenn bisa banget buat gambar animasi GIF
    ^_^
    makasie ya INPHONYA Mas
    very USEFULL

    Comment by andriristiawan | January 25, 2009 | Reply

  32. klo berkunjung jangan lp tinggalkan komentar yaaa…www.asep09.co.cc

    Comment by asep09 | January 27, 2009 | Reply

  33. thanks banget atas info nya

    Comment by mirdahayu | February 10, 2009 | Reply

  34. AKHIRNYA……
    udah lama nie nyari yang beginian…
    tx ya bang info’e….
    moga blog’e makin rame pengunjung!!!
    SIFFF…

    Comment by Monte | March 1, 2009 | Reply

  35. makasih ya,tapi pas saya mau save,munculnya cuman jpg?
    gimana tuh ya?

    Comment by Hinamori | March 28, 2009 | Reply

  36. keren bro…langsung praktek…thanks

    Comment by loopdreamer | May 14, 2009 | Reply

  37. nice info bro.
    thanx a lot. it really works..

    Comment by Ajoy D1 | May 26, 2009 | Reply

  38. nice info bro.
    thanx a lot. it really works..

    Comment by Ajoy D1 | May 26, 2009 | Reply

  39. mantep banget thanks

    Comment by wonk70674 | June 7, 2009 | Reply

  40. cari cara buat gambar gif
    eee mbah google menuntun saya
    tuk lihat blog ini
    thank tutorial nya mas
    nambah ilmu dah daku

    Comment by rakhman | July 17, 2009 | Reply

  41. makaciiiiiiiiiiiiiiii…atur nuwun lah mbah.numpang nanya lagi boleh ga?gmana buat situs kayak ente ini,pake 3d yaw.keren banget.sukses slalu🙂

    Comment by vanker | August 19, 2009 | Reply

  42. owh ya.bales ke mail saya ya.tolong banget bos.

    Comment by vanker | August 19, 2009 | Reply

  43. Mas Ardhi, oKs bgt!
    bahasanya mudah dimengerti pula..
    jd guru aja mas..heheheh
    aniwei thx a lot

    Comment by ann | October 8, 2009 | Reply

  44. kok saya gak bisa disimpan dengan ekstension gif ya ???
    hikzzz😦

    Comment by deidara_ | October 26, 2009 | Reply

  45. Thank’s ya om Ardhi,
    Mangstabss..

    Comment by Bens29 | November 15, 2009 | Reply

  46. makasih yaa..aku mau coba ahh
    mudah2an berhasil

    Comment by vina | January 12, 2010 | Reply

  47. Kecil banget tulisanya… njelimet mbacanya….

    Comment by Kristanto WDS | January 26, 2010 | Reply

  48. Mas Ardhi mau tanya, kalo bikin pake adobe photoshop CS4 gimana ya?? saya coba di photoshop cs4 tapi tidak ada image readynya. Tq

    Comment by Heman | February 25, 2010 | Reply

  49. Every body remembers that our life is not cheap, but some people require cash for different issues and not every one earns enough cash. Therefore to get quick loans and just small business loan should be good way out.

    Comment by Douglas31Rosalind | March 14, 2010 | Reply

  50. Hebat Gan, Makasih Infonya, sgt bermanfaat

    Comment by walijo | April 28, 2010 | Reply

  51. Hebat mas, segera saya praktekan dan saya install di blogku
    Makasih Infonya, sgt bermanfaat
    mampir di blog ku mas
    http://antibanbocor.com
    blog yg unik artikelnya lumayan, yg sebelumnya belum ada
    pertama di Indonesia
    http://antibanbocor.com

    Comment by tire guard | July 1, 2010 | Reply

  52. Houses and cars are quite expensive and not everyone is able to buy it. But, personal loans was created to help people in such hard situations.

    Comment by loan | July 31, 2010 | Reply

  53. Wah, bagus sekali tutorialnya..
    ternyata gampang sekali bikin gambar ber format GIF.
    thx a lot.

    Comment by auto rotary bintaro | August 13, 2010 | Reply

  54. Mas, kalo udah, dibuatnya gimana ya ?
    Soalnya saya sudah mau buat tapi bukan berbahan dasar GIF
    tapi malah JPEG. Pas saya mau membukanya, itu tidak terjadi apa2.Tolong kasih tau dan beri koment bagi yang tau ? Tolong !

    Comment by zblack | April 27, 2011 | Reply

  55. thank’s ya buat tips and caranya

    Comment by fakhri | May 21, 2011 | Reply

  56. bagus juga neh

    Comment by mursyid Burhan | November 23, 2011 | Reply

  57. klu cara mskin ke web gmn gan.. yhx info ny

    Comment by herry | March 14, 2012 | Reply


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: