Rancangan UI/UX Design Aplikasi Pembelajaran Bahasa Jepang Pada Sekolah Menengah Atas Menggunakan Metode Design Thinking

(1)

JURIKOM (Jurnal Riset Komputer), Vol. 9 No. 4, Agustus 2022 e-ISSN 2715-7393 (Media Online), p-ISSN 2407-389X (Media Cetak) DOI 10.30865/jurikom.v9i4.4442

Hal 980−987 http://ejurnal.stmik-budidarma.ac.id/index.php/jurikom

Rancangan UI/UX Design Aplikasi Pembelajaran Bahasa Jepang Pada Sekolah Menengah Atas Menggunakan Metode Design Thinking

Muhammad Adhitya Dhita Pratama^*, Yudhi Raymond Ramadhan, Teguh Iman Hermanto Fakultas Teknik, Program Studi Tekik Informatika, Sekolah Tinggi Teknologi Wastukancana, Purwakarta, Indonesia Email: ^1,*muhammadadhitya33@wastukancana.ac.id, ²yudhi.raymond@wastukancana.ac.id, ³teguhiman@wastukancana.ac.id

Email: muhammadadhitya33@wastukancana.ac.id Submitted 06-07-2022; Accepted 16-08-2022; Published 30-08-2022

Abstrak

Dalam Dunia Pendidikan yang sudah berkembang ini pastinya kita secara tidak langsung dituntut untuk dapat mengerti atau menguasai penggunaan bahasa asing. SMA Negeri 1 Cikarang Pusat menjadi salah satu sekolah yang mempelajari bahasa Jepang. Murid-murid yang mempelajari bahasa jepang di sekolah tersebut memiliki berbagai macam motivasi yang besar, namun juga tidak sedikit dari murid-murid yang dapat mengerti dan bahkan kesulitan dalam mempelajari bahasa jepang. Mengingat bahwa inovasi dalam dunia Pendidikan di era ini sudah banyak sekali yang melibatkan teknologi untuk melakukan proses pembelajaran. Banyak cara untuk mempelajari bahasa jepang misalnya dengan belajar melalui media pembelajaran yang memanfaatkan teknologi seperti smartphone.

Didukung dengan inovasi teknologi yang semakin maju dan pola interaksi baru, sehingga peran User Interface (UI) dan User Experience (UX) ini menjadi penting terhadap kebutuhan pengguna dalam menyelesaikan masalah. Penelitian ini dilakukan untuk bagaimana cara kita agar dapat memenuhi dan mengetahui kebutuhan pengguna dengan menggunakan design thinking. Dengan adanya media pembelajaran bahasa jepang ini diharapkan dapat membantu para murid agar dapat mempelajari bahasa jepang dengan mudah. Kata Kunci: Antarmuka Pengguna; Pengalaman Pengguna; Design Thinking; Media Pembelajaran

Abstract

In the world of education that has developed, of course, we are indirectly required to be able to understand or master the use of foreign languages. SMA Negeri 1 Cikarang Pusat is one of the schools that learn Japanese. The students who study Japanese at the school have various kinds of great motivation, but also not a few of the students who can understand and even have difficulty in learning Japanese.

Given that there are many innovations in the world of education in this era that involve technology to carry out the learning process.

There are many ways to learn Japanese, for example by learning through learning media that utilize technology such as smartphones.

Supported by increasingly advanced technological innovations and new interaction patterns, the role of the User Interface (UI) and User Experience (UX) is important to the needs of users in solving problems. This research was conducted to find out how we can meet and know user needs by using design thinking. With this Japanese language learning media, it is hoped that it can help students learn Japanese easily.

Keywords: User Interface; User Experience; Design Thinking; Learning Media

1. PENDAHULUAN

SMA Negeri 1 Cikarang Pusat menjadi salah satu sekolah yang terdapat mata pelajaran Bahasa Jepang di dalam kurikulumnya terhitung sejak tahun 2012. Mata pelajaran Bahasa Jepang ini sudah bertahan cukup panjang karena rasa antusias dan minat belajar yang dimiliki oleh para murid begitu besar dan banyak faktornya seperti untuk digunakan sebagai alat komunikasi, untuk kepentingan pekerjaan di masa depan, atau tertarik dengan kebudayaannya, dan masih banyak lagi. Namun juga tidak sedikit atau banyak peserta didik di sekolah SMA Negeri 1 Cikarang Pusat ini yang mengalami kesulitan dalam mempelajari Bahasa Jepang karena beberapa faktor seperti tingkat kesulitan dalam mempelajari Bahasa jepang baik dari segi pemahaman materi maupun keterampilan, keinginan atau motivasi dari murid itu sendiri, bahkan bisa terjadi karena metode pembelajaran yang diterapkan oleh guru di sekolah masih kurang cukup sehingga pembelajaran belum cukup maksimal. Beberapa permasalahan ini merupakan permasalahan yang paling sering ditemukan dan dialami oleh para kalangan murid di SMA Negeri 1 Cikarang Pusat.

Mengingat bahwa dalam dunia Pendidikan yang sudah berkembang ini, banyak jalan dan cara untuk dapat mempelajari Bahasa Jepang seperti dengan menggunakan media pembelajaran yang memanfaatkan teknologi seperti smartphone. Dalam permasalahan ini media pembelajaran menjadi alternatif dalam membantu para murid untuk belajar Bahasa Jepang, karena dengan media pembelajaran yang interaktif dan memasukkan salah satu atau beberapa elemen gamifikasi sebagai pendekatan dalam proses pembelajaran, dengan begitu dapat membantu memahami materi dengan metode pembelajaran yang berbeda sehingga dapat lebih membantu merangsang kemampuan dari murid tersebut[1].

Dengan didukung inovasi teknologi yang semakin maju dan juga pola interaksi baru, UI dan UX dengan tampilan dan desain yang baik akan membuat pengguna yang memakai produk menciptakan pengalaman yang menyenangkan dan dapat memengaruhi suatu keberhasilan dari penggunaan user[2].Maka dari itu UI dan UX menjadi peran yang sangat penting dibantu dengan menggunakan metode design thinking [3]. Penelitian ini dilakukan untuk dapat membantu menemukan kebutuhan pengguna dan juga mencari solusi dari permasalahan yang dialami oleh pengguna dalam belajar Bahasa jepang dengan menggunakan media pembelajaran yang sudah dibuat sesuai kebutuhan para pengguna.

2. METODOLOGI PENELITIAN

(2)

Metode Design Thinking dikenal sebagai suatu proses berpikir komprehensif yang berkonsentrasi untuk menciptakan solusi yang diawali dengan proses empati terhadap suatu kebutuhan tertentu yang berpusat pada manusia[4]. Design Thinking pada penilitian ini terdiri dari lima tahapan, yaitu adalah Empathize, Define, Ideate, Prototype dan Test[5].

Gambar 1 merupakan alur penelitian pada perancangan UI/UX Aplikasi pembelajaran Bahasa Jepang.

Gambar 1. Alur Penelitian 2.2 Design Thinking

Metode Design Thinking dikenal sebagai suatu proses berpikir komprehensif yang berkonsentrasi untuk menciptakan solusi yang diawali dengan proses empati terhadap suatu kebutuhan tertentu yang berpusat pada manusia[4]. Design Thinking pada penilitian ini terdiri dari lima tahapan, yaitu adalah Empathize, Define, Ideate, Prototype dan Test[5].

2.2.1 Empathize

Tahap empati ini merupakan tahapan pertama dilakukannya penelitian dengan tujuan untuk mengetahui kebutuhan para pengguna dengan melakukan observasi dan wawancara [6].

2.2.2 Define

Pada tahap kedua dengan menganalisis dan memahami semua data dan informasi yang telah kita dapatkan pada tahap empati terhadap pengguna, tahapan ini dilakukan agar kita dapat menemukan sebuah ide dan solusi dari masalah yang dihadapi pengguna[2] .

2.2.3 Ideate

Tahap ideasi ini adalah tahapan dimana kita merancang dan menghasilkan sebuah ide dan solusi yang sekiranya dapat membantu untuk memenuhi kebutuhan pengguna[7].

2.2.4 Prototype

Proses merancang tampilan awal sebuah produk yang kita buat dengan mengimplementasikan ide-ide yang sudah dikumpulkan agar menghasilkan sebuah prototype yang siap untuk diuji coba[8].

2.2.5 Test

Setelah merancang sebuah prototype dari sebuah produk, tahap selanjutnya adalah dengan melakukan uji coba untuk mengetahui apakah desain sudah berjalan dengan baik atau belum, dan akan mendapat feedback untuk perkembangan produk kedepannya[9]. Nantinya pada penelitian ini akan diujikan kepada 5 orang partisipan, karena jumlah ini sudah cukup untuk memenuhi data akan pola perilaku [10].

3. HASIL DAN PEMBAHASAN

3.1 Empathize

Tahap pertama dalam proses empathize ini dengan melakukan sebuah penyusunan research plan, research plan ini berupa tujuan penelitian, metode yang digunakan, kriteria pengguna, dan harapan. Tujuannya agar dapat tetap fokus terhadap scope penelitian, dan agar berjalan dengan sistematis selama proses user research yang dilakukan[11].

Dimulai dari tahap dilakukannya wawancara terhadap beberapa murid di sekolah SMA Negeri 1 Cikarang Pusat.

Proses wawancara dilakukan untuk memungkinkan mendapatkan sebuah insight baru dan informasi lebih lanjut terkait topik yang berkaitan. Setelah melakukan proses wawancara selanjutnya dengan melakukan penyusunan setiap jawaban dari responden agar nantinya akan memudahkan dalam proses pembuatan affinity map atau affinity diagram. Affinity Diagram merupakan teknik yang digunakan dalam melakukan proses user research untuk mendapatkan berbagai macam wawasan dan juga peluang yang muncul. Pada gambar 2 merupakan hasil dari proses Affinity Diagram pada penelitian ini.

(3)

Gambar 2. Affinity Diagram 3.2 Define

Proses define ini merupakan proses menganilis dan memahami data serta informasi yang telah didapat pada tahap empati[12]. Pada tahap ini dibuatlah sebuah Persona, POV, Journey Map, dan How Might We.

3.2.1 User Persona

Penggambaran User Persona ini berguna sebagai sebagai gambaran atau representasi dari target user pada produk.

Sehingga dengan adanya persona ini dapat membantu mengetahui keingingan dari pengguna itu sendiri. Karena persona ini sendiri dibagi menjadi 4 bagian yaitu goals, likes, dislikes, dan frustation. Gambar 2 merupakan hasil persona yang sudah dibuat.

3.2.2 Point Of View

Penulisan Point Of View ini dibuat sebagai panduan utama selama proses desain, pov pada penelitian ini dibuat berdasarkan user persona yang telah dibuat, lalu dibuat lebih spesifik lagi terkait gambaran target pengguna. Dalam proses POV ini dibagi menjadi 3 bagian yaitu User, Need, dan Insight. Hasil dari pov yaitu:

a. User

Siswa atau siswi yang mempelajari bahasa jepang dan/atau menyukai pelajaran bahasa jepang di sekolah b. Need

Memerlukan layanan pembelajaran bahasa jepang yang metodenya mudah dipahami dan penyampaian materinya jelas c. Insight

Metode pembelajaran yang diterapkan dalam kelas masih kurang cukup sehingga masih ada siswa-siswi yang kebingungan dan juga kesulitan dalam belajar bahasa jepang.

3.2.3 User Journey Map

Dengan User Journey Map (UJM) ini berfungsi untuk memahami kebutuhan pengguna beserta menemukan paint points ketika pengguna tersebut sedang berinteraksi dengan produk yang dibuat. Pada UJM ini terbagi menjadi 4 Phase of Journey yang dimulai dari saat ketika pengguna ingin mencari materi Bahasa jepang, lalu mulai belajar, mengerjakan tes, dan yang terakhir setelah mengerjakan tes.Gambar 3 merupakan hasil UJM yang sudah dibuat dalam penelitian ini.

Gambar 3. User Journey Map 3.2.4 How Might We

Pembuatan How Might We (HMW) ini merupakan hasil dari semua peluang yang sudah ditemukan dalam penggambaran

(4)

a. Bagaimana cara kita dapat menyajikan materi untuk pengguna ?

b. Bagaimana membuat pengguna agar materi yang dipelajari tetap di ingat ?

c. Bagaimana cara kita dapat tetap bisa menjaga minat belajar bahasa jepang pengguna ?

d. Bagaimana cara kita untuk dapat meningkatkan rasa tertarik dan motivasi pengguna dalam belajar ? e. Bagaimana cara kita membantu user untuk dapat memilih materi bahasa jepang dengan mudah ? f. Bagaimana cara kita membuat agar user dapat mempelajari materi kapanpun yang di inginkan ? 3.3 Ideate

Proses ideasi adalah tahapan dilakukannya pengumpulan ide-ide yang menjadi solusi untuk menjawab permasalahan yang telah ditemukan. Pada penelitian ini proses pengumpulan ide dibagi berdasarkan 4 bagian yaitu Do it now, Do next, Do Last, dan Later. Pembagian ini dilakukan agar dapat mengetahui prioritas dari setiap fiturnya yang akan di finalisasi dan di implementasikan ke dalam bentuk prototype. Gambar 4 menunjukkan hasil dari prioritas ide.

Gambar 4. Prioritas Ide

Dari hasil prioritas ini, pengerjaan yang didahulukan adalah bagian kanan atas yaitu Do it Now, karena pada bagian ini terletak pada bagian sebelah kanan yang menunjukkan bahwa proses pengembagan atau usaha yang dibutuhkan memiliki nilai rendah atau mudah, dan terdapat dibagian atas kanan yang artinya fitur-fitur disini memiliki dampak yang besar terhadap pengguna.

3.4 Prototype

Setelah proses pengumpulan data, ide dan solusi selesai, selanjutnya ialah membuat sebuah rancangan antarmuka terkait produk yang dibuat. Kemudian hasil akhir dari tahap ini akan diuji cobakan untuk memvalidasi apakah desain yang sudah dirancang telah memenuhi[13]. Pada penilitian ini pembuatan prototype dibuat dengan menggunakan tool figma[14]. Dan dibagi menjadi beberapa bagian yaitu Arsitektur Informasi, User Flow, Wireframe dan Mockup.

3.4.1 Arsitektur Informasi

Pembuatan arsitektur informasi sangatlah penting guna mengetahui struktur utama dari sebuah produk dan juga untuk menentukan flow dari fitur-fitur yang terdapat dalam produk dan dengan adanya gambaran arsitektur ini juga agar mendapatkan pandangan visual terkait susunan interface pada produk yang akan dibuat. Gambar 5 merupakan rancangan arsitektur informasi yang dibuat pada penilitian ini.

Gambar 5. Arsitektur Informasi

(5)

Hal 980−987 http://ejurnal.stmik-budidarma.ac.id/index.php/jurikom 3.4.2 User Flow

User Flow adalah gambaran dari alur pengguna, tujuannya untuk mengetahui langkah-langkah juga batasan yang dapat dilakukan oleh pengguna dan digunakan untuk mencapai tujuannya. Gambar 6 merupakan beberapa hasil penentuan flow pada penilitian ini.

Gambar 6. User Flow 3.4.3 Wireframe dan Mockup

Perancangan wireframe dan pembuatan mockup ini adalah tahapan dimana melakukan proses penyusunan struktur dan navigasi yang ada dalam produk, kemudian hasil dari wireframe tersebut di visualisasikan hingga menjadi sebuah tampilan antarmuka yang utuh dengan warna dan ikon-ikon. Karena berdasarkan target pengguna yang telah ditentukan pada tahap empati adalah sebagian besar pengguna merupakan murid-murid SMA, sehingga pada penelitian ini dibuat dengan tampilan sefleksibel dan semenarik mungkin.

Gambar 7. Wireframe Produk

(6)

3.5 Test

Tahap terakhir dari penilitian ini adalah dengan melakukan testing, setelah semua desain telah disiapkan kemudian dilakukan uji coba untuk memvalidasi solusi dari desain yang telah dibuat. Dalam penelitian ini melibatkan 5 partisipan yang mana partisipan disini merupakan orang-orang yang menjadi target atau kriteria pengguna yaitu murid-murid dari sekolah SMA Negeri 1 Cikarang Pusat. Dalam pengujian ini terdapat goals dan scenario yang harus dicapai oleh partisipan, dan menyiapkan pertanyaan setelah melakukan uji coba karena demi mencapai tujuan untuk mendapatkan hasil yang efektif dan juga valid.

Hasil dari uji coba Usability Testing ini nantinya akan ditinjau masalah apa yang terjadi pada desain, lalu menemukan sebuah opportunity baru yang dapat dikembangkan pada produk berdasarkan feedback yang diberikan oleh partisipan. Hasil dari melakukan Usability Test dengan maze dapat adalah sebagai berikut:

a. Skenario 1 melakukan login

Gambar 9. Hasil usability scenario 1

Berdasarkan hasil pengujian yang telah dilakukan kepada 5 partisipan pada skenario 1 terlihat pada gambar 9 ini mendapatkan hasil yang bagus dan rata-rata waktu yang dihabiskan tiap halamannya memakan waktu tidak terlalu lama dalam mencapai tujuan dari skenario yang telah dibuat.

b. Skenario 2 melakukan pembelajaran

Gambar 10. Hasil usability scenario 2

Berdasarkan hasil pengujian yang terdapat pada gambar 10 , merupakan nilai yang didapatkan dari hasil pengujian pada skenario ke 2, pada skenario ini nilai yang didapat di bawah 80 karena partisipan memakan waktu cukup lama ketika mencari materi pembelajaran.

c. Skenario 3 menyimpan atau mengunduh materi

Gambar 11. Hasil usability scenario 3

Berdasarkan hasil pengujian yang terdapat pada gambar 11, diperoleh hasil yang cukup baik pada skenario 3 seluru partisipan dapat menyelesaikan tugas dengan yang diberikan dengan cepat.

d. Skenario 4 melakukan uji kemampuan

(7)

Hal 980−987 http://ejurnal.stmik-budidarma.ac.id/index.php/jurikom Berdasarkan hasil pengujian yang terdapat pada gambar 12, diperoleh hasil dibawah 80 karena partisipan menghabiskan waktu cukup lama saat dihalaman pengerjaan soal. Namun pada akhirnya partisipan menyelesaikan skenario ini dengan baik.

e. Skenario 5 melihat daftar tugas belajar

Berdasarkan hasil pengujian yang terdapat pada gambar 13, diperoleh hasil dengan nilai 77 dikarenakan pada skenario ini partisipan memakan waktu cukup lama pada halaman profile saat mencari tugas.

f. Skenario 6 melihat kategori pembelajaran

Berdasarkan hasil pengujian yang terdapat pada gambar 14, diperoleh hasil yang tidak bagus karena partisipan masih bingung ketika ingin belajar melalui kategori sehingga banyak terjadinya misclick pada halaman.

g. Skenario 7 mengambil hadiah pembelajaran

Berdasarkan hasil pengujian yang terdapat pada gambar 15, diperoleh hasil yang cukup baik pada pengujian skenario 7 ini. Partisipan dapat menyelesaikan tugas dengan waktu cukup cepat.

4. KESIMPULAN

Hasil perancangan UI/UX pada penilitian yang telah dilakukan dengan menggunakan metode design thinking, menghasilkan sebuah produk media pembelajaran Bahasa Jepang dalam bentuk High Fidelity Prototype dan mendapatkan hasil yang cukup baik setelah dilakukan pengujian terhadap prototype yang telah dirancang. Dan dari hasil melakukan validasi terhadap pengguna mendapat respon yang positif dan juga saran yang membangun yang berdampak baik untuk pengembangan produk ini untuk kedepannya, pengguna atau partisipan sangat terbantu dengan produk ini dan benar- benar memenuhi kebutuhan dalam mempelajari Bahasa Jepang. Jadi dapat dikatakan bahwa dengan menggunakan design thinking dalam proses untuk memahami permasalahan dan kebutuhan pengguna, dapat menjawab permasalahan yang dihadapi oleh para pengguna dalam belajar Bahasa Jepang.

REFERENCES

[1] D. Ariani, “Gamifikasi untuk Pembelajaran,” J. Pembelajaran Inov., vol. 3, no. 2, pp. 144–149, Nov. 2020, doi:

10.21009/jpi.032.09.

[2] R. W. Purwitasari, P. Dileon, Y. Nainggolan, N. Rahmawati, F. Dharma Adhinata, and G. Ramadhan, “Perancangan UI/UX Webinar Booking Terhadap Kepuasan Pengguna Menggunakan Metode Design Thinking,” J. Ris. Komputer), vol. 8, no. 6, pp.

2407–389, 2021, doi: 10.30865/jurikom.v8i6.3700.

[3] R. Wulandari, F. Nurdiansyah, M. Hasbani, A. Y. Prasetya, and T. Desyani, “Pengujian pada Aplikasi ‘Kembaliin’ Berbasis Mobile Application/Android dengan Metode Design Thinking,” J. Inform. Univ. Pamulang, vol. 5, no. 2, p. 182, 2020, doi:

(8)

[4] R. T. Haniifah, R. Aisy, K. Candra Brata, and H. Muslimah Az-Zahra, “Perancangan User Experience Mobile Learning menggunakan Metode Design Thinking (Studi Kasus : SD Negeri Wates Kabupaten Kediri),” J. Pengemb. Teknol. Inf. dan Ilmu Komput., vol. 5, no. 8, pp. 3247–3255, 2021, [Online]. Available: http://j-ptiik.ub.ac.id

[5] H. Plattner, “An Introduction to Design Thinking PROCESS GUIDE,” 2010.

[6] C. M. Chandra, C. M. Putri, D. R. Theja, R. Umami, S. N. Hakim, and M. R. Pribadi, MDP STUDENT CONFERENCE (MSC) 2021 Perancangan UI/UX Pada Aplikasi Femine Menggunakan Metode Design Thinking. 2021.

[7] F. Fariyanto and F. Ulum, “PERANCANGAN APLIKASI PEMILIHAN KEPALA DESA DENGAN METODE UX DESIGN THINKING (STUDI KASUS: KAMPUNG KURIPAN),” J. Teknol. dan Sist. Inf., vol. 2, no. 2, pp. 52–60, 2021, [Online].

Available: http://jim.teknokrat.ac.id/index.php/JTSI

[8] D. Haryuda Putra, M. Asfi, and R. Fahrudin, “PERANCANGAN UI/UX MENGGUNAKAN METODE DESIGN THINKING BERBASIS WEB PADA LAPORTEA COMPANY,” 2021.

[9] 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, Jan. 2021, doi: 10.20884/1.jutif.2021.2.1.30.

[10] “Why You Only Need to Test with 5 Users.” https://www.nngroup.com/articles/why-you-only-need-to-test-with-5-users/

(accessed Jun. 29, 2022).

[11] G. Nabila and S. Wahyuni, MDP STUDENT CONFERENCE (MSC) 2022 Penerapan UI/UX Dengan Metode Design Thinking Pada Aplikasi Jaya Indah Perkas. 2022.

[12] A. Mursyidah, I. Aknuranda, and H. Muslimah Az-Zahra, “Perancangan Antarmuka Pengguna Sistem Informasi Prosedur Pelayanan Umum Menggunakan Metode Design Thinking (Studi Kasus: Fakultas Ilmu Komputer Universitas Brawijaya),” urnal Pengemb. Teknol. Inf. dan Ilmu Komput. , vol. 3, no. 4, pp. 3931–3938, 2019, [Online]. Available: http://j-ptiik.ub.ac.id [13] D. Priyono, A. Ramdhani, and R. Hardian, “Desain User Interface Informasi Prodi Desain Komunikasi Visual melalui Media

Digital Website,” J. Desain, vol. 7, no. 3, p. 223, Aug. 2020, doi: 10.30998/jd.v7i3.5877.

[14] A. Muhyidin, “PERANCANGAN UI/UX APLIKASI MY CIC LAYANAN INFORMASI AKADEMIK MAHASISWA MENGGUNAKAN APLIKASI FIGMA,” J. Digit, vol. 10, no. 2, pp. 208–219, 2020, [Online]. Available: https://my.cic.ac.id/.