Selasa, 20 September 2016

Augmented Reality dengan Animasi Wave dan Curve Editor 3DSMax

Selamat datang di A.R.T. pada tutorial kali ini akan membahas Tehnik Animasi Wave yang sering digunakan oleh Animator Proffesional di 3DSMax untuk membuat Animasi objek yang "melambai-lambai" seperti Ombak, sayap, Air, dll. tadinya kami kira, tehnik Animasi Curve Editor dan Wave ini tidak akan jalan di ARToolkit, tapi ternyata jalan dengan sedikit pengaturan khusus di Exporter WRLnya

Bagaimana cara membuatnya, ikuti Tutorial dibawah:

1. Buka 3DSMax Versi yang Anda Punya. (Kami Sarankan Gunakan Versi 9, karna lebih Mudah)
2. Untuk Modelling Ikan Pari, bisa anda baca di Buku The Magic Of 3DStudio Max, karangan Hendi Hendratman., ST dan Robby ST, buku bisa dipesan di www.hendihen.com



















3. Atau jika kamu belum mendapatkan bukunya, kamu bisa mendownload objek 3D Ikan Pari, yang sudah saya siapkan, Cukup DOWNLOAD DISINI, untuk sekedar latihan Animasinya.

4. Jika sudah didownload, buka Pari (Non Animasi).max di 3DSMax kamu..

















Animasi Sayap Kiri

5. Pertama kita akan Menggerakan Sayap Kiri. untuk itu aktifkan objek ikan pari, kemudian klik Modify >> Modifier List: Mesh Select.


















6. Selanjutnya buka tanda (+)  di Mesh Select kemudian pilih Vertex.



















7. Seleksi Vertex di Ujung kiri Saya Ikan Pari. (Sedikit Saja)

















8. Selanjutnya, klik tanda (+) pada Soft Selection, lalu beri tanda Checklist Soft Selection dan atur Falloff = 37. maka vertex yang tadinya kita seleksi, akan menyebar ke sayap kiri.


















9. Selanjutnya, sayap kiri masih dalam keadaan terseleksi. kita beri modifier list Wave. kemudian atur parameter Amplitude 1 = 10, Amplitude 2 = 10, dan Wave Length = 100, seperti gambar dibawah.


 



























10. Ok, jika sudah selesai. saatnya kita animasikan sayap kiri. Klik tombol Time Configuration (dibawah tompol, play stop and pause). lalu atur length animasi menjadi 199.





























11. Sekarang, Aktifkan Auto Key lalu Geser Time Slider ke posisi 199/199













12. Selanjutnya, di menu Parameter Wave, aktifkan Phase 2.0
























13. nah, sekarang jalankan animasinya. Jika diperhatikan baik-baik, saat animasi sayap kiri jalan, ada percepatan di awal dan perlambatan di akhir. untuk memperbaikinya, klik menu Graph Editor > Track View - Curve Editor 














14. kemudian, Klik Modified Objct > Wave > Phase















15. Setelah itu,. klik 2 titik di Ujung Gari bawah dan atas lalu klik tombol Set Tangens to Linear. sehingga kurva menjadi Lurus.




















Animasi Sayap Kanan


16.  Untuk Animasi sayap kanan, caranya sama seperti animasi sayap kiri. cukup, kalian ulang sendiri yah. sekarang kita lanjut langkah ke-17.

17. Ok. saya anggap kalian sudah membuat animasi sayap kanan. tetapi, saat di jalankan animasinya, pasti gerakan sayapnya tidak kompak, yang kanan keaatas, yang kiri kebawah. seperti terlihat di gambar bawah.

















18. Gimana cara memperbaikinya?. caranya, masih sayap kanan dalam keadaan terseleksi, lalu klikModify, klik tanda (+) pada modifier Wave >> Gizmo. lalu klik tombol Select and Rotate.














19. kemudian atur, posisi roatating sayap di menu yang letaknya dibawah menu time slider (saya tidak tau namanya). kemudian atur posisi Y: 180 seperti gambar dibawah:









20. masih di Gizmo sayap kanan, setelah diatur menjadi 180. sekarang, atur posisi X: 180. 













21. Beres.. Kini tinggal di Play. Sama Bukan gerakan Sayapnya?..

Animasi Ekor


21. Baiklah setelah Animasi sayap selesai, sekarang kita membuat Animasi Ekor. cara membuat animasi ekor sama dengan cara membuat sayap. pertama, tambahkan modifier mesh select >> Vertex >> Seleksi Ujung Ekor. 















22. Setelah itu, buka tanda (+) Soft Selection >> Checklist Use Soft Selection >> beri Falloff: 33























23. Kemudian seperti Biasa, kita beri Modifier List Wave, lalu beri Parameter Amplitude 1 = 5 dan Wave Length = 84. dan untuk Phase = 2. (Cat: Jangan lupa, saat diberi Phase, agar mengaktifkan dahulu Auto Key, lalu geser Time slider ke 199/199) 

























24. Kemudian terakhir, sama halnya saat kita memperbaiki animasi sayap kanan ikan pari, kita bukaGizmo pada Modifier Wave. Klik Tool Select And Rotate. lalu putar Sumbu X: 90 dan Sumbu Y: -90


















25. Ok.. Animasi ikan Pari Beres. kini saatnya, tahap Exporting. saya rasa, pasti sudah tau semua cara Export ke Wrl karna sudah saya jelaskan di tutorial dasar. cukup, klik File > Export > Pilih Save as Type VRML97(*.WRL) > Save di folder ARToolkit\Bin\Wrl.. 


26. Sebelum kamu klik Save, , lakukan Setting di VRML97 Exporter seperti gambar dibawah ini, Supaya Animasi Ikan Parinya jalan di ARToolkit.































Sekian.. Tutorial Kali Ini..
Semoga Berhasil, Jika ada Pertanyaan bisa ditanyakan di Komentar Blog Ini.
Read more

Belajar Augmented Reality dengan Objek Beranimasi Hewan Unity3D 4

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 :



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 :


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.


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.


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.


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-launchscene ini ke bentuk aplikasi dan di test pada handphone kalian masing-masing. Kalo lupa, silahkan dilihat caranya pada


Alhamdulillah, selesai belajar bareng kita kali ini. Gimana pada bisa jalan kan semua animasinya?? kalo belum pada jalan, coba deh dibaca ulang mungkin ada step yang kelewatan. Kalo ngga bisa juga silahkan beri tahu saya, mungkin saya ada kekurangan dalam memberikan stepnya hehe. Mudah"an sih semuanya pada bisa jalan :)

Read more

Sabtu, 17 September 2016

Tutorial Membuat Augmented Reality Tulisan Simple Menggunakan UNITY 3D

 Tutorial Membuat Augmented Reality Simple 

Menggunakan UNITY 3D

Selanjutnya saya akan membagikan tutorial membuat augmented reality sederhana. Beberapa bulan yang lalu saya mengangkat teknologi ini pada penulisan skripsi saya, yaitu tentang media pembelajaran interkatif 3D pada salah satu sekolah dasar di Kec. Pamona  Utara, Kab. Poso. Buat teman-teman yang belum tahu apa itu augmented reality pasti bertanya-tanya tentang teknologi ini.

Augmented Reality (biasa disebut : AR ) adalah sebuah teknologi yang menggabungkan antara objek maya 2 dimensi atau 3 dimensi kedalam sebuah lingkungan nyata atau objek nyata (marker) dan memproyeksikannya dalam waktu yang realtime. AR sendiri jika diterjemahkan dalam bahasa indonesia yaitu realitas tertambah. AR sendiri berbeda dengan VR(Virtual Reality) yang mensimulasikan dunia nyata kedalam dunia virtual. AR disini yaitu ‘menggabungkan atau menambahkan’ sedangkan VR yaitu ‘Menggantikan atau mensimulasikan’.
Oke langsung sja....

Pertama kita siapkan alat dan bahan yang kita butuhkan:
   
   1.Unity game engine (versi yang saya gunakan pada tutorial ini yaitu unity versi 5.1.2f1) yang dapat teman-teman download secara gratis di https://unity3d.com. Saya sarankan untuk mengunduh versi 5 keatas, untuk menyesuaikan dengan vuvoria SDK yang sekarang sudah diupdate ke versi 5 juga.
  
   2.Vuforia SDK (versi yang saya gunakan dalam tutorial ini 5.0.5), yaitu merupakan extension Unity besutan qualcomm yang berfungsi untuk mempermudah kita dalam memproses image dari marker untuk dijadikan dunia AR. Dengan Vuforia SDK kita sebagai developer tidak perlu lagi dipusingkan dengan hitunga rumit image processing untuk membuat aplikasi augmented reality. Untuk vuforia SDK sendiri dapat teman-teman download dihttps://developer.vuforia.com/downloads/sdk. pastikan teman-teman mendownload voforia-unity 5.x.x.unitypackage.
  
  3.Marker yang akan kita gunakan sebagai penanda untuk memnculkan objek maya yang nantinya akan disebut sebagai AR. pada tutorial kali ini saya sedikit akan membahas cara membuat database di vuforia yang nantinya akan menampung marker yang akan kita gunakan.
Oke jika semua sudah siap, langsung saja  instal unity game engine-nya. Cara menginstal unity hampir sama dengan menginstal software lainnya, hanya saja disini kita membutuhkan koneksi internet dan juga akun unity. Selengkapnya teman-teman bisa bertanya kepada om google tentang cara iinstal unity game engine, karena saya sedang tidak membahas hal itu pada saat ini. Sebelum kita lanjut ke unity, terlebih dahulu kita akan membuat database di vuforia developer.
Sebelumnya kita harus membuat akun di vuforia developer dihttps://developer.vuforia.com. Cara membuat akun di vuforia dapat teman-teman tanyakan pada om google. Setelah akun kita sudah siap, selanjutnya kita login ke vuforia dengan akun yg sdh kita buat tadi.

Selanjutnya pembuatan DB 

1.   Terlebih dahulu kita membuat license yang nantinya akan kta pakai untuk membuat AR di      unity. Pilih tab develop->License Manager->add License key










    2.   Selanjutnya isikan nama aplikasinya dan setting seperti gambar di bawah ini, lalu tekan next.

   3.   Centang seperti dibawah ini, lalu tekan confirm.


  4.   Kita telah berhasil membuat license key seperti terlihat pada gambar dibawah ini. Klik nama license-nya  untuk melihat license key-nya.

   5.   Selanjutnya kita akan membuat DB Vuforia. Klik menu target manager->
Add database, lalu akan muncul form seperti gambar di bawah ini. Isikan nama Dbnya, lalu pilih tipe device, dan tekan create.

  
   6.  Jika berhasil, kini kita telah mempunyai DB di vuforia. Klik DB yang telah kita buat tdi, lalu klik add target, dan akan muncul form seperti di bawah ini. Pilih tipe single target, lalu klik browse untuk memasukkan gambar yang akan kita gunakan sebagai marker (cat: plih gambar yg mempunyai tekstur dan pola yg baik. warna pada gambar tdk mempengaruhi rating marker, krna sistem ini membedakan pola bukan warna). Setelah itu, masukkan ukuran pada kolom width, lalu tekan add.

  7. Selanjutnya kita telah mempunyai sebuah marker dalam database yg kita buat tdi (cat: semakin tinggi rating markernya maka smakin baik). Kita akan mendownload kembali marker yg telah kita upload tdi ke unity. Caranya centang marker lalu klik tombol download dataset. Akan muncul form baru, lalu kita pilih unity editor dan tekan tombol download. Setelah selesai kita download kita akan masuk ke unity.

  
   8.    Buka program unity anda. Buat project baru dan akan muncul uniity editor. Selanjutnya klik kanan pd folder assets->import package->custom package. Pilih vuforia unity SDK (versi 5 keatas) yang telah teman-teman download tadi. Lalu klik import. Jika berhasil, di kolom project di folder assets akan bertambah beberapa folder tampak seperti di bawah ini.

 9.Selanjutnya hapus main camera pada kolom hirarchy. Setelah itu klik folder assetsàvuforiaàprefabs lalu drag drop AR camera dan image target di kolom hirarchy.

  10. Import marker yg telah kita download tdi, caranya double klik pada file marker yg kita download dri DB vuforia tdi, maka otomatis akan ter-Import ke unity. Setelah itu Copy license key yg telah kita buat tadi di vuforia lalu paste-kan di kolom app license key pada jendela inspector. Lalu setting AR camera seperti di bawah ini.


  11. Setelah itu setting image target sperti gambar.

  12. Kita akan memasukkan objek 3D yang akan ditampilkan sebagai AR. caranya drag dan drop objek 3D di folder assets lalu dari folder assets drag drop lg ke kolom hirarki. Sehingga akan tampak seperti ini.

  13. Setelah kita memasukkan semuanya, tekan tombol run pada unity..lalu arahkan marker ke kamera web cam...

  14. Dan hasilnya, taraaaaa...




Read more