JUSIKOM PRIMA (Journal of Information Systems and Computer Science Prim.
Vol.
6 No.
February 2023
E-ISSN: 2580-2879
IMPLEMENTATION OF DESIGN THINKING APPROACH METHODS IN
CURVING SELL MAINTENANCE WEBSITES
(CASE STUDY: KAI DAOP 5 PURWOKERTO)
Yuni Novita Br.
Sihaloho*1.
Akhmad Fauzi2.
Sisilia Thya Safitri3
1,2,3
Telkom Purwokerto Institute of Technology Jl.
DI Panjaitan No.
Karangreja.
Purwokerto Kidul.
Kec.
Purwokerto Sel.
Banyumas Regency.
Central Java 53147 E-mail:* 19103076@ittelkom-pwt.
ABSTRACT- PT KAI DAOP 5 Purwokerto is one of Indonesia's railroad operating units under the auspices of PT Kereta Api Indonesia (Perser.
PT KAI DAOP 5 Purwokerto has several divisions, one of which is the rail and bridge unit.
The rail line and bridge units at KAI DAOP 5 Purwokerto are still manually recording plan data and inspecting tracks.
So, a system is needed to record plan data and review railroad tracks.
This is done to make it easier for inspection officers to store data and reduce the risk of losing data from inspecting railroad tracks.
Methods of data collection using literature study methods, interviews, and discussions with prospective website users and the team.
This research aims to assist users in recording planning data and to inspect rail lines and Designing a website using the Design Thinking approach can make it easier to make User Interface designs that suit user needs.
Applying the Design Thinking approach, a prototype design was found, which was used as a reference in implementing the Sell Maintenance website.
The results of tests conducted on one of the employees on the user interface design were 8 accepted, 2 rejected, and 3 revisions.
Applying the Design Thinking approach, a prototype design was found, which was used as a reference in implementing the Sell Maintenance The results of tests conducted on one of the employees on the user interface design were 8 accepted, 2 rejected, and 3 revisions.
Applying the Design Thinking approach, a prototype design was found, which was used as a reference in implementing the Sell Maintenance website.
The results of tests conducted on one of the employees on the user interface design were 8 accepted, 2 rejected, and 3 revisions.
Keywords: Design Thinking.
User Interface.
Website INTRODUCTION Information technology is a device, system, and method used to collect, transmit, process, process, store, organize and use data effectively and meaningfully.
Today's application of information technology has many advantages, one of which is used to carry out activities within an organization or A minimal movement is carried out without the use of information technology.
Therefore, information technology has a crucial role in today's Along with the development of information technology, information systems are also running very fast.
The current use of internet is not only used to obtain information but can also be used as a medium for doing business by creating a website.
Website or World Wide Web .
or better known as the web, is a service that can be accessed through devices such as computers or smartphones connected to the internet.
A website or site is a collection of pages presenting information, including text, images, animation, sound, or a mixture .
A good website design can be one of the attractions for users to use the website.
A structure can achieve its goals if it meets functional criteria, is consistent with characteristics, and meets operational standards by applicable ethical values.
The user interface or User Interface (UI) is an inseparable part of an application or website that allows users to interact easily.
UI affects user comfort when using a website or application and can also give an idea of how attractive the website is to users.
Previous research regarding the Application of the Design Thinking Method in Kirihuci MSME Website Design produced a website that makes it easy for its This can be seen from user feedback.
Of the thirty participants who are owners and consumers of Kirihuci products at the usability testing stage regarding the appearance of the website interface design, it was good.
Previous research entitled UI & UX Redesign Using the Design Thinking Method in the Mobile-Based Student Siakadu Application that the Design Thinking method can produce prototype Siakadu Student applications that suit user needs.
Previous research discussing designing thrifter business websites using the design thinking approach resulted in the design thinking method enabling the development of gathering information required by users to be used as material for website .
PT KAI DAOP 5 Purwokerto is one of the functional areas for Indonesian railways under the environment of PT Kereta Api Indonesia (Perser.
In a company, having a website with an attractive appearance can help the user or users in using it.
Rail and bridge lines at PT KAI DAOP 5 Purwokerto are divided into 2 parts, namely the Wesel Line and the Curved Line.
Until now.
PT KAI DAOP 5 Purwokerto is still keeping records manually JUSIKOM PRIMA (Journal of Information Systems and Computer Science Prim.
Vol.
6 No.
February 2023
E-ISSN: 2580-2879
in recording railroad track inspection data.
Based on these problems, a website was created to record railroad inspection data in the operational area 5 Purwokerto.
In this regard, it was decided to design a good and attractive website using the Design Thinking approach.
RESEARCH METHODS
Design thinking is a way of solving product design problems focusing on innovation and solutions.
Design Thinking is a new technique in the design process that aims to create innovative products that meet user needs.
Design Thinking is concerned with how it looks and feels and focuses on the overall user experience.
This method is used to find the most effective and efficient solution to complex problems with a comprehensive approach.
The Design Thinking approach has five stages: empathize, define, ideate, prototype, and test.
Picture 1.
Stages of Design Thinking (Stanford.
Emphasize Emphasizing is a process to identify user needs by conducting interviews and observations.
Define Define is the stage where you start to analyze and understand user needs and results from the information collected through the empathize process.
the idea is piling or describing ideas and solutions to existing problems.
Prototype A prototype is a process of implementing ideas and solutions obtained from the previous stage in the implementation process.
The test is where ideas and solutions obtained from the previous location are implemented.
RESEARCH RESULT
Making UI designs on the Sell Maintenance website for curved sections using Figma with the design thinking method for recording data on rail and bridge inspections at PT KAI DAOP 5 Purwokerto.
The following are the analysis and design results of the Website Sell Maintenance UI design:
Empathize Process This process searches for user information, which will then become the basis for designing the Sell Maintenance website.
This process was carried out through interviews with the IT manager of PT KAI DAOP 5 Purwokerto.
The information collected includes anything needed to record planning data and inspection results of rail lines and bridges.
Process Define After gathering information on the empathize process, the next step is to analyze the information that has been collected.
Based on the problems identified during the empathize process, the rail and bridge unit needed a system to record plans and inspection results.
Idea Process Picture 2.
Use Case Diagram (Source: Own wor.
This process develops solutions based on the problems obtained from the defined process.
Based on the issues brought, a solution is obtained, namely creating a website that will be used to input plan data and inspection results for rail lines and railroad bridges, which will be called Sell Maintenance.
The Sell Maintenance website will be used by the Railroad and Bridge division at KAI DAOP 5 Purwokerto.
In this process, we are also starting to make features on the website, starting from resort data, road plot data, asset data, bow inspection data, arrow-bowstring inspection data, and spoor elevation inspection data.
Prototyping Process After getting an idea in the ideate process, implement it into the Sell Maintenance website design process.
The Sell Maintenance website will be used by the Railroad and Bridge division at KAI DAOP 5 Purwokerto.
Based on the ideas obtained from the ideate process, the existing features will be divided into 2 .
, namely admin and super Table 1 is an explanation of the Sell Maintenance website design features.
Table 1.
Design Features Page Name Description Homepage Curve/Wesel section Login To enter the website Provide information regarding the organizational structure of the railroad and bridge offices, descriptions of JJ units, and resort data.
Data Resorts Provide information about resorts that are included in PT KAI DAOP 5 Purwokerto.
Plot of Road Provides information about the roadmap list JUSIKOM PRIMA (Journal of Information Systems and Computer Science Prim.
Vol.
6 No.
February 2023
E-ISSN: 2580-2879
Asset Data Bow Check ArrowBowstring Examination Spoor Level Check About Users Home Settings Data Resort Entering/editing data regarding arch asset data Perform input, editing, and deletion of arc inspection data Perform information, editing, and deletion of ArrowBowstring Inspection data.
Entering, editing, and deleting Spoor Height Inspection data Provide information regarding the description of the Sell Maintenance website.
Provide information about admin or user data.
In addition, the super admin can add new users to this feature.
To change the organizational structure and description on the home menu in the admin To change and delete existing resort data at KAI DAOP 5 Purwokerto Picture 4.
Login Display (Source: Own wor.
The login page is a page that accepts input in the form of an email address and password that has been registered in the database.
The login page is vital to access the menus available on this website.
The following is a display of the features that have been determined during the ideate process that has been designed using Figma:
Picture 5.
Home Page (Source: Own wor.
The home display is the initial part after logging in as admin.
On this home page are an organizational structure for the KAI DAOP 5 Purwokerto Railway and Bridge office, a description of the JJ Unit, and a list of JJ Resort Units at KAI DAOP 5 Purwokerto.
Picture 3.
Initial Page Display (Source: Own wor.
The start page is the initial display that will appear every time you open the Sell Maintenance The KAI logo and company name are to inform you that this website will be used at PT Kereta Api Indonesia (Perser.
DAOP 5 Purwokerto.
This initial page has 2 .
menu options, namely Curve and Wesel, which, when clicked, will continue the page according to the selected division.
Picture 6.
Data Menu (Source: Own wor.
The data page is a page that displays data that has been entered into the system about the selected resort.
On this page, you can add a new plan by adding a resort name, changing an existing resort name, deleting an inn, and inputting the road plot data for the selected resort.
JUSIKOM PRIMA (Journal of Information Systems and Computer Science Prim.
Vol.
6 No.
February 2023
E-ISSN: 2580-2879
Picture 7.
Path Plot List Display (Source: Own wor.
This page is the page that will appear when clicking details on the data menu.
For example, a display will appear below after clicking on the components according to the selected resort and adding the plot name and photo.
Picture 10.
Display of Arrow-Bowstring Inspection Data (Source: Own wor.
The arrow-bowstring inspection page is a page that accepts input inspection data.
This view appears when clicking the next page feature on the arc inspection data page.
Picture 11.
Display of Spoor Height Inspection Data (Source: Own wor.
Picture 8.
List of Road Plots (Source: Own wor.
The road map list page is displayed when we click on the details according to the selected resort.
The display in Figure 3.
7 is an example of when you have chosen the UPT JR Resort Slawi resort and entered the plot name.
Picture 9.
Bow Inspection Data Display (Source:
Own wor.
The arc inspection data display is a display where when you have clicked on the selected road In the arc inspection data menu, you can input data per the results of the arc inspection carried out on the road plot.
This spoor height inspection data page continues with bow and arrow-bowstring inspection data.
This page is close to the previous 2 pages, which accept input data from the results of the spoor elevation Picture 12.
Asset Data Display (Source: Own wor.
The asset data page is a menu that accepts input data related to the results of the inspections that have been carried out.
Arch asset data display can be seen in Figure 3.
12 above.
JUSIKOM PRIMA (Journal of Information Systems and Computer Science Prim.
Vol.
6 No.
February 2023
E-ISSN: 2580-2879
Testing Process Picture 13.
Display About (Source: Own wor.
The about page is a menu that contains descriptions related to the Sell Maintenance website, which is a description of the website and the uses of this Sell Maintenance website.
In testing a new product, in this case, the user interface design aims to provide an assessment and input in detail about the productAos chances of success and determine the final adjustments needed.
This testing process is carried out directly to one of the prospective users in the Railroad and Bridge division.
This test was carried out directly by Mr.
Yudi, an employee in the Railroad and Bridge division at KAI DAOP 5 Purwokerto.
Testing is carried out after all the design stages have been carried out.
The results of testing the user interface design obtained can be seen in table 2.
Table 2.
Test result Page Name Status Reason Homepage Accepte According to the input Login Picture 14.
View Manage Admin (Source: Own The Manage admin page is one of the displays that exist when you have logged in as super admin.
this menu, the super admin can add users to either become an admin or a super admin.
In addition, in this menu, super admins can perform several actions related to registered admin data, such as adding new admins, changing existing admin data, and deleting registered admins or super admins.
Picture 15.
Management Diagram View (Source:
Own wor.
The management diagram page is a page for changing the organizational structure on the admin's home menu.
The management chart can be changed simply by uploading a new corporate structure image.
Accepte Accepte Data Resorts Not List of Road Plots Aset Data Accepte Accepte Accepte Accepte Bow Check ArrowBowstring Examination Spoor Level Check About Accepte Revision Users Revision Home Settings Revision Data Resort Not Under the expected login page Existing Because already a list of resort data on the home page According to user The columns provided are under user needs According to user According to user According to user Provide usability of the website that will be The provided is in the form of first name, last name, username, email, and position to detail the The page's name is organizational structure can be changed.
Because the data resort feature is already in the home menu / initial display after logging in JUSIKOM PRIMA (Journal of Information Systems and Computer Science Prim.
Vol.
6 No.
February 2023
E-ISSN: 2580-2879
CONCLUSION
After conducting the discussion, applying the Design Thinking approach in designing websites will make creating User Interface plans that suit user needs easier.
For example, making a website is done to make it easier to input data on the inspection of rail lines and railway bridges.
By applying the Design Thinking approach, a user interface design was found, which was used as a reference in implementing the Sell Maintenance website.
The results of tests conducted 56 none of the employees on the user interface design given were 8 accepted, 2 rejected, and 3 revisions.
CLOSING
This research has several limitations, so steps must be taken in future research to overcome these These include:
There has yet to be any testing of the system on potential users in this study.
However, the feedback after testing can provide a practical evaluation for future designs.
This research uses the Design Thinking approach.
However, it is hoped that future research will use other methods in order to be able to compare the performance of the Design Thinking method with other processes on the problems to be studied.
Psychology, "The Influence of the Work Environment.
Mukaromah.
Faculty of Psychology.
UMP, 2018," pp.
1Ae8, 2018.
Susanti.
Fatkhiyah, and E.
Efendi, "Ui/Ux Development in the M-Voting Application Using the Design Thinking Method," Save.
Nas.
RAPI XVi, pp.
364Ae 370, 2019.
IP Sari.
AH Kartina.
AM Pratiwi.
Oktariana.
MF Nasrulloh, and SA Zain, "Implementation of the Design Thinking Approach in Making Happy Class Applications at the UPI Cibiru Campus," Edsence J.
Educator.
Multimed.
, vol.
2, no.
45Ae55, 17509/edsence.
BIBLIOGRAPHY