1. @agatestudio
Animation
Luluz
Producer
Agate Studio

2. @agatestudio@agatestudio@agatestudio
VERTEX AND SHAPE ANIMATION
FOR
For Game Developer
Part 1
Research

3. @agatestudio@agatestudio@agatestudio
Overview
• Memberikan pengenalan tentang Skeletal Animation
dan Vertex Animation.
• Tujuan Share:
Producer mendapat gambaran sejauh apa potensi
penggunaan animation dalam game development.
Memberikan gambaran dasar konsep penggunaan
Vertex Animation.

4. @agatestudio@agatestudio@agatestudio
Batasan Masalah
• Part ini hanya menjelaskan dasar dan potensi
penggunaan Vertex Animation.
• Tidak termasuk dengan pembahasan performansi,
teknik implementasi dan lain-lain (Mungkin akan di
bahas di part 2).

5. @agatestudio@agatestudio@agatestudio
Skeletal Animation
*Teknik animasi dengan menggunakan bone.
*Definisi to the point, untuk definisi ilmiah silahkan cek Wiki

6. @agatestudio@agatestudio@agatestudio
Vertex Animation
• Flex Animation/Vertex and shape key
animation/Morph Animation adalah istilah-istilah
yang sering digunakan.
• Salah satu game yang menggunakan skeletal
animation dan vertex animation secara bersamaan
adalah DOTA 2 (akan digunakan sebagai referensi di
Presentasi kali ini).
• Pada DOTA 2, Pergerakan Karakter(berlari, pukul,
berdoa) menggunakan Skeletal Animation. Vertex
Animation digunakan untuk Facial Expression dan
Lypsync pada Portrait Karakter.

7. @agatestudio@agatestudio@agatestudio
Skeletal Animation
Faceless Void - Valve
Penggunaan Bone Leher dan Wajah untuk menggerakkan Faceless Void.
Garis-garis hitam adalah bone yang digunakan oleh karakter ini.

8. @agatestudio@agatestudio@agatestudio
Flex Animation
Flex animation (also called vertex and shape key animation) is the direct manipulation
of vertices without the involvement of a skeleton.
Perhatikan bahwa tidak ada bone yang mengatur pergerakan rahang.

9. @agatestudio@agatestudio@agatestudio
Lihat Lebih Dalam
Skeletal Animation (Perhatikan pergerakan tulang yang membuat kepala mendongak)

10. @agatestudio@agatestudio@agatestudio
Lihat Lebih Dalam
Flex Animation (Perhatikan bahwa mulut terbuka tanpa adanya pergerakan tulang,
mulut terbuka karena vertex di animasikan dari keadaan tertutup ke terbuka).

11. @agatestudio@agatestudio@agatestudio
Konsep Dasar Pembuatan
Vertex Animation
Akan dijelaskan menggunakan Blender sebagai contoh
untuk menjelaskan konsep dasar Vertex Animation.
Misalkan target kita adalah
Membuat vertex animation yang mengubah object dari
bentuk Kubus menjadi Trapesium.

12. @agatestudio@agatestudio@agatestudio
Teori
• Secara teori vertex animation bisa diperoleh dengan menggerakkan
vertex di setiap framenya.
Misal:
frame 1 mulut tertutup, do nothing
frame 5 mulut terbuka, kita gerakkan vertex agar terbuka
frame 10 mulut tertutup, kita gerakkan vertex agar tertutup.
Maka akan terjadi animasi membuka dan menutup mulut.
• Problem: Makan waktu dan capek karena harus menggerakkan
vertex vertex.
• Oleh karena problem diatas, 3D Software pada umumnya telah
menyediakan cara yang lebih friendly untuk melakukan Vertex
Animation.

13. @agatestudio@agatestudio@agatestudio
Pembuatan Vertex Animation pada Blender
Objek awal yang akan digunakan
sebagai bentuk dasar (default).
Kita catat sebagai Shape Keys ‘Basis
Kubus Biasa
Kita buat Shape Keys baru dengan nama Trapesium.
Kita edit Cube dengan memindahkan vertex-
vertexnya sehingga membentuk trapesium

14. @agatestudio@agatestudio@agatestudio
Pembuatan Vertex Animation pada Blender
Kita bisa mengatur value pada Shape Keys Trapesium.

15. @agatestudio@agatestudio@agatestudio
Pembuatan Vertex Animation pada Blender
Konsep (Sotoy):
Intinya dia nyatet bentuk trapesiumnya. Value ‘0’ bentuk dasarnya, value ‘1’ adalah bentuk
trapesiumnya. Jika kita set ‘0.5’ pergeseran vertex akan setengahnya.
Penggunaan:
Nah, value inilah yang akan diatur nantinya di Animation Timeline-nya. Jadi kita cukup mengatur
value shape key-nya saja, tidak perlu menggeser setiap vertex-nya.

16. @agatestudio@agatestudio@agatestudio
Catatan Kecil
• Pembuatan vertex animation diatas hanyalah salah
satu contoh (tiap 3D software mungkin berbeda).
• Vertex animation tidak se-serdahana itu untuk di
export dan digunakan . Sangat bergantung pada
engine yang digunakan (konsultasi dengan para
technical).
• Vertex animation dan Skeletal Animation bisa
digunakan bersamaan.

17. @agatestudio@agatestudio@agatestudio
Demo
Memperlihatkan perbedaan animasi dengan kombinasi
antara vertex animation dan skeletal animation dengan
vertex animation

18. Thank you!