Tuesday, November 24, 2015

Prak 9 – Remake “One Little Finger” by Super Simple Song (Part 3)

1. Tujuan

Mempercepat penguasaan Adobe Flash Professional melalui kegiatan remake.

2. Alat

Adobe Flash Professional CS3+

3. Bahan

4. Dasar Teori

A. Classic Motion Tween
B. Graphic Symbol
C. Movie Clip Symbol and Filters

5. Tugas Praktikum

Buatlah tiruan dari video “One Little Finger”
semakin mirip semakin bagus

6. Petunjuk Praktikum

Mulailah dari bentuk animasi yang sederhana seperti gerakan title opening dan gerakan awan.

7. Hasil Praktikum

8. Kesimpulan

pada percobaan ketiga kali ini, saya mengalami kebuntuan. saya mengalami kesulitan dalam membuat animasi one little finger secara lengkap. saya hanya mampu membuat sampai gerakan tangan pertama setelah berjalan. namun saya sudah menambahkan lagu hingga akhir. saya juga mengalami masalah teknis saat export ke dalam format yang playable. jadi saat ini hanya bisa dalam format gif

9. Referensi

Prak 8 – Remake “One Little Finger” by Super Simple Song (Part 2)

1. Tujuan

Mempercepat penguasaan Adobe Flash Professional melalui kegiatan remake.

2. Alat

Adobe Flash Professional CS3+

3. Bahan

4. Dasar Teori

A. Classic Motion Tween
B. Graphic Symbol
C. Movie Clip Symbol and Filters

5. Tugas Praktikum

Buatlah tiruan dari video “One Little Finger”
semakin mirip semakin bagus

6. Petunjuk Praktikum

Mulailah dari bentuk animasi yang sederhana seperti gerakan title opening dan gerakan awan.

7. Hasil Praktikum


8. Kesimpulan

dalam praktikum kali ini sangat membutuhkan ketelitian dan kesabaran yang banyak dengan tingkat kesabaan dan ketelatenan juga akan menentukan hasil yang sesuai juga

9. Referensi

Prak 7 – Remake “One Little Finger” by Super Simple Song (Part 1)

1. Tujuan

Mempercepat penguasaan Adobe Flash Professional melalui kegiatan remake.

2. Alat

Adobe Flash Professional CS3+

3. Bahan

4. Dasar Teori

A. Classic Motion Tween
B. Graphic Symbol
C. Movie Clip Symbol and Filters

5. Tugas Praktikum

Buatlah tiruan dari video “One Little Finger”
semakin mirip semakin bagus

6. Petunjuk Praktikum

Mulailah dari bentuk animasi yang sederhana seperti gerakan title opening dan gerakan awan.

7. Hasil Praktikum


8. Kesimpulan

membuat awalan animasi one little finger mengalami kesulitan saat tracing title dan memasukkan audio

9. Referensi

Prak 6 – Walk Cycle using Tween

1. Tujuan

Menerapkan walk cycle pada sebuah karakter yang populer dengan bantuan Tween.

2. Alat

Adobe Flash Professional CS3+

3. Bahan

Gambar referensi berisi salah satu karakter animasi yang populer misalnya naruto.

4. Dasar Teori

Secara prinsip, ada minimal 4 konsep yang perlu dipenuhi, antara lain:
  1. Pose
    (tambahkan penjelasan tentang Pose)
  2. Timing
    (tambahkan penjelasan tentang Timing)
  3. Inbetween
    (tambahkan penjelasan tentang inbetween)
  4. Arcs
    (tambahkan penjelasan tentang Arcs)
Secara teknis, adobe flash memiliki fitur untuk inbetween otomatis yang didebut dengan Tween
(tambahkan contoh penggunaan tween untuk mengerakkan sebuah kotak)

5. Tugas Praktikum

Buatlah walk cycle dari naruto dengan menggunakan bantuan Classic Tween

6. Petunjuk Praktikum

Berikut adalah langkah-langkah membuat walk cycle untuk kaki:
  1. Pecah kaki naruto menjadi 4 Graphic Symbol yang mewakili kaki bagian atas dan bawah untuk bagian kiri dan kanan
  2. Gunakan symbol tersebut untuk membuat contact position pada frame ke 1
  3. Gunakan transform tool (Q) untuk mengatur pivot dari masing-masing symbol. Dimana pivot kaki bagian atas terletak pada pinggul dan pivot kaki bagian bawah terletak pada lutut
  4. Buat keyframe (F6) pada frame ke 9. Buat contact position kebalikan dari frame ke 1
  5. Copy contact position pada frame 1 ke frame ke 17
  6. Klik kanan pada timeline diantara frame 1 dan 9 kemudian pilih menu “Create Classic Tween”
  7. Klik kanan pada timeline diantara frame 9 dan 17 kemudian pilih menu “Create Classic Tween”
  8. Uji animasi yang dibuat dengan menekan tombol Ctrl+Enter. Jika menghasilkan animasi kaki sliding seperti di danau es, maka lanjutkan ke langkah berikutnya. Jika tidak, perbaiki dulu animasinya.
  9. Buat keyframe (F6) pada frame ke 5 dan 13. Buatlah passing position pada frame tersebut.
  10. Jika semua berjalan lancar, maka akan diperoleh good enough walk cycle.
untuk memperhalus animasinya, dapat dilanjutkan dengan menambahkan gambar lutut dan menambahkan pose down dan up.

7. Hasil Praktikum


8. Kesimpulan

dalam pengerjaan praktikum kali ini saya menemui banyak sekali kesulitan meskipun materi kali ini adalah menginstankan langkah-langkah dalam membuat stick man yang sudah berbentuk naruto,dan dalam praktikum kali ini saya memiliki banyak sekali percobaan

9. Referensi

Thursday, October 1, 2015

Prak 5 – Popular Character Walk Cycle

1. Tujuan
Menerapkan konsep walk cycle pada sebuah karakter yang populer.
 2.     Alat
Adobe Flash Professional CS3+ 
3.   Bahan
Gambar referensi berisi salah satu karakter animasi yang populer misalnya naruto. 
4.   Dasar Teori
Secara teori, sebuah walk cycle dari sembarang karakter dapat diperoleh dengan me-replace stickman pada praktikum sebelumnya dengan karakter populer yang diinginkan
5.   Tugas Praktikum
Buatlah walk cycle dari character populer tersebut 
6.   Hasil Praktikum









7.   Kesimpulan
 Kita bisa menerapkan teknik walk cycle, yang awalnya hanya menggunakan stickman, kali ini kita bisa menggunakan karakter bervolume. Dalam hal ini kita memakai karakter naruto 

Thursday, September 17, 2015

Prak 3 – Memperhalus Walk Cycle menggunakan Konsep Arcs

1. Tujuan

Memperhalus walk cycle menggunakan konsep Arcs

2. Bahan

Sebuah walk cycle yang memiliki kriteria berikut:
1. Pose lengkap (contact, down, passing, up)
2. Timing tepat ( 8 frame atau 16 frame )
3. Inbetween antar pose (seluruh frame terisi keyframe)

3. Alat

Adobe Flash Professional CS3

4. Dasar Teori

Salah satu cara memperhalus animasi adalah dengan memperhatikan arcs-nya. Arcs yang dimaksud adalah lengkungan lintasan pergerakan. Untuk gerakan walk cycle, arcs yang muncul lebih dari satu macam. Arcs yang perlu diperhatikan pada walk cycle adalah arcs dari titik penting sebuah stickman. Ada banyak titik penting yang perlu di-cek arcs-nya. Salah satunya adalah titik tumit. berikut adalah contoh cara mengecek arcs yang dihasilkan dari pergerakan tumit.
Cara mengecek arcs bisa dimulai dengan menandai titik pentingnya. Pada video diatas, titik tumit ditandai dengan titik warna hijau. Setelah seluruh titik tumit pada seluruh frame ditandai, maka kita akan dapat kumpulan titik sebagai berikut
tanda-titik-tumit
titik penanda posisi tumit pada setiap frame
jika titik-titik hijau tersebut dihubungkan, maka akan bisa dievaluasi apakah animasinya sudah halus atau belum. jika garis yang dihasilkan tidak berbentuk kurva mulus, maka animasinya termasuk kurang halus.
berikut adalah contoh titik-titik yang menghasilkan arcs yang kurang mulus. perhatikan pada daerah yang dilingkari biru. jika daerah ini dibetulkan, yaitu dengan menggeser posisi tumit pada keyframe tersebut, maka akan diperoleh hasil animasi yang lebih halus.
broken-arcs
Contoh titik yang merusak arcs

5. Tugas Praktikum

Perbaiki arcs pada titik:
1. pinggul
2. tumit

6. Hasil Praktikum



7. Kesimpulan Praktikum

Saya dapat mempelajari mendalami walk cycle stickman dengan konsep arcs. walaupun dalam animasi saya belum ditambahkan titik-titik panduan brush, karena perintah brush di laptop saya tidak bisa dipakai

Thursday, September 10, 2015

Praktikum 2 - membuat animasi stickman

1. Tujuandapat membuat animasi pertama menggunakan adobe flash profesional

2. Alat
adobe flash professional cs6

3. Dasar teori
terdapat tiga dasar dalam pembuatan animasi stickman, yaitu
  • pose
  • timing
  • in between

1. 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.

walk-cycle-basic
Walk Cycle Poses Collection

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.

2. 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.
Untuk walk cycle, ada beberapa timing yang bisa digunakan tergantung jenis walk yang diinginkan
normal walk: 12 frame (0.5 detik)
cartoon walk: 8 frame
Timing yang relatif mudah untuk keperluan belajar adalah 8 frame. Dengan spesifikasi berikut,
pose contact –> frame 1
pose down –> frame 3
pose passing –> frame 5
pose up –> frame 7
pose contact –> frame 9
berikut adalah susunan keyframe pada timeline

basic-timing
timing untuk 4 pose walk cycle
berikut adalah tampilan onion skin dari 4 pose dasar walk cycle

walk-cycle-onion-skin
4 basic walk cycle in onion skin

3. Inbetween

4 pose hanya bisa untuk 4 keyframe. Sedangkan untuk walk cycle dengan timing cartoon, perlu 8 frame. Sehingga perlu 4 tambahan frame atau 1 tambahan perantara frame yang biasa disebut dengan inbetween. Proses pembuatan inbetween sangat sederhana.
  1. Cukup aktifkan onion sehingga bisa tampak keyframe frame sebelumnya dan frame setelahnya. Sebagai contoh, berikut adalah kondisi frame 2 saat masih baru ditambahkan empty keyframe dengan mode onion skin aktif.
    onion-skin
    onion skin
  2. Tambahkan gambar yang mewakili pertengahan dari kedua frame tersebut. Berikut adalah contoh hasil penambahan inbetween untuk keyframe pada frame 2.

    hasil-inbetween
    hasil proses inbetween
  3. Ulangi langkah tersebut untuk menambahkan keyframe pada frame 4, 6, dan 8. Sehingga diperoleh keyframe untuk masin-masing frame seperti berikut ini

    1-frame-1-keyframe
    1 frame 1 keyframe
     
 4. Tugas Praktikum
  • buatlah sebuah stickman
  • animasikan sehingga tampak berjalan
5. Hasil Praktikum


6. Kesimpulan
dari melakukan praktikum ini kita bisa memahami bagaimana cara membuat dasar animasi walk cycle. cukup rumit, namun dengan sedikit ketekunan akan didapatkan hasil yang cukup bagus. apalagi dengan penyempurnaan in between.

7. Referensi

Moh Hasbi A, Membuat Animasi Stickman Menggunakan Adobe Flash Professional