XP in Front-End Development of Living Lab Smart City Surabaya to Create User Interaction

Abstract

The development of digital services within the smart city ecosystem in Surabaya still faces challenges, particularly the low level of utilization of government digital services. According to data from the Central Bureau of Statistics (BPS), the population of Surabaya reached 3,018,022 people in 2024; however, the usage level of several digital services remains limited. This condition is reflected in the Wargaku application, one of the public service platforms provided by the Surabaya City Government, which has only been downloaded approximately 100,000 times on the Google Play Store as of 2025. This indicates that the adoption of government digital services by the community is still not optimal. Therefore, an innovative collaborative platform is required to integrate various smart city features while providing more comprehensive information about government programs to the public. One possible solution is the development of a Smart City Living Lab as a collaborative medium between citizens and the government.This study aims to develop the front-end website of the Surabaya Smart City Living Lab as a platform for information sharing and collaboration between citizens and the city government. Using the Extreme Programming (XP) approach, this research focuses on designing a user interface that supports optimal user interaction through an iterative cycle consisting of planning, design, implementation, and testing stages. In the planning phase, a mind map was developed to identify system requirements and scope. The design phase included the development of a design system, Entity Relationship Diagram (ERD), use case diagram, activity diagram, and interface prototype. During the implementation phase, the front-end design was realized through coding using HTML, CSS, and JavaScript, supported by a MySQL database to dynamically manage visit reservation data and blog content. The testing phase was conducted through usability testing using Maze to evaluate the aspects of learnability, efficiency, and error prevention. The evaluation involved 30 respondents who completed several task scenarios using the developed prototype. The results show that all tasks achieved a success rate of 100%, with an average completion time ranging from 2.6 to 7.9 seconds and a low misclick rate of 0–4.8%. In addition, each scenario obtained a Single Ease Question (SEQ) score of 7, indicating that users perceived the tasks as very easy to complete. Furthermore, the Maze Usability Score (MAUS) reached 99 with an “excellent” category, demonstrating that the prototype achieved a very high level of usability and provides an intuitive user interaction experience with minimal obstacles.