Cara Membuat Animasi Bergerak

Seringkali kita melihat gambar bergerak pada animasi di film kartun terlihat hidup layaknya benda hidup. Tetapi jika kita perhatikan dengan baik gambar tersebut hanyalah berupa gabungan dari gambar-gambar yang sangat banyak dan berurutan. Sebelum diciptakannya teknologi animasi komputer film kartun dibuat dari ratusan hingga ribuan lembar gambar yang berurutan, gambar tersebut di sorot satu per satu sehingga menjadi seperti sebuah gerakan yang terlihat hidup. Prinsip kerjanya adalah semakin banyak gambar yang dibuat maka semakin halus gerakan yang akan tercipta.

Prinsip dasar animasi tersebut masih sering digunakan sampai sekarang, seperti yang ditampilkan dari teknik animasi stop motion. Dalam stop motion setiap gerakan akan tercipta dari beberapa foto yang ditangkap kamera. Foto-foto tersebut lalu digabungkan dan di slideshow dalam waktu yang sangat cepat sehingga akan menampilkan gerakan yang juga mirip gerakan animasi.

Jenis Animasi File GIF

Ada banyak jenis animasi sederhana yang lainnya. Jika Anda sering melihat sebuah ikon atau avatar seseorang pada sebuah forum di internet terlihat bergerak layaknya animasi atau video, itu adalah salah satu jenis animasi sederhana. Animasi tersebut sekilas terlihat seperti sebuah file video padahal pada dasarnya file tersebut hanyalah berupa gambar yang dibuat dengan teknik animasi GIF yang sederhana.

Animasi GIF merupakan teknik animasi sederhana yang menggunakan prinsip animasi dasar berupa gambar-gambar yang saling dihubungkan. Bagaimana cara membuat animasi GIF?. Berikut ini adalah contoh sederhana bagaimana membuat animasi GIF dengan software Adobe Photoshop, pada dasarnya animasi yang akan dibuat berikut ini adalah beberapa gambar yang digabungkan dan dimainkan secara bergantian seperti halnya slideshow.

Cara Membuat Animasi Bergerak GIF

Untuk lebih memudahkan Anda, berikut adalah langkah-langkahnya membuat animasi bergerak GIF  :

1. Buka software Adobe Photoshop dan buat halaman baru. Buat gambar pertama yang akan muncul pada frame pertama.

Cara Membuat Animasi Bergerak 1

 

2. Lalu selanjutnya buat gambar untuk frame-frame berikutnya secara berurutan sesuai dengan urutan animasinya nanti. Setiap gambar diletakan pada layer yang terpisah. Sebaiknya setiap gambar pada tiap frame dibuat dalam satu layar sehingga jika Anda membuat gambar yang berjumlah 6 frame animasi, maka usahakan juga hanya terdapat enam buah layer gambar. Jadi satu frame = satu layer. Seperti yang terlihat pada gambar berikut.

Cara Membuat Animasi Bergerak 2

3. Selanjutnya pilih panel Animasi yang terletak pada toolbar Windows -> Animation lalu pada panel animasi buat frame baru dengan menekan tombol “duplicates selected frames”. Perintah tersebut akan berfungsi seperti halnya duplicate layer, hanya saja pada hal ini bukan berupa layer melainkan frame.

Cara Membuat Animasi Bergerak 3

Cara Membuat Animasi Bergerak 3

4. Setelah membuat frame dengan cara menduplicatenya maka sekarang akan ada dua frame, tetapi masih berupa gambar yang sama. Untuk merubahnya pertama-tama Anda harus mengklik frame kedua sehingga frame no.2 menjadi terseleksi. Lalu non aktifkan layer visibility pada semua layer kecuali layer yang akan ditampilkan dalam hal ini berarti layer bernama “hold” harus aktif. Aturan tersebut berlaku untuk frame lainnya, jadi pada frame 1 berarti layer yang diaktifkan hanyalah layer “bendra”, frame no 3 layer yang diaktifkan adalah layer “3” begitu seterusnya.

Cara Membuat Animasi GIF 4

 

Cara Membuat Animasi GIF 5

5. Jika semua frame telah dibuat berdasarkan urutan layer yang Anda inginkan maka Anda tinggal mengklik tombol play untuk memainkan animasi tersebut. Untuk mengatur timing tiap frame Anda cukup menggantinya pada tiap frame. Timeng tiap frame dapat diatur berbeda-beda atau sama.

Cara Membuat Animasi GIF 6

6. Setelah jadi Anda tinggal mensave dengan format gif. Sebaiknya gunakan perintah Save for Web & Devices atau dengan shortkey Alt+Shift+Ctrl+S pada menu save for web and devices pilih format gif dan tekan tombol save. File animasi GIF Anda telah selesai dan siap untuk digunakan.

Cara Membuat Animasi Bergerak – Prolog

Demikian tutorial singkat untuk membuat animasi bergerak yang dapat Anda ikuti. Selamat mencoba dan semoga bermanfaat.


Posted

in

by

Tags:

Comments

43 responses to “Cara Membuat Animasi Bergerak”

  1. vanesa lie vani

    thx bagus banget sangat membantu

    1. Ahli Kompie

      @ vanesa lie vani

      Sip. Senang bisa membantu :)

    2. Fais

      mau nanya kalau ingin merubah animasi pada sketchup menjadi video lalu di masukkan ke power point ya p4 ?

      1. Ahli Kompie

        @ Fais

        Halo Pak Fais. Kalau untuk yang itu saya belum pernah mencoba jadi kurang tahu. Mohon maaf.

  2. gimana sih.. caranya membuat animasi di adobe photoshop???

    1. Ahli Kompie

      @ ginaya24

      Silakan dicermati lagi artikel di atas :)

  3. heri

    tolong perjelas langkah langkah peralatan apa saja yang digunakan diphotoshop ini,karna menurut saya ini kurang untuk mempraktekan dan masih membingungkan

    1. Ahli Kompie

      @ heri

      Terima kasih untuk pertanyaannya. Untuk penjelasan lebih lanjut sepertinya akan terlalu sempit jika dijelaskan melalui form komentar. Mudah2an kami bisa menulis lebih detali lagi di artikel yang lainnya.

  4. ergy

    saya sangat senang dgn adanya forum ini terlebih bs menambah wawasan dlm hal cetak poto dgn langkah sederhana, ini bagian usaha saya sbnrya,tp saya msh ingin lebih banyak bljr terutama aplikasi adobe potoshop keliatannya agak rumit

    1. Ahli Kompie

      @ ergy

      Terima kasih atas dukungannya. Belajar memang kadang rumit dan sulit, tapi jangan patah semangat karena hasilnya biasanya manis :)

  5. adi

    trims

    1. Ahli Kompie

      @ adi

      Terima kasih kembali.

  6. setia

    photoshop yang CS biasa kq gak ada pilihan animasi yaaa

    1. Ahli Kompie

      @ setia

      Ada lah. Yang versi sebelumnya aja ada :)

  7. ila

    di mana letak windows?

    1. Ahli Kompie

      @ ila

      Di mana letak Windows? Mohon maaf saya kurang faham dengan pertanyaan yang diajukan.

      1. cara buat animasinya pakai photoshop cs5 kan?

        1. Ahli Kompie

          @ bintang yahasri

          Ya, bisa pakai Adobe Photoshop CS 5

  8. aisya

    terima kasih atas pemberitahhuannya

    1. Ahli Kompie

      @ aisya

      Terima kasih kembali.

  9. siti rabila sari

    bagus juga penjelasannya. bisa dimengerti.

    1. Ahli Kompie

      @ siti rabila sari

      Terima kasih banyak untuk dukungannya.

  10. maaf kang, panel Animasi yang terletak pada toolbar Windows -> Animation

    koq ngak ketemu, thanx

    1. Ahli Kompie

      @ irwan

      Adobe Photoshop yang dipakai versi apa Pak?

  11. ilham hacker

    terima kasih infox mampir juga dong di bloger q http://sispecter.blogspot.com/

    1. Ahli Kompie

      @ ilham hacker

      Terima kasih kembali. Saya sudah kunjungi blog Anda, sesuai dengan namanya, bertema hacking. Salam kenal Pak.

  12. tazkiyyatul maulidah

    gimana ya caranya buat animasi bergerak kalau lewat internet?

    1. Ahli Kompie

      @ tazkiyyatul maulidah

      bisa dicoba untuk memakai berbagai website GIF animator, seperti :

      gifup.com, picasion.com, gickr.com, makeagif.com, gifsun.org, loogix.com, online-image-editor.com

  13. thorik

    gampangan juga pake macromedia flash player kusus buat newbie pake nih

    1. Ahli Kompie

      @ thorik

      Terima kasih banyak untuk tipsnya.

  14. aku akan coba ..
    terimakasih atas infonya ..!!

    1. Ahli Kompie

      @ Tricajus

      Terima kasih kembali.

  15. informasi yang sangat bagus sekali,,
    terimaksih

    1. Ahli Kompie

      @ produk furniture,furniture jepara

      Terima kasih kembali. Semoga sukses usahanya.

  16. mantep gan tutorialnya ,,, ngomog2 pake photoshop versi berapa ya gan yang bagus yang kumplit untuk buat gambar animasi?

    1. Ahli Kompie

      @ J-Ris-Man

      Makasih kembali. Versi makin baru makin komplit tentunya. Ya tapi makin mahal juga, hehehe.

  17. […] Sumber: http://ahlikompie.com/cara-membuat-animasi-bergerak-988.html Share this:TwitterFacebookLike this:SukaBe the first to like this post. […]

  18. terimakasih pak,
    saya sudah berhasil membuat animasi gif nya. tengok di bagian bawah page ini http://transferfactorpeduliwanita.blogspot.com/2011/04/transfer-factor-sang-pemimpin-di.html

    singkat dan jelas sekali penjelasannya.
    silahkan mampir dan download brosurnya ya, sewaktu-waktu mungkin akan bermanfaat.
    trimksh

    1. Ahli Kompie

      @ Arif Transfer Factor

      Terima kasih kembali :)

  19. pemula

    mas, ada ngak kursus atau pelatihan membuat animasi sederhana untuk wilayah bandung khususnya..sangat berminat. saya bukan basic ilmu komputer tapi ingin tau sedikit nasalah membuat animasi

    1. Ahli Kompie

      @ pemula

      Kalau di Bandung masih belum tahu Pak, paling di Jakarta yang saya tahu Baba Studio

  20. decky

    mas
    klo membuat animasi bergerak di java gmna ya mas
    mkasih :)

    1. Ahli Kompie

      @ decky

      Mohon maaf kalau untuk yang urusan ini saya kurang tahu.

Leave a Reply to produk furniture,furniture jepara Cancel reply

Your email address will not be published. Required fields are marked *