Design Thinking Method Application in UI/UX Design on the Sabiekah E-Commerce Website

The rapid growth of electronic commerce (e-commerce) has compelled organizations, including educational entities such as Islamic boarding schools, to strategically prioritize the refinement of user experience on their website. Institution of Diniyyah Puteri Padang Panjang, one of the oldest Islamic boarding schools for girls, has a business unit under the supervision of Diniyyah Business Pillar. This business unit has established an e-commerce website to promote their services to the public. However, the user experience in terms of design (user interface) and functionality (user experience) has not received adequate attention. Therefore, a redesign of the Sabiekah e-commerce website has been undertaken with the goal of enhancing user experience through improved visuals. This research employs the design thinking method to design the UI/UX of the Sabiekah e-commerce website. The design thinking method consists of five stages: empathize, define, ideate, prototype, and testing. The usability testing results using the System Usability Scale (SUS)(Derisma, 2020; Sembodo et al., 2021; Welda et al., 2020) generated a score of 90. This calculation confirms that the prototype design meets acceptable standards in usability testing evaluation


INTRODUCTION
User interface (UI)/user experience (UX) is one part of the stages in the development of the system to produce interactive and attractive web-based application layouts so that it is easy to understand and use by users (Krisnanik & Rahayu, 2021).
In this digital era, product quality cannot be separated from aesthetics, those who are responsible for the beauty of product appearance are UI/UX Design and Frontend (Prasetiyo et al., 2022).
The rapid development in electronic commerce (e-commerce) has transformed the way people shop and interact with brands and products.Ecommerce websites have become a primary platform (Umair Manzoor et al., 2020;VARNALI, 2023) for companies to engage with customers and sell their products.However, many e-commerce websites face challenges in providing an optimal user interface/user experience (UI/UX) (Akbar et al., 2023).
"Sabiekah" is an enterprise conducted with the aim of obtaining profits, wages, or business gains.Established in February 2021, Sabiekah (House of Basiba) is a business unit under the auspices of Diniyyah Pilar of Enterprise, Diniyyah Puteri Padang Panjang Institution.The Diniyyah Puteri Padang Panjang Institution created an e-commerce website to promote their business to the public.Nevertheless, the user interface and user experience aspects have not received adequate attention.
Initial research using quantitative methods through an online questionnaire (using Google Forms) gathered responses from 52 participants.Quantitative data revealed that the e-commerce website's interface is outdated, as seen in the homepage with some elements having a less tidy layout.The login page lacks user-friendly features, with users expressing a desire for improvements to enhance usability and visual appeal.Respondents also noted unattractive and information-lacking aspects of the shopping cart page, the absence of a wish list feature, and suggested changes to the layout, information, and elements on the product page.

LITERATURE REVIEW
Usability testing using the Usability Testing method (Anam et al., 2023;Kamińska et al., 2022;Nalendro & Wardani, 2020) resulted in a score of 69.95, categorized as "Good" with a grade scale of D. Based on this data, a redesign of the Sabiekah e-commerce website is recommended.
Therefore, it is essential to investigate the application of the design thinking method in UI/UX design for e-commerce websites, particularly in the context of Sabiekah.Design Thinking is a comprehensive thinking process focused on creating solutions, beginning with empathy for specific human needs, leading to sustainable innovation.The method involves five stages: Empathize (Research Finding), Define, Ideate, Prototype, and Testing (Krisnanik & Rahayu, 2021).

METHODOLOGY
Explain your methodologies in this chapter.You should explain your research instruments, data collection processes, data analysis processes or hypothesis testing processes, and data display processes.
The research methodology for this final project utilizes the Design Thinking method, which consists of 5 stages in the development of UI/UX (Herfandi et al., 2022): Empathize, Define, Ideate, Prototype, and Testing.The following diagram illustrates the stages of the Design Thinking method.

Picture 1. Design Thinking Flow
The stages of the Design Thinking method (R. F. Dam, 2022; R. Dam & Siang, 2019)in the creation of the e-commerce website redesign for Sabiekah are as follows: a. Empathize In this stage, the author created an online questionnaire (using Google Form) to be distributed to users of the Sabiekah e-commerce website with the criteria (Gupta, 2023): -Native Indonesian residents.
-Familiar with e-commerce applications.
This process aims to gather feedback and insights from users of the Sabiekah e-commerce website.From this, the author will obtain data on issues related to the user interface and user experience of the current Sabiekah ecommerce website.b.Define In this stage, the author will analyze the previously obtained data through quantitative methods using an online questionnaire (using Google Form).The author will synthesize the information using affinity mapping, grouping the obtained information into clearer categories (Gupta, 2023).c.Ideate In this stage, the author strives to provide the best solutions to address the problems identified in the previous testing participants.To offer solutions to the identified issues, the author will create "How Might We" (HMW) statements and conduct brainstorming to facilitate decision-making regarding the challenges perceived by participants (Gupta, 2023).

d. Prototype
In this stage, the author will explore designs on other e-commerce websites as references for designing the Sabiekah e-commerce website.Afterward, the author will create a UI style guide as a benchmark for designing the Sabiekah e-commerce website, then design low fidelity and high fidelity prototypes using Figma (Gupta, 2023).e. Testing The final stage involves testing the new design of the Sabiekah ecommerce website with participants using the usability testing method moderated face-to-face via Zoom.This assesses how easily participants navigate the experience with the solutions provided for the redesigned website.Additionally, the author analyzes the differences between the previous and redesigned website designs based on data obtained from the first and second usability testing sessions.The first usability testing session involves the original design of the Sabiekah e-commerce website, while the second usability testing session involves the redesigned design (Subhiyakto et al., 2023).
To analyze the results, the author employs the System Usability Scale (SUS) and Net Promoter Score (NPS) as benchmarks.SUS is a questionnaire designed by John Brooke in 1986 to measure perceived usability.The SUS score is calculated using the formula(Al-Faruq et al.The average score from the SUS questionnaire is obtained by summing the total scores of all respondents.Meanwhile, the Net Promoter Score (NPS) reflects customer loyalty and is calculated using the formula (Pratama & Indriyanti, 2023):

a. Empathize
In order to understand the problems and needs in the Sabiekah ecommerce website interface design process, researchers carried out the empathy stage.Data regarding these problems and needs was obtained through user research, where the author distributed questionnaires to Sabiekah customers.The results of this research were obtained from the responses of 52 respondents who participated in filling out the questionnaire: Picture 2. The Results of Research Using Quantitative Questionnaire Methods Are Displayed in the Initial Display • 46,2% of people think that the UI on the initial appearance of the Sabiekah ecommerce website is still outdated or not up to date.With this percentage, there are still many respondents who answered that they did not agree to provide suggestions or input on elements that needed to be changed, such as in terms of color, layout, footer, and other supporting features.
Picture 3. Research Results Using Quantitative Questionnaire Methods on the Product Menu • 65,4% of people think that the UI on the product menu displayed on the Sabiekah e-commerce website is still old or not up to date.• 34,6% of people think that the UI on the product detail display on the Sabiekah e-commerce website is still old or not up to date.With this percentage, there are still many respondents who answered that they did not agree to provide suggestions or input on elements that needed to be changed, such as color, layout, size choices, ratings and reviews, footers, and other supporting features.Table 1.Original Score SUS

No
Original Score Q1 Q2 Q3 Q4 Q5 Q6 Q7 Q8 Q9 Q10 After the respondent answered the questionnaire given, the respondent was also given 10 questions that were useful for seeing the SUS results from the Sabiekah e-commerce website, where the author got the SUS results as follows: Table 2 Based on the questionnaire data, an empathy map was created to map responses from respondents to creating the Sabiekah e-commerce website.Empathy maps are created to find out user needs.The empathy map is divided into four quadrants: hear, see, say, do, think, and feel, which are analyzed based on questionnaire data: Picture 13 consists of wish list information banners, how to use the wish list, vouchers, last viewed products, other product recommendations and supporting features.Picture 15 consists of order status, payment deadline information, virtual account, virtual account number, total payments.

e. Testing
The following is a recap of the original data from the SUS questionnaire for the 5 previous usability testing participants: 2. In designing using the design thinking method, testing was carried out using the moderated usability testing method with 5 participants.3. Based on the results of usability testing using the SUS (System Usability Scale), a score of 90 was obtained.Based on the results of these calculations, it shows that the prototype design has been able to meet the acceptable requirements in the usability testing assessment

FURTHER STUDY
The suggestions that can be used as input for future final projects are as follows: 1.In future research, it is recommended to carry out research, researchers should be able to add several features to the Sabiekah e-commerce website in line with the developing needs of users.The addition of this feature is tailored to the needs of users which is expected to make it easier to promote Sabiekah products.2. For further research development, it is recommended to create a more interactive prototype.The use of interactive prototypes can give users a good and comfortable impression when using them and the test results obtained are more accurate.

Picture 4 .
Research Results Using Quantitative Questionnaire Methods on the Login Display • 57,7% of people think that the UI on the Sabiekah e-commerce website login display is still old or not up to date.Picture 5. Research results using quantitative questionnaire methods on the basket display •75% of people think that the UI on the Sabiekah e-commerce website's basket display is still old or not up to date.Picture 6. Research Results Using Quantitative Questionnaire Methods on Product Details 4. Cart Picture 14.Low & High-Fidelity Cart Picture 14 consists of products, CTAs, vouchers, last viewed products, other product recommendations and supporting features.5. Transaction Picture 15.Low & High-Fidelity Transaction . Result Score SUS

Table 3 .
SUS Original Score Data