Sebelumnya terima kasih untuk PT Kusuma Megah dan Perfetti Indonesia yang telah mempercayakan development aplikasinya ke saya..
Proyek ini dimulai sekitar Maret 2018. Pada awalnya saya dihubungi oleh mbak Grace (rekan di Animator Forum duluuu sekali saat saya masih berprofesi jadi animator) lama sebelumnya sekitar Maret 2017 untuk mendemokan aplikasi menggunakan AR. Lama tidak terdengar kabar lalu saya kembali dihubungi oleh mbak Grace untuk kemungkinan membuat aplikasi AR untuk permen Big Babol.
Setelah meeting awal, saya membuat demo sederhana menggunakan bungkus permen Big Babol dan hasilnya adalah bungkus permen Big Babol hanya mungkin dipergunakan sebagai obyek scan. Awalnya pihak Perfetti meminta agar aplikasi ini bisa menggunakan bungkus permen Big Babol sebagai marker AR dan bisa membaca beberapa marker sekaligus.
Tapi ini tidak mungkin...pertama bungkus permen Big Babol itu terlalu kecil dan kedua bahannya glossy. Yang ada program AR sering kesulitan membaca marker tersebut karena kecil dan mengkilat sehingga point marker tidak terbaca kamera karena pantulan cahaya.
Okelah disepakati bahwa bungkus permen hanya sebagai obyek scan untuk memunculkan karakter AR.
Gamenya tentang apa?
Sederhana sih, dua robot pukul pukulan di satu layar dan satu device...
Saya menawarkan bagaimana jika dua device dan link dengan BlueTooth atau Wifi? Juga kontrol pukul pukulan yang lebih kompleks seperti combo dan sebagainya. tapi pihak Perfetti bilang cukup pukul pukulan dengan satu tombol kanan dan kiri, dua orang dalam satu device.
Ok siap!
Dimulai dengan saya mendesain robot robot sebagai karakter fighter di game ini.
Style robotnya saya ambil dari style gundam versi versi awal yang lebih blocky. Saya ambil style itu karena ini buat mobile game yang Android 4.4 bisa jalan lancar. Harapannya tidak banyak makan jumlah polygon.. Rata rata jumlah poly sekitar 1200-1400poly per robot. Animasi menggunakan bones supaya lebih efisien dalam penggunaan cpu dan masing masing karakter cukup 1 texture dengan 1 UV untuk meminimalisir drawcall.
Supaya development lebih streamline, begitu modeling awal selesai, langsung saya rig dan saya serahkan ke rekan animator Xave Enrico.. Kebetulan masbro Xave doyan banget maen game gebuk gebukan jadi pas banget saya percayakan animasi ke masbro Xave.. Hehe
Sementara menunggu animasi kelar, saya membuat coding untuk UI, scan logic dan fight logic.
Pihak Perfetti ingin ada robot ke 7 yang baru akan tampil bila pengguna scan ke 6 bungkus permen BigBabol sekaligus dalam 1 sesi. Jadi ada mode scan khusus yang dibedakan dengan scan permen biasa.
Tidak ada yang istimewa sih di coding, soalnya semua masih biasa saja...hanya if, else, StartCoroutine, InvokeRepeating, Instantiate dsb dst dll..... Nah yang ribet adalah disaat pihak Perfetti ingin menambahkan kode unik Alfamart kedalam aplikasi berupa algoritme. Sebenarnya diluar kesepakatan awal tapi ya sudahlah saya orangnya baik hati dan tidak sombong jadi saya sanggupi #lebay
Agak nyesal juga sih, karena ternyata susah banget buat saya...hahaha...
Pengen saya tulis disini tapi gak bisa karena confidential...tapi intinya berupa sebuah fungsi yang builtin di bahasa PHP....gampang banget mengaplikasikan di bahasa PHP.... Yang susah adalah convert fungsi bahasa PHP itu ke bahasa C# karena game engine Unity pakai C#...mau nangis rasanya...huhuhu...
Tapi akhirnya happy ending karena saya menemukan pembahasan itu di forum stackoverflow.com...😁
Setelah semua bagian kelar, barulah saya menambahkan semua komponen yang dibutuhkan agar menjadi satu game utuh.
Total ada 6 scenes di aplikasi Big Babol. Aslinya ada 5 scenes tapi akhirnya saya berkeputusan untuk memecah 1 scene menjadi 2 scene tersendiri.
Scene yang saya pecah itu ada di bagian Show Mode, dimana aslinya hanya satu scene utuh antara scan bungkus dan menampilkan robot. Dengan satu scene maka hasil scan akan cepat muncul. Tapi cara ini ada dua kelemahan, satu membuat smartphone menjadi sangat panas karena kamera dan cpu aktif terus dan juga membuat animasi agak patah patah. Saya sudah berusaha me non aktifkan Vuforia tapi entah kenapa kalau di non aktifkan maka sesi berikutnya gak mau aktif lagi. Kalau hanya di pause tetap saja gak ngaruh. Lalu kedua entah kenapa Canvas jadi ngaco tampilannya. Ada yang berjalan baik di beberapa smartphone tapi di smartphone lain Canvas nya hilang. Ya sudah akhirnya scene saya pecah...hasilnya memang gak bisa instant muncul robotnya setelah scan tapi tidak menimbulkan masalah diatas.
Untuk texturing tidak menarik dibahas karena biasa saja. Shader pakai mobile shader supaya cepat dan efisien.
Pihak Perfetti ingin supaya aplikasi bisa menampilkan notifikasi. Untungnya ada OneSignal yang free dan selalu update...kalau enggak saya pasti pusing lagi...haha
Untuk deployment ke Android seperti umumnya tidak bermasalah, tapi deployment ke iOS ternyata bermasalah.
Masalahnya adalah di Vuforia yang blank camera untuk iPhone 8 keatas. Saya tidak menyangka karena di device bawahnya tidak apa apa walau memakai iOS terbaru 11.4.1 dan bugs ini hanya kena iPhone 8 keatas...kalau keterangan resmi Vuforia karena bentrok dengan ARKit Apple. Apapun itu akhirnya saya harus upgrade semua, mulai dari Unity, Vuforia hingga XCode karena semua berhubungan. Yang paling nyebelin adalah beberapa script jadi gak jalan...hadeeh...bongkar maning...
Secara keseluruhan proyek ini menyenangkan buat saya karena saya hobi banget sama robot....😁
Software yang digunakan:
Unity2017.4.3 - upgraded to Unity2018.2 khusus untuk iOS
Vuforia 6 - upgraded to Vuforia 7 khusus iOS
Lightwave3D 2015
Link download :
Link Android
Link iOS
Proyek ini dimulai sekitar Maret 2018. Pada awalnya saya dihubungi oleh mbak Grace (rekan di Animator Forum duluuu sekali saat saya masih berprofesi jadi animator) lama sebelumnya sekitar Maret 2017 untuk mendemokan aplikasi menggunakan AR. Lama tidak terdengar kabar lalu saya kembali dihubungi oleh mbak Grace untuk kemungkinan membuat aplikasi AR untuk permen Big Babol.
Setelah meeting awal, saya membuat demo sederhana menggunakan bungkus permen Big Babol dan hasilnya adalah bungkus permen Big Babol hanya mungkin dipergunakan sebagai obyek scan. Awalnya pihak Perfetti meminta agar aplikasi ini bisa menggunakan bungkus permen Big Babol sebagai marker AR dan bisa membaca beberapa marker sekaligus.
Tapi ini tidak mungkin...pertama bungkus permen Big Babol itu terlalu kecil dan kedua bahannya glossy. Yang ada program AR sering kesulitan membaca marker tersebut karena kecil dan mengkilat sehingga point marker tidak terbaca kamera karena pantulan cahaya.
Okelah disepakati bahwa bungkus permen hanya sebagai obyek scan untuk memunculkan karakter AR.
Gamenya tentang apa?
Sederhana sih, dua robot pukul pukulan di satu layar dan satu device...
Saya menawarkan bagaimana jika dua device dan link dengan BlueTooth atau Wifi? Juga kontrol pukul pukulan yang lebih kompleks seperti combo dan sebagainya. tapi pihak Perfetti bilang cukup pukul pukulan dengan satu tombol kanan dan kiri, dua orang dalam satu device.
Ok siap!
Dimulai dengan saya mendesain robot robot sebagai karakter fighter di game ini.
 |
| Desain awal |
Style robotnya saya ambil dari style gundam versi versi awal yang lebih blocky. Saya ambil style itu karena ini buat mobile game yang Android 4.4 bisa jalan lancar. Harapannya tidak banyak makan jumlah polygon.. Rata rata jumlah poly sekitar 1200-1400poly per robot. Animasi menggunakan bones supaya lebih efisien dalam penggunaan cpu dan masing masing karakter cukup 1 texture dengan 1 UV untuk meminimalisir drawcall.
 |
| Hasil akhir |
Supaya development lebih streamline, begitu modeling awal selesai, langsung saya rig dan saya serahkan ke rekan animator Xave Enrico.. Kebetulan masbro Xave doyan banget maen game gebuk gebukan jadi pas banget saya percayakan animasi ke masbro Xave.. Hehe
Sementara menunggu animasi kelar, saya membuat coding untuk UI, scan logic dan fight logic.
Pihak Perfetti ingin ada robot ke 7 yang baru akan tampil bila pengguna scan ke 6 bungkus permen BigBabol sekaligus dalam 1 sesi. Jadi ada mode scan khusus yang dibedakan dengan scan permen biasa.
Tidak ada yang istimewa sih di coding, soalnya semua masih biasa saja...hanya if, else, StartCoroutine, InvokeRepeating, Instantiate dsb dst dll..... Nah yang ribet adalah disaat pihak Perfetti ingin menambahkan kode unik Alfamart kedalam aplikasi berupa algoritme. Sebenarnya diluar kesepakatan awal tapi ya sudahlah saya orangnya baik hati dan tidak sombong jadi saya sanggupi #lebay
Agak nyesal juga sih, karena ternyata susah banget buat saya...hahaha...
Pengen saya tulis disini tapi gak bisa karena confidential...tapi intinya berupa sebuah fungsi yang builtin di bahasa PHP....gampang banget mengaplikasikan di bahasa PHP.... Yang susah adalah convert fungsi bahasa PHP itu ke bahasa C# karena game engine Unity pakai C#...mau nangis rasanya...huhuhu...
Tapi akhirnya happy ending karena saya menemukan pembahasan itu di forum stackoverflow.com...😁
Setelah semua bagian kelar, barulah saya menambahkan semua komponen yang dibutuhkan agar menjadi satu game utuh.
Total ada 6 scenes di aplikasi Big Babol. Aslinya ada 5 scenes tapi akhirnya saya berkeputusan untuk memecah 1 scene menjadi 2 scene tersendiri.
Scene yang saya pecah itu ada di bagian Show Mode, dimana aslinya hanya satu scene utuh antara scan bungkus dan menampilkan robot. Dengan satu scene maka hasil scan akan cepat muncul. Tapi cara ini ada dua kelemahan, satu membuat smartphone menjadi sangat panas karena kamera dan cpu aktif terus dan juga membuat animasi agak patah patah. Saya sudah berusaha me non aktifkan Vuforia tapi entah kenapa kalau di non aktifkan maka sesi berikutnya gak mau aktif lagi. Kalau hanya di pause tetap saja gak ngaruh. Lalu kedua entah kenapa Canvas jadi ngaco tampilannya. Ada yang berjalan baik di beberapa smartphone tapi di smartphone lain Canvas nya hilang. Ya sudah akhirnya scene saya pecah...hasilnya memang gak bisa instant muncul robotnya setelah scan tapi tidak menimbulkan masalah diatas.
Untuk texturing tidak menarik dibahas karena biasa saja. Shader pakai mobile shader supaya cepat dan efisien.
Pihak Perfetti ingin supaya aplikasi bisa menampilkan notifikasi. Untungnya ada OneSignal yang free dan selalu update...kalau enggak saya pasti pusing lagi...haha
Untuk deployment ke Android seperti umumnya tidak bermasalah, tapi deployment ke iOS ternyata bermasalah.
Masalahnya adalah di Vuforia yang blank camera untuk iPhone 8 keatas. Saya tidak menyangka karena di device bawahnya tidak apa apa walau memakai iOS terbaru 11.4.1 dan bugs ini hanya kena iPhone 8 keatas...kalau keterangan resmi Vuforia karena bentrok dengan ARKit Apple. Apapun itu akhirnya saya harus upgrade semua, mulai dari Unity, Vuforia hingga XCode karena semua berhubungan. Yang paling nyebelin adalah beberapa script jadi gak jalan...hadeeh...bongkar maning...
Secara keseluruhan proyek ini menyenangkan buat saya karena saya hobi banget sama robot....😁
Software yang digunakan:
Unity2017.4.3 - upgraded to Unity2018.2 khusus untuk iOS
Vuforia 6 - upgraded to Vuforia 7 khusus iOS
Lightwave3D 2015
Link download :
Link Android
Link iOS
Comments
Post a Comment