Redesign the user interface (UI) and user experience (UX) for websites using the design thinking method

Khairul Muttaqin; Nurul Fadillah; Rani Khairani

doi:10.62870/tjst.v21i1.30087

Redesign the user interface (UI) and user experience (UX) for websites using the design thinking method

Khairul Muttaqin, Nurul Fadillah, Rani Khairani

Abstract

The Samudra University Informatics Study Program website serves as a vital information hub for students and other users. The comfort and experience users gain when accessing a website are critical factors to consider when designing a user interface. Currently, the Informatics Study Program website is underutilized. Redesign efforts are necessary to optimize its functionality by developing an improved user interface. Data collection was conducted using evaluations and questionnaires to enhance the user-centered approach. The redesign was carried out using the design thinking method, with the interface designed using Figma tools. Design thinking is a solution-oriented design approach that aids in problem-solving and understanding user needs. Initial evaluations indicate that the average user satisfaction score was at a "Bad" level. After implementing the design thinking process, the new design achieved "Above Average" ratings in attractiveness, perspicuity, efficiency, and dependability, a "Good" rating in stimulation, and an "Excellent" rating in novelty. A comparison of average values reveals significant improvements between the old and new designs: attractiveness improved by 1.14, perspicuity by 1.34, efficiency by 1.52, dependability by 1.57, stimulation by 1.69, and novelty by 1.67. These results demonstrate that the website redesign is effective and enhances the user experience.

Keywords

Website' Design Thinking; Redesign; User interface; User experience

Full Text:

PDF

References

I. Darmawan, M. S. Anwar, A. Rahmatulloh, and H. Sulastri, “Design Thinking Approach for User Interface Design and User Experience on Campus Academic Information Systems,” Int. J. Informatics Vis., vol. 6, no. 2, pp. 327–334, 2022, doi: 10.30630/joiv.6.2.997.

F. Juansyah and D. Rosa Indah, “Application of Design Thinking Method in Redesigning The UI/UX of SIMAK (Academic Information System) of Sriwijaya University Based on Mobile Platform,” J. Phys.: Conf. Ser., vol. 8, no. 1, pp. 012013-1–012013-8, 2023, doi: 10.1088/1742-6596/2540/1/012013.

Aminudin et al., “Redesigning the User Interface in the Mobile-Based Ngaji.AI Application Using the Design Thinking Method,” ADRI Int. Conf. Ser., vol. 4, no. 1, pp. 97–105, 2023, doi: 10.34306/conferenceseries.v4i1.635.

E. N. K. Wati, M. I. A. Putera, S. R. Natasia, and L. Yonata, “Redesign the UI/UX of the PT MNO Company Profile Website Using the Thinking Design Method,” J. Sist. Inf. dan Ilmu Komput. Prima, vol. 7, no. 2, pp. 11–25, 2024.

W. P. Panggabean, “Implementation of Design Thinking UI/UX Construction RAB Application at PT PLN (Persero) UID S2JB Lahat,” J. Ilm. Tek. Inform. dan Komput., vol. 4, no. 2, pp. 1173–1183, Dec. 2024.

A. Syahrial, Supriyanto, and M. A. Putri, “Implementasi BMC Dengan Metode Design Thinking Dalam Menghadapi Covid-19 Di IKM Pati,” J. Teknol. Dan Manaj. Ind., vol. 1, no. 2, pp. 6–14, 2020.

B. Ramadhani, “Perancangan Design User Interface/User Experience Pada Aplikasi Penjualan UMKM House Of Flanel Sidoarjo Dengan Metode Design Thinking,” J. Ilm. Inform. Komput., vol. 4, no. 1, pp. 1–10, 2023.

I. F. Ramadhan, A. S. Aji, and U. T. Yogyakarta, “Enhancing Repository Application UI/UX through Design Thinking Methodology,” J. RESTI (Rekayasa Sist. dan Teknol. Inf.), vol. 3, no. 4, pp. 1540–1550, 2024, doi: 10.29207/resti.v3i4.1540.

S. Milda Puspita and N. Apriyanti, “The UI/UX Design with Design Thinking Method for The University Complaint Website,” Inf. Technol. Int. J., vol. 1, no. 1, pp. 23–36, 2023, doi: 10.33005/itij.v1i1.2.

A. Amalia Ristias, M. Sahlan Amin, and A. Agussalim, “UI/UX Design on Digilearn Application with the Iterative Design Thinking Methodology,” Inf. Technol. Int. J., vol. 1, no. 1, pp. 1–11, 2023, doi: 10.33005/itij.v1i1.4.

L. Setiyani and E. Tjandra, “UI/UX Design Model for Student Complaint Handling Application Using Design Thinking Method (Case Study: STMIK Rosma Karawang),” Int. J. Sci. Technol. Manag., vol. 3, no. 3, pp. 690–702, 2022, doi: 10.46729/ijstm.v3i3.505.

W. S. L. Nasution and P. Nusa, “UI/UX Design Web-Based Learning Application Using Design Thinking Method,” ARRUS J. Eng. Technol., vol. 1, no. 1, pp. 18–27, 2021, doi: 10.35877/jetech532.

T. Drey, M. Rietzler, and E. Rukzio, “Qualitative Feedback Methods to Measure User Experience in Mixed Reality,” in Proc. ACM Hum.-Comput. Interact., vol. 1, no. 1, pp. 1–20, 2021, doi: 10.1145/3474689.

B. Laugwitz, T. Held, and M. Schrepp, “Construction and Evaluation of a User Experience Questionnaire,” in HCI and Usability for Education and Work, A. Holzinger, Ed. Berlin, Germany: Springer, 2008, pp. 63–76, doi: 10.1007/978-3-540-89350-9_6.

R. Pramudita, R. W. Arifin, A. N. Alfian, N. Safitri, and S. Dina, “Penggunaan Aplikasi Figma Dalam Membangun UI/UX Yang Interaktif Pada Program Studi Teknik,” J. Ilm. Inform. Komput., vol. 3, no. 1, pp. 149–154, 2021.

T. B. Ayu and N. Wijaya, “Penerapan Metode Design Thinking pada Perancangan Prototype Aplikasi Payoprint Berbasis Android,” MDP Student Conf., vol. 2, no. 1, pp. 68–75, 2023, doi: 10.35957/mdp-sc.v2i1.4065.

L. A. Abdillah, “FinTech E-Commerce Payment Application User Experience Analysis during COVID-19 Pandemic,” Sci. J. Informatics, vol. 7, no. 2, pp. 265–278, 2020, doi: 10.15294/sji.v7i2.25554.

I. K. Wardani, P. Utomo, A. Budiman, and D. N. Amadi, “Pemanfaatan Metode Design Thinking dan Pengujian SUS untuk UI/UX Aplikasi Home Care Madiun Berbasis Android,” J. Comput. Inf. Syst. Ampera, vol. 4, no. 2, pp. 106–125, 2023. [Online]. Available: https://journal-computing.org/index.php/journal-cisa/index.

R. K. Pangestu and M. B. Ulum, “Implementation of Design Thinking Method in UI/UX Redesign of,” J. Phys.: Conf. Ser., vol. 16, no. 2, pp. 112–122, 2023.

E. Ramadansyah, R. G. Guntara, and A. Prehanto, “Design Thinking Approach for User Interface and User Experience on Campus Online Learning Platform,” J. Teknol. Inf. dan Pendidik., vol. 17, no. 2, pp. 344–357, 2024.

A. A. Syifa and E. P. Rachmawati, “Redesign UI UX Aplikasi Info BMKG Menggunakan,” J. Inform. dan Komput., vol. 10, no. 2, pp. 137–146, 2022.

A. Lucero, “Using Affinity Diagrams to Evaluate Interactive Prototypes,” in Human-Computer Interaction – INTERACT 2015, J. Abascal, S. Barbosa, M. Fetter, T. Gross, P. Palanque, and M. Winckler, Eds. Cham, Switzerland: Springer, 2015, pp. 231–248, doi: 10.1007/978-3-319-22668-2_19.

D. Siemon, F. Becker, and S. Robra-Bissantz, “How Might We? From Design Challenges to Business Innovation,” in Proc. 52nd Hawaii Int. Conf. Syst. Sci., 2019, pp. 6456–6465, doi: 10.24251/HICSS.2019.776.

T. Cai et al., “Personalized Font Recommendations: Combining ML and Typographic Guidelines to Optimize Readability,” in DIS 2022 - Proc. 2022 ACM Des. Interact. Syst. Conf. Digit. Wellbeing, 2022, pp. 1–25, doi: 10.1145/3532106.3533457.

R. Z. Li He and H. Qi, “Image Color Transfer to Evoke Different Emotions Based on Color Combinations,” Int. J. Comput. Graph., vol. 5, no. 2, pp. 45–56, 2019.

P. Riyaldi, P. Narendra, N. Kadek, A. Wirdiani, N. Made, and I. Marini, “Website Based UI/UX Application Design Of Balinese Traditional Products Using The Design Thinking Method,” J. Phys.: Conf. Ser., vol. 11, no. 2, pp. 103–114, 2023, doi: 10.1088/1742-6596/2624/1/012054.

I. Ferdiansyah, M. Defriani, and I. Maruf Nugroho, “Redesign Aplikasi Kai Acces Menggunakan Metode Design Thinking,” INFOKOM (Informatika & Komputer), vol. 11, no. 1, pp. 34–45, 2023, doi: 10.56689/infokom.v11i1.1045.

M. Fadhil, I. Aknuranda, and R. I. Rokhmawati, “Perancangan Antarmuka Sistem Informasi Akademik Mahasiswa Berbasis Perangkat Bergerak,” J. Pengemb. Teknol. Inf. dan Ilmu Komput., vol. 3, no. 5, pp. 4739–4748, 2019.

P. P. Rau and J. Zhou, “Comparing Low and High-Fidelity Prototypes in Mobile Phone Evaluation,” Int. J. Technol. Diffusion, vol. 3, no. 4, pp. 1–19, 2012, doi: 10.4018/jtd.2012100101.

E. F. Firdani, I. F. Hanif, M. Febriansyah, and M. Yusuf, “Implementation of Website-Based UI UX Using the Design Thinking Method: Case Study at PT Jesinra Makmur Group,” J. Ilm. Tek. Inform. dan Komput., vol. 6, no. 1, pp. 73–82, 2024.

DOI: http://dx.doi.org/10.62870/tjst.v21i1.30087

Refbacks

There are currently no refbacks.

This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.

Teknika: Jurnal Sains dan Teknologi is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.