Prak 3. Membuat Walk Cycle Menggunakan Keyframe

1.      Tujuan

Dapat membuat animasi stickman berjalan secara halus dengan menambahkan proses in between

2.      Alat

Adobe Flash CS6

3.      Dasar Teori

-          In Between

in between adalah proses dari membuat transisi frame diantara 2 objek berurutan yang  terpisah untuk menampilkan perpindahan dan evolusi dari objek pertama ke objek kedua.

-          Line Tools

Tools yang digunakan untuk membuat garis lurus.

-          Oval Tools

Tools untuk membuat objek oval atau lingkaran.

-          Keyframe

Keyframe merupakan suatu tempat yang digunakan untuk menaruh objek. Keyframe boleh kosong. Keyframe bisa disebut juga kepala frame karena memiliki titik, dan bila keyframe dihapus, maka frame juga ikut menghilang.

-          Pose

Berikut adalah pose-pose yang perlu ada dalam sebuah walk. Seringkali disebut dengan walk cycle. Dinamakan cycle karena pose ini dipilih sedemikian rupa sehingga pose terakhir identik dengan pose awal sehingga bisa disusun menjadi sebuah siklus tanpa henti.

Perhatikan bahwa ada 4 pose yang diperlukan, yaitu contact, down, passing, dan up. Untuk mempermudah proses belajar, ada baiknya jika fokus pada pergerakan kaki dahulu. kemudian baru dilanjut bagian tubuh yang lain pada kesempatan berikutnya.

-          Timing

Timing yang dimaksud adalah jumlah frame yang diperlukan untuk menghasilkan animasi yang diinginkan. Timing juga berhubungan dengan durasi animasi yang diinginkan, apakah cepat atau lambat. Yang perlu diingat, untuk memperlambat animasi, tidak dilakukan dengan cara mengubah setting FPS, akan tetapi dengan cara mengubah jumlah frame yang dibuat. Dalam animasi baik 2D dan 3D, standar FPS adalah 24.

4.      Tugas Praktikum

5.      Hasil Praktikum

6.      Kesimpulan

Untuk membuat animasi yang tampak halus pergerakannya, membutuhkan langkah in between yang menghubungkan frame sebelumnya dengan frame setelahnya.

7.      Referensi

-          [In-Betweening (Tweening)] https://www.techopedia.com/definition/104/in-betweening-tweening

-          [emo, Mengenal Flash] http://morfour.blogspot.co.id/p/mengenal-flash.html

-          [Febrianto Arif, Apakah Keyframe itu?] http://blog.flashindonesia.com/2010/02/apakah-keyframe-itu/

-          [Moh Hasbi Assidiqi, Prak 2. Membuat Animasi Stickman Menggunakan Adobe Flash Professional] http://www.mohhasbias.com/prak-2-membuat-animasi-stickman-menggunakan-adobe-flash/

Praktikum 2 Membuat Animasi Stickman di Flash

1.    Tujuan

Mengetahui cara membuat animasi dengan menggunakan tools yang ada di flash dan fungsi dari Key Frame.

2.    Alat dan Bahan

Adobe Flash CS6.

3.    Dasar Teori

Flash merupakan suatu program grafis  multimedia dan animasi yang dibuat oleh perusahan Macromedia untuk keperluan pembuatan aplikasi web interaktif mau pun animasi yang berkembang pada saat ini. Program ini banyak digunakan untuk membuat game, kartun, presentasi dan model pembelajaran interaktif. Terdapat beberapa versi dari macromedia flash yang berkembang saat ini meskipun saat ini tidak lagi milik macromedia melainkan Adobe Flash.

Keyframe merupakan suatu tempat yang digunakan untuk menaruh objek. Keyframe boleh kosong. Keyframe bisa disebut juga kepala frame karena memiliki titik, dan bila keyframe dihapus, maka frame juga ikut menghilang.

4.      Tugas Praktikum

Membuat stickman berjalan.

1. Stickman

2. Animasi Berjalan

5.    Hasil Praktikum

Untuk membuat animasi seperti di atas, pertama membuat struktur dari stickman. Kemudian, setelah membuat struktur yang pertama, selanjutnya adalah mengelompokan stickman sesuai dengan posisi badan dari stickman.

Setelah selesai mengelompokkan posisi masing-masing badan dari stickman, selanjutnya adalah membuat keyframe untuk penganimasian. Pada praktikum ini, keyframe di letakkan pada setiap frame dengan loncatan 5 frame.

Pada setiap keyframe, gerak dari stickman dibuat berbeda dan posisi stickman berubah sehingga nantinya pada saat di jalankan, stickman terlihat bergerak.

Lanjutkan untuk membuat beberapa pergerakan atau mengulang pergerakan yang sebelumnya sehingga keyframe bertambah.

Untuk melihat hasil dari animasi, tekan “Enter” pada keyboard, atau tekan kombinasi tombol “Ctrl+Enter”.

Setelah selesai membuat animasi, simpan hasil animasi dengan memilih menu “File-Save”

1.    Kesimpulan

Keyframe pada Adobe Flash berfungsi untuk membuat sebuah animasi karena apabila ditambahkan keyframe dan posisi dari animasi sebelumnya diubah maka ketika di play akan ada pergerakan pada objek.

2.    Referensi

[Emo, Mengenal Flash] http://morfour.blogspot.com/p/mengenal-flash.html

[Febrianto Arif, Apakah KeyFrame itu?] http://blog.flashindonesia.com/2010/02/apakah-keyframe-itu/

[Terry Irawan, Animasi Stickman dengan Adobe Flash CS3 (Latihan Animasi Frame by Frame] http://news.palcomtech.com/animasi-stickman-dengan-adobe-flash-cs3-latihan-animasi-frame-by-frame/

Praktikum 1 Mengenal Interface Adobe Flash

1. Tujuan

     untuk mengenal tampilan (interface) dari Adobe Flash Professional.

2. Dasar Teori

    Flash merupakan suatu program grafis  multimedia dan animasi yang dibuat oleh perusahan Macromedia untuk keperluan pembuatan aplikasi web interaktif mau pun animasi yang berkembang pada saat ini. Program ini banyak digunakan untuk membuat game, kartun, presentasi dan model pembelajaran interaktif. Terdapat beberapa versi dari macromedia flash yang berkembang saat ini meskipun saat ini tidak lagi milik macromedia melainkan Adobe Flash.

3. Tugas Praktikum

    menjelaskan fungsi dari masing-masing bagian tampilan Adobe Flash di bawah ini :

 

4. Hasil Praktikum

1.      Toolbar

Tempat kumpulan tools yang nantinya akan digunakan pada saat mengoperasikan Adobe Flash Player. Untuk dapat mengoperasikan Adobe Flash Player, memahami fungsi dari setiap tools yang terdapat pada flash sangatlah penting, karena fungsi setiap tools berbeda.

2.      Stage

Stage merupakan area untuk menempatkan gambar dan atau komponen-komponen yang diperlukan dalam pembuatan animasi.

3.      Other Panel

Fungsi dari bagian panel adalah untuk menambahkan pengeditan pada gambar atau komponen animasi. Panel ini dapat di tambah atau di kurangi dengan cara mengedit penampilan (interface) dari flash melalui menu bar window.

4.      Panel Properties

Pada panel properties terdapat beberapa bagian antara lain   :

-          Publish                  : publish digunakan dalam pengaturan hasil publishan dari pekerjaan pada flash, dalam publish setting terdapat beberapa pilihan jenis publish diantaranya adalah swf, exe, jpg, fla, html, dll.

-          Properties              : properties digunakan untuk mengatur warna dari stage, mengatur ukuran stage, dan fps (kecepatan jalannya pergerakan animasi persecondnya)

-          Position and size   : panel ini akan muncul ketika dalam stage terdapat komponen animasi dan komponen tersebut di klik. Fungsi dari panel ini adalah untuk melakukan pengaturan ukuran dan juga posisi dari komponen animasi.

5.      Zoom, Scene, Symbol

-          Zoom digunakan untuk mengatur dekat jauhnya stage dari flash.

-          Scene digunakan untuk memilih scene mana yang diaktifkan atau di tampilkan pada stage, ada kalanya pada 1 name file terdapat lebih dari 1 scene yang digunakan.

-          Symbol digunakan untuk memilih symbol mana yang akan diedit, dengan memilih symbol dari tools Symbol ini pengeditan symbol dapat dilakukan dengan mudah karena dalam stage hanya akan muncul symbol yang akan diedit.

6.      Timeline

Timeline adalah tempat dimana dilakuakannya eksekusi pembuatan keyframe dalam pembuatan animasi pada flash.

7.      Name File

Fungsi dari name file adalah memberikan informasi mengenai nama file yang sedang aktif.

8.      Esentials

Esentials memberikan pilihan mengenai pengaturan interface yang dapat digunakan pada flash.

9.      Panel properties dan Library

Untuk mengaktifkan pilihan property atau library. Ketika property yang diaktifkan, maka akan muncul pengaturan mengenai property tepat di bawah panel. Namun apabila panel Library yang diaktifkan maka akan muncul History Library yang digunakan pada pembuatan animasi.

5. Kesimpulan
    Salah satu aplikasi yang dapat digunakan untuk membuat animasi adalah Adobe Flash. Untuk dapat mengaplikasikan Adobe Flash maka perlu untuk memahami interface dari Adobe Flash.

6. Referensi
[Emo "Mengenal Flash"] http://morfour.blogspot.com/p/mengenal-flash.html