Journal of Information System Research (JOSH) Volume 4, No. 4, Juli 2023, pp 1072−1081 ISSN 2686-228X (media online) DOI 10.47065/josh.v4i4.3648 Penerapan Metode Design Thinking dalam Perancangan UI/UX Aplikasi Mobile SIPROPMAWA Soni Ansori, Purwono Hendradi*, Setiya Nugroho Fakultas Teknik, Program Studi Teknik Informatika, Universitas Muhammadiyah Magelang, Magelang Jl. Mayjen Bambang Soegeng, Glagak, Sumberrejo, Kec. Mertoyudan, Kabupaten Magelang, Jawa Tengah, Indonesia Email: 2,*p_hendra@ummgl.ac.id, 3setiya@ummgl.ac.id Email Penulis Korespondensi: p_hendra@ummgl.ac.id Submitted: 14/06/2023; Accepted: 14/07/2023; Published: 26/07/2023 Abstrak-Sipropmawa adalah sistem berbasis website yang dirancang untuk mengatur, mengawasi, dan mengelola penerimaan proposal secara online. Namun, penggunaan website sipropmawa masih belum optimal dan kurang memperhatikan desain user interface (UI) dan user experience (UX), terutama saat diakses melalui perangkat mobile, sehingga menimbulkan ketidaknyamanan pengguna saat menggunakan aplikasi tersebut. Selanjutnya motivasi dibalik pengujian ini adalah untuk mengupdate UI/UX aplikasi Sipropmawa dari situs menjadi aplikasi berbasis mobile dengan menerapkan metode desain thinking. Pilihan dibuat untuk pendekatan pemikiran desain karena menekankan kreativitas dalam penciptaan solusi baru dan menempatkan penekanan kuat pada pemahaman kebutuhan pengguna. Studi ini meliputi pengumpulan dan analisis data yang melibatkan lima tahapan metode design thinking yaitu empathize, define, ideat, prototype, dan testing. Penerapan metode desain thinking dalam pengembangan antarmuka pengguna UI/UX menghasilkan hasil yang dapat mencapai tujuan metode untuk meningkatkan kepuasan dan utilitas pengguna. Dalam hal ini, dukungan tersebut bergantung pada hasil pengujian kemudahan penggunaan yang mencapai skor akhir 86 dan mendapatkan klasifikasi B pada skala penilaian. Dengan demikian, hal ini menunjukkan bahwa pengguna menghargai tingkat kegunaan yang tinggi dari aplikasi Sipropmawa. Desain UI/UX dari aplikasi Sipropmawa diharapkan dapat menjadi model untuk pengembangan aplikasi Sipropmawa di masa depan. Kata Kunci: Design Thinking; User Inteface; User Experience; Mobile Application; Sipropmawa Abstract-Sipropmawa is a web-based system designed to manage, monitor, and oversee the online submission of proposals. However, the use of the Sipropmawa website is still suboptimal and lacks attention to user interface (UI) and user experience (UX) design, especially when accessed through mobile devices, resulting in user discomfort when using the application. Therefore, the motivation behind this testing is to update the UI/UX of the Sipropmawa application from a website to a mobile- based application by implementing the design thinking method. The choice was made to adopt a design thinking approach because it emphasizes creativity in creating new solutions and places a strong emphasis on understanding user needs. This study involves the collection and analysis of data, which includes five stages of the design thinking method: empathize, define, ideate, prototype, and testing. The implementation of the design thinking method in the development of the user interface (UI/UX) yields results that can achieve the goals of the method, which is to enhance user satisfaction and utility. In this regard, the support relies on the results of usability testing, which achieved a final score of 86 and obtained a B classification on the rating scale. Thus, this indicates that users highly appreciate the usability of the Sipropmawa mobile application. The UI/UX design of the Sipropmawa application is expected to serve as a model for future development of the Sipropmawa application. Keywords: Design Thinking; User Inteface; User Experience; Mobile Application; Sipropmawa 1. PENDAHULUAN Lembaga tinggi pendidikan adalah suatu tempat berlangsungnya proses pembelajaran. Setiap lembaga tinggi pendidikan pasti memiliki Organisasi Mahasiswa. Di Universitas Muhammadiyah Magelang (UNIMMA) sendiri juga mempunyai Organisasi Mahasiswa (ORMAWA), oleh karena itu dibuatlah Sistem Informasi Proposal Organisasi Mahasiswa (SIPROPMAWA). SIPROPMAWA adalah sistem yang dibuat untuk mengatur, mengawasi dan mengelola penerimaan proposal organisasi mahasiswa secara online. Tujuannya adalah untuk memudahkan dan mempercepat proses pengajuan proposal organisasi mahasiswa serta mengawasi kegiatan organisasi mahasiswa. SIPROPMAWA juga memberikan kemudahan bagi mahasiswa untuk mengajukan proposal organisasi secara online, tanpa harus datang ke kampus dan sistem ini juga menampilkan semua agenda ORMAWA yang ada di UNIMMA. Meskipun sistem Sipropmawa telah dirancang dengan baik, namun masih banyak pengguna yang mengalami kesulitan dalam mengimplementasikannya. Oleh karena itu, pengguna berharap ada perbaikan pada tampilan UI/UX dan fungsi pada sistem Sipropmawa agar penggunaan sistem tersebut menjadi lebih mudah dan efisien. Pengembangan desain interface seringkali dilakukan tanpa observasi pengguna, menyebabkan kesalahan dan produk yang memaksa pengguna dengan fitur sulit atau membosankan. Jika dalam peningkatan aplikasi pengguna menjadi perhatian utama, aplikasi akan mudah digunakan pengguna[1]. Rachma mengatakan bahwa untuk membuat antarmuka pengguna yang baik dan memenuhi kebutuhan pengguna, Anda tidak hanya perlu mengetahui prinsip dan pedoman desain secara detail, tetapi juga ruang desain yang terdiri dari beberapa bagian. Bagian-bagian ini menggabungkan segmen gambar yang dapat digunakan, pilihan desain, dan pilihan visualisasi yang disempurnakan[2]. Desain antarmuka pengguna dan pengalaman pengguna atau UI/UX sangat penting karena dapat membuat pengguna merasa nyaman saat menggunakan suatu produk jika dirancang dengan baik dan memenuhi kebutuhan pengguna[3]. Pengguna ingin tetap berada di situs web jika memiliki desain UI/UX yang bagus. Di sisi lain, pengguna situs web akan pergi jika memiliki desain UI/UX yang buruk[4]. Copyright © 2023 The Author, Page 1072 This Journal is licensed under a Creative Commons Attribution 4.0 International License
Journal of Information System Research (JOSH) Volume 4, No. 4, Juli 2023, pp 1072−1081 ISSN 2686-228X (media online) DOI 10.47065/josh.v4i4.3648 User interface (UI) sistem aplikasi berbasis mobile sangat penting karena hampir semua aplikasi mobile memiliki user interface[5]. Jika antarmuka pengguna tidak terstruktur dengan baik, maka pengguna akan merasa frustrasi dan hal ini akan berdampak pada produktivitas mereka. Selain UI, UX juga merupakan hal penting yang harus diperhatikan. Menurut Saptari, pengalaman pengguna (UX) sering kali digunakan sebagai salah satu faktor untuk menilai kualitas suatu sistem[6]. UX melibatkan sikap, perilaku, dan emosi pengguna ketika menggunakan produk, sistem, atau layanan. Ini terkait dengan persepsi individu pengguna tentang manfaat dan kemudahan yang diperoleh dari penggunaan sistem tersebut. Oleh karena itu, perlu adanya pengembang SIPROPMAWA yang memperhatikan desain UI/ UX agar pengguna dapat merasa nyaman dan terbantu ketika menggunakan aplikasi tersebut. Pengembangan system akan berfokus pada aplikasi berbasis mobile. Hal ini disebabkan karena perangkat mobile sangat populer dan banyak digunakan oleh masyarakat terutama ORMAWA UNIMMA. Pengembangan aplikasi mobile akan memudahkan pengguna dalam mengakses dan memanfaatkan sistem[7]. Aplikasi mobile juga akan lebih memudahkan pengguna dalam melihat / merevisi proposal yang diajukan. Untuk merancang sistem informasi tersebut, dibutuhkan suatu metode yang tepat, seperti Metode Design Thinking. Design Thinking dipilih sebagai metode yang digunakan untuk mengatasi masalah tersebut. Metode Design Thinking adalah pendekatan inovasi yang berfokus pada manusia, yang melibatkan desainer untuk mengintegrasikan kebutuhan orang-orang, teknologi, dan kebutuhan bisnis[8]. Metode ini berfokus pada pencarian solusi masalah dengan menggunakan pendekatan berbasis masalah. Memanfaatkan pendekatan pengalaman pengguna dan antarmuka pengguna, pendapat langsung pengguna dikumpulkan untuk mengevaluasi kualitas produk, khususnya aplikasi mobile[9]. Berdasarkan masalah di atas Penggunaan metode design thinking dianggap sebagai solusi yang efektif untuk menyelesaikan masalah dan mengembangkan model prototype desain yang telah teruji dan sesuai dengan kebutuhan pengguna[10]. Berdasarkan penelitian sebelumnya yang dilakukan oleh Pradana, ditemukan bahwa dengan menerapkan metode design thinking, penelitian ini berhasil mengenali kebutuhan pengguna dan merancang antarmuka yang menarik dan mudah dipahami[11]. Adhitya juga menggunakan metode design thinking untuk mendesain interface aplikasi mobile. Temuan penelitian ini menunjukkan bahwa metode ini mampu memahami masalah dan kebutuhan pengguna serta menawarkan solusi yang efektif untuk masalah tersebut[12]. Sementara, penelitian yang dibuat oleh Angelina, dia berbicara tentang bagaimana merencanakan rencana antarmuka aplikasi penawaran yang sesuai dengan kebutuhan bisnis menggunakan pendekatan desain thinking. Hasil penelitian menunjukkan bahwa desain akhir diterima dengan baik, memenuhi persyaratan bisnis, dan dapat diterima oleh calon pengguna[13]. Penelitian tambahan yang dilakukan oleh Valentino membahas mengenai penerapan metode design thinking dalam merancang desain aplikasi yang mendukung proses mentoring atau kursus 1:1 antara siswa dan mentor. Penelitian ini menunjukkan bahwa metode tersebut terbukti efektif dalam menciptakan desain UI/UX yang dapat dipelajari dengan mudah dan telah memenuhi kebutuhan pengguna.[14]. Di sisi lain, hasil penelitian yang dilakukan oleh Nabila mengenai penerapan metode design thinking dan agile dalam rancang bangun aplikasi penjualanku menunjukkan bahwa metode Design Thinking memiliki efektivitas yang lebih tinggi dalam menghasilkan solusi-solusi yang kreatif dan inovatif dalam perancangan aplikasi mobile[15]. Dari penelitian yang telah dilakukan, kesimpulannya adalah bahwa penerapan metode design thinking terbukti efektif dalam merancang desain UI/UX untuk produk dan layanan, termasuk website dan aplikasi mobile. Penelitian ini memiliki tujuan untuk mengembangkan SIPROPMAWA berbasis mobile dengan menerapkan metode design thinking. Diharapkan dengan menggunakan metode design thinking, masalah dapat meningkatkan kenyamanan serta mengembangkan system sesuai dengan kebutuhan ORMAWA UNIMMA. 2. METODOLOGI PENELITIAN Design Thinking adalah pendekatan yang melibatkan kolaborasi dengan pengguna untuk menemukan solusi bagi suatu masalah. Tujuan utamanya adalah menciptakan layanan yang inovatif, sesuai dengan kebutuhan pengguna, dan dapat mengatasi masalah yang ada. Tahapan penelitian, di sisi lain, merujuk pada serangkaian langkah atau proses yang dilakukan oleh seorang peneliti dalam menjalankan sebuah penelitian. Langkah-langkah ini biasanya mencakup identifikasi masalah yang diteliti, tujuan penelitian, metode penelitian yang digunakan, hasil yang diperoleh, serta kesimpulan yang diambil dari awal hingga akhir penelitian. Gambar 1. Tahapan Metode Design Thinking Gambar 1 menunjukkan lima tahap dalam proses design thinking, yaitu tahap empathize, define, ideat, pembuatan prototype, dan test. Setiap tahap ini berperan sebagai fondasi bagi tahap selanjutnya, sehingga biasanya Copyright © 2023 The Author, Page 1073 This Journal is licensed under a Creative Commons Attribution 4.0 International License
Journal of Information System Research (JOSH) Volume 4, No. 4, Juli 2023, pp 1072−1081 ISSN 2686-228X (media online) DOI 10.47065/josh.v4i4.3648 dilakukan dalam urutan yang terstruktur. Namun, karena pendekatan desain thinking bersifat fleksibel, juga memungkinkan untuk melaksanakan tahapan-tahapan tersebut dalam urutan yang tidak terlalu terikat pada logika linier[16]. 2.1 Tahapan Penelitian 2.1.1 Empathize Tahap Empathize dapat dijelaskan sebagai upaya untuk mendapatkan pemahaman dan perhatian yang mendalam terhadap pengguna agar dapat memahami kebutuhan dan keinginan mereka dengan baik[17]. Di tahap awal, peneliti melakukan pengumpulan data secara mandiri melalui observasi dan wawancara terhadap pengguna aplikasi Sipropmawa. Pengguna tersebut adalah mahasiswa yang pernah tergabung dalam sebuah ORMAWA dan telah memiliki pengalaman menggunakan aplikasi siperopmawa sebelumnya. Setelah data terkumpul, peneliti melakukan evaluasi terhadap data tersebut. Evaluasi ini dilakukan dengan tujuan mengenali kebutuhan dan masalah yang dihadapi oleh pengguna saat menggunakan aplikasi yang akan dirancang. 2.1.2 Define Tahap Define bertujuan untuk menganalisis data dari tahap empathize guna mengidentifikasi masalah pengguna[18]. Untuk mengidentifikasi kategori yang sesuai dengan kebutuhan pengguna, peneliti menganalisis data yang diperoleh dari wawancara, observasi, dan tinjauan pustaka. Dalam rangka menciptakan struktur yang terorganisir, peneliti menggunakan affinity diagram untuk mengelompokkan informasi yang ada. Pada tahap define, affinity diagram membantu pengembangan konsep terfokus dan berorientasi[19]. Dengan memahami pola- pola yang muncul, peneliti dapat meningkatkan kreativitas mereka dalam menemukan solusi yang tepat untuk masalah-masalah yang dihadapi oleh pengguna. 2.1.3 Ideate Tahap Ideate dalam metode design thinking merupakan saat dimana ide-ide inovatif dan kreatif dihasilkan untuk menemukan solusi dari masalah yang telah diidentifikasi[20]. Metode brainstorming digunakan oleh peneliti untuk menghasilkan sejumlah ide dan solusi. Tujuan dari tahap ideate adalah untuk mencari solusi yang kreatif dan inovatif untuk masalah yang baru ditemukan, dan memilih solusi terbagus dari berbagai pilihan yang tersedia. Kebutuhan pengguna akan digunakan sebagai acuan dalam menentukan prioritas solusi yang dipilih. 2.1.4 Prototype Dalam proses design thinking, peneliti mengembangkan prototype, yang merupakan model atau representasi dari ide-ide yang dihasilkan pada tahap sebelumnya. Tahap ini memiliki peranan penting. Peneliti menggunakan berbagai tahap, seperti Userflow, wireframe, dan mockup, untuk membuat prototype. Tahap prototype sangat signifikan dalam proses perencanaan karena memungkinkan para ahli untuk mengurangi risiko kesalahan atau kekecewaan pada tahap selanjutnya. Dengan menggunakan prototype, peneliti dapat memperjelas dan menguji ide-ide mereka sebelum melanjutkan ke tahap implementasi yang lebih lanjut. Prototype akan dievaluasi ulang melalui pengamatan dan analisis sebelum produk akhir dirilis ke publik untuk menentukan tingkat keberhasilan dan kegagalan media[21]. 2.1.5 Test Pengujian dilakukan untuk mengevaluasi kinerja prototype dan memastikan bahwa produk telah berjalan dengan baik. Prototype yang telah selesai dibuat kemudian diujikan kepada pengguna, yang memberikan umpan balik untuk membantu meningkatkan kualitas produk. Dalam penelitian ini, pengujian dilakukan dengan melibatkan 5 orang karena setelah diuji pada 6 pengguna, kemungkinan hasil yang diperoleh akan serupa. Sistem pengujian dilakukan dengan menggunakan survei, dan untuk mengukur hasil eksperimen digunakan System Usability Scale (SUS). SUS adalah strategi pengujian kenyamanan yang menarik dan solid untuk aplikasi. SUS merupakan sebuah kuisioner yang digunakan untuk mengukur tingkat kegunaan sistem dari sudut pandang individu pengguna, dan hasilnya digunakan untuk mengevaluasi tingkat kegunaan sistem tersebut[22]. 3. HASIL DAN PEMBAHASAN Inilah hasil yang diperoleh dari penerapan metode Design Thinking dalam perancangan aplikasi Sipropmawa yang memiliki tujuan yang jelas, yaitu untuk mengidentifikasi permasalahan yang ada, menghasilkan solusi yang efektif, serta melahirkan inovasi-inovasi yang didasarkan pada perspektif pengguna. Melalui metode Design Thinking, peneliti mampu menggali pemahaman mendalam tentang kebutuhan, keinginan, dan tantangan yang dihadapi oleh pengguna. Dalam proses ini, langkah-langkah design thinking dilaksanakan dengan kesungguhan untuk memastikan bahwa aplikasi Sipropmawa dapat memberikan solusi yang relevan, intuitif, dan menyenangkan bagi pengguna. Dengan demikian, penerapan metode Design Thinking dalam perancangan aplikasi Sipropmawa Copyright © 2023 The Author, Page 1074 This Journal is licensed under a Creative Commons Attribution 4.0 International License
Journal of Information System Research (JOSH) Volume 4, No. 4, Juli 2023, pp 1072−1081 ISSN 2686-228X (media online) DOI 10.47065/josh.v4i4.3648 berhasil memberikan hasil yang berdampak signifikan dan mampu meningkatkan pengalaman pengguna secara menyeluruh. Di bawah ini adalah pembahasannya:. 3.1 Implementasi Design Thinking 3.1.1 Empathize Di tahap ini, peneliti melakukan pengumpulan data secara mandiri menggunakan teknik observasi dan wawancara langsung dengan pengguna. Tujuan dari kegiatan ini adalah untuk memperoleh pemahaman yang mendalam dan perhatian terhadap pengguna, sehingga peneliti dapat memahami permasalahan dan keinginan pengguna dengan baik. Akhir dari informasi yang diperoleh peneliti sehubungan dengan masalah dan keinginan pengguna tercantung pada Tabel 1. Tabel 1. Masalah Pengguna NO 1 2 3 4 5 6 MASALAH Tampilan UI/UX yang kurang ramah pengguna (friendly) Tampilan UI/UX yang kurang mendukung untuk di akses meggunakan perangkat mobile Pemilihan warna dan font yang kurang optimal Penambahan fitur baru yang dapat membantu pengguna Terlalu banyak fitur yang tidak dibutuhkan Penggunaan icon yang sulit dipahami dan ketidak konsistenan dalam tata letak. Berdasarkan pengamatan terhadap website yang telah ada, terlihat bahwa tampilan UI/UX kurang friendly. Gambar 2 menyajikan tampilan website sebelumnya yang terlihat dalam pemilihan warna yang kurang optimal dan penggunaan ikon yang sulit dipahami serta ketidak konsistenan dalam tata letak. Pengguna juga merasa banyak fitur yang tidak dibutuhkan dan berharap penambahan fitur baru yang lebih interaktif untuk membantu pengguna dalam mengoperasikan aplikasi tersebut. Gambar 2. Tampilan Web Sipropmawa Lama 3.1.2 Define Pada tahap ini, peneliti mengklarifikasi hasil dari proses wawancara dan observasi dengan pengguna agar fokus pada inti permasalahan yang ada. Selanjutnya, data tersebut diproses dan diatur menggunakan teknik affinity diagram. Setelah melalui proses pengolahan data, peneliti berhasil mengelompokkan hasil ke dalam tiga kategori utama yang menjadi fokus dalam pembahasan, yaitu masalah penggunaan, masalah tampilan, dan kebutuhan pengguna. Dalam kategori pertama yang berkaitan dengan masalah pengguna, terdapat kendala dalam mengakses menggunakan perangkat seluler dan sulitnya mengetahui berkas yang sudah diterima/dikembalikan, serta kesulitan dalam mencari fitur-fitur tertentu yang ada di situs web tersebut. Sementara itu, dalam kategori kedua yang berhubungan dengan tampilan, terdapat beberapa masalah yang perlu diatasi. Misalnya, tampilan UI yang kurang ramah pengguna dan terasa membosankan. Selain itu, pemilihan warna dan font yang belum optimal juga menjadi perhatian. Selanjutnya, penggunaan icon yang sulit dipahami dan ketidak konsistenan dalam tata letak juga perlu diperbaiki. Pada kategori terakhir, kebutuhan pengguna meliputi harapan akan adanya fitur baru yang lebih Copyright © 2023 The Author, Page 1075 This Journal is licensed under a Creative Commons Attribution 4.0 International License
Journal of Information System Research (JOSH) Volume 4, No. 4, Juli 2023, pp 1072−1081 ISSN 2686-228X (media online) DOI 10.47065/josh.v4i4.3648 interaktif dan dapat membantu mempermudah penggunaan aplikasi. Selain itu, pengguna juga menginginkan tampilan yang mudah diakses menggunakan perangkat seluler. Dalam hal ini, tampilan UI yang mudah, sederhana, informatif, dan ramah pengguna sangat diharapkan. Terakhir, pengguna juga menginginkan penggunaan icon yang sesuai dengan konteks dan tata letak yang konsisten dalam antarmuka aplikasi. Dengan memperhatikan kategori- kategori tersebut, pengembang dapat memprioritaskan perbaikan dan penyesuaian yang sesuai untuk meningkatkan pengalaman pengguna aplikasi. Dengan menggunakan teknik affinity diagram, peneliti dapat secara terfokus menciptakan solusi yang tepat dan sesuai dengan kebutuhan pengguna. Dengan menerapkan teknik ini, peneliti dapat menganalisis dan memahami masalah yang dihadapi oleh pengguna secara terstruktur. Implementasi teknik affinity diagram dalam pengorganisasian data dapat dilihat dalam Gambar 3. Gambar 3. Affinity Diagram 3.1.3 Ideate Tahap berikutnya adalah Ideate, di mana peneliti menghasilkan ide dan solusi berdasarkan masalah-masalah pengguna yang diidentifikasi pada tahap sebelumnya. Hasil dari tahap ini adalah ide-ide yang tercatat dalam Tabel 2. Tabel 2. Ide dan Solusi yang di dapatkan No 1 Mengembangkan desain UI/UX yang mudah dipahami oleh pengguna 2 Merubah yang semulanya berbasis website menjadi berbasis mobile 3 Mengembangkan desain UI/UX dengan pilihan warna, font, dan gaya yang menyenangkan dan nyaman Ide dan Solusi bagi pengguna saat digunakan. 4 Menghapus fitur yang tidak dibutuhkan dan Menambahkan fitur last seen, notifikasi dan search untuk membantu pengguna dalam penggunaan aplikasi sipropmawa. 5 Memilih icon yang identik dengan fitur yang ada dan Pada tahap sebelumnya, ide-ide dan solusi-solusi tersebut muncul setelah melakukan analisis masalah dan mengidentifikasi kebutuhan pengguna. Ide-ide ini dihasilkan melalui proses brainstorming dan kemudian dikelompokkan menggunakan teknik affinity diagram. Semua ide dan solusi ini menjadi acuan dalam merancang tampilan UI/UX yang lebih baik untuk aplikasi Sipropmawa, dengan tujuan memenuhi kebutuhan pengguna secara optimal. Ide dan solusi yang telah tercatat dalam Tabel 2 akan digunakan sebagai dasar untuk membuat desain prototype yang akan diuji kepada pengguna pada tahap berikutnya, yaitu tahap prototype. 3.1.4 Prototype Tahap prototipe merupakan salah satu elemen krusial dalam proses berpikir desain yang dilakukan oleh peneliti. Pada tahap ini, mereka membuat model atau prototype dari konsep yang dihasilkan pada tahap sebelumnya. Dengan menggunakan prototype, peneliti dapat memperjelas dan menguji ide-ide mereka sebelum melanjutkan ke tahap implementasi yang lebih lanjut. Berikut adalah beberapa langkah krusial yang perlu dijalankan dalam tahap prototipe: a. Userflow : Pada fase ini, para peneliti telah membuat sebuah diagram alur pengguna yang bertujuan untuk menggambarkan urutan langkah-langkah yang diambil oleh pengguna saat menggunakan aplikasi mobile SIPROPMAWA. Tujuan utama dari diagram ini adalah memberikan gambaran yang lebih terperinci dan jelas tentang bagaimana pengguna akan menggunakan aplikasi tersebut, sehingga memudahkan pemahaman dan navigasi pengguna dalam menjalankan fungsi-fungsi aplikasi. Dengan adanya diagram ini, diharapkan pengguna dapat dengan mudah mengikuti alur penggunaan aplikasi dan memaksimalkan pengalaman pengguna mereka. Dengan adanya diagram user flow, peneliti dapat memvisualisasikan secara sistematis dan terstruktur bagaimana pengguna akan berinteraksi dengan aplikasi serta mengidentifikasi potensi masalah atau Copyright © 2023 The Author, Page 1076 This Journal is licensed under a Creative Commons Attribution 4.0 International License
Journal of Information System Research (JOSH) Volume 4, No. 4, Juli 2023, pp 1072−1081 ISSN 2686-228X (media online) DOI 10.47065/josh.v4i4.3648 perbaikan yang dapat dilakukan untuk meningkatkan pengalaman pengguna secara keseluruhan. Userflow dapat dilihat pada gambar 4. Gambar 4. User Flow b. Wireframe : Pada gambar 5, Peneliti telah membuat seketsa tampilan sederhana untuk membuat rancangan UI aplikasi mobile SIPROPMAWA. Peneliti hanya membuatnya dalam sketsa ini tanpa mempertimbangkan aspek visual dengan cermat. Sebelum desainer mulai memasukkan elemen visual yang lebih kompleks, wireframe digunakan untuk memastikan bahwa struktur antarmuka aplikasi memenuhi kebutuhan pengguna. Komponen penting tampilan aplikasi, seperti tombol, menu, dan elemen lainnya, juga dijelaskan dalam wireframe. Gambar 5. Wireframe Aplikasi Sipropmawa c. Mockup : Pada tahap ini peneliti membangun model atau prototype interface aplikasi mobile Sipropmawa yang lebih mendalam. Tujuan penggunaan maket ini adalah untuk menguji dan memvisualisasikan konsep yang dibuat sebelumnya. Peneliti sangat memperhatikan setiap aspek tampilan aplikasi selama proses pembuatan mockup, meliputi warna, font, dan ukuran elemen. Pilihan untuk membuat presentasi sederhana dan elemen-elemen yang dapat diabaikan dirancang untuk memudahkan pengguna untuk memahami dan menggunakan aplikasi. Selain itu, strategi ini berpotensi mempercepat waktu pemuatan aplikasi dan kinerja keseluruhan. Agar aplikasi mobile Sipropmawa tampil profesional dan sesuai dengan identitas visual kampus, Copyright © 2023 The Author, Page 1077 This Journal is licensed under a Creative Commons Attribution 4.0 International License
Journal of Information System Research (JOSH) Volume 4, No. 4, Juli 2023, pp 1072−1081 ISSN 2686-228X (media online) DOI 10.47065/josh.v4i4.3648 pemilihan warna yang melengkapi branding kampus UNIMMA juga penting. Peneliti juga mempertimbangkan kegunaan pengguna saat memilih tata letak yang ditunjukkan pada Gambar 6, sehingga fitur yang tersedia dapat dengan mudah ditemukan dan dimanfaatkan. Menggunakan tata letak yang baik dapat mengurangi kemungkinan kesalahan atau ketidaktahuan pengguna saat menggunakan aplikasi dan meningkatkan keterlibatan pengguna. Gambar 6. Mockup Aplikasi Sipropmawa Setelah melalui fase prototype, peneliti berhasil menghasilkan desain UI/UX aplikasi mobile Sipropmawa yang telah dibuat menggunakan Userflow, Wireframe, dan Mockup. Selain itu, dalam tahap ini, peneliti juga secara aktif melakukan evaluasi terhadap desain yang telah dibuat dengan melibatkan pengguna untuk mendapatkan masukan dan saran yang berharga guna meningkatkan kualitas antarmuka aplikasi tersebut. Evaluasi ini bertujuan untuk memastikan bahwa antarmuka aplikasi mobile Sipropmawa sesuai dengan kebutuhan dan harapan pengguna, serta meningkatkan pengalaman pengguna dalam penggunaannya. 3.1.5 Test System Usability Scale (SUS) adalah alat yang digunakan untuk mengukur kegunaan atau usability dari suatu sistem, produk, atau layanan. Ini adalah skala penilaian yang sering digunakan untuk mengevaluasi sejauh mana pengguna dapat dengan mudah menggunakan sistem atau produk tersebut, seberapa efektif mereka dalam mencapai tujuan mereka, serta kepuasan pengguna terhadap pengalaman penggunaan. Pengguna diminta untuk memberikan penilaian berdasarkan skala Likert yang terdiri dari lima pilihan jawaban, Setiap item pertanyaan menggunakan skala lima poin, di mana responden menilai setiap pernyataan dari 1 hingga 5. Pada skala ini, angka 1 menunjukkan ketidaksetujuan yang kuat, sedangkan angka 5 menunjukkan persetujuan yang kuat.. Nilai skor dari setiap pertanyaan berkisar dari 0 hingga 4. Dalam perhitungan skor SUS, untuk pertanyaan nomor ganjil, skor didapatkan dengan mengurangi 1 dari posisi pada skala. Sedangkan untuk pertanyaan nomor genap, skor didapatkan dengan mengurangi posisi pada skala dari 5. Untuk mendapatkan skor SUS secara keseluruhan, jumlahkan skor dari setiap pertanyaan dan kalikan dengan 2,5. Skor akhir SUS akan berada dalam rentang 0 hingga 100, Dimana semakin tinggi skor yang diperoleh menandakan tingkat kegunaan sistem atau produk yang lebih baik. Pernyataan dalam SUS mencakup aspek-aspek seperti kesederhanaan penggunaan, kemudahan pembelajaran, kepercayaan pengguna terhadap sistem, serta keinginan pengguna untuk menggunakan sistem tersebut di masa depan. Skor SUS dihitung berdasarkan pernyataan yang dijawab oleh pengguna dan dapat memberikan gambaran mengenai kepuasan pengguna secara keseluruhan terhadap sistem yang dievaluasi. Dengan menggunakan SUS, pengembang atau peneliti dapat memperoleh wawasan yang berharga mengenai pengalaman pengguna dan mengidentifikasi area perbaikan yang diperlukan untuk meningkatkan kegunaan sistem. Gambar 7 menampilkan pertanyaan yang terdapat dalam kuisioner yang telah diisi ajukan kepada pengguna. Copyright © 2023 The Author, Page 1078 This Journal is licensed under a Creative Commons Attribution 4.0 International License
Journal of Information System Research (JOSH) Volume 4, No. 4, Juli 2023, pp 1072−1081 ISSN 2686-228X (media online) DOI 10.47065/josh.v4i4.3648 Gambar 7. Pertanyaan SUS Berikut adalah hasil yang diperoleh dari lembar kuesioner SUS setelah diberikan kepada pengguna dan diisi pasca pengujian. Hasil ini ditampilkan dalam Tabel 3 sebagai berikut: Tabel 3. Hasil Kuisioner SUS User1 User2 User3 User4 User5 Q1 Q2 Q3 Q4 Q5 Q6 Q7 Q8 Q9 4 3 4 3 3 3 4 3 4 4 4 3 3 3 4 3 4 3 3 4 3 4 4 3 3 4 4 3 4 3 3 3 4 4 4 3 4 3 3 4 4 4 3 4 4 Skor Akhir SUS Q10 3 2 3 3 3 Jumlah Skor SUS 34 34 34 35 35 85 85 85 87,5 87,5 86 Pada tabel 3 telah diketahui hasil dari Skor SUS. Cara penghitungan Skor SUS yaitu Jumlah dikali 2,5 akan : menghasilkan Skor SUS x̅ = langkah selanjutnya yaitu menghitung Skor Akhir SUS dengan rumus ∑ x n x̅ = 430 5 x̅ = 86 Keterangan : x̅ ∑ X n : Nilai Rata-rata : Jumlah Skor : Total Responden Berdasarkan hasil pengujian prototype UI/UX aplikasi mobile Sipropmawa, ditemukan bahwa skor akhir System Usability Scale (SUS) mencapai 86/100. Hasil ini mengindikasikan bahwa pengguna memiliki persepsi yang positif terhadap kegunaan aplikasi tersebut. Jika merujuk pada batas bawah rata-rata skor SUS sebesar 68/100, dapat disimpulkan bahwa desain aplikasi ini diterima dengan baik oleh pengguna dan pantas untuk digunakan. Gambar 8. Indikator Nilai SUS Copyright © 2023 The Author, Page 1079 This Journal is licensed under a Creative Commons Attribution 4.0 International License
Journal of Information System Research (JOSH) Volume 4, No. 4, Juli 2023, pp 1072−1081 ISSN 2686-228X (media online) DOI 10.47065/josh.v4i4.3648 Setelah dilakukan analisis berdasarkan indikator SUS yang terdapat pada gambar 8, ditemukan bahwa skor SUS aplikasi mobile Sipropmawa mencapai angka 86. Skor ini menunjukkan bahwa desain aplikasi mencapai kategori B pada skala peringkat dan memiliki tingkat keunggulan yang tinggi. Berdasarkan temuan ini, aplikasi mobile sipropmawa mudah digunakan dan kemungkinan akan diterima dengan baik. Hasil ini menunjukkan bahwa desain UI/UX aplikasi Sipropmawa berhasil mencapai tujuan yang diinginkan untuk meningkatkan kegunaan dan kepuasan pengguna. 4. KESIMPULAN Berdasarkan temuan penelitian yang telah dilakukan dengan pengujian prototype pada perancangan aplikasi Sipropmawa UI/UX berbasis mobile dengan metode design thinking, aplikasi ini mendapat tanggapan positif dari lima pengguna merupakan calon pengguna aplikasi Sipropmawa melalui usability testing. Kesimpulan ini dapat dibuat berdasarkan temuan penelitian. Penilaian dari lima klien menunjukkan reaksi positif terhadap desin rancangan UI/UX aplikasi mobile sipropmawa. Hal ini terlihat dari skor SUS (System Usability Scale) yang tinggi yaitu 86 dari 100 untuk aplikasi mobile sipropmawa. Pada skala penilaian, kategori B diberikan untuk skor ini, yang menunjukkan tingkat keunggulan yang tinggi. Memahami persyaratan pengguna dan mengembangkan solusi yang dapat memenuhi persyaratan ini telah terbukti layak dengan proses desain yang menggunakan metode design thinking. Di tahap empathize, penekanannya adalah memahami masalah pengguna dari atas ke bawah. Masalahnya didefinisikan dengan jelas selama fase define. Solusi kreatif dihasilkan selama tahap Ideate. Tahap protoype membuat rencana antarmuka aplikasi gambaran dari pengaturan yang mendasarinya. Walaupun respon terhadap desain rancangan UI/UX aplikasi Sipropmawa berbasis mobile telah positif, tetap diperlukan upaya pengembangan secara berkala untuk menjawab kebutuhan yang terus berkembang dan mengikuti kemajuan teknologi. Selain itu, desain pengembangan UI/UX aplikasi Sipropmawa berbasis mobile dapat berfungsi sebagai panduan untuk pengembangan aplikasi Sipropmawa di masa depan, REFERENCES [1] Mastery, UX Techniques. Diambil kembali dari UX Mastery: [Online]. Available: [2] R. W. Purwitasari, P. D. Y. Nainggolan, N. Rahmawati, F. D. Adhinata, and N. G. Ramadhan, "Perancangan UI/UX Webinar Booking Terhadap Kepuasan Pengguna Menggunakan Metode Design Thinking," JURIKOM (Jurnal Ris. Komputer), vol. 8, no. 6, p. 350, 2021, doi: 10.30865/jurikom.v8i6.3700. [3] H. Ilham, B. Wijayanto, and S. P. Rahayu, "Analysis and Design of User Interface/User Experience With the Design Thinking Method in the Academic Information System of Jenderal Soedirman University," J. Tek. Inform., vol. 2, no. 1, pp. 17-26, 2021, doi: 10.20884/1.jutif.2021.2.1.30. [4] Azizah Khoiro Nisah, Hamidillah Ajie, and Widodo, "Perancangan Berbasis User Experience Pada Modul Admin Sistem Informasi Akademik Universitas Negeri Jakarta," PINTER J. Pendidik. Tek. Inform. dan Komput., vol. 5, no. 2, pp. 56- 64, 2021, doi: 10.21009/pinter.5.2.9. I. Rochmawati, "Iwearup.Com User Interface Analysis," Visualita, vol. 7, no. 2, pp. 31-44, 2019, doi: 10.33375/vslt.v7i2.1459. J. Saptari, R. Iswandari, and R. Setyawati, "User Experience (UX) dalam pemanfaatan fasilitas Informal Learning Space (ILS) perpustakaan," Berk. Ilmu Perpust. dan Inf., vol. 14, no. 1, p. 26, 2018, doi: 10.22146/bip.27502. [5] [6] [7] T. Alam, Y. M. Alharbi, F. A. Abusallama, and A. O. Hakeem, "Smart Campus Mobile Application Toward the Development of Smart Cities," Int. J. Appl. Sci. Smart Technol., vol. 02, no. 01, pp. 75-88, 2020, doi: 10.24071/ijasst.v2i1.2376. J. Teknologi et al., "PERANCANGAN APLIKASI PEMILIHAN KEPALA DESA DENGAN METODE UX DESIGN THINKING ( STUDI KASUS : KAMPUNG KURIPAN )," vol. 2, no. 2, pp. 52-60, 2021. [8] [9] M. Subhan and A. D. Indriyanti, "Penggunaan Metode Heuristic Evaluation sebagai Analisis Evaluasi User Interface dan User Experience pada Aplikasi BCA Mobile," J. Emerg. Inf. Syst. Bus. Intell., vol. 2, no. 3, pp. 30-37, 2021, [Online]. Available: [10] M. S. Hadafi and B. A. Herlambang, "Pengembangan Ui/Ux Design Studi Kasus Aplikasi Campaign Menggunakan Metode Design Thinking," Sci. Eng. Natl. Semin., vol. 6, no. Sens 6, pp. 297-307, 2021, [Online]. Available: [11] A. R. Pradana and M. Idris, "Implementasi User Experience Pada Perancangan User Interface Mobile E-learning Dengan Pendekatan Design Thinking," AUTOMATA, vol. 2, no. 2, 2021. [12] M. A. D. Pratama, Y. R. Ramadhan, and T. I. Hermanto, "Rancangan UI/UX Design Aplikasi Pembelajaran Bahasa Jepang Pada Sekolah Menengah Atas Menggunakan Metode Design Thinking," JURIKOM (Jurnal Ris. Komputer), vol. 9, no. 4, p. 980, 2022, doi: 10.30865/jurikom.v9i4.4442. [13] K. Angelina, E. Sutomo, and V. Nurcahyawati, "Desain UI UX Aplikasi Penjualan dengan Menyelaraskan Kebutuhan Bisnis menggunakan Pendekatan Design Thinking," Temat. J. Teknol. Inf. Komun., vol. 9, no. x, pp. 70-78, 2022, [Online]. Available: [14] V. K. Reynaldi and N. Setiyawati, "Perancangan Ui/Ux Fitur Mentor on Demand Menggunakan Metode Design Thinking Pada Platform Pendidikan Teknologi," JIPI (Jurnal Ilm. Penelit. dan Pembelajaran Inform., vol. 7, no. 3, pp. 835-849, 2022, doi: 10.29100/jipi.v7i3.3109. [15] Z. Amin and N. Pasha, "Penerapan Metode Design Thinking dan Agile dalam Rancang Bangun Aplikasi Penjualanku," vol. 4, no. 3, pp. 755-766, 2023, doi: 10.47065/josh.v4i3.3117. [16] F. R. Isadora, B. T. Hanggara, and Y. T. Mursityo, "Perancangan User Experience Pada Aplikasi Mobile HomeCare Copyright © 2023 The Author, Page 1080 This Journal is licensed under a Creative Commons Attribution 4.0 International License
Journal of Information System Research (JOSH) Volume 4, No. 4, Juli 2023, pp 1072−1081 ISSN 2686-228X (media online) DOI 10.47065/josh.v4i4.3648 Rumah Sakit Semen Gresik Menggunakan Metode Design Thinking," J. Teknol. Inf. dan Ilmu Komput., vol. 8, no. 5, p. 1057, 2021, doi: 10.25126/jtiik.2021844550. [17] Y. I. Mahendra and D. H. Sutanto, "Implementasi Metode Hear Them Out, Empathize, Apologize dan Taking Proper Action and Follow Up (Head) Sebagai Pelayanan Prima Bisnis Perhotelan," Ascarya J. Islam. Sci. Cult. Soc. Stud., vol. 1, no. 1, pp. 66-77, 2021, doi: 10.53754/iscs.v1i1.11. [18] A. Rizky Rabbani, "Penerapan Design Thinking Terhadap Usaha Baju Di Toko Setal Pangkalpinang Dengan Menggunakan Website Sebagai Salah Satu Solusi," Rainstek J. Terap. Sains dan Teknol., vol. 3, no. 3, pp. 167-175, 2021, doi: 10.21067/jtst.v3i3.6046. [19] A. Candra, P. Sukmasetya, and P. Hendradi, "Perancangan UI / UX Aplikasi Berbasis Mobile Menggunakan Designing UI / UX Mobile -Based Applications Using the Design thinking Method ( Case Study of SISFO SKPI UNIMMA )," TeIKa, vol. 13, pp. 53-68, 2023. [20] E. Susanti, E. Fatkhiyah, and E. Efendi, "Pengembangan Ui/Ux Pada Aplikasi M-Voting Menggunakan Metode Design Thinking," Simp. Nas. RAPI XVIIII FT UMS, pp. 364-370, 2019. [21] Y. Yulius and E. Pratama, "Metode Design Thinking Dalam Perancangan Media Promosi Kesehatan Berbasis Keilmuan Desain Komunikasi Visual," Besaung J. Seni Desain dan Budaya, vol. 6, no. 2, pp. 111-116, 2021, doi: 10.36982/jsdb.v6i2.1720. [22] I. H. Wibisono, S. Hadi Wijoyo, and A. Rachmadi, "Analisis dan Perbaikan Usability Situs Halo FILKOM menggunakan Metode Design Thinking dan System Usability Scale," J. Pengemb. Teknol. Inf. dan Ilmu Komput., vol. 6, no. 11, pp. 5154-5162, 2022, [Online]. Available: Copyright © 2023 The Author, Page 1081 This Journal is licensed under a Creative Commons Attribution 4.0 International License