SKRIPSI PERANCANGAN USER INTERFACE (UI) BERDASARKAN USER EXPERIENCE (UX) PADA APLIKASI IPUSNAS MENGGUNAKAN METODE USER-CENTERED DESIGN

(1)

SKRIPSI

PERANCANGAN USER INTERFACE (UI) BERDASARKAN

USER EXPERIENCE (UX) PADA APLIKASI IPUSNAS

MENGGUNAKAN METODE USER-CENTERED DESIGN

Sebagai Salah Satu Syarat Memperoleh Gelar Sarjana Komputer Sistem Informasi Fakultas Sains dan Teknologi

Universitas Islam Negeri Syarif Hidayatullah

Disusun Oleh:

PUTRI SYARIFAH TINUR 11160930000057

PROGRAM STUDI SISTEM INFORMASI FAKULTAS SAINS DAN TEKNOLOGI

UNIVERSITAS ISLAM NEGERI SYARIF HIDAYATULLAH JAKARTA

(2)

SKRIPSI

Disusun Oleh:

(3)

i

HALAMAN JUDUL

SKRIPSI

Disusun Oleh:

(4)

(5)

ii

LEMBAR PERSETUJUAN

SKRIPSI

Disusun Oleh:

Putri Syarifah Tinur

(6)

iii

LEMBAR PERNYATAAN

DENGAN INI SAYA MENYATAKAN BAHWA SKRIPSI INI BENAR-BENAR HASIL KARYA SENDIRI YANG BELUM PERNAH DIAJUKAN SEBAGAI SKRIPSI ATAU KARYA ILMIAH PADA PERGURUAN TINGGI MANAPUN

Jakarta, 4 April 2021

PUTRI SYARIFAH TINUR

(7)

iv

(8)

(9)

v

ABSTRAK

Putri Syarifah Tinur – 11160930000057, Perancangan User Interface (UI)

Berdasarkan User Experience (UX) Pada Aplikasi iPusnas Menggunakan Metode User-Centered Design. Di bawah bimbingan Nurbojatmiko dan Elsy Rahajeng. Perpustakaan Nasional memanfaatkan pertumbuhan pengguna smartphone di Indonesia dengan menyediakan aplikasi perpustakaan digital yaitu iPusnas sebagai solusi untuk meningkatkan minat baca di Indonesia. Hasil observasi banyak pengguna yang mengeluhkan masalah UI (User Interface) dan UX (User Experience) aplikasi iPusnas, serta moving rating dari AppBrain.com sejak Agustus 2019 hingga Februari 2020 iPusnas mengalami naik turun dengan rating terendah berada pada angka 1.00. Dari hasil kuesioner ke 100 responden didapatkan respon aspek efektivitas sebesar 32% dan aspek efisiensi mendapatkan respon sebesar35% kedua aspek tersebut berada pada indikator tidak setuju. Tujuan penelitian ini untuk melakukan perancangan ulang aplikasi iPusnas dengan memperhatikan aspek UI dan UX menggunakan pendekatan User-Centered Design (UCD) berdasarkan ISO 9241-210 dengan 4 tahapan yaitu, specify the context of use, specify user requirement, product design solutions, dan evaluate against requirement. Kemudian dilakukan pengujian rekomendasi UI & UX menggunakan metode think-aloud dan kuesioner ISO 25022 untuk rekomendasi desain ke 13 pengguna. Hasil pengujian mengalami peningkatan dari aplikasi iPusnas saat ini, dengan rata-rata nilai measures of effectiveness untuk indikator task completed meningkat 0.07, indikator objectives achieved meningkat 0.29, indikator error in a tasks menurun 6.9, indikator task with errors meningkat 0.29 dan indikator task error intensity meningkat 0.23. Measures of efficiency pada indikator task time menurun 2 menit 11 detik, pada indikator time efficiency meningkat 0.01, dan indikator productive time ratio meningkat 0.46. Measures of satisfaction pada indikator satisfaction with features meningkat 0.42, indikator perceived usefulness meningkat 0.44, dan indikator perceived meaningfulness meningkat 0.3 dari nilai usability aplikasi iPusnas versi saat ini.

Kata kunci: digital library, user experience, user interface, user-centered design,

usability, think-aloud, ISO 25022, ISO 9241-210

V Bab + xiii Halaman + 136 Halaman + 22 Gambar + 32 Tabel + Daftar Pustaka + Lampiran

(10)

(11)

vi

KATA PENGANTAR

Segala puji dan syukur penulis panjatkan kepada Allah SWT karena atas limpahan rahmat dan hidayah-Nya penulis dapat menyelesaikan penelitian skripsi yang berjudul “Perancangan User Interface (UI) Berdasarkan User Experience (UX) Pada Aplikasi iPusnas Menggunakan Metode User-Centered Design”.

Penyusunan penelitian skripsi ini merupakan tugas akhir yang harus ditempuh oleh mahasiswa Fakultas Sains dan Teknologi Universitas Islam Negeri Syarif Hidayatullah Jakarta sebagai salah satu syarat dalam menyelesaikan program Strata Satu (S1).

Dalam penyusunan penelitian skripsi ini, penulis banyak mendapatkan bantuan, saran, dorongan, bimbingan dan keterangan dari berbagai pihak yang merupakan salah satu bentuk pengalaman yang tidak dapat diukur dengan materi. Oleh karena itu, dengan segala hormat dan kerendahan hati, perkenankan lah penulis mengucapkan terima kasih kepada:

1. Bapak Nashrul Hakiem, S.Si., M.T., Ph.D selaku dekan Fakultas Sains dan Teknologi UIN Syarif Hidayatullah Jakarta.

2. Bapak A’ang Subiyakto, M.Kom, Ph.D sebagai Ketua Program Studi Sistem Informasi dan Ibu Nida’ul Hasanati, S.T.,MMSI selaku Sekretaris Program Studi Sistem Informasi Fakultas Sains dan Teknologi UIN Syarif Hidayatullah Jakarta.

3. Bapak Nurbojatmiko, M.Kom dan Ibu Elsy Rahajeng, MTI, selaku pembimbing skripsi penulis yang selalu menyempatkan waktu, tenaga,

(12)

vii

dan pikiran untuk memberikan saran, bimbingan, arahan serta dukungan kepada penulis untuk menyelesaikan penelitian ini.

4. Ibu, Bapak, Imam Taufik, Nur Baeti selaku keluarga penulis yang selalu mendoakan, mendukung dan memberi motivasi tanpa henti untuk penulis agar dapat menyelesaikan penelitian ini dengan benar dan tepat pada waktunya.

5. Bapak Edithya Septiadi selaku staff Perpustakaan Nasional dan seluruh partisipan yang memberikan ide, saran, dan opini untuk kesuksesan penelitian ini, tanpa adanya kalian penelitian ini tidak akan maksimal dalam proses pengerjaan nya.

6. Kepada sahabat penulis Nida, Lizza, Silma, Viranda, Shaqila, Shana, Tegar, Annisa dan Myra yang selalu menghibur, mendukung dan memotivasi penulis selama pengerjaan penelitian ini.

7. Teman-teman Sistem Informasi 2016 B yang selalu berbagi ilmu selama masa perkuliahan dan berjuang bersama dalam menyelesaikan skripsi. 8. Komunitas Rumah UX yang memberikan banyak sekali ilmu terkait

UI/UX Desain yang sangat berguna untuk kelancaran penelitian ini. 9. Kopipayu yang menyediakan tempat yang sangat nyaman dengan

lagu-lagu menyenangkan dan kopis yang selalu menjadi menu kesukaan penulis selama mengerjakan penelitian ini.

10.Serta semua pihak yang tidak dapat penulis sebutkan satu persatu yang telah membantu dalam penyelesaian penelitian skripsi ini.

(13)

viii

Dalam penyusunan penelitian ini, penulis menyadari bahwa masih terdapat banyak kekurangan yang disebabkan keterbatasan ilmu pengetahuan, wawasan, dan pengalaman yang penulis miliki. Untuk itu penulis memohon maaf atas segala kekurangan tersebut dan tidak menutup diri terhadap segala bentuk saran dan kritik yang bersifat konstruktif bagi penulis dan dapat disampaikan melalui

putrisyarifah12@gmail.com. Akhir kata, semoga penelitian ini dan apa yang telah penulis kerjakan dapat bermanfaat bagi pembaca dan penulis sendiri.

Bogor, Desember 2020

(14)

(15)

ix

DAFTAR ISI

HALAMAN JUDUL ... i

LEMBAR PERSETUJUAN... ii

LEMBAR PERNYATAAN ... iii

LEMBAR PENGESAHAN ... iv

ABSTRAK ... v

KATA PENGANTAR ... vi

DAFTAR ISI ... ix

DAFTAR GAMBAR ... xii

DAFTAR TABEL ... xiii

BAB I ... 1 PENDAHULUAN... 1 1.1 Latar Belakang... 1 1.2 Identifikasi Masalah ... 7 1.3 Rumusan Masalah ... 8 1.4 Batasan Penelitian ... 8 1.5 Tujuan Penelitian ... 9 1.6 Manfaat Penelitian ... 9 1.7 Metode Penelitian ... 10

1.7.1 Metode Pengumpulan Data ... 10

1.7.2 Metode User Centered-Design (UCD) ... 11

1.8 Sistematika Penulisan ... 12

BAB II ... 14

TINJAUAN PUSTAKA... 14

2.1 Perpustakaan Nasional... 14

2.1.1 Sistem Pelayanan Tertutup (Close Access) ... 16

2.1.2 Sistem Pelayanan Terbuka (Open Access) ... 17

2.2 Human Computer Interaction... 17

2.3 User Experience ... 19

2.4 User Interface ... 25

2.5 Google Material Design ... 29

(16)

x 2.7 User Persona ... 36 2.8 Usability ... 38 2.9 ISO 25022 ... 39 2.10 Think-Aloud ... 44 BAB III... 45 METODOLOGI PENELITIAN ... 45 3.1 Kerangka Penelitian... 45

3.2 Metode Pengumpulan Data ... 46

3.2.1 Studi Pustaka ... 46

3.2.2 Kuesioner ... 56

3.2.3 Observasi ... 59

3.2.4 Wawancara ... 60

3.2.5 Pengujian Awal ... 63

3.3 User Centered-Design (UCD) ... 68

3.3.1 Specify the context of use ... 68

3.3.2 Specify User and Organisational Requirement ... 69

3.3.3 Product Design Solutions ... 70

3.3.4 Evaluate Designs Against User Requirement ... 71

BAB IV ... 72

HASIL DAN PEMBAHASAN ... 72

4.1 Gambaran Umum Perpustakaan Nasional Republik Indonesia... 72

4.2 Gambaran Umum Aplikasi iPusnas... 74

4.3 Specify the Context of Use ... 77

4.3.1 Observasi ... 77

4.3.2 Wawancara ... 79

4.3.3 Kuesioner ... 83

4.3.4 Pengujian Awal ... 84

4.4 Specify User and Organisational Requirement ... 98

4.4.1 User Persona ... 99

4.4.2 Spesifikasi Kebutuhan Pengguna ... 100

4.4.3 Hierarchical Task Analysis (HTA) ... 102

4.4.4 Skenario Model User Experience ... 107

4.5 Produce Design Solutions ... 113

(17)

xi

4.5.2 Perancangan Rekomendasi Medium fidelity Prototype Aplikasi iPusnas 119

4.6 Evaluate Designs Against User Requirement... 137

4.6.1 Evaluasi Desain oleh UI & UX Designer ... 138

4.6.2 Usability Testing Kedua ... 141

BAB V ... 152

KESIMPULAN DAN SARAN ... 152

5.1 Kesimpulan ... 152

5.2 Saran ... 156

DAFTAR PUSTAKA ... 157

LAMPIRAN I... 163

(18)

xii

DAFTAR GAMBAR

Gambar 1.1 Moving Rating aplikasi iPusnas menurut (Appbrain.com) ... 4

Gambar 1.2 Review pengguna iPusnas pada Play Store ... 5

Gambar 2.1 Garis Besar Interaksi Manusia dan Komputer (Martono & Kurniawan, 2011) ... 18

Gambar 2.2 Lima Elemen Dasar User Experience (Garrett & James, 2011) ... 20

Gambar 2.3 Empat Proses User Centered-Design (UCD) (L. Albani and G. Lombardi (FIMI), 2010)... 35

Gambar 3.1 Kerangka Berpikir Penelitian ... 45

Gambar 3.2 Risk and opportunities associated with the level of quality ... 68

Gambar 4.1 Value Chain Perpustakaan Nasional (Perpustakaan Nasional Republik Indonesia, 2018) ... 73

Gambar 4.2 Tampilan user interface aplikasi iPusnas mobile versi saat ini ... 74

Gambar 4.3 Rating aplikasi iPusnas menurut web AppBrain ... 79

Gambar 4.4 Hasil kuesioner demografis pengguna ... 83

Gambar 4.5 Persentase komentar pengguna pada pengujian 1 ... 85

Gambar 4.6 Hierarchical Task Analysis (HTA) Plan 0 ... 103

Gambar 4.7 Hierarchical Task Analysis (HTA) Plan 1 & 2 ... 104

Gambar 4.10 Warna untuk rekomendasi UI & UX iPusnas ... 120

Gambar 4.11 Tipografi untuk rekomendasi UI & UX iPusnas ... 121

Gambar 4.12 Icon & ilustrasi untuk rekomendasi UI & UX iPusnas... 121

Gambar 4.13 Design system untuk rekomendasi UI & UX iPusnas ... 122

Gambar 4.14 Persentase komentar pengguna pada pengujian 2 ... 143

Gambar 4.15 Perbandingan rata-rata nilai effectiveness pengujian 1 & 2 ... 146

Gambar 4.16 Perbandingan rata-rata nilai efficiency pengujian 1 & 2 ... 149

(19)

xiii

DAFTAR TABEL

Tabel 2.1 Measures of Effectiveness ... 40

Tabel 2.2 Measures of Efficiency ... 41

Tabel 3.1 Studi literatur sejenis ... 47

Tabel 3.2 Indikator Skor Kuesioner (%) ... 57

Tabel 3.3 Daftar Pertanyaan Kuesioner Berdasarkan (ISO/IEC 25022, 2016)... 58

Tabel 3.4 Pertanyaan wawancara dengan pengguna iPusnas (Sundt & Davis, 2017) ... 61

Tabel 3.5 Pertanyaan wawancara dengan stakeholder (UX Apprentice, 2013) ... 63

Tabel 3.6 Skenario Usability Testing Menggunakan Think-Aloud ... 65

Tabel 3.7 Kuesioner Pengukuran Satisfaction Menggunakan ISO 25022 ... 67

Tabel 3.8 Measurement Scale and Rating Level ISO 25022... 68

Tabel 4.1 Kesimpulan hasil wawancara dengan pengguna ... 81

Tabel 4.2 Hasil tugas pada think aloud pertama ... 86

Tabel 4.3 Measures of effectiveness menggunakan rumus ISO 25022... 87

Tabel 4.4 Hasil measures of effectiveness pengujian pertama menggunakan ISO 25022 ... 88

Tabel 4.5 Waktu pengerjaan think aloud pertama ... 89

Tabel 4.6 Waktu produktivitas responden pada pengujian pertama... 90

Tabel 4.7 Measures of efficiency menggunakan rumus ISO 25022 ... 92

Tabel 4.8 Hasil measures of efficiency pada pengujian pertama menggunakan ISO 25022 ... 93

Tabel 4.9 Kalkulasi respon kuesioner satisfaction pengujian pertama... 95

Tabel 4.10 Hasil measure of satisfaction pada pengujian pertama ... 97

Tabel 4.11 User Persona ... 99

Tabel 4.12 Spesifikasi kebutuhan pengguna ... 101

Tabel 4.13 Skenario model user experience ... 109

Tabel 4.14 Hasil perancangan wireframe rekomendasi UI & UX iPusnas ... 113

(20)

xiv

Tabel 4.16 Profile UI/UX designer ... 138

Tabel 4.17 Komentar & saran UI/UX designer ... 139

Tabel 4.18 Perbaikan UI & UX berdasarkan komentar designer ... 140

Tabel 4.19 Daftar skenario usability testing kedua ... 142

Tabel 4.20 Hasil tugas pada think-aloud kedua... 144

Tabel 4.21 Hasil perhitungan measures of effectiveness menggunakan rumus ISO 25022 ... 145

Tabel 4.22 Waktu pengerjaan think-aloud kedua ... 147

Tabel 4.23 Hasil perhitungan measures of efficiency menggunakan ... 147

Tabel 4.24 Hasil evaluasi kuesioner satisfaction pengujian kedua ... 151

(21)

(22)

1

BAB I

PENDAHULUAN

1.1 Latar Belakang

Interaksi antara komputer dengan manusia merupakan interaksi timbal-balik yang mempunyai tujuan untuk mempermudah manusia dalam mengoperasikan komputer. Timbal balik tersebut berupa output dari sistem komputer. Hubungan timbal balik ini, terjadi karena user atau manusia melakukan perintah (input) lalu komputer akan memproses dengan memberikan suatu feedback berupa hasil (output) dari perintah tersebut. Interaksi manusia dan komputer berhubungan dengan desain, implementasi serta evaluasi komputer, sehingga memudahkan manusia dalam penggunaannya. Perancangan sebuah aplikasi perlu memperhatikan beberapa hal seperti bagaimana membuat sebuah desain antarmuka (interface) yang menarik, bagaimana membuat aplikasi tersebut menjadi nyaman dalam interaksinya serta bagaimana aplikasi tersebut mudah untuk digunakan, hal tersebut dapat memperhatikan aspek User Experience (UX) dan User Interface (UI).

UI adalah bagian visual dari sebuah aplikasi yang memastikan bagaimana manusia berinteraksi dengan aplikasi tersebut serta bagaimana informasi ditampilkan. UI yang baik dapat memberikan kenyamanan dan kemudahan bagi pengguna dalam mengakses setiap informasi yang ada dalam aplikasi sehingga tujuan dari aplikasi tersebut dapat tercapai (Galitz, 2007). UI sendiri menggabungkan konsep desain visual, desain interaksi, dan infrastruktur informasi.

(23)

2

Dalam membuat sebuah UI yang baik seorang designer juga perlu memperhatikan aspek UX. Menurut ISO 9241-210: 2010 (L. Albani and G. Lombardi (FIMI), 2010) UX adalah persepsi dan respon dari pengguna sebagai reaksi dari penggunaan sebuah produk, sistem atau layanan. UX merupakan bagaimana pengguna merasakan kesenangan dan kepuasan dari menggunakan sebuah produk, melihat atau memegang produk tersebut. UX tidak dapat dirancang oleh designer tapi seorang designer dapat merancang sebuah produk yang dapat menghasilkan UX. UI dan UX merupakan faktor penting penentu keberhasilan sebuah produk. UI dan UX menjadi pondasi awal dan dapat menjadi sebuah solusi untuk mempermudah pengguna, salah satunya pada aplikasi perpustakaan digital.

Untuk mengetahui baik atau buruk aspek UI dan UX dari sebuah produk maupun aplikasi dapat dilakukan pengukuran nilai usability (Rubin et al., 2008). Menurut (Vermeeren et al., 2010) usability digolongkan oleh user experience, implikasinya adalah bahwa UX memerlukan augmentatif metode yang ada untuk evaluasi usability. Usability cenderung fokus pada kinerja tugas sedangkan user experience berfokus pada pengalaman hidup.

Membaca memiliki banyak manfaat yang luar biasa untuk diri kita, bukan hanya sekedar mendapatkan ilmu pengetahuan tetapi dengan membaca dapat mendapat wawasan dunia. Bagi negara-negara maju budaya membaca menjadi hal penting dan sudah mejadi aktivitas serta kebutuhan setiap individu. Indonesia sendiri minat membaca masih sangat kurang sekali. Hasil survey yang dilakukan oleh (CCSU News Release, 2016) negara Finlandia menempati peringkat nomor 1 sebagai negara dengan literasi terbaik, sedangkan Indonesia berada pada peringkat

(24)

3

60 dari 61 negara yang disurvei. Survey tersebut terbukti Indonesia masih sangat jauh dari budaya membaca. Indonesia sebagai negara berkembang perlu meningkatkan wawasan serta pengetahuan mereka dengan menerapkan budaya membaca.

Era digital saat ini masyarakat sudah terbiasa dengan apa itu yang namanya teknologi, terutama smartphone. Indonesia merupakan negara urutan ke 11 pecandu smartphone di dunia, total pengguna smartphone di Indonesia 27 juta. Meledaknya populasi kelas menengah di Indonesia dan semakin meningkatnya pendapatan per- kapita, membuat adopsi smartphone semakin meningkat di tanah air, terlebih ponsel menjadi sarana utama dalam mengakses internet (Putra et al., 2017). Penelitian yang dilakukan oleh (Guo & Wang, 2014) menyatakan smartphone di Indonesia diprediksi meningkat dari 16% di 2014 menjadi 32% di 2015, atau naik tiga kali lipat, mereka menggunakan smartphone untuk kepentingan jejaring sosial dan chatting.

Pertumbuhan smartphone di Indonesia yang semakin maju dan sebagai solusi untuk meningkatkan minat membaca di Indonesia, Pada 16 Agustus 2016 Badan Perpustakaan Nasional Indonesia (Perpusnas) bekerja sama dengan Aksamaraya menyediakan aplikasi perpustakaan digital, iPusnas. Hasil wawancara yang dilakukan dengan Bapak Edithya Septiadi selaku Pustakawan yang menangani pengadaan koleksi digital untuk iPusnas, diketahui iPusnas disediakan sebagai layanan ekstensi untuk masyarakat Indonesia yang tidak bisa datang langsung ke Perpustakaan Nasional, sehingga dibuatlah iPusnas agar masyarakat dapat membaca buku dimana saja dan kapan saja. iPusnas menyediakan ribuan ebook

(25)

4

dengan berbagai kategori buku seperti buku-buku Pendidikan, Agama, Fiksi, Budaya dan Sastra dan berbagai katagori lainnya. Buku yang disediakan pada aplikasi iPusnas dikeluarkan oleh penerbit lokal sehingga konten buku yang disediakan mayoritas menggunakan Bahasa Indonesia.

Menurut penuturan Bapak Edithya Septiadi sampai saat ini iPusnas masih memiliki kekurangan, seperti permasalahan user experience terkait data yang ditampilkan untuk suggest keyword pencarian yang dirasa belum lengkap, kemudian kurangnya data demografis pengguna seperti range umur pengguna, karena hal tersebut dapat menjadi acuan Perpusnas dalam menyediakan konten di aplikasi sesuai kebutuhan pengguna serta dapat memberikan informasi apakah iPusnas sudah diakses oleh seluruh masyarakat Indonesia. Berdasarkan grafik moving rating yang didapatkan dari website AppBrain sejak Agustus 2019 hingga Februari 2020 aplikasi iPusnas cenderung mengalami naik turun, dengan rating paling rendah berada pada angka 1.

(26)

5

Kemudian melalui review aplikasi iPusnas pada Play Store banyak juga pengguna yang mengkritik tampilan aplikasi iPusnas belum memenuhi kebutuhan mereka, seperti pengguna sulit mencari buku yang diinginkan karena tidak adanya fitur sort dan filter pada fitur pencarian, kemudian button sign up yang tidak ditemukan pada halaman sign up, dan sulit mencari judul buku yang tepat.

Gambar 1.2 Review pengguna iPusnas pada Play Store

Permasalahan lainnya juga didapatkan dari penelitian kuantitatif dengan menyebarkan kuesioner ke 100 pengguna aplikasi iPusnas untuk mengetahui respon pengguna terhadap nilai usability untuk aspek efektivitas dan efisiensi aplikasi iPusnas. Pertanyaan kuesioner dibuat berdasarkan ISO 25022 (Enriquez et al., 2016) dengan pengukuran menggunakan poin skala likert dan dari hasil pengukuran didapatkan nilai untuk respon aspek efektivitas sebesar 32% yang berada pada indikator tidak setuju dan berdasarkan pertanyaan yang diberikan untuk aspek efektivitas aplikasi iPusnas, artinya pengguna merasa tidak setuju bahwa iPusnas

(27)

6

dapat membantu pengguna menyelesaikan tugas-tugas atau tujuan pengguna selama menggunakan aplikasi iPusnas dan aplikasi iPusnas tidak merespon dengan cara yang diharapkan pengguna serta tidak memberikan kemudahan untuk pengguna selama proses mencapai tujuan yang diinginkan. Kemudian hasil perhitungan untuk respon aspek efisiensi di dapatkan nilai sebesar35% yang berada pada indikator tidak setuju dan berdasarkan pertanyaan yang diberikan, artinya untuk aspek efisiensi aplikasi iPusnas, pengguna merasa aplikasi iPusnas tidak mampu memberikan kinerja yang tepat dan cepat dalam memproses tujuan yang diinginkan pengguna. Permasalahan yang sudah dijelaskan, maka agar aplikasi iPusnas dapat memenuhi kebutuhan dari pengguna dengan baik perlu dilakukan analisis User Experience (UX) agar mendapatkan rekomendasi perancangan User Interface (UI).

Faktor UX adalah hal yang perlu dipertimbangkan dalam membangun sebuah aplikasi. UX dari sebuah aplikasi dipengaruhi oleh UI dikarenakan UI merupakan penghubung antara pengguna aplikasi dalam berinteraksi. Membangun UI yang baik bagi pengguna dapat menggunakan metode perancang model UI dan UX, yaitu User-Centered Design (UCD). UCD sendiri merupakan pendekatan desain multidisiplin berdasarkan keterlibatan aktif dari pengguna untuk meningkatkan pemahaman kebutuhan pengguna dan task, iterasi desain dan evaluasi (Mao et al., 2005). Tahap yang terdapat pada UCD pengguna merupakan komponen utama dalam pengembangan sistem karena pengguna terlibat langsung dalam pengembangan sistem dan pengguna berhak memberi saran dan masukan yang berpengaruh dalam pengembangan sistem. Menurut terdapat 4 tahapan dalam

(28)

7

perancangan UCD, diantaranya yaitu specify the context of use, specify user and organisational requirements, produce design solutions, dan evaluate designs against user requirements.

Permasalahan yang sudah dijelaskan diatas, maka perlu dilakukan perancangan ulang tampilan aplikasi iPusnas dengan memperhatikan aspek UI dan UX menggunakan metode UCD, karena metode ini melibatkan langsung pengguna dalam perancangan ulang UI aplikasi iPusnas dan pengguna berhak memberikan saran dan masukan yang berpengaruh besar dalam pengembangan sistem. Oleh karena itu, penulis tertarik melakukan penelitian mengenai perancangan UI berupa prototype bersandarkan analisis UX pada aplikasi iPusnas dengan judul

“Perancangan User Interface (UI) Berdasarkan User Experience (UX) pada Aplikasi iPusnas Menggunakan Metode User-Centered Design.”

1.2 Identifikasi Masalah

Latar belakang yang sudah dipaparkan sebelumnya, maka dapat diidentifikasikan permasalahan pada penelitian ini sebagai berikut:

1. Pihak Perpusnas merasa aplikasi iPusnas masih memiliki banyak kekurangan terutama untuk user experience, seperti masih kurangnya suggest keyword pada fitur pencarian, kurangnya data demografis pengguna yang berpengaruh pada proses bisnis Perpusnas.

2. Sejak awal perilisan pada tahun 2016, Badan Perpustakaan Nasional Indonesia belum melakukan perubahan UI aplikasi iPusnas. Terbukti dari hasil survey melalui website analisis statistik dari AppBrain, iPusnas belum pernah melakukan perubahan untuk

(29)

8

aspek UI maupun UX dan pada review Play Store hal tersebut menyebabkan banyak pengguna mengeluhkan masalah UX maupun UI pada aplikasi iPusnas.

3. Dibutuhkannya peningkatan nilai usability untuk aspek efektivitas dan efisiensi aplikasi iPusnas agar lebih memahami kebutuhan pengguna.

4. Perlunya analisis UX untuk mendapatkan rancangan UI yang sesuai dengan kebutuhan user.

1.3 Rumusan Masalah

Berdasarkan identifikasi masalah yang sudah dipaparkan sebelumnya, maka

dapat dirumuskan permasalahan pada penelitian ini adalah “Bagaimana merancang

user interface berdasarkan analisis user experience pada aplikasi iPusnas menggunakan metode user-centered design agar sesuai dengan kebutuhan user?”

1.4 Batasan Penelitian

Batasan pada penelitian ini adalah sebagai berikut:

1. Objek penelitian ini adalah aplikasi iPusnas Mobile yang beroperasi pada Android.

2. Usability Testing pada penelitian ini menggunakan metode Think-Aloud dan ISO 25022.

3. Pengukuran nilai usability hanya untuk mengetahui nilai effectiveness, efficiency dan satisfaction. Nilai effectiveness, efficiency dan satisfaction diukur menggunakan rumus ISO 25022.

(30)

9

4. Responden untuk pada penelitian ini merupakan pengguna aplikasi iPusnas. Responden untuk kuesioner berjumlah 100 orang dan responden untuk usability testing berjumlah 13 pengguna.

5. Perancangan UI dan UX pada penelitian ini menggunakan metode User Centered-Design (UCD).

6. Hasil penelitian ini adalah rekomendasi user interface berupa prototype dengan menggunakan Figma sebagai tools merancang UI dan Prototype, Flaticon sebagai free vector icons, dan Maze digunakan sebagai tools untuk usability testing hasil rekomendasi prototype yang sudah dibuat.

1.5 Tujuan Penelitian

Tujuan penelitian ini adalah sebagai berikut:

1. Melakukan analisis user experience dan pengukuran nilai usability untuk mendapatkan informasi kebutuhan pengguna yang dapat menjadi rekomendasi perancangan ulang user interface aplikasi iPusnas.

2. Merancang rekomendasi user interface berupa prototype pada aplikasi iPusnas menggunakan metode User Centered-Design (UCD).

3. Menghasilkan rancangan user interface berupa prototype dengan memperhatikan aspek UI dan UX pada aplikasi iPusnas menggunakan metode User Centered-Design (UCD).

1.6 Manfaat Penelitian

(31)

10

1. Usulan perancangan user interface pada aplikasi iPusnas pada penelitian ini dapat memenuhi kebutuhan pengguna dan memberikan informasi yang diperlukan pengguna.

2. Dapat menjadi referensi baru untuk penelitian selanjutnya mengenai Human Computer Interaction (HCI), UI, UX dan User-Centered Design.

3. Penelitian ini dapat menjadi manfaat bagi peneliti selanjutnya dalam merancang sebuah sistem dengan memperhatikan aspek UI dan UX.

4. Bagi Badan Perpustakaan Nasional dan perusahan pengembang aplikasi, dapat dijadikan sebagai referensi dalam memperbaharui UI dan UX aplikasi iPusnas pada versi selanjutnya.

1.7 Metode Penelitian

Metode pada penelitian ini dibagi 2 tahap, yaitu metode pengumpulan data dan metode User Centered-Design (UCD) sebagai metode perancangan UI dan UX aplikasi iPusnas

1.7.1 Metode Pengumpulan Data

1. Studi Pustaka

Studi pustaka adalah mempelajari berbagai buku referensi serta hasil penelitian sebelumnya yang sejenis yang berguna untuk mendapatkan landasan teori mengenai masalah yang akan diteliti (Sarwono, 2006)

2. Observasi

Observasi adalah sebuah pengamatan dan juga pencatatan secara urut yang terdiri dari unsur-unsur yang muncul dalam suatu fenomena pada objek penelitian

(32)

11

tersebut. Dan hasil dari pengamatan tersebut selanjutnya akan dilaporkan dengan susunan secara sistematis dan juga sesuai dengan kaidah-kaidah yang berlaku (Nawawi dan Martini, 1992).

3. Wawancara

Wawancara adalah pertemuan dua orang untuk bertukar informasi dan ide melalui tanya jawab, sehingga biasa dikontraskan makna dalam sebuah topik tertentu (Sugiyono, 2013).

1.7.2 Metode User Centered-Design (UCD)

Proses dari metode User-Centered Design (UCD) berdasarkan ISO 9241-210: 2010 (L. Albani and G. Lombardi (FIMI), 2010) terdapat empat proses yaitu : 1. Specify the context of use

Mengidentifikasi konteks pengguna sistem. Konteks pengguna sistem berisi mengenai pengguna yang akan menggunakan sistem dan menentukan kondisi digunakan sistem oleh pengguna. Data konteks pengguna diperoleh dari pengambilan data kepada pengguna. Hasil yang didapatkan dari tahap ini berupa karakteristik pengguna, task yang akan dilakukan oleh pengguna dan environment yang menunjukkan melalui apa dan dimana pengguna akan menggunakan sistem. Hasil pada tahap ini kemudian dijadikan sebagai data konteks pengguna sistem. 2. Specify user and organisational requirement

Mengidentifikasi kebutuhan dari sistem yang dapat sesuai dengan kebutuhan dari pengguna, data kebutuhan dari pengguna diperoleh dari pengguna dan organisasi dan memiliki kaitan dengan data konteks pengguna sistem. Hasil yang didapatkan dari tahap ini berupa data dari sistem sesuai dengan kebutuhan

(33)

12

pengguna. Hasil pada tahap ini kemudian dijadikan sebagai data kebutuhan dari pengguna terhadap sistem yang akan dibangun.

3. Product design solutions

Merancang solusi desain berdasarkan data kebutuhan dari pengguna, proses ini dilakukan dalam beberapa proses, dimulai dari merancang konsep desain, membuat desain menjadi lebih detail dan konkret kemudian mengimplementasikan desain. Hasil yang didapatkan dari tahap ini berupa rancangan konsep desain sistem, desain sistem dalam bentuk yang lebih detail dan implementasi dari desain sistem. Hasil pada tahap ini kemudian dijadikan sebagai solusi desain sistem. 4. Evaluate designs against user requirement

Menguji solusi desain sistem untuk menilai apakah solusi desain telah dapat sesuia dengan kebutuhan pengguna. Hasil yang didapatkan dari tahap ini berupa data pengujian. Hasil yang didapatkan dari tahap ini berupa data pengujian solusi desain sistem sesuai dengan kebutuhan dari pengguna dan feedback untuk perbaikan desain.

1.8 Sistematika Penulisan

Dalam penyusunan laporan penelitian ini, pembahasan terbagi dalam lima bab yang secara singkat akan diuraikan sebagai berikut:

BAB I PENDAHULUAN

Bab ini menjelaskan mengenai latar belakang masalah, identifikasi masalah, perumusan masalah, batasan penelitian, tujuan penelitian, manfaat penelitian, metodologi penelitian dan sistematika penulisan.

(34)

13

BAB II LANDASAN TEORI

Bab ini menjelaskan tentang teori-teori yang berkaitan dengan penyelesaian masalah dalam penelitian ini.

BAB III METODOLOGI PENELITIAN

Bab ini menjelaskan mengenai gambaran umum objek penelitian (Aplikasi iPusnas), menguraikan metodologi penelitian yang digunakan dalam perancangan UI dan UX (User-Centered Design), pemilihan responden dalam penelitian ini.

BAB IV HASIL DAN PEMBAHASAN

Pada bab ini berisi pembahasan dan hasil dari proses analisis dan perancangan UI dan UX pada aplikasi iPusnas menggunakan metode UCD.

BAB V KESIMPULAN DAN SARAN

Bab ini berisi kesimpulan dan saran atas hasil penelitian yang sudah dilakukan serta saran untuk kelanjutan penelitian berikutnya.

(35)

(36)

14

BAB II

TINJAUAN PUSTAKA

2.1 Perpustakaan Nasional

Berdasarkan pasal 4 UU No.43 tahun 2007 tentang perpustakaan disebutkan bahwa Perpustakaan bertujuan memberikan layanan kepada pemustaka, meningkatkan kegemaran membaca, serta memperluas wawasan dan pengetahuan untuk mencerdaskan kehidupan bangsa (Presiden Republik Indonesia & Dewan Perwakilan Rakyat Republik Indonesia, 2007).

Dalam hasil pertemuan Conference of Directors of National Libraries (CDNL) di Bangkok tahun 1999 Perpustakaan Nasional adalah sebuah institusi, terutama didanai (langsung atau tidak langsung) oleh negara, yang bertanggung jawab atas pengumpulan secara komprehensif, pencatatan bibliografis, pelestarian dan menyediakan warisan dokumenter (terutama materi yang diterbitkan dalam semua jenis) yang berasal atau berkaitan dengan negara tersebut; dan dapat juga bertanggung jawab atas pelaksanaan lebih lanjut fungsi perpustakaan di negara tersebut secara efisien dan efektif melalui tugas seperti manajemen koleksi yang maknawi secara nasional, penyediaan infrastruktur, koordinasi aktivitas perpustakaan dan sistem informasi di negara bersangkutan, hubungan internasional, dan melaksanakan kepemimpinan. Biasanya tanggung jawab ini secara formal diakui lazimnya berdasarkan perundang–undangan. Untuk keperluan definisi ini maka sebuah negara didefinisikan sebagai negara independen berdaulat. Institusi

(37)

15

yang disetarakan dengan perpustakaan nasional terdapat juga di entitas nasional non-berdaulat seperti di Catalonia, Quebec dan Wales (Feather & Sturges, 2003).

Dalam pasal 3 UU No.43 2007 disebutkan Perpustakaan berfungsi sebagai wahana pendidikan, penelitian, pelestarian, informasi, dan rekreasi untuk meningkatkan kecerdasan dan keberdayaan bangsa. Fungsi pendidikan diwujudkan dengan perpustakaan yang mampu meningkatkan kegemaran membaca penggunanya. Fungsi penelitian diterapkan dengan menyediakan pelayanan untuk pemakai dalam memperoleh informasi sebagai bahan rujukan untuk kepentingan penelitian. Fungsi pelestarian yaitu sebagai tempat melestarikan bahan pustaka (bahan pustaka merupakan sumber ilmu pengetahuan, teknologi, dan budaya). Fungsi informasi diterapkan dengan menyediakan sumber-sumber pustaka yang lengkap dan bermutu. Fungsi rekreasi diterapkan dengan menyediakan buku hiburan dan tata ruang yang bersifat rekreatif. Selain fungsi-fungsi tersebut, ada pula fungsi sosial, yang diartikan sebagai wadah sosialisasi antar pengunjung dalam memperoleh informasi (Presiden Republik Indonesia & Dewan Perwakilan Rakyat Republik Indonesia, 2007).

Dalam Rancangan Peraturan Pemerintah Republik Indonesia Tahun 2009 Tentang Standar Nasional Perpustakaan (Basuki, 2008), disebutkan perpustakaan berdasarkan jenis dan kepemilikan mencakup:

1. Perpustakaan nasional 2. Perpustakaan pemerintah 3. Perpustakaan provinsi

(38)

16 5. Perpustakaan kecamatan

6. Perpustakaan desa/kelurahan 7. Perpustakaan sekolah/madrasah 8. Perpustakaan perguruan tinggi 9. Perpustakaan khusus

10. Perpustakaan keluarga 11. Perpustakaan pribadi

Ada dua macam sistem pelayanan yang biasa dilakukan oleh perpustakaan yaitu sistem pelayanan terbuka dan sistem pelayanan tertutup. Masing-masing sistem tersebut memiliki kelebihan dan kekurangan.

2.1.1 Sistem Pelayanan Tertutup (Close Access)

Kebalikan dari sistem terbuka, pengunjung tidak boleh masuk ke ruangan koleksi, tetapi yang dibutuhkannya harus diambilkan oleh petugas. Penelusuran/pencarian koleksi harus melalui katalog. Petugas selain mencatat peminjaman dan pengembalian, juga mengambilkan dan mengembalikan koleksi ke rak.

1. Kelebihan:

a. Susunan dan letak buku terpelihara

b. Tidak perlu ada petugas khusus untuk mengawasi pengguna. 2. Kekurangan:

(39)

17

a. Melihat dari katalog kadang-kadang mengesalkan, karena dalam katalog ada, tetapi bukunya sering tidak ada, dan harus memilih lagi sampai berulang-ulang.

b. Petugas harus mengambilkan dan mengembalikan buku c. Katalog harus lengkap.

2.1.2 Sistem Pelayanan Terbuka (Open Access)

Dalam sistem pelayanan terbuka perpustakaan memberi kebebasan kepada pengguna untuk dapat masuk dan memilih sendiri koleksi yang diinginkannya dari rak. Petugas hanya mencatat apabila koleksi tersebut akan dipinjam serta dikembalikan.

1. Kelebihan:

a. Pengguna bebas memilih bukunya sendiri

b. Kebebasan ini menimbulkan rangsangan untuk membaca

c. Kalau buku yang dikehendaki tidak ada, dapat memilih buku lain dengan subyek atau topik yang sama.

2. Kekurangan:

a. Susunan buku dalam rak menjadi sulit teratur. b. Kemungkinan banyak buku yang hilang.

2.2 Human Computer Interaction

Interaksi manusia dan komputer atau human computer interaction (HCI) adalah hubungan antara manusia dan komputer yang mempunyai karakteristik tertentu untuk mencapai suatu tujuan dengan menjalankan sebuah sistem yang

(40)

18

bertopengkan sebuah antarmuka pemakai (interface) (Lubis, 2019). Menurut (Martono & Kurniawan, 2011) peran utama dari interaksi manusia dan komputer adalah untuk menghasilkan sistem yang mudah digunakan, aman, efektif dan efisien. Terdapat tiga komponen dalam interaksi manusia dan komputer antara lain pengguna sistem, model interaksinya dan sistem yang akan digunakan. Untuk melihat garis besar dari interaksi manusia dan komputer dapat dilihat dalam Gambar 2.1.

Gambar 2.1 Garis Besar Interaksi Manusia dan Komputer (Martono & Kurniawan, 2011)

Penjelasan mengenai HCI yang sudah dijelaskan sebelumnya, dapat ditarik kesimpulan bahwa interaksi manusia dan komputer adalah hubungan antara manusia dan komputer untuk menciptakan sebuah sistem yang mudah digunakan, efektif, efisien dan aman dengan menggunakan antarmuka (interface).

(41)

19

2.3 User Experience

User experience (UX) adalah persepsi dan respon seseorang yang dihasilkan dari penggunaan atau antisipasi dari sebuah produk, sistem atau jasa, mencakup semua emosi, keyakinan, pilihan, persepsi, respon fisik dan psikologis, perilaku, serta keberhasilan pengguna yang terjadi sebelum, selama, dan setelah penggunaan sistem (ISO, 2010). Terdapat tiga faktor yang mempengaruhi pengalaman pengguna yaitu sistem, pengguna, dan konteks penggunaan.

UX sangat sulit didefinisikan secara umum, karena UX memiliki jarak yang luas antara konsep fuzzy dan konsep dinamis, emosional, efektif, experimental, hedonic dan semua yang berhubungan dengan keindahan. Unit analisis dari UX dirasa terlalu lunak, mulai dari aspek interaksi pengguna secara individu dengan aplikasi mandiri sampai semua aspek dari interaksi beberapa pengguna dengan perusahaan dan penggabungan atas layanan dari berbagai bidang ilmu. Cakupan dari penelitian UX ini terpecah dari berbagai model teoritis dengan fokus yang berbeda seperti pragmatis, emosi, pengaruh, pengalaman, nilai, kesenangan, keindahan, kualitas hedonis dan lain sebagainya (Law et al., 2009). Menurut penelitian yang dilakukan oleh (Garrett & James, 2011) UX memiliki 5 elemen dasar :

(42)

20

Gambar 2.2 Lima Elemen Dasar User Experience (Garrett & James, 2011) 1. Strategy plane

Bagian ini merupakan lapisan paling bawah berupa strategi bisnis mendasar yang menentukan tujuan dari produk serta kebutuhan dari penggunanya. Strategi Plane memiliki 2 bagian yaitu Product Objectives dan User Needs.

a. Product Objectives

Merancang dan melaksanakan strategi bisnis adalah inti dari mengelola suatu perusahaan (Borah et al., 2017). Menciptakan pengalaman pengguna yang sukses, kita harus memastikan bahwa setiap keputusan yang dibuat berakar pada pemahaman yang kuat tentang konsekuensi nya. Pertimbangan penting dalam merumuskan tujuan untuk suatu produk adalah identitas merek, ketika kebanyakan dari kita melihat kata branding, kita memikirkan hal-hal seperti logo, palet warna, dan tipografi, selanjutnya yang perlu dipersiapkan adalah tolak ukur keberhasilan ketika produk sudah berhasil dibuat (Garret t & James, 2011).

b. User Needs

Merancang sebuah aplikasi perlu memahami siapa pengguna aplikasi tersebut dan apa yang mereka butuhkan. Melakukan penelitian untuk kebutuhan pengguna,

(43)

21

dapat menciptakan sebuah produk dari sudut pandang pengguna. Buku (Garrett & James, 2011) menjelaskan, untuk mengetahui kebutuhan user hal yang perlu dilakukan adalah segmentasi demografis, yaitu pengelompokan pengguna seperti berdasarkan umur, jenis kelamin, pekerjaan, hal tersebut dapat mempermudah memahami kebutuhan pengguna.

Melakukan user research atau penelitian dapat dilakukan untuk memahami kebutuhan pengguna. Metode yang dilakukan untuk penelitian tersebut dapat berupa survey, wawancara secara langsung, ataupun user test. Hasil mengumpulkan data dapat berupa sikap, persepsi pengguna serta kebiasaan user. Hasil tersebut nantinya dapat dikembangkan untuk menciptakan sebuah produk. Langkah selanjutnya dapat menentukan Persona. Persona merupakan karakter fiksi yang dibangun dari segmentasi pengguna untuk mewakili kebutuhan seluruh pengguna. Persona dapat memastikan untuk kita selalu mengingat target pengguna dalam proses perancangan produk.

2. Scope plane

Scope plane merupakan translasi dari strategi untuk diteruskan dalam pembuatan spesifikasi fungsional. Scope plane dapat mendefinisikan apa yang akan kita buat sehingga mengetahui ruang lingkup produk yang akan dibuat. Dalam menentukan ruang lingkup produk terdapat 2 katagori yaitu produk sebagai fungsionalitas dan produk sebagai informasi.

a. Functional Specifications

Untuk mengembangkan suatu produk perlu adanya dokumen yang berisi spesifikasi fungsi dan fitur apa yang akan ditampilkan pada produk. Dan seberapa

(44)

22

kompleks produk tersebut perlu diperhatikan beberapa aturan umum untuk penulisan pada dokumen seperti:

• Be Positive (menggunakan kalimat yang positif daripada negatif): (Negatif) sistem tidak akan mengizinkan membeli radio tanpa antenna (Positif) sistem akan mengarahkan pengguna ke halaman antenna saat pengguna mencoba untuk menyalakan radio.

• Be Specific (menjelaskan spesifikasi fungsi produk secara jelas dan spesifik):

(Tidak Spesifik) layanan yang paling sering dikunjungi pengguna akan diberi tanda

(spesifik) layanan dengan jumlah pengunjung terbanyak akan ditampilkan pada urutan pertama pada halaman hotlist.

b. Content Requirement

Content requirement berupa informasi yang akan ditampilkan harus dipersiapkan secara matang. Informasi seperti text, gambar, video dan konten lainnya dapat disesuaikan dengan produk yang akan dibuat.

3. Structure plane

Arsitektur informasi dibuat dengan memperhatikan pembentukan struktur informasi yaitu kemudahan pengguna dalam mendapatkan informasi. Dalam pembuatan suatu produk designer perlu memahami perilaku dan pemikiran pengguna untuk mendapatkan pemahaman dalam menentukan struktur produk agar pengalaman pengguna sesuai dengan produk yang ingin dikembangkan.

(45)

23 a. Interaction Design

Interaction design berkaitan dengan menggambarkan kemungkinan perilaku pengguna dan menentukan bagaimana sistem akan merespon perilaku tersebut. Interaction design menggabungkan pengetahuan tentang kemungkinan teknologi dari platform dan sistem dalam sebuah permainan, penilaian estetika yang terampil, dan empati informasi dengan pengguna potensial (Goodman et al., 2011). Contoh sederhana interaction design yaitu ketika pengguna klik sebuah icon maka sistem akan merespon dengan mengubah icon tersebut menjadi warna yang berbeda.

Untuk membuat sebuah interaction design perlu menentukan conceptual model untuk membantu designer memahami perbedaan berbagai jenis informasi yang perlu ditampilkan dalam sebuah produk. Conceptual model akan mengilustrasikan kebutuhan, prioritas dan memberikan kejelasan tentang produk yang akan dibuat. Conceptual model akan membantu pengguna dan designer memahami bagaimana produk berperilaku sebenarnya.

b. Information Architecture

Information architecture dapat diartikan bagaimana pengguna dapat memproses informasi yang terdapat dalam produk yang kita buat. Designer harus mampu dalam menyusun informasi yang akan ditampilkan/diberikan sehingga pengguna dapat memahami dan menggunakannya.

4. Skeleton plane

Tahap ini fokus utama pada membuat low fidelity prototype yang merupakan perwujudan dari interaction design. Yang dilakukan pada langkah awal adalah membuat antarmuka. Prototype merupakan simulasi dari produk yang sedang

(46)

24

dikembangkan, yang bertujuan untuk melihat seberapa baik dan konsisten alur dari suatu produk yang dapat diterima oleh pengguna (Banerjee, 2014). Perancangan low fidelity prototype meliputi layout dan penempatan elemen-elemen interaksi. Penempatan dan pengelompokan elemen interaksi disesuaikan dengan tingkat kepentingan dan hubungan antar elemen interaksi (Garrett & James, 2011). Skeleton plane terdiri atas tiga bagian, meliputi:

a. Interface design

Bagian ini merupakan pengaturan elemen antarmuka untuk memungkinkan pengguna dalam berinteraksi. Interface design sebaiknya disesuaikan dengan target kebiasaan pengguna dalam menggunakan aplikasi. Consistency menjadi poin yang perlu diperhatikan ketika designer merancang suatu interface agar pengguna familiar dengan produk yang diciptakan. Seberapa intuitif interface yang dibuat menjadi poin utama kesuksesan sebuah desain.

b. Navigation design

Navigation design merupakan kumpulan elemen yang memungkinkan pengguna untuk menjelajahi arsitektur informasi. Navigation design harys mencapai 3 tujuan secara bersamaan:

• Harus memberi pengguna sarana untuk berpindah dari satu titik ke titik lainnya.

• Harus mengkomunikasikan hubungan antara elemen-elemen yang terdapat dalam sebuah produk atau layanan yang dibuat.

• Harus mengkomunikasikan hubungan antara kontennya dan halaman yang sedang dilihat pengguna.

(47)

25 c. Information Design

Information design merupakan presentasi dari informasi untuk memudahkan pemahaman. Information design bagaimana mengelola informasi yang kita miliki untuk ditampilkan secara baik agar user dapat memahami informasi dengan lebih mudah. Informasi tersebut dapat ditampilkan berupa text, grafik, diagram dll. Pengelompokan informasi dapat mempermudah user menentukan informasi yang sedang dicari,

5. Surface Plane

Surface plane merupakan pengalaman sensoris kepada pengguna (berupa warna, gambar, icon) yang dibuat untuk menyelesaikan produk. Pada tahap ini dihasilkan sebuah design guidelines. Design guidelines terdiri dari perancangan sistem elemen visual meliputi warna, tipografi, dan icon. Design guidelines tersebut digunakan sebagai acuan dalam perancangan medium fidelity. Perancangan medium fidelity prototype merupakan lanjutan dari perancangan low fidelity prototype.

2.4 User Interface

User Interface (UI) adalah suatu istilah yang digunakan untuk menggambarkan tampilan dari mesin atau komputer yang berinteraksi langsung dengan pengguna. Desain dan penyusunan tampilan antarmuka perlu diperhatikan untuk menghasilkan tampilan yang bagus (Ghiffary et al., 2018). UI seperti proses komunikasi umum, dimana UI merupakan media yang menghubungkan komunikasi antara dua domain (produk atau sistem dan manusia) dan berperan penuh dalam menerjemahkan setiap aksi dan reaksi dari kedua domain tersebut. UI berlaku pada beberapa jenis atau varian produk atau sistem. Dalam kehidupan

(48)

26

sehari-hari, manusia dapat berinteraksi dengan obyek-obyek yang ada di sekitarnya melalui keberadaan UI (Darmawan, 2013).

Menurut (Suteja & Harjoko, 2008) tujuan dari UI adalah merancang interface yang efektif untuk sistem perangkat lunak. Efektif artinya siap digunakan, dan hasilnya sesuai dengan kebutuhan. Kebutuhan disini adalah kebutuhan penggunanya. Pengguna sering menilai sistem dari interface, bukan dari fungsinya melainkan dari user interface, jika desain sebuah produk user interface buruk, maka hal tersebut sering menjadi alasan untuk tidak menggunakan produk tersebut. Selain itu, interface yang buruk menyebabkan pengguna membuat kesalahan fatal. Desain harus bersifat user-centered, artinya pengguna sangat terlibat dalam proses desain. Karena itu ada proses evaluasi yang dilakukan oleh pengguna terhadap hasil desain. Membuat sebuah antarmuka pengguna, designer perlu memperhatikan prinsip-prinsip yang akan dijadikan acuan. Prinsip tersebut merupakan aturan dari pembuatan sebuah design produk agar sesuai dengan kebutuhan pengguna. Dalam buku (Shneiderman et al., 2017) menjelaskan Eight Golden Rules of Interface Design yang perlu diperhatikan agar design interface sebuah produk yang kita buat dapat digunakan dengan baik dan sesuai dengan kebutuhan pengguna.

1. Strive for consistency

Konsistensi dalam sebuah produk dibutuhkan antar halaman yang masih berhubungan. Hal tersebut berguna agar user merasa bahwa halaman yang akan diakses masih memiliki keterhubungan dengan produk yang dijalankan, dengan demikian akan membuat user merasa nyaman dalam menggunakan atau mengeksplorasi produk yang kita buat tanpa harus perpindahan ke produk lain.

(49)

27 2. Enable frequent users to use shortcuts

Sebagai seorang UI Designer perlu memperhitungkan jenis variasi user yang akan menggunakan produknya, seperti jenis pekerjaan, usia, budaya, Bahasa dan tingkat pemahaman user akan sebuah produk, hal tersebut akan menjadi acuan untuk designer merancang produk yang dapat dipahami oleh user. Seperti ada sebuah tombol tertentu yang sudah biasa digunakan di aplikasi lain dengan tata letak dan fungsi yang sudah familiar di kalangan user maka hal tersebut patut menjadi acuan untu designer merancang sebuah aplikasi.

3. Offer informative feedback

Memberikan informasi mengenai apa yang telah atau sedang dilakukan user diperlukan sebuah feedback yang dapat terlihat secara visual dan memiliki makna yang baik agar user mendapatkan informasi atau jawaban dari tindakan yang telah dilakukan oleh user. Contoh sederhana seperti user akan mengklik suatu menu aplikasi dapat merespon aksi user dengan menampilkan proses loading.

4. Design dialogue to yield closure

Menyampaikan bahwa proses yang dijalankan oleh user sudah selesai agar user mengerti tanpa harus menunggu ketidakpastian apakah harus melakukan proses lainnya setelah melakukan suatu proses. Seperti contoh sederhana user melakukan penyimpanan pada perubahan data diri di menu pengaturan, sebagai feedback atas aksi yang telah dilakukan oleh user aplikasi dapat menampilkan notifikasi bahwa perubahan data diri berhasil diperbaharui.

(50)

28 5. Offer simple error handling

Menciptakan sebuah produk, designer perlu merancang tampilan sebaik mungkin hal tersebut akan menjaga agar user tidak melakukan kesalahan dalam menjalankan proses. User akan merasa bosan jika produk yang digunakan sering mengalami kesalahan atau error dan menyebabkan user tidak ingin menggunakan produk itu kembali, untuk menghindari hal tersebut designer dapat membuat sebuah petunjuk singkat pada proses yang akan dilakukan user.

6. Permit easy reversal of actions

User bisa saja melakukan kesalahan dalam menggunakan sebuah aplikasi, dan perbaikan kesalahan tersebut harusnya mudah diakses dan dilakukan oleh user, hal tersebut berhubungan dengan UX. Sebagai contoh pada box search di aplikasi user salah menginput kata yang sebenarnya diinginkan, user dapat dengan mudah

menggantinya dengan menghapus atau langsung mengklik tombol ‘x’ pada box

search yang diartikan sebagai menghapus secara cepat dan user akan menginput kembali kata yang diinginkannya dengan benar, hal tersebut akan membuat user merasa nyaman dengan aplikasi yang digunakannya.

7. Support internal locus of control

User akan merasa nyaman saat mereka dapat memiliki atau mengatur tampilan aplikasi yang sedang mereka gunakan sesuai dengan selera mereka. Contoh sederhana adalah user dapat dengan mudah merubah tampilan aplikasi dari light mode menjadi dark mode ataupun sebaliknya. Hal tersebut dapat meningkatkan kepuasan user terhadap aplikasi yang sangat mempengaruhi UX pada aplikasi tersebut.

(51)

29 8. Reduce short-term memory of load

Saat melakukan design tampilan sebuah produk biasanya designer akan lebih fokus terhadap design tata telak menu dan tombol, namun sebenarnya hal tersebut kurang efektif, akan lebih baik jika diterapkan pada proses saat user harus memberikan input ke sistem. Dengan menerapkan hal tersebut, user tidak perlu mengingat data yang harus di input ke system, karena data yang di input, sudah disediakan oleh sistem.

2.5 Google Material Design

Material design merupakan sistem desain atau panduan sebuah desain yang dibuat oleh Google untuk membatu tim pengembang atau perancang aplikasi membangun sebuah produk digital berkualitas tinggi untuk Android, iOS, Flutter, dan web (Google, 2016). Material design dibuat berdasarkan inspirasi dunia nyata, dimana sebuah benda dapat memiliki tekstur, memantulkan cahaya dan menghasilkan bayangan. Material design terdiri dari panduan desain tipografi, garis, spasi, ukuran, warna, dan gambar untuk menciptakan hierarki, makna, dan fokus sebuah produk dan memberikan pengalaman ke pengguna dalam menggunakan sebuah produk.

Material design menentukan kualitas dengan mengekspresikan daerah, permukaan, dan permukaan UI. Rancangan dan susunan strategi sebuah produk atau aplikasi yang dirancang dibuat menggunakan fondasi yang menangani desain dari perspektif yang luas dan terperinci. Fondasi dalam material design dibagi menjadi beberapa bagian, yaitu:

(52)

30 1. Environment

Dalam sebuah aplikasi material design memiliki kualitas 3D yang tercermin dalam 3 aspek, yaitu penggunaan permukaan, kedalaman, dan bayangan

a. Surfaces

Surface merupakan material design yang mencerminkan kualitas aplikasi dalam cara menampilkan permukaan dan berpindah antara seluruh UI material. Permukaan dan cara bergerak dalam 3D dikomunikasikan dengan menyerupai pergerakan sebuah benda di kehidupan nyata.

b. Elevation

Elevasi dalam material design diukur sebagai jarak antara permukaan material. Jarak dari bagian depan salah satu permukaan material ke permukaan lainnya diukur sepanjang sumbu z dalam piksel, digambarkan secara default menggunakan bayangan.

c. Light and Shadow

Dalam environment material design, cahaya virtual digunakan untuk menerangi UI. Cahaya menciptakan sebuah bayangan terarah yang lebih tajam, yang disebut key shadows. Cahaya yang muncul dari berbagai sudut dapat menciptakan bayangan lembut yang tersebar, yang disebut ambient shadows.

2. Layout

Tata letak dalam material design mendorong designer untuk konsistensi di seluruh platform, environments dan ukuran layar dengan menggunakan elemen dan jarak yang seragam dalam menciptakan sebuah desain.

(53)

31 3. Navigation

Navigasi adalah tindakan berpindah pindah antara layar aplikasi untuk menyelesaikan suatu tugsa. Navigasi diaktifkan melalui beberapa cara yaitu, komponen navigasi khusus, memasukan perilaku navigasi ke dalam konten, dan kemampuan platform.

4. Color

Sistem warna pada material design membantu designer menerapkan warna ke UI dengan cara yang berarti. Designer dapat memilih warna primer dan sekunder untuk mewakili warna pada produk atau aplikasi yang akan dibuat.

5. Typography

Tipografi dalam material design membantu designer untuk menyajikan desain dan konten segelas dan seefisien mungkin. Material design menyediakan berbagai ukuran font yang mendukung kebutuhan produk atau aplikasi yang ingin dibuat. Dengan memilih jenis font apapun yang designer inginkan secara otomatis dapat diubah ukurannya dan dioptimalkan berdasarkan panduan tipografi dari material design.

6. Sound

Suara dalam UI harus berfungsi seperti okestra yang terkoordinasi dengan baik. Terdapat 3 jenis suara yang muncul dalam UI yaitu, design suara, musik dan voice. Setiap jenis suara mengkomunikasikan informasi dan identitas sebuah produk dengan cara yang berbeda. Jenis suara yang berbeda dapat digunakan untuk membuat efek tertentu dan beberapa suara dapat muncul terpisah atau

(54)

bersama-32

sama di UI yang sama. Dengan menggunakan suara dapat mengkomunikasikan informasi dengan cara yang meningkatkan user experience.

7. Icongraphy

Ikon adalah ekspresi visual dari suatu produk atau aplikasi, termasuk layanan dan alatnya. Ikon mengkomunikasikan ide inti dan maksud dari sebuah aplikasi dengan cara yang sederhana, berani, dan bersahabat. Meskipun setiap ikon berbeda secara visual, namun dalam penerapannya harus disatukan sesuai dengan konsep aplikasi atau produk yang dibuat. Panduan iconography dalam material design dimaksudkan untuk memastikan bahwa warna ikon produk dan elemen utama mencerminkan identitas aplikasi yang designer buat.

8. Shape

Permukaan sebuah material desain dapat ditampilkan dalam berbagai bentuk. Bentuk dapat memberikan perhatian langsung dalam mengidentifikasi komponen, mengkomunikasikan keadaan dan mengekspresikan sebuah merek.

9. Motion

Motion membantu membuat UI menjadi lebih ekspresif dan mudah digunakan. Motion terbagi menjadi 3, yaitu motion design, motion focuses, dan motion celebrates. Motion design dapat memberi tahu pengguna dengan menyoroti hubungan antara elemen, ketersediaan tindakan, dan hasil tindakan. Motion focuses merupakan gerakan memfokuskan perhatian pada apa yang penting, tanpa menimbulkan gangguan yang tidak perlu. Dan motion celebrates adalah gerakan sebuah desain untuk merayakan momen dalam perjalanan pengguna menggunakan

(55)

33

aplikasi, menambahkan karakter pada interaksi umum, dan dapat mengekspresikan daya merek.

10.Interaction

Interaksi terbagi menjadi 3 macam, yaitu: a. Gesture

Gestur memungkinkan pengguna untuk berinteraksi dengan elemen layar menggunakan sentuhan. Isyarat menggunakan sentuhan sebagai cara lain dalam melakukan sebuah tugas di aplikasi.

b. Selection

Pilihan mengacu pada bagaimana pengguna menunjuk sebuah item tertentu yang ingin mereka lakukan.

c. States

Status adalah representasi visual yang digunakan untuk mengkomunikasikan status suatu komponen atau elemen interaktif

11.Communication

Komunikasi merupakan hal penting dalam merancang sebuah produk, designer harus mengetahui bagaimana cara mereka memberikan informasi dalam bahasa visual agar mudah untuk dimengerti oleh pengguna selama menggunakan produk atau aplikasi tersebut.

2.6 User Centered-Design

Menurut (Priyatna, 2019) User Centered-Design (UCD) merupakan metode untuk pengembangan sistem. UCD adalah bahasa yang banyak di terapkan dalam

(56)

34

menggambarkan rancangan. UCD merupakan suatu proses interaktif yang mana langkah-langkah rancangan dan evaluasi dibuat dalam awal proyek sampai dengan tahap implementasi. Produk yang dikembangkan dengan pendekatan UCD, dioptimalkan untuk end-user serta ditekankan pada bagaimana kebutuhan atau keinginan end-user terhadap penggunaan suatu produk (Jayanti, 2019). Desain dirancang dengan adaptasi terhadap behaviour atau perilaku pengguna dalam menggunakan produk sehingga produk yang dikembangkan tidak memaksa pengguna untuk mengubah perilakunya ketika menggunakan produk tersebut.

Penelitian yang dilakukan oleh (Wanti et al., 2019) UCD telah berhasil diimplementasikan ke dalam sistem pendukung keputusan peramalan penjualan ikan hias di WD Aquafish yang dapat memetakan semua kebutuhan user ke dalam desain aplikasi peramalan penjualan ikan hias sehingga user/pemilik toko merasa nyaman ketika berinteraksi dengan sistem pendukung keputusan tersebut. Penelitian yang dilakukan (Widhiyanti, 2017) juga menggunakan UCD sebagai perancangan dan pembuatan game pembelajaran Bahasa Jepang untuk pemula, hasil penelitian yang dilakukan terbukti bahwa 92,3% dari sistem navigasi dan fitur yang ada pada aplikasi pembelajaran ini telah dipahami oleh pengguna dan dapat membantu pengguna untuk mempelajari Bahasa Jepang.

Berdasarkan ISO 9241-210: 2010 (L. Albani and G. Lombardi (FIMI), 2010) metode UCD memiliki empat proses yaitu:

(57)

35

Gambar 2.3 Empat Proses User Centered-Design (UCD) (L. Albani and G. Lombardi (FIMI), 2010)

1. Specify the context of use

Mengidentifikasi konteks pengguna sistem. Konteks pengguna sistem berisi mengenai pengguna yang akan menggunakan sistem dan menentukan kondisi digunakan sistem oleh pengguna. Data konteks pengguna diperoleh dari pengambilan data kepada pengguna. Hasil yang didapatkan dari tahap ini berupa karakteristik pengguna, task yang akan dilakukan oleh pengguna dan environment yang menunjukkan melalui apa dan dimana pengguna akan menggunakan sistem. Hasil pada tahap ini berupa user persona yang dijelaskan pada sub bab 2.6 kemudian dijadikan sebagai data konteks pengguna sistem.

2. Specify user and organisational requirement

Mengidentifikasi kebutuhan dari sistem yang dapat sesuai dengan kebutuhan dari pengguna, data kebutuhan dari pengguna diperoleh dari pengguna dan organisasi dan memiliki kaitan dengan data konteks pengguna sistem. Hasil yang didapatkan dari tahap ini berupa data dari sistem sesuai dengan kebutuhan

(58)

36

pengguna dengan melakukan pengujian usability testing. Hasil pada tahap ini kemudian dijadikan sebagai data kebutuhan dari pengguna terhadap sistem yang akan dibangun.

3. Product design solutions

Merancang solusi desain berdasarkan data kebutuhan dari pengguna, proses ini dilakukan dalam beberapa proses, dimulai dari merancang konsep desain, membuat desain menjadi lebih detail dan konkret kemudian mengimplementasikan desain. Hasil yang didapatkan dari tahap ini berupa rancangan konsep desain sistem, desain sistem dalam bentuk yang lebih detail dan implementasi dari desain sistem. Hasil pada tahap ini kemudian dijadikan sebagai solusi desain sistem berupa prototype.

4. Evaluate designs against user requirement

Menguji solusi desain sistem berupa prototype untuk menilai apakah solusi desain telah dapat sesuai dengan kebutuhan pengguna. Hasil yang didapatkan dari tahap ini berupa data pengujian. Hasil yang didapatkan dari tahap ini berupa data pengujian solusi desain sistem sesuai dengan kebutuhan dari pengguna dan feedback untuk perbaikan desain.

2.7 User Persona

User persona dapat diartikan sebagai suatu karakter fiksi untuk mewakili user yang akan menggunakan produk yang telah dibuat (Nielsen & Hansen, 2014). User persona dapat diartikan juga sebagai user yang memiliki perilaku dan karakteristik yang sama (Nielsen & Hansen, 2014). Persona dapat menggambarkan keterangan

(59)

37

jelas mengenai kebutuhan dari user terhadap konten dari produk yang sedang dirancang. Menurut buku yang di tulis oleh (Cooper, 2005) dengan menggunakan user persona perancang akan mendapat beberapa keuntungan:

1. Fokus proses pembangunan produk atau program berdasarkan user.

2. Akan lebih menghasilkan produk yang akan sesuai dengan harapan dan keinginan user.

3. Membantu memprioritaskan requirement pada produk dan membantu menentukan apakah problem yang akan ditemukan dapat diselesaikan dengan benar atau tidak.

Membuat sebuah persona harus didasarkan pada riset pengguna agar benar-benar akurat dan mewakili pengguna produk yang sebenar-benarnya. Persona adalah orang-orang yang dibuat-buat, tetapi mereka harus dibuat berdasarkan informasi tentang orang-orang nyata. Idealnya, proses pembuatan persona harus menjadi bagian dari fase penelitian untuk suatu produk atau fitur, sebelum proses desain yang sebenarnya dimulai. Studi lapangan, survei, wawancara, dan metode penelitian pengguna lainnya harus dilakukan terlebih dahulu untuk menentukan karakteristik pengguna tipikal. Setelah penelitian pengguna selesai, persona dan skenario kemudian dapat diturunkan dari data itu (Harley, 2015).

Proses pembuatan persona dapat dimulai dengan mengidentifikasi karakteristik pengguna yang diamati dari kegiatan penelitian pengguna. Kelompokkan atribut ini ke dalam kelompok untuk mulai membentuk karakter yang jelas. Jika beberapa tampak terlalu mirip, gabungkan menjadi satu atau singkirkan kelompok apa pun yang tampaknya kurang penting bagi bisnis. Begitu