Jurnal Teknik Informatika dan Sistem Informasi ISSN 2407- 4322 Vol. 8, No. 3, September 2021, Hal. 1397-1406 E- ISSN 2503- 2933 1397

## User Interface Layanan Mandiri Untuk Gelanggang Olahraga Menggunakan Metode Design Thinking
Muhammad Reinaldy Gunawan*, Septi Andryana, Andrianingsih Andrianingsih Program Informatika, Fakultas Teknologi Komunikasi dan Informatika, Universitas Nasional Fakultas Teknologi Komunikasi dan Informatika, Universitas Nasional e-mail: *reinaldy.kuroba@gmail.com, septi.andryana@civitas.unas.ac.id, andrianingsih@civitas.unas.ac.id

## Abstrak
Olahraga sangat dibutuhkan pada masyarakat untuk menjaga tubuh tetap sehat dan juga dapat menjaga kekebalan tubuh. Pada bidang olahraga sebagian besar masyarakat memakai sebuah gelanggang olahraga untuk melakukan kegiatannya. Gelanggang Olahraga (GOR) itu sendiri adalah sebuah fasilitas olahraga yang diperuntukan untuk berbagai macam aktivitas olahraga didalamnya. Cara untuk mengakses sebuah GOR sedikit sulit dikarenakan harus bertemu dengan pengurus yang ada. Hal itu dinilai kurang efisien karena pelanggan harus mencari dan menunggu lama sampai pengurus tiba. Dengan meninjau masalah ini dibutuhkan suatu solusi yaitu membuat sebuah sistem pelayanan mandiri dengan mendesain sebuah user interface untuk pelanggan memesan GOR sendiri. Dengan menggunakan metode design thinking para pelanggan akan mengakses sebuah GOR tersebut tanpa harus mencari atau bertemu dengan pengurus.
Keywords — Design Thinking, Layanan Mandiri , User Interface

## Abstract
Exercise is needed in the community to keep the body healthy and can also maintain immunity.In the field of sports most of the community uses a sports arena to do its activities.The Sports Arena (GOR) itself is a sports facility intended for a variety of sports activities in it.The way to access a GOR is a little difficult because it has to meet with the existing administrators.It was considered less efficient because customers had to search and wait a long time until the caretaker arrived.By reviewing this problem, a solution is needed to create a self-service system.But in the results of this study is designing a user interface for customers ordering their own gor.By using design thinking method the customers will access a gor without having to search or meet with the administrator.
Kata kunci — Design Thinking, Self Service, User Interface .

## 1. PENDAHULUAN
lahraga sangat dibutuhkan pada masyarakat untuk menjaga tubuh tetap sehat dan juga dapat menjaga kekebalan tubuh, terkadang masyarakat berolahraga juga untuk kegiatan lainnya seperti hobi dan juga lomba. Sebagian besar masyarakat memakai fasilitas di gelanggang olahraga (GOR) sebagai tempat untuk melakukan kegiatannya. Gelanggang Olahraga (GOR) itu sendiri adalah sebuah fasilitas olahraga yang diperuntukan untuk berbagai macam aktivitas olahraga didalamnya.
Sulitnya mengakses atau menyewa fasilitas di GOR terkadang menjadi sebuah masalah terhadap masyarakat. Para masyarakat harus bertemu dengan pengurus untuk menanyakan O
1398 Jatisi ISSN 2407-4322 Vol. 8, No. 3, September 2021, Hal . 1397-1406 E- ISSN 2503-2933
jadwal lapangan dan terkadang pengurus tidak ada ditempat. Hal itu dinilai kurang efisen karena masyarakat harus mencari dan menunggu lama sampai pengurus tiba.
Pada masalah ini dibutuhkan suatu solusi yang tepat yaitu membuat sebuah sistem pelayanan mandiri. Pelayanan mandiri secara umum di definisikan sebagai teknologi yang memungkinkan masyarakat agar dapat melakukan transaksi secara sendiri [1]. Tujuan pada penelitian ini adalah membuat sebuah perancangan desain user interface sebagai layanan mandiri supaya para pengguna tidak kesulitan dalam mengakses atau menyewa GOR tanpa harus bertemu dengan pengurus terlebih dahulu.
Sistem layanan mandiri (Self Service) diterapkan pada penelitian ini untuk memberi kenyamanan kepada setiap pengguna. Sistem layanan mandiri (Self Service) memiliki tujuan agar pengguna merasa nyaman dan bebas dalam memilih kebutuhannya [2].
Desain UI dibuat dengan memperhatikan kenyamanan pengguna agar diterima oleh masyarakat [3]. Jikalau pengguna berpendapat UI yang telah dibuat tidak menarik dan susah untuk dimengerti akan berakibat kegagalan, agar mudah untuk merancang desain UI diperlukan sebuah alat maupun software yang baik seperti Figma atau Adobe.
Untuk perancangan UI itu sendiri akan menjadi sebuah penguhubung secara langsung antara sistem dengan penggunanya, oleh sebab itu UI dibuat dengan tepat untuk membentuk presepsi pengguna terhadap suatu perangkat [4].
Dari penelitian yang dilakukan oleh Anandhi dan kawan-kawan bahwa pada metode design thinking mempunyai beberapa tahapan dimulai dari pengumpulan informasi, yang pengguna butuhkan, membuat solusi yang kreatif, mengembangkan dari permasalahan dan menguji hasil yang telah dibuat sehingga mendapatkan tolakukur [5]. Didalam design thinking juga terdapat dua alat utama yang digunakan untuk mencari solusi dari suatu permasalahan, yaitu Double-Diamond dan Human-Centered Design.
Pada Double-Diamond menurut peneliti Andra Irb te yaitu pada Design Thinking harus menemukan permasalahan yang tepat dan juga mencari solusi yang tepat. Proses sistemik Sebagian maupun seluruhnya yang dimulai dengan tujuan yang sudah ditentukan dan sebagian hasil yang dapat diperdiksi. Hal ini adalah pendekatan yang didasarkan pada analogi dengan proses perancangan [6].
Aryun Nadaa  menyatakan bagian Human-Centered-Design merupakan sistem  yang memfokuskan pada penerapan faktor manusia atau aspek ergonomis dalam merancang dan mengembangkan sistem yang interaktif [7]. Human-Centered Design sangat berpusat pada manusia sehingga desain yang dikembangkan dapat memenuhi kebutuhan [8].
Studi literatur yang digunakan sebagai pembanding perancangan sistem ini dilakukan oleh Design Thinking dan Human-Centered Design sebagai pendekatan pengembangan sistem untuk membuat user interface sistem layanan mandiri gelanggang olahraga.

## 2. METODE PENELITIAN
Proses perancangan akan dimulai dari studi literatur seperti menganalisis, analisis hasil simulasi dan lainnya yang ditujukan untuk memperkuat penelitian. Gambar berikut adalah alur dari penelitian;
E- ISSN 2503-2933   1399

## 2.1 Alur Penelitian
Gambar 1. Alur Penelitian
Berawal dengan studi literatur yang dimana bertujuan untuk mendapatkan wawasan yang sedang diteliti. Lalu masuk tahap pengumpulan data dimana pada tahap tersebut peneliti melakukan  sebuah in-depth interview kepada masyarakat yang memang sering melakukan aktifitas di GOR.
Dengan itu peneliti akan mendapatkan poin-poin permasalahan dan akan melakukan sebuah analisis pada permasalahan tersebut serta memvalidasi untuk masuk tahap berikutnya. Lalu masuk ketahap pengembangan ide solusi yaitu dimana peneliti melakukan banyak pencarian ide yang kemudian dimasukkan ke dalam tahap evaluasi desain yang dimana akan diubah dalam bentuk wireframe dan nantinya diubah lagi ke bentuk mockup , setelah itu masuk tahap analisis  hasil menggunakan metode usability testing ,  tahap  ini ditujukan untuk mendapatkan hasil dari perancangan yang sudah dilakukan.
1400 Jatisi ISSN 2407-4322 Vol. 8, No. 3, September 2021, Hal . 1397-1406 E- ISSN 2503-2933

## 2.2 Diagram User Flow
Gambar 2. Diagram User Flow
E- ISSN 2503-2933   1401
Dijelaskan pada Gambar 3, bagaimana proses jalannya aplikasi sistem layanan mandiri untuk GOR ketika digunakan oleh user, pada saat membuka pengguna ada di posisi start lalu pengguna melakukan lihat jadwal dan memilih jenis olahraga yang diinginkan kemudian menentukan jadwal penyewaan, setelah menentukan jadwal pengguna mengisi data registrasi dan pembayaran.

## 2.3 Alur Perancangan
Gambar 3. Alur Desain Thinking
2.3.1 Double-Diamond
Sebelum memasuki Design Thinking peneliti perlu mendapati permasalahan yang tepat dan juga mencari solusi yang tepat. langkah ini dikategorikan sebagai pemikiran yang berbeda untuk menghasilkan sebanyak mungkin ide-ide potensial, karena pada double-diamond membutuhkan pengamatan dan pemikiran terbuka [9].
Permasalahan yang didapat tersebut ialah sulitnya mengakses atau menyewa fasilitas di GOR. Para masyarakat harus bertemu dengan pengurus untuk menanyakan jadwal lapangan dan terkadang pengurus tidak ada ditempat. Dan solusi yang didapatkan yaitu merancang sebuah UI dengan sistem layanan mandiri untuk masyarakat agar tidak kesuliatan dalam menyewa fasilitas di GOR.

## 2.3.2 Design Thinking
Design thinking merupakan semacam pendekatan dalam membuat pengalaman yang melibatkan pada estetika, emosional, serta hubungan yang berorientasi pada moral sosial [10]. Dengan menggunakan metode design thinking peneliti akan mempunyai beberapa fase yang nantinya berguna untuk pengumpulan informasi, apa saja yang dibutuhkan oleh pengguna, membuat solusi yang bermanfaat, membangun representasi dari permasalahan dan solusi yang ditawarkan, serta memeriksa hasil representasi yang telah dibuat sehingga mendapatkan tolak ukur yang nantinya akan dibentuk sebuah desain sampai menjadi prototype [5].

## 2.3.3 Human-Centered-Design
Pada bagian Human-Centered-Design adalah faktor pendukung sebagai pendekatan yang berfungsi untuk memfokuskan pada penerapan faktor manusia dalam merancang dan mengembangkan sistem yang interaktif kepada pengguna [7]. Human-Centered Design sangat berpusat pada manusia sehingga desain yang dikembangkan dapat memenuhi kebutuhan [8]. Peneliti mempelajari secara langsung mengenai masalah yang akan dihadapi dengan memposisikan diri sebagai pengguna serta berusaha untuk merealisasikan gagasan dan ide yang telah dipelajari pada tahap sebelumnya dengan mengidentifikasi peluang.

## 3. HASIL DAN PEMBAHASAN
Di  dalam design thinking memiliki  beberapa fase seperti Empathy,  Define,  Ideate, Prototype, dan Testing yang tujuannya untuk memvalidasi ide sehingga keinginan user terpenuhi.
1402 Jatisi ISSN 2407-4322 Vol. 8, No. 3, September 2021, Hal . 1397-1406 E- ISSN 2503-2933

## 3.1 Pengumpulan Data
Pengumpulan data adalah fase Empathy dimana setelah melakukan pengumpulan data didapatkan beberapa permasalahan dan keresahan yang didapat, berikut merupakan keresahan dari masyarakat;
1. Kesulitannya dalam mengakses dan menyewa gelanggang olahraga 2. Sulit untuk mendapatkan informasi jadwal

## 3.2 Analisis Permasalahan
Setelah permasalahan dan keresahan dikumpulkan lalu diterjemahkan kedalam bentuk tantangan untuk diselesaikan, dimana semua permasalahan yang sudah ditemukan akan dibentuk menjadi pernyataan dengan bertujuan untuk mengembangkan keresahan menjadi solusi dalam perancangan.
1. Menjadikan proses untuk menyewa fasilitas menjadi lebih efisien
2. Membuat informasi jadwal penyewaan fasilitas menjadi lebih teratur
3. Menyediakan layanan pembayaran virtual
4. Dapat menghemat waktu

## 3.3 Pengembangan Ide Solusi
Pada tahapan ini yaitu fase ideate berfokus pada pengumpulan ide untuk menciptakan solusi berdasarkan permasalahan. Setelah mendapatkan solusi dibuatlah sebuah mind mapping untuk menerjemahkan solusi menjadi konsep model desain seperti pada gambar 4.
E- ISSN 2503-2933   1403

## Gambar 4. Konsep Model

## 3.4 Evaluasi Desain
Di evaluasi desain adalah fase Prototype dimana ada 3 tahap di fase prototype yaitu wireframe (Lo – Fi), Mockup (Hi – Fi), dan prototype .
Pada tahapan ini peneliti membuat sebuah wireframe untuk tata letak, kerangka dasar, dan komponen-komponen lainnya sebelum masuk pada tahap high – fidelity – design (Hi – Fi).
Gambar 5. Wireframe
1404 Jatisi ISSN 2407-4322 Vol. 8, No. 3, September 2021, Hal . 1397-1406 E- ISSN 2503-2933
Setelah membuat sebuah wireframe tahap selanjutnya ialah membuat mockup atau high – fidelity – design (Hi – Fi). High – fidelity – design (Hi – Fi) itu sendiri merupakan tahapan design akhir yang dijadikan secara detail dengan memberikan gambar, font, pewarnaan serta komponen lainnya.

## Gambar 6. Mockup
Dalam pembuatan prototype dengan bentuk High – fidelity – design bertujuan untuk mempermudah developer agar dapat memahami permasalahan dan juga solusi yang sesuai dengan pengalaman pengguna pada saat berinteraksi dengan sistem.

## 3.5 Analisa Hasil
Setelah permasalahan dan keresahan sudah dikumpulkan lalu diterjemahkan kedalam bentuk tantangan untuk diselesaikan dan desain sudah dibuat selanjutnya mengukur hasil usability testing dengan aspek yaitu effectiveness yang bertugas sebagai mengukur pencapaian layanan sebuah sistem yang layak kepada pengguna.
Atribut Effectiveness
Pengujian ini peneliti memberikan kepada 50 tester untuk menguji sebuah desain prototype yang sudah dibuat dan nantinya mendapatkan nilai rata-rata, perhitungan akan menggunakan Screen Usability Score Formula yang ada pada tools Maze dimana pada penilaian tersebut didapat dengan menyelesaikan tujuan.
Tabel 1. Matrix Pengujian Effectiveness 50 Tester Tujuan Tercapai* Gagal* Tujuan 1 94 6 Tujuan 2 87 13 Tujuan 3 85 15 Tujuan 4 67 33 Tujuan 5 92 8 Tujuan 6 90 10 Rata-rata 86 14 *Angka dilihat dalam bentuk persen (%)
E- ISSN 2503-2933   1405
Dapat dilihat pada tabel 1. bahwa 50 tester memiliki nilai rata rata 86 didapat dari persentase tingkat kesuksesan. Keefektifan nilai paling tinggi untuk menyelesaikan tujuan yaitu pada tujuan ke 1 sebesar 94% dengan faktor gagal 6% dimana 47 orang telah berhasil mencapai tujuan dan 3 orang lainnya telah gagal sedangkan untuk nilai paling rendah menyelesaikannya yaitu pada tujuan ke 4 dimana hanya 67% yang tercapai.

## 4. KESIMPULAN
Perancangan sistem pelayanan mandiri ini dibuat dengan menggunakan metode design thinking dan Human-Centered-Design sebagai pendekatannya. Untuk menguji prototype yang sudah dibuat, maka peneliti menguji dengan cara mengukur hasil usability testing kepada 50 orang, dimana atribut effectiveness sebagai aspeknya.
Pada pengujian yang telah dilakukan terdapat hasil nilai dengan rata-rata 86, dimana nilai tersebut menunjukan bahwa tingkat keefektifannya layak untuk pengguna dan mendapat nilai A dengan adjective rating tergolong Excellent . Dengan ini, dapat disimpulkan bahwa User Interface sangat dibutuhkan guna mempermudah masyarakat untuk menjembatani antara sistem dan pengguna.

## DAFTAR PUSTAKA
[1] H. Kaur and S. Malhotra, “Use of ‘Kiosks’ as a Self Service Tools in Libraries,” IEEE 5th Int. Symp. Emerg. Trends Technol. Libr. Inf. Serv. ETTLIS 2018 , pp. 269–271, 2018.
[2]  B. Wicaksono, “ Pengaruh Self-Service Technology Terhadap Kepercayaan, Kepuasan Nasabah, dan Loyalitas Nasabah (Survei pada Nasabah PT. Bank Rakyat Indonesia (Persero) Tbk. Kantor Cabang Malang Kawi Kanwil Malang),” J. Adm. Bisnis S1 Univ. Brawijaya , Vol. 25, No. 2, p. 86168, 2015.
[3] E. Susilo, F. D. Wijaya, and R. Hartanto, “Perancangan dan Evaluasi User Interface Aplikasi Smart Grid Berbasis Mobile Application, ” J. Nas. Tek. Elektro dan Teknol. Inf. , Vol. 7, No. 2, pp. 150–157, 2018.
[4]  H. Joo, “ A Study On Understanding of UI and UX, and Understanding of Design According to User Interface Change ,” Int. J. Appl. Eng. Res. , Vol. 12, No. 20, pp. 9931– 9935, 2017.
[5] A. Tristiaratri, A. H. Brata, and L. Fanani, “Perbandingan User Interface Aplikasi Mobile Pemesanan Tiket Pesawat Online Dengan Design Thinking,” J.  Pengemb. Teknol. Inf. dan Ilmu Komput. e-ISSN , vol. 2548, no. 6, p. 964X, 2017.
[6] A. Irb te and A. Strode, “ Design Thinking Models in Design Research and Education ,” Soc. Integr. Educ. Proc. Int. Sci. Conf. , Vol. 4, No. May, p. 488, 2016.
[7] A.  Nadaa  Aniesiyah,  H.  Tolle,  and  H.  Muslimah  Az-zahra,  “ Perancangan  User Experience Aplikasi Pelaporan Keluhan Masyarakat Menggunakan Metode Human- Centered Design, ” Pengemb. Teknol. Inf. dan Ilmu Komput. , Vol. 2, No. 11, p. 172, 2018.
1406 Jatisi ISSN 2407-4322 Vol. 8, No. 3, September 2021, Hal . 1397-1406 E- ISSN 2503-2933
[8]  A. Purnomo, “ Pengembangan User Experience (Ux) dan User Interface (Ui) Aplikasi Ibeauty Berbasis Android ,” JSTIE (Jurnal Sarj. Tek. Inform. , Vol. 6, No. 3, pp. 18–27, 2018.
[9] H.  F.  Wang  and  S.  Liou,  “Empathy:  Its  Proximate  and  Ultimate  Bases  in  Advancing Technology,” 2018 Int. Conf. Orange Technol. ICOT 2018 , pp. 1–4, 2018.
[10]  P. A. A. M, B. Suranto, and I. V Paputungan, “ Pembuatan Aplikasi Ayosparring dengan Pendekatan Design Thinking. ”