Sabtu, 17 September 2016

Tutorial Cara Membuat Aplikasi Simple Augmented Reality (AR) di Android Menggunakan Unity dan Vuforia


Tutorial Cara Membuat Aplikasi Simple Augmented Reality (AR) di Android Menggunakan Unity dan Vuforia

By the way, skripsi saya juga bertemakan AR, judulnya aplikasinya tuh “Learn Shalat”. Aplikasi tersebut menampilkan manfaat-manfaat dari gerakan shalat bagi kesehatan tubuh manusia. Untuk menggambarkan gerakan shalat dan agar konten aplikasi tersebut menarik, model 3D pun dibuat beranimasi yang kemudian dibuat AR scenenya dengan Unity3D. Berikut gambar-gambar dari aplikasi tersebut :

Gambar 1. Gerakan Shalat Pada Aplikasi 

Gambar 2. Informasi Kesehatan Yang Ditampilkan
Oke langsung aja, kita belajar bareng gimana sih cara membuat AR scene dengan objek beranimasi. Tapi sebelum mulai belajar pembuatan AR scene seperti pada skripsi saya tersebut, kita pertama-tama belajar cara dasarnya dulu yah :p.

Pertama-tama, siapin dulu objek 3D yang udah beranimasi. Kita bisa buat objek 3D tersebut dengan Blender, 3DsMax ataupun tools lainnya. Setelah selesai, objek 3D tersebut kita export kedalam bentuk format *fbx. Kenapa sih mesti format *fbx, karena itu tuh adalah ekstensi yang dapat diproses Unity3D untuk objek 3D beranimasi. Di sini saya menggunakan model kijang dengan animasi loncat-loncat (*inget lagu joshua kan? Hehe ). Kalian bisa menggunakan model ini sebagai contoh ataupun dengan model buatan kalian masing-masing. Ini nih kijang yang akan digunakan :


Gambar 3. Kijang Yang Akan Digunakan
Klik disini untuk download modelnya.
Selanjutnya, buka Unity3D kemudian kita bikin projek baru untuk belajar AR kali ini. Pilih File > New Project lalu beri nama projek kita tersebut. Kemudian, langkah selanjutnya adalah menentukan platform yang akan digunakan. Pada projek ini, kita akan menjalankan AR scene yang akan dibuat pada Android mobile phone. Caranya pilih File > Build Settings > Android lalu Switch Platform. Selain itu, kita juga harus mengatur settingan pada menu Player Settings > Other Settings. Disana kita dapat memberikan nama Bundle Indentifier dan mengatur Minimimal API Level untuk aplikasi ini. Kemudian, close window Build Settings-nya.


Gambar 4. Form Pembuatan Project
Gambar 5. Form Build Settings
Gambar 6. Pengaturan Pada Bundle Identifier & Minimum API
Sebenernya cara settingan seperti diatas dan pengimportan model 3D telah dijelaskan pada tutorial sebelumnya. Untuk mempersingkat waktu, saya tidak menjelaskan cara pengimportan model 3D kembali. Walaupun kali ini model 3D yang digunakan beranimasi, overall cara pengimportannya sama kok namun ada sedikit penyesuaian. Berikut adalah gambar penyesuaian yang dilakukan untuk model 3D yang beranimasi :

Gambar 7. Pengaturan Scale Factor Model 3D
Pada gameObject "kijangLoncatUV", buka tab Model, lalu ubahlah ukuran scale factor dari gameObject ini. Kita perlu merubah scale factor ini agar pada saat gameObject ini kita resize/ scale di scene nanti, gameObject ini dapat bertambah besar/ kecil dengan proporsional (sesuai dengan scale factor-nya). Setelah itu, apply pengaturan terhadap model ini. Silahkan perhatikan pengaturan pada gambar 7 dibawah.
Gambar 8. Pengaturan Animation Model 3D
Selanjutnya, pada tab Animations, sebenernya kita ngga harus sih me-rename nama clip animasi yang udah ada. Oiya, biasanya nama clip animasi awalnya itu bernama "Default_Take". Tapi biar lebih mudah diingat, kita kasih aja nama clip animasi ini dengan "loncat". Setelah itu, bila kita ingin model tersebut selalu mengulang gerakan animasinya, kita dapat men-ceklist pada pilihan Loop Pose. Disini kita men-ceklist pilihan loop pose agar nantinya kijang dapat terus mengulang animasinya (loncat-loncat terus). Setelah itu apply. Silahkan perhatikan gambar 8 diatas.

Kemudian, kita memerlukan animator controller untuk mengatur jalannya animasi yang akan diputar. Pada animator controller ini, kita dapat mengatur animasi-animasi apa saja yang akan dimainkan, pada kondisi apa saja animasi dimainkan, dan lain sebagainya. Setelah dilakukan pengaturan animasi pada animator controller ini, biasanya dilakukan peng-codingan untuk menjalankan animator ini. Untuk saat ini, kita tidak perlu melakukan peng-codingan dulu karena animasi yang akan kita putar hanya satu saja. Insya Allah, pada tutorial selanjutnya kita akan membahas lebih banyak mengenai hal ini.

Untuk membuat animator controller, caranya klik kanan pada tab project (kolom kanan pada gambar 9) lalu create > Animator Controller, beri nama "KijangController" (pemberian nama dapat diabaikan yah, artinya beri nama sesuka kalian hehe), dan double klik KijangController tersebut. Selanjutnya, kita masukkan animasi loncat yang akan kita mainkan pada KijangController, caranya dengan drag-drop animasi loncat pada gameObject kijangLoncatUV ke arah KijangController sehingga muncul state loncat yang berwarna orange. Warna orange pada state maksudnya adalah default state animasi yang dimainkan. Jadi state default animasinya adalah loncat. Ini yang menyebabkan kijang akan langsung memainkan animasi loncat. Oleh karena itu kita belum perlu melakukan peng-codingan karena state default ini akan secara otomatis memainkan animasi loncat tersebut. Silahkan perhatikan gambar 9 berikut.

Gambar 9. Peletakan Animasi Loncat pada Kijang Controller
Tahap terakhir adalah pemberian animator controller yang telah kita buat. Dengan begini model kijang dapat melakukan animasi yang terdapat pada animator controller tersebut. Silahkan lihat gambar 10 berikut.

Gambar 10. Pemberian Animator Controller pada Model
Setelah scene ini disave, kalian bisa mencoba apakah kita berhasil membuat kijang tersebut bergerak loncat atau tidak dengan menekan tombol play pada Unity sebelum me-launch scene ini kedalam bentuk aplikasi Android. Alhamdulillah berhasil bergerak loncat nih punya saya yeay hehe :). Setelah berhasil bergerak, kalian bisa meneruskan me-launch scene ini ke bentuk aplikasi dan di test pada handphone kalian masing-masing. Kalo lupa, silahkan dilihat caranya pada tutorial sebelumnya.

Gambar 11. Kijang Berhasil Loncat

0 komentar:

Posting Komentar