Analisis dan Desain User Interface dan User Experience dengan Pendekatan User Persona Berbasis Design
Thinking
Reva Eka Prasetyo1, Tan Amelia2, Julianto Lemantara*3
1,2,3Jurusan Sistem Informasi, Fakultas Teknologi dan Informatika, Universitas Dinamika, Jl. Raya Kedung Baruk No. 98, Surabaya, Jawa Timur, Indonesia
e-mail: 118410100004@dinamika.ac.id, 2meli@dinamika.ac.id, *3julianto@dinamika.ac.id
Abstrak
Picnicker merupakan startup yang bergerak pada bidang pariwisata dimana layanannya menyediakan informasi bagi para wisatawan yang ingin mencari kemudahan menemukan informasi dan mendapatkan akses ke tempat wisata lokal dengan pembelian tiket secara online dan validasi masuk ke tempat wisata tanpa antrean untuk mengurangi risiko tertular Covid-19 di tengah pandemi. Permasalahan saat ini startup Picnicker membutuhkan platform yang dapat menampung sekumpulan informasi tentang destinasi wisata, lokasi wisata, dan tiket obyek wisata dalam membentuk sebuah produk yang akan dibangun untuk mencapai minimum viable product (MVP) yang tentunya terdapat aspek-aspek salah satunya yaitu User Interface dan User Experience. Penelitian ini menggunakan metode Design Thinking yang terdapat ada 5 tahap yaitu empathize, define, ideate, prototype, dan test. Selain itu alasan menggunakan metode Design Thinking karena proses penciptaan ide-ide inovasi baru untuk memecahkan permasalahan pada pengembangan produk aplikasi baru serta untuk pengukuran user experience menggunakan framework HEART Metric yang dikembangkan oleh Google untuk mengukur tingkat keberhasilan UX pada suatu produk. Berdasarkan analisis dan perancangan user interface dan user experience pada startup Picnicker dengan pendekatan user persona berbasis design thinking menghasilkan kesuksesan User Experience yang dilakukan menggunakan Framework Google Heart Metric memperoleh sebesar 0,762 dan lebih besar dari r-tabel 0,284 dengan melakukan uji reliabel menggunakan Cronbach Alpha yang ditunjukkan ke 23 pertanyaan dan dari indikator Framework Heart Metric terdapat 5 indikator yaitu happiness, engagement, adaption, retention, dan task success yang mana rata-rata presentase sebesar 55,1% yang artinya secara keseluruhan dari hasil yang didapat menunjukkan pengguna dapat diterima dan mendapatkan kisaran yang baik.
Kata kunci: User interface/user experience, Design Thinking, Framework Heart Metric
Abstract
Picnicker is a startup that is engaged in tourism where its services provide information for tourists who want to find it easy to find information and gain access to local tourist attractions by purchasing tickets online and validating entry to tourist attractions without queuing to reduce the risk of contracting Covid-19 in the middle of the world. pandemic. The current problem is that the Picnicker startup requires a platform that can accommodate a collection of information about tourist destinations, tourist locations, and tourist attraction tickets in forming a product that will be built to achieve a minimum viable product (MVP), which of course has aspects, one of which is the User Interface and User Experience. This study uses the Design Thinking method which there are 5 stages, namely empathize, define, ideate, prototype, and test. In addition, the reason for using the Design Thinking method is because of the process of creating new innovative ideas to solve problems in developing new application products and for measuring user experience using the HEART Metric framework developed by Google to measure the level of success of UX on a product. Based on the analysis and design of the user interface and user experience at the
Picnicker startup with a user persona approach based on design thinking, the success of User Experience carried out using the Google Heart Metric Framework was 0.762 and greater than r- table 0.284 by performing a reliable test using Cronbach Alpha which is shown to 23 questions and from the Heart Metric Framework indicators there are 5 indicators, namely happiness, engagement, adaptation, retention, and task success where the average percentage is 55.1%, which means that overall the results obtained indicate that users are acceptable and get a range of the good one.
Keywords: User interface/user experience, Design Thinking, Framework Heart Metric
1. PENDAHULUAN
Picnicker merupakan startup yang bergerak pada bidang pariwisata dimana layanannya menyediakan informasi bagi para wisatawan yang ingin mencari kemudahan menemukan informasi dan mendapatkan akses ke tempat wisata lokal dengan pembelian tiket secara online dan validasi masuk ke tempat wisata tanpa antrean untuk mengurangi resiko tertular Covid-19 ditengah pandemi. Permasalahan saat ini startup Picnicker membutuhkan platform yang dapat menampung sekumpulan informasi tentang destinasi wisata, lokasi wisata, dan tiket obyek wisata dalam membentuk sebuah produk yang akan dibangun untuk mencapai minimum viable product (MVP) yang tentunya terdapat aspek-aspek salah satunya yaitu User Interface Ketika pengguna merasakan sebuah perasaan atau pengalaman setelah menggunakan jasa atau produk disebut User Experience (UX) [1] sedangkan tampilan visual yang dilihat oleh pengguna ketika berinteraksi dengan mobile application, dalam tujuannya untuk memahami informasi serta menggunakan layanan yang disediakan produk atau jasa disebut dengan User Interface (UI) [2]. Penelitian ini menggunakan metode Design Thinking karena proses penciptaan ide-ide inovasi baru untuk memecahkan permasalahan pada pengembangan produk aplikasi baru. Metode ini memecahkan permasalahan yang belum terdefinisi secara jelas dilakukan dengan cara memahami kebutuhan pengguna yang akan terlibat menggunakan aplikasi, dengan cara mengumpulkan banyak ide dalam sesi brainstroming, dan melakukan pendekatan langsung melalui pembuatan prototipe dan pengujian langsung [3] serta untuk pengukuran user experience menggunakan framework HEART Metric dari Google [4] untuk mengukur tingkat keberhasilan UX pada suatu produk.
2. METODE PENELITIAN Metode penelitian dapat dilihat pada Gambar 1.
Gambar 1 Metode Penelitian
Tahapan metodologi penelitian ini terdapat ada 3 tahapan yaitu tahap awal, tahap pengembangan, dan tahap akhir. Untuk tahap awal untuk memahami model peracangan dan pemahaman materi, untuk tahap pengembangan untuk melakukan pelaksanaan penelitian percangan desain user interface dan user experience berdasarkan metode dan pengujian yang dipakai, dan yang terakhir tahap akhir untuk mendokumentasikan hasil rancangan desain yang sudah diuji cobakan.
3. HASIL DAN PEMBAHASAN 3.1. Tahap Awal
A. Studi Literatur
Berdasarkan identifikasi masalah yang ditemukan maka mempelajari studi literatur dari teori-teori dan sumber data pendukung yang akan dikembangkan dalam pembuatan analisis dan perancangan UI/UX pada aplikasi Picnicker dengan pendekatan user persona [4] dengan metode Design Thinking [5].
B. Tahap Empatize
Tahap Empatize dengan melakukan user research seperti in-dept interview kepada 5 orang dan menyebarkan survey kepada 33 orang. Hasil in-depth interview ditemukan beberapa permasalahan yang dialami pengguna ketika melakukan perjalanan ke tempat destinasi wisata dikala pandemi, kebutuhan pengguna ketika mencari destinasi wisata dikala pandemi. Setalah melakukan In-depth interview dan survey, penulis melakukan competitor analysis untuk membedakan produk dan layanan yang akan diberikan kepada pengguna. Competitor analysis dapat dilihat pada Tabel 1.
Tabel 1 Competitor Analysis
Customer (Who) Problem (What) Solution (How)
Picnicker vs Traveloka Different Customer
Picnicker vs Tiket.com Different Customer
Picnicker vs Atourin Different Approch
Picnciker vs Fave
3.2. Tahap Pengembangan A. Tahap Define
Tahap Define untuk mendefinisikan dari permasalahan pengguna dari hasil tahap empathize yang mana mengindetifikasi permasalahan pengguna ketika mencari informasi dan melakukan destinasi wisata dikala pandemi.
1. Teknik User Persona a. State Hypothesis
Pada tahap State Hypothesis penulis mencari permasalah mengenai pengguna ketika mencari informasi dan melakukan destinasi wisata dikala pandemi. Berikut hasil analisa yang terkait dengan permasalahan pada Tabel 2.
Tabel 2 Hipotesis State Hypothesis
Hypotesis Persona Explanation
H0 Wisatawan Picnicker Pengguna ingin mengetahui informasi (alamat, lokasi, no. telp, website destinasi wisata, harga, dll) destinasi wisata yang sesuai dengan protokol kesehatan dan tiket online
b. Ranges of Behavioural Variabels
Pada tahap ini penulis membuat daftar variabel perilaku yang berhubungan dengan masalah yang ada pada Picnicker, dan memberikan rentang nilai yang mungkin dari setiap variabel perilaku. Tabel 3 merupakan hasil identifikasi variabel perilaku.
Tabel 3 Variabel Perilaku Pengguna
No Observed Behavioral Variabel Scale
1. Mencari Informasi Lokasi Destinasi Wisata Mudah Sulit 2. Motivasi ingin berlibur ke tempat wisata dikala pandemi Ingin Tidak Ingin 3. Frekuensi melihat tempat-tempat wisata berbagaia
kategori/tipe tempat wisata di sosial media
Sering Jarang 4. Platform pencarian tempat wisata Mobile Website 5. Jenis tiket yang sering digunakan Fisik Digital c. Mapping of interview subject (emotion card)
Pada tahap ini akan dilakukan pemetaan berdasarkan dari hasil wawancara yang telah dilakukan oleh penulis. Hasil pemetaan dapat dilihat pada Gambar 2.
Gambar 2 Emoticon Card d. Identify Significant Behaviour Pattern
Pada tahap ini mengindentifikasi masing-masing kelompok berdasarkan karakteristik pengguna Picnicker Invalid source specified.. Hasil identifikasi dapat dilihat pada Tabel 4.
Tabel 4 Hasil Identify Significant Behaviour
Observed Behavioral Variabel Scale Percentage Mencari Informasi Lokasi Destinasi Wisata Mudah
Kadang Sulit
80%
10%
10%
Motivasi ingin berlibur ke tempat wisata dikala pandemi
Ingin Tidak Ingin
100%
0%
Frekuensi melihat tempat-tempat wisata berbagai kategori/tipe tempat wisata di sosial media
Sering Jarang
90%
10%
Platform pencarian tempat wisata Mobile Website
80%
20%
Jenis tiket yang sering digunakan Fisik Digital
10%
90%
e. Synthesize Characteristic and Relevant Goals
Pada tahap ini digunakan untuk menemukan pola perilaku dari pengguna Picnicker. Hasil pola perilaku yang sudah dipresentasikan dapat dilihat pada gambar 3.
Gambar 3 Synthesize Characteristic Pengguna f. Check for Redudancy and Completeness
Pada tahap ini digunakan untuk memastikan bahwa semua persona bermakna berbeda [7].
Pada tahap ini, dilakukan validasi responden yang terdapat 4 fase sebagai berikut:
i. Memvalidasi data pengguna Picnicker ii. Validasi menggunakan responden lain iii. Validasi variable
iv. Menentukan anomali yang sedang terjadi g. Expand the Description of Attribute and Behaviours
Tahap ini persona yang telah dibuat pada tahap-tahapan sebelumnya akan diubah menjadi bentuk narasi deskriptif yang akan di deskripsikan kedalam Persona Fundation Document yang dapat dilihat pada Gambar 5 [8].
h. Designate Persona Types
Tahap ini dibuat berdasarkan pada tahap sebelumnya, yaitu narasi deskriptif yang telah dibuat untuk menentukan persona yang telah diwawancari yang dapat dilihat pada Gambar 4.
Gambar 4 User Persona
Gambar 5 Persona Fundation Document i. Build Use Case
Pada tahap ini penulis membuat use case untuk mengimplementasikan dan merancang prototipe yang akan dibangun berdasarkan kebutuhan pengguna. Use case dapat dilihat pada Gambar 6.
Gambar 6 Use Case Diagram
j. Implement and evaluate prototypes
Di tahap terakhir ini tahap untuk merancang prototype dalam proses pengembangan sistem yang akan dibuat yang didalamnya terdapat informasi mengenai destinasi wisata dan tahap ini berkaitan dengan design thinking yang terdapat pada tahap prototype di metode design thinking [6].
2. Empthy Map
Empthy map untuk memvisualisasikan kolaboratif yang digunakan untuk mengartikulasikan apa yang kita ketahui tentang jenis pengguna tertentu yang berdasarkan apa yang dikatakan, dipikirkan, dilakukan, dan dirasakan. Emphaty Map dapat dilihat pada Gambar 7.
Gambar 7 Emphaty Map B. Tahap Ideate
Pada tahap ini mencari segala macam solusi yang dapat memecahkan permasalahan dari tahap sebelumnya dan mencatat segala macam solusi yang dikemukakan pada saat brainstorming.
1. How Might We
How Might we pada Gambar 8 adalah metode inovasi brainstorming yang didasarkan dapat bereksplorasi dengan liar/spontan dan kreativitas.
How Might We Pertama How Might We Kedua How Might We Kedua Gambar 8 How Might We
2. Crazy 8
Crazy 8 adalah metode invoasi brainstorming dengan menggunakan kertas yang dilipat sebanyak 8 kali yang dapat menuangkan ide-ide yang digambarkan. Desain wireframe dapat dilihat pada Gambar 9.
Wireframe login dan kelengkapan data Wireframe Halaman Utama
Wireframe detail destinasi wisata
Wireframe detail pemesanan
Wireframe metode Pembayaran Gambar 9 Desain Wireframe
C. Tahap Prototype
Pada tahap ini memvalidasi bahwa ide yang ada dapat menyelesaikan masalah dari pengguna. Mulai tahap sebelumnya yaitu ideate dari wireframe dengan metode crazy 8 dipindahkan ke low fidelity dalam bentuk digital. Lalu selanjutnya dari low fidelity ke high fidelity yang sudah memiliki warna, ukuran, jarak dan bentuk elemennya juga sudah dirangkai ke dalam bentuk prototype. Hasil high fidelity dapat dilihat pada Gambar 10.
Gambar 10 Prototype High Fidelity D. Tahap Testing
Pada tahap ini melakukan uji coba dari ide dan rancangan dari tahap sebelum, untuk melakukan uji coba dengan metode usability testing yang terdapat indikator dari framework Heart by google untuk mengukur parameter kesuksesan pengalaman pengguna yang terdapat ada 5 kategori yaitu Happiness, Engagement, Adoption, Retention, dan Task Success. 5 kategori tersebut adalah metrik yang akan digunakan dalam tahap pengujian ini. Selanjutnya mengartikulasikan tujuan yang akan dijadikan tolak diukur yang mana terdapat 3 hal yaitu goals- signal-metrics. Goals-signal-metrics bisa dilihat pada tabel 5.
Tabel 5 Goals-signal-metrics
Goal Signal Metrics
Happiness, Engagement, Adaption, Retention, Dan Task Success
Lakukan penyebaran kuesioner dengan memberikan pernyataan yang beriorientasi pada kepuasan, kebahagiaan, dan kenyamanan (Happiness), Engagement, Adaption, Retention, dan Task Success
Bentuk jawaban kuesioner akan berada pada skala 1 sampai 5; dan peneliti ingin menghitung presentasi responden yang menjawab 5 Langkah selanjutnya adalah menyusun pernyataan kuisioner yang akan diukur untuk mendapatkan Metrics yang telah disusun pada goal-signal-metrics. Pernyataan dijawab oleh responden dengan skala likret 1 sampai 5. Setelah menyusun kuisioner peneliti menyebarkan kuisioner yang mana telah mendapat jumlah responden sebanyak 48 responden dan melakukan depth interview ke 10 responden yang dipilih. Setelah itu melakukan uji reliabilitas dengan menggunakan Cronbach alpha dengan menggunakan SPSS. Dari hasil pengujian menunjukkan tingkat reliabilitas dengan nilai koefisiannya kriteria ≥ 0,60. Hasil uji reliabilitas jika dibandingkan dengan r-tabel ditunjukkan pada tabel 7.
Tabel 6 Hasil Uji Reliabilitas Cronbach Alpha Test R-Tabel
0,762 0,284
Hasil analisa pengujian google heart metric menghasilkan yaitu:
1. User Interface dan visual mobile sesuai dengan pendekatan user persona
2. Menghasilkan user interface dan user experience yang mudah dipahami oleh pengguna dalam mengakses aplikasi mobile yang mana presentasenya sebesar 52,1% pada kriteria Happines (H3) pengguna merasa mudah menggunakan aplikasi Picnicker dan pada kriteria task success (TS 3) yang mana presentase nya sebesar 56,3% bahwa pengguna bisa membaca detail informasi tempat destinasi wisata yang dipiih pengguna di aplikasi Picnciker
3. Memberikan rekomendasi informasi destinasi wisata yang sesuai dengan kebutuhan pengguna yang mana presentasenya sebesar 60,4% pada kriteria task success (TS 2) bahwa pengguna dapat melihat informasi tempat-tempat wisata di aplikasi Picnciker dan ditambah lagi pada kriteria adaption (A2) dengan presentase 47,9% aplikasi Picnicker dapat memenuhi kebutuhan pengguna
4. Informasi uptodate tentang destinasi wisata yang didukung pada kriteria Engagement (E5) dengan presentase 39,6% pengguna melakukan rutin update aplikasi Picnciker.
Dalam hal ini secara keseluruhan dari hasil yang didapat menunjukkan pengguna dapat diterima dengan baik dengan user interface dan user experience pada desain aplikasi Picnicker.
3.3. Tahap Akhir
Pada tahap ini merupakan dokumentasi hasil dari validasi yang dengan user interface / user experience dari saran dan masukkan yang didapat dari responden. Desain user interface dapat dilihat pada gambar
Halaman Login dan Lengakapi Data Halaman Detail Pesanan dan Data Pemesanan
Halaman Beranda Halaman Detail Destinasi Wisata
Halaman Pembayaran Halaman Pesanan dan Detail Tiket Gambar 11 Desain user interface
4. KESIMPULAN
Berdasarkan hasil analisis dan perancangan user interface dan user experience pada startup Picnicker dengan pendekatan user persona berbasis Design Thinking, menghasilkan kesimpulan dapsat ditarik antara lain:
A. Hasil dari pengujian untuk mengukur kesuksesan User Experience yang dilakukan menggunakan Framework Google Heart Metric memperoleh sebesar 0,762 dan lebih besar dari r-tabel 0,284 dengan melakukan uji reliabel menggunakan Cronbach Alpha yang ditunjukkan ke 23 pertanyaan. 23 pertanyaan tersebut dari 5 indikator kategori/kriteria yaitu Happiness, Engagement, Adoption, Retention, dan Task Success dari Framework Google Heart Metric yang terbukti reliabel diperoleh dari hasil skala likert dari presentase nilai variabel yaitu:
i. Happiness mendapatkan rata-rata presentase paling sebesar yaitu 58,3%
ii. Engagement mendapatakan rata-rata presentase sebesar yauitu 58,3%, iii. Adoption mendapatkan rata-rata presentase sebesar 63,3%,
iv. Retention mendapatkan rata-rata presentase sebesar 51%, v. Task Success mendapatkan rata-rata presentase sebesar 63,3%.
B. Dari 5 kriteria google heart metric secara keseluruhan dari hasil yang didapat menunjukkan pengguna dapat diterima dan mendapatkan kisaran yang baik mulai dari visual desain/user interface yang sesuai dengan pendektan user persona, informasi yang mudah dipahami, pengguna mendapatkan infomasi rekomendasi dan update serta lengkap tentang destinasi wisata yang diinginkan.
5. SARAN
Saran yang diberikan pada hasil penelitian ini prototype yang dihasilkan fokus pada device smartphone. Sehingga kedepannya dapat dikembangkan lagi dengan membuat tampilan prototype dalam segala ukuran device seperti tablet dan desktop, sehingga mampu menghasilkan prototype yang lebih baik lagi dan dapat digunakan didalam semua jenis device. Yang kedua ditingkat kan lagi dalam hal user research nya seperti melakukan user persona, empthy map, user journey, dan lain-lainnya.
DAFTAR PUSTAKA
[1] R. Fadhillah, "Perbedaan User Interface dan User Experience pada Desain Aplikasi,"
Medium, 2018. [Online]. Available: https://medium.com/@ganfadhil/perbedaan-user- interface-dan-user-experience-pada-desain-aplikasi-d8fcaccf400a.
[2] E. Tirtadarma, A. E. B. Waspada and E. F. Jasjfi, "Kajian Peranan Desain UX (Pengalaman Pengguna) - UI (Antar Muka Pengguna) Mobile Application Kategori Transportasi Online terhadap Gaya Hidup Bertransportasi Masyarakat Urban," Jurnal Seni Dan Reka Rancang:
Jurnal Ilmiah Magister Desain, vol. 1(1), 2018.
[3] E. Susanti, E. Fatkhiyah and E. Efendi, "Pengembangan Ui / Ux pada aplikasi M-Voting,"
Simposium Nasional RAPI, p. 364–370, 2019.
[4] P. N. Lestari, P. I. Santosa and R. Ferdiana, "Pengukuran Pengalaman Pengguna Dalam Menggunakan Sistem Informasi Akademik," Seminar Nasional Teknologi Informasi Dan Komunikasi, 2016.
[5] Y. Arifin, "PENGENALAN TENTANG PERSONA," Binus University, 2016. [Online].
Available: https://socs.binus.ac.id/2016/12/28/pengenalan-tentang-persona/.
[6] H. M. Kalyani, "Apa itu Persona?," Medium, 2019. [Online]. Available:
https://medium.com/learnfazz/apa-itu-persona-2e3d2cab00ba.
[7] W. A. Kusuma and D. Yanto, "Penggunaan User Persona untuk Meningkatkan Efektifitas Penggunaan Kebutuhan pada Perangkat Lunak," SENTRA (Seminar Teknologi dan Rekayasa), p. 42–48, 2021.
[8] W. A. Kusuma, A. Chathil, Y. Raditya and N. & Prakoso, "Elisitasi Kebutuhan Menggunakan User Persona," Prosiding SENTRA (Seminar Teknologi Dan Rekayasa), p.
85–93, 2020.
[9] W. Eli, "Design Thinking Handbook," DesignBetter.Co, 2011. [Online]. Available:
https://www.designbetter.co/design-thinking/prototype.