Pada kali ini saya akan berbagi bagaimana aplikasi Augmented Reality (AR) berbasis web untuk mendukung acara wisuda BINUS dibuat. Sebelumnya oleh M.Aziz mengenai bagaimana dia membuat 3D model untuk dapat digunakan pada aplikasi AR.

Dengan semakin canggihnya teknologi web browser, kita dapat membangun aplikasi berbasis web yang sebelumnya tidak dimungkinkan. Ide untuk membangun AR berbasis web akan menambahkan kemudahan bagi pengguna akhir karena tidak perlu lagi melakukan instalasi app khusus pada perangkat mobile ataupun desktop (yang berujung pada banyaknya app yang tidak berguna). Pengguna hanya cukup mengunjungi laman web melalui URL, menunggu web termuat, dan voila sudah dapat pengalaman AR.

Teknologi web AR yang digunakan adalah menggunakan pustaka dari 8thwall. Kita cukup membangun halaman web seperti biasa dengan sintaks HTML, CSS, dan pada Javascript-nya perlu melakukan pemanggilan fungsi-fungsi khusus dari library 8thwall. Untuk melakukan publikasi laman web agar dapat diakses umum memerlukan lisensi dari 8thwall. Tapi kalau hanya ingin mencoba untuk development, ini gratis.

AR buku wisuda

Pada project ini, kami menggunakan buku wisuda sebagai marker, dimana tiap gambar gedung akan menampilkan informasi berupa visualisasi 3D dari gedung tersebut, juga informasi tambahan seperti kapan didirikan dan lainnya. Pada saat itu jumlah maksimal marker yang bisa ditangani perhalaman web oleh 8thwall adalah sebanyak lima marker, sehingga web harus dibuat menjadi 2 halaman.

Untuk format 3D model yang digunakan adalah harus menggunakan gLTF. Format ini dikembangkan oleh Facebook dan selanjutnya mulai digunakan sebagai standar pada beberapa library 3D rendering. Format ini menggabungkan model, tekstur, dan animasi menjadi compact. Terkadang disebut sebagai versi JPG dari 3D format.

Sedangkan untuk pemrograman Javascript selain menggunakan library dari 8thwall, juga dipergunakan library seperti three.js untuk dapat memanipulasi objek 3D. Pada project ini untuk mengatur posisi dan juga rotasi secara otomatis dari tiap object 3D yang tampil.

Demikian sedikit berbagi pengalaman dari perspektif teknis pembangunan AR berbasis web untuk keperluan wisuda BINUS, semoga menginspirasi.