Perancangan dan Implementasi Aplikasi Virtual Try-On Pakaian dengan Fitur Unggah Model 3D Berbasis Web Menggunakan React dan Three.js

Irfan Septian; Hani Dewi Ariessanti; Agus Herwanto; Ratna Yulika Go

doi:10.54065/artificial.1142

Authors

Irfan Septian Universitas Esa Unggul
Hani Dewi Ariessanti Universitas Esa Unggul
Agus Herwanto Universitas Esa Unggul
Ratna Yulika Go Universitas Esa Unggul

DOI:

https://doi.org/10.54065/artificial.1142

Keywords:

Virtual Try-On, Visualisasi 3D, React.js, Three.js, E-commerce, Cloudinary, Firebase

Abstract

E-commerce telah berkembang pesat, dengan visualisasi produk dan kecerdasan buatan (AI) menjadi faktor kunci dalam meningkatkan pengalaman pengguna dan membantu pengambilan keputusan pembelian. Penelitian ini bertujuan merancang dan mengembangkan aplikasi web Virtual Try-On untuk produk busana, di mana pengguna dapat melihat pakaian dalam bentuk model 3D interaktif serta memanfaatkan fitur chatbot AI untuk rekomendasi fashion. Aplikasi dibangun menggunakan framework React.js di sisi frontend dan Three.js untuk merender model 3D pakaian yang dapat diunggah (upload) ke sistem. Fitur 3D memungkinkan pengguna memutar, memperbesar, dan melihat pakaian dari berbagai sudut seolah-olah mencobanya secara virtual, memberikan gambaran yang lebih nyata dibanding foto 2D. Selain itu, diintegrasikan AI “Gemini” sebagai virtual stylist – berupa chatbot interaktif yang dapat menjawab pertanyaan seputar produk dan memberikan saran outfit personal. Metodologi penelitian meliputi analisis kebutuhan, perancangan UI/UX, implementasi sistem, serta pengujian fungsional (black-box) dan uji coba pengguna. Hasil implementasi menunjukkan platform e- commerce dengan fitur try-on 3D dan chatbot AI dapat berjalan dengan baik. Pengguna dapat berinteraksi dengan model 3D secara lancar dan mendapatkan rekomendasi fashion secara real-time. Fitur-fitur ini terbukti meningkatkan pemahaman pengguna teqrhadap produk sekaligus memberikan dukungan keputusan yang lebih akurat melalui teknologi AI. Pengujian menunjukkan seluruh fungsionalitas utama sudah sesuai kebutuhan, dan umpan balik pengguna awal mengindikasikan pengalaman belanja yang lebih interaktif, informatif, dan percaya diri dengan adanya visualisasi 3D dan asisten virtual.

References

Basuki, R. R., & Setiawan, A. A. (2025). Pengaruh Teknologi Virtualisasi Produk Secara Hedonis Dalam Belanja Pakaian Online: The Hedonic Influence Of Product Virtualization Technology On Online Clothing Shopping. Economic And Education Journal (Ecoducation), 7(1), 176-185. Https://Doi.Org/10.33503/Ecoducation.V7i1.1367

Almasyariqi, M. R., Rani, S., & Suranto, B. (2018, August). Rancang Bangun Aplikasi Berbasis Augmented Reality Untuk Virtual Fitting Room Frame Kacamata. In Seminar Nasional Aplikasi Teknologi Informasi (Snati).

Firmanda, A., Adam, C., & Cahyono, Y. R. N. (2024). Virtual Try-On Batik Berbasis Augmented Intelligence: Tantangan Dan Peluang Implementasi Dalam Pemasaran Digital. Journal Of Applied Multimedia And Networking, 8(1), 78-84. Https://Doi.Org/10.30871/Jamn.V8i1.8193

Hartono, R. W. T., Fauziah, A. W., Fadhlan, M. Y., Adiyatma, A., & Tarigan, J. P. (2024). Perancangan dan Implementasi Aplikasi IoT untuk Fitting Baju Virtual menggunakan Pengolahan Citra. Prosiding IRWNS, 11(1), 2064. https://doi.org/10.35313/irwns.v11i1.2064

Kasuma, T. S., & Oktarina, R. (2024). Pengaruh Pemanfaatan Fitur Virtual Try-On Berbasis Augmented Reality Pada Aplikasi Tiktok Dalam Pemilihan Produk Cushion Oleh Mahasiswa Di Fakultas Pariwisata Dan Perhotelan Universitas Negeri Padang. Jurnal Kajian Dan Penelitian Umum, 2(5), 87-98. Https://Doi.Org/10.47861/Jkpu-Nalanda.V2i5.1305

Kristiwi, K. A., Nirwana, A., & Prasetya, B. P. P. (2025). Perancangan Desain User Interface Aplikasi Mobile “Tintropic” Sebagai Panduan Personal Color Dan Pemilihan Warna Kosmetik. Sainsbertek Jurnal Ilmiah Sains & Teknologi, 6(1), 42-61. Https://Doi.Org/10.33479/Sb.V6i1.386

Nugroho, F., & Anggara, A. (2024). Aplikasi E-Commerce Dengan Pemanfaatan Teknologi Augmented Reality Sebagai Gambaran Wujud Secara Nyata. Jurnal Informatika Teknologi Dan Sains (Jinteks), 6(4), 1007-1016. Https://Doi.Org/10.51401/Jinteks.V6i4.4919

Purba, A. A. E., & Nasution, M. I. P. (2025). Business Intelligence Dalam Era Ekonomi Digital: Kajian Sistematis Atas Strategi Dan Implementasi. Journal Artificial: Informatika Dan Sistem Informasi, 3(2), 161–171. Https://Doi.Org/10.54065/Artificial.753

Putro, P. W., Aditia, M. Y., & Sujianto, A. E. (2023). Teknologi Augmented Reality Sebagai Strategi Pemasaran Syariah Di Era Digitalisasi. Jurnal Studi Manajemen Dan Bisnis, 10(1), 19-31. Https://Doi.Org/10.21107/Jsmb.V10i1.20442

Rashmi, R., & Seranmadevi, R. (2025). Study On Impact Of Future Trends Of E-Commerce. International Journal For Multidisciplinary Research, 7(2). Https://Doi.Org/10.36948/Ijfmr.2025.V07i02.38655

Rizkyanzah, A. D. T., Hartanto, P., Rakhmadani, D. P., Lishobrina, L. F., & Hidayat, C. M. (2024, December). A New Paradigm For Consumer Retention In The Beauty Industry: Insights From Augmented Reality. In International Conference On Digital Business Innovation And Technology Management (Iconbit) 1(1).

Rusdhin, N., Rosmiati, R., & Nirsal, N. (2025). Rancang Bangun Aplikasi Penjualan Baju Pada Mia Fashion Berbasis Website. Journal Artificial: Informatika Dan Sistem Informasi, 3(1), 34–45. Https://Doi.Org/10.54065/Artificial.577

Setiawan, A. D., & Novelan, M. S. (2025). Sistem E-Commerce Berbasis Website Dengan Integrasi Augmented Reality (Ar) Pada Butik Gpm Collection. Journal Of Science And Social Research, 8(1), 757-764. Https://Doi.Org/10.54314/Jssr.V8i1.2765

Safina, Z., Ali, M., & Fitri, D. (2024). Analisis Gaya Komunikasi Penjual Pada Akun Tiktok@ Grosirshop_Stufff. Cendekia: Jurnal Hukum, Sosial Dan Humaniora, 2(4), 840-849. Https://Doi.Org/10.70193/Cendekia.V2i4.135

Sellerscommerce. (2025). Ai In E-Commerce Statistics (2025). (Laporan Statistik Adopsi Ai Di E- Commerce: 80% Bisnis Gunakan Chatbot)

Shopify. (2023). The Thrilling Evolution: 3d Ecommerce And A New Era Of Retail. (Laporan Shopify: Merchant Dengan 3d Commerce Naik Konversi Hingga 94%)

Takaria, Z. Y., & Tjokrosaputro, M. (2024). Pengaruh Penggunaan Dan Respons Chatbot Terhadap Kepuasan Konsumen E-Commerce. Jurnal Ekonomi, 29(3), 446-468. Https://Doi.Org/10.24912/Je.V29i3.2322

Viohafeni, Z. D., & Aliyah, K. N. (2023). Pengaruh Fitur Virtual Try-On, Online Customer Review, Dan Persepsi Harga Terhadap Keputusan Pembelian Kosmetik Pada Aplikasi Shopee. Journal Of Economics And Business Research (Juebir), 2(2), 214-226. Https://Doi.Org/10.22515/Juebir.V2i2.7916

Winata, N. W., Setiawan, A., & Nugraha, F. (2025). Gamifikasi Dan Virtual Try-On Di Sistem Penjualan Branded Murah Kudus Untuk Meningkatkan Pengalaman Konsumen. Jekin-Jurnal Teknik Informatika, 5(1), 339-350. Https://Doi.Org/10.58794/Jekin.V5i1.1302

Wuryandari, A., & Retnowati, N. (2023). Virtual Fitting Room Sepatu Lurik Berbasis Augmented Reality. Journal Of Information System Management (Joism), 5(1), 102-107. Https://Doi.Org/10.24076/Joism.2023v5i1.1156

Wehalo, A. G., & Puspita, V. (2025). Pengaruh Sosial Media Visual Search, Virtual Technology Dan Gamification Terhadap Minat Beli. Multiplier: Jurnal Magister Manajemen, 6(2), 991-1013. Https://Doi.Org/10.24905/Mlt.V6i2.129

Yanti, R., Susilawati, F. E., & Akramunnisa, A. (2024). Rancang Bangun Aplikasi Penjualan Berbasis Website pada Toko MD Komputer Palopo. Journal Artificial: Informatika Dan Sistem Informasi, 2(2), 147–160. https://doi.org/10.54065/artificial.552