Perancangan Antarmuka Visual Pada Aplikasi Augmented Reality Untuk Informasi Nilai Gizi Minuman

Melati Rosanensi; I Nyoman Yoga Sumadewa; Widia Febriana

doi:10.69693/ijim.v4i3.2024

Authors

Melati Rosanensi Universitas Bumigora
I Nyoman Yoga Sumadewa Universitas Bumigora
Widia Febriana Universitas Bumigora

DOI:

https://doi.org/10.69693/ijim.v4i3.2024

Keywords:

augmented reality, antarmuka visual, UI/UX, hierarki informasi, nilai gizi

Abstract

Augmented reality (AR) banyak dimanfaatkan sebagai media informasi kesehatan, termasuk untuk menyampaikan nilai gizi minuman kemasan kepada penderita diabetes. Namun, penelitian-penelitian sejenis umumnya menitikberatkan pada aspek teknis pembangunan aplikasi AR seperti pembuatan marker, integrasi Vuforia, dan proses assembly pada Unity, sedangkan aspek perancangan antarmuka visual yang menentukan apakah informasi gizi benar-benar dapat dipahami secara cepat dan tepat oleh pengguna belum dibahas secara mendalam. Artikel ini bertujuan mengkaji ulang perancangan antarmuka visual pada sebuah aplikasi AR informasi nilai gizi minuman dari sudut pandang ilmu desain antarmuka (UI/UX) dan Human-Computer Interaction (HCI), bukan dari sudut pandang pengembangan teknis AR. Metode yang digunakan adalah deskriptif kualitatif dengan memanfaatkan tahap Design pada Multimedia Development Life Cycle (MDLC) sebagai kerangka kerja, difokuskan pada elemen tata letak, tipografi, warna, ikon, struktur navigasi, hierarki informasi, konsistensi visual, keterbacaan, dan interaksi pengguna. Hasil kajian menunjukkan bahwa antarmuka pada menu utama, menu pemindaian AR, dan empat menu informasi bahaya zat gizi memiliki pola tata letak simetris dan grid sederhana, namun konsistensi tipografi, kontras warna, serta hierarki visual antarhalaman masih dapat dioptimalkan berdasarkan prinsip desain komunikasi visual dan sepuluh heuristik Nielsen. Pembahasan juga menghubungkan data pengujian beta pengguna dengan aspek keterbacaan dan interaksi untuk memperkuat argumen perancangan. Artikel ini menyimpulkan bahwa kualitas penyampaian informasi kesehatan melalui AR sangat bergantung pada perancangan visual yang sistematis, bukan semata pada teknologi penampil objek tiga dimensi maupun dua dimensinya, sehingga perancangan antarmuka visual perlu diperlakukan sebagai domain kajian tersendiri yang setara pentingnya dengan pengembangan sistem AR itu sendiri.

Downloads

Download data is not yet available.

References

Aprilia, G. N., & Dasaprawira, M. N. (2023). Perancangan UI/UX aplikasi E-Rapor pada TPQ berbasis Android menggunakan metode User Centered Design (UCD). Indexia, 5(1), 48. https://doi.org/10.30587/indexia.v5i01.5496

Ashiddiq, M. N. (2024). Perancangan UI/UX Learning Management System (LMS) aplikasi mobile Edu-Learn menggunakan metode Design Thinking. Jurnal Informatika dan Teknik Elektro Terapan, 12(1). https://doi.org/10.23960/jitet.v12i1.3693

Barus, R. C., Utomo, S. R. H., & Darmawan, A. J. (2025). Optimalisasi pemilihan typeface untuk keterbacaan pada perangkat digital. Ardvis: Artistik Riset Desain, Komunikasi Visual, Inovasi dan Seni, 1(1), 40–50.

Cahyani, A., Hakam, F., & Nurbaya, F. (2020). Evaluasi penerapan sistem informasi manajemen puskesmas (SIMPUS) dengan metode HOT-FIT di Puskesmas Gatak. Jurnal Manajemen Informasi dan Administrasi Kesehatan (JMIAK), 3(2), 20–26.

Chantika, R., Husania, P. M., Dini, T. S. R., Sitorus, S. R., Alhirani, P. S., & Gibran, M. K. (2025). Dampak warna dan tipografi terhadap kenyamanan pengguna dalam desain antarmuka digital. Jurnal Publikasi Ilmu Komputer dan Multimedia, 4(2), 102–110. https://doi.org/10.55606/jupikom.v4i2.4073

Ependi, U. (2017). Heuristic evaluation for mobile application (Studi kasus: Aplikasi Depo Auto 2000 Tanjung Api Api Palembang). Simetris: Jurnal Teknik Mesin, Elektro dan Ilmu Komputer, 8(2), 563–570.

Fauzan, & Ati, S. (2018). Analisis pemanfaatan aplikasi iPusnas berbasis Android di Perpustakaan Nasional Republik Indonesia. Jurnal Ilmu Perpustakaan, 7(4), 11–20.

Herawan, A. R., Rokhmawati, R. I., & Akbar, M. A. (2023). Analisis dan perancangan ulang desain UI & UX pada aplikasi iPusnas dengan penerapan elemen gamifikasi. Jurnal Pengembangan Teknologi Informasi dan Ilmu Komputer, 7(6), 2767–2776.

Hidayat, T., & Rahmawati, I. (2014). Desain dan implementasi teknologi augmented reality sebagai media edukasi kesehatan anak. Prosiding Seminar Nasional Teknologi Informasi dan Multimedia, Yogyakarta.

Kementerian Kesehatan RI. (2018). Laporan Riset Kesehatan Dasar (Riskesdas) 2018. Kemenkes RI.

Kholik, A., Soegiarto, A., & Sari, W. P. (2024). Strategi komunikasi visual dalam User Interface (UI) dan User Experience (UX) untuk membangun kepuasan pengguna. TUTURAN: Jurnal Ilmu Komunikasi, Sosial dan Humaniora, 2(4), 335–344. https://doi.org/10.47861/tuturan.v2i4.1358

Lidwell, W., Holden, K., & Butler, J. (2010). Universal principles of design. Rockport Publishers.

Muhyidin, M. A., Sulhan, M. A., & Sevtiana, A. (2020). Perancangan UI/UX aplikasi My CIC layanan informasi akademik mahasiswa menggunakan aplikasi Figma. Jurnal Digit: Digital of Information Technology, 10(2), 208–219.

Nielsen, J. (1994). Usability engineering. Morgan Kaufmann.

Norman, D. A. (2013). The design of everyday things (Rev. ed.). Basic Books.

Novianto, A. R., & Rani, S. (2022). Pengembangan desain UI/UX aplikasi Learning Management System dengan pendekatan User Centered Design. Jurnal Sains, Nalar, dan Aplikasi Teknologi Informasi, 2(1). https://doi.org/10.20885/snati.v2i1.16

Pangkey, M. E. M., Najoan, X. B. N., & Paturusi, S. D. E. (2024). Perancangan UI/UX website UPT Bahasa menggunakan Heuristic Evaluation dan User-Centered Design. Jurnal Teknik Informatika, 19(2), 161–172.

Prasetya, D. A., Widyaningtias, G. R., Permadani, T. W. I., & Adam, M. (2025). Analisis perbandingan pengalaman pengguna pada mode gelap dan mode terang pada aplikasi WhatsApp dengan metode UEQ. Prosiding SEMNAS INOTEK, 9(2), 1240–1249. https://doi.org/10.36040/inotek.v9i2.7552

Rachman, A., Saputra, Y. A. D., Hafidz, M., Sugiman, Z. A. I., & Sahria, Y. (2024). Perancangan UI/UX aplikasi integrasi teknologi finansial "FiHub" menggunakan metode User-Centered Design. Jurnal Informatika dan Teknik Elektro Terapan, 12(1). https://doi.org/10.23960/jitet.v12i1.3884

Rahayu, W. D. P., Hendriadi, A. A., & Ridwan, T. (2024). Perancangan UI UX aplikasi website sistem informasi menggunakan metode User Centered Design (Studi Kasus Desa Losari Kidul). Jurnal Informatika dan Teknik Elektro Terapan, 12(3). https://doi.org/10.23960/jitet.v12i3.4994

Rahmadani, N., & Fardida, S. N. (2024). Peran UI/UX pada layanan aplikasi MyTelkomsel terhadap keputusan pembelian dan loyalitas pelanggan. SAFARI: Jurnal Pengabdian Masyarakat Indonesia, 4(3), 220–227. https://doi.org/10.56910/safari.v4i3.1655

Ramadhan, C., Fitrian, H. P., & Rusghana, F. (2025). Perancangan antarmuka penggunaan (UI/UX) pada aplikasi rapor siswa TK Al-Husna. Jurnal Informatika dan Teknik Elektro Terapan, 13(3S1). https://doi.org/10.23960/jitet.v13i3S1.7515

Rosiana, P. S., Voutama, A., & Ridha, A. A. (2023). Perancangan UI/UX sistem informasi pembelian hasil tani berbasis mobile dengan metode Design Thinking. Jurnal Informatika dan Teknik Elektro Terapan, 11(3), 246–253. https://doi.org/10.23960/jitet.v11i3.3048

Santoso, M. F. (2022). Implementasi konsep dan teknik UI/UX dalam rancang bangun layout web dengan Figma. Jurnal Infortech, 4(2), 156–163.

Setiawan, B., & Triase, T. (2023). Implementasi desain UI/UX aplikasi Ourticle ke dalam aplikasi berbasis Android. SIBATIK Journal: Jurnal Ilmiah Bidang Sosial, Ekonomi, Budaya, Teknologi, dan Pendidikan, 2(3), 805–818. https://doi.org/10.54443/sibatik.v2i3.665

Shneiderman, B., Plaisant, C., Cohen, M., Jacobs, S., Elmqvist, N., & Diakopoulos, N. (2016). Designing the user interface: Strategies for effective human-computer interaction (6th ed.). Pearson.

Susilo, E., Wijaya, F. D., & Hartanto, R. (2018). Perancangan dan evaluasi user interface aplikasi smart grid berbasis mobile application. Jurnal Nasional Teknik Elektro dan Teknologi Informasi (JNTETI), 7(2), 150–157. https://doi.org/10.22146/jnteti.v7i2.416

Todorov, T., & Dochkova-Todorova, J. (2023). Accessible UX/UI design. In 2023 International Conference Automatics and Informatics (ICAI) (pp. 362–366). IEEE.

World Health Organization. (2016). Global report on diabetes. WHO.