PELATIHAN DISAIN UI DAN UX MENGGUNAKAN APLIKASI FIGMA DALAM MEMBUAT WEBSITE

https://doi.org/10.23960/ela.v4i2.1611
Published: Sep 27, 2025

Abstract:

This community service activity aims to design the UI/UX of the Tanjung Lago Village Website, South Sumatra, to support the development of a digital-based village information system. The main problems faced by the village include limited online information media, unstructured documentation of activities, and difficulties experienced by village officials in managing digital data. To address these issues, the Design Thinking method was applied, which consists of the empathize, define, ideate, prototype, and test stages. The design process involved village officials and the community through observations and interviews to identify user needs. The results of this activity include a UI/UX blueprint of the village website consisting of information architecture, wireframes, mockups, and interactive prototypes developed using Figma. The design presents a clear navigation structure, simple interface, and key features such as village profiles, news, and activity documentation. This activity is expected to serve as a foundation for developing an informative, user-friendly village website that supports transparency and digital-based public services.

Kegiatan pengabdian kepada masyarakat ini bertujuan untuk merancang UI/UX Website Desa Tanjung Lago, Sumatera Selatan, sebagai upaya mendukung pengembangan sistem informasi desa berbasis digital. Permasalahan utama yang dihadapi desa adalah keterbatasan media informasi daring, dokumentasi kegiatan yang belum terstruktur, serta kesulitan perangkat desa dalam mengelola data secara digital. Untuk mengatasi hal tersebut, digunakan metode Design Thinking yang meliputi tahapan empathize, define, ideate, prototype, dan test. Proses perancangan dilakukan dengan melibatkan perangkat desa dan masyarakat melalui observasi dan wawancara untuk menggali kebutuhan pengguna. Hasil kegiatan berupa blueprint UI/UX website desa yang terdiri dari arsitektur informasi, wireframe, mockup, dan prototipe interaktif berbasis Figma. Rancangan yang dihasilkan menampilkan struktur navigasi yang jelas, tampilan sederhana, serta fitur utama seperti profil desa, berita, dan dokumentasi kegiatan. Kegiatan ini diharapkan dapat menjadi dasar bagi pemerintah desa dalam mengembangkan website desa yang informatif, mudah digunakan, dan mendukung transparansi serta pelayanan publik berbasis digital.

Keywords:
1. UI/UX
2. Village Website
3. Design Thinking
4. Community Service
5. Village Information System
Authors:
1 . Muhammad Firli Irsyandi
Universitas Bina Darma
2 . Nurul Huda
Universitas Bina Darma
View PDF
How to Cite
Irsyandi, M. F., & Huda, N. (2025). PELATIHAN DISAIN UI DAN UX MENGGUNAKAN APLIKASI FIGMA DALAM MEMBUAT WEBSITE. Education, Language, and Arts: Jurnal Pengabdian Kepada Masyarakat, 4(2), 316–324. https://doi.org/10.23960/ela.v4i2.1611
Download Citation
  1. Endnote/Zotero/Mendeley (RIS)
  2. BibTeX
Issue & Section
Vol. 4 No. 2 (2025): Education, Language, and Arts: Jurnal Pengabdian Kepada Masyarakat
Articles
References

    Biantara, O., & Dana, I. (2021). Pelatihan UI/UX berbasis Figma untuk peningkatan kesiapan kerja di industri digital. Jurnal Teknologi Informasi dan Pendidikan, 14(2), 85–94.

    Bramantio, R., Putra, A. R., & Lestari, D. (2025). Pelatihan desain UI/UX berbasis Figma untuk meningkatkan kompetensi desainer pemula. Jurnal Informatika dan Sistem Informasi, 11(1), 45–56.

    Brown, T. (2020). Change by Design: How Design Thinking Transforms Organizations and Inspires Innovation. Harper Business.

    Dam, R. F., & Siang, T. Y. (2021). Design Thinking: The Five Phases. Interaction Design Foundation.

    Haqiqi, M., & Ardiansyah, R. (2024). Analisis penggunaan Figma dalam perancangan UI/UX website berbasis kolaboratif. Jurnal Teknologi Informasi dan Komputer, 9(1), 33–42.

    Kurniawan, A., Prasetyo, B., & Lestari, N. (2022). Penerapan design thinking berbasis Figma dalam perancangan antarmuka website. Jurnal Sistem Informasi, 18(2), 120–131.

    Miles, M. B., Huberman, A. M., & Saldaña, J. (2020). Qualitative Data Analysis: A Methods Sourcebook (4th ed.). SAGE Publications.

    Ramadhani, F., & Hidayati, S. (2023). Pelatihan UI/UX berbasis Figma untuk peningkatan keterampilan desain mahasiswa. Jurnal Pendidikan Teknologi dan Kejuruan, 7(2), 98–107.

    Ramadano, M. A. M., Huda, N., & Megawaty, M. (2022). Rancang bangun UI/UX pre-order dekorasi pernikahan pada wedding organizer DSN. Jurnal Bina Komputer, 4(1), 9–16.

    Solikin, I., Mukti, A. R., Megawaty, N. H., Ansori, A., & Dharmawan, P. (2022). Pelatihan desain user interface (UI) pada Sekolah Azharyah menggunakan Zoom Meeting. KOMMAS: Jurnal Pengabdian kepada Masyarakat Universitas Pamulang, 3(1), 102–106.

    Yin, R. K. (2022). Qualitative Research from Start to Finish (2nd ed.). The Guilford Press.

  1. Biantara, O., & Dana, I. (2021). Pelatihan UI/UX berbasis Figma untuk peningkatan kesiapan kerja di industri digital. Jurnal Teknologi Informasi dan Pendidikan, 14(2), 85–94.
  2. Bramantio, R., Putra, A. R., & Lestari, D. (2025). Pelatihan desain UI/UX berbasis Figma untuk meningkatkan kompetensi desainer pemula. Jurnal Informatika dan Sistem Informasi, 11(1), 45–56.
  3. Brown, T. (2020). Change by Design: How Design Thinking Transforms Organizations and Inspires Innovation. Harper Business.
  4. Dam, R. F., & Siang, T. Y. (2021). Design Thinking: The Five Phases. Interaction Design Foundation.
  5. Haqiqi, M., & Ardiansyah, R. (2024). Analisis penggunaan Figma dalam perancangan UI/UX website berbasis kolaboratif. Jurnal Teknologi Informasi dan Komputer, 9(1), 33–42.
  6. Kurniawan, A., Prasetyo, B., & Lestari, N. (2022). Penerapan design thinking berbasis Figma dalam perancangan antarmuka website. Jurnal Sistem Informasi, 18(2), 120–131.
  7. Miles, M. B., Huberman, A. M., & Saldaña, J. (2020). Qualitative Data Analysis: A Methods Sourcebook (4th ed.). SAGE Publications.
  8. Ramadhani, F., & Hidayati, S. (2023). Pelatihan UI/UX berbasis Figma untuk peningkatan keterampilan desain mahasiswa. Jurnal Pendidikan Teknologi dan Kejuruan, 7(2), 98–107.
  9. Ramadano, M. A. M., Huda, N., & Megawaty, M. (2022). Rancang bangun UI/UX pre-order dekorasi pernikahan pada wedding organizer DSN. Jurnal Bina Komputer, 4(1), 9–16.
  10. Solikin, I., Mukti, A. R., Megawaty, N. H., Ansori, A., & Dharmawan, P. (2022). Pelatihan desain user interface (UI) pada Sekolah Azharyah menggunakan Zoom Meeting. KOMMAS: Jurnal Pengabdian kepada Masyarakat Universitas Pamulang, 3(1), 102–106.
  11. Yin, R. K. (2022). Qualitative Research from Start to Finish (2nd ed.). The Guilford Press.

Most read articles by the same author(s)