Perancangan Kembali Antarmuka Pengguna Aplikasi Romantik Online dengan Metode User Centered Design
Makalah Skripsi – Program Studi D-IV Komputasi Statistik Perancangan Kembali Antarmuka Pengguna Aplikasi Romantik Online dengan Metode User-Centered Design Shiddaq Quthbuddin Pajriannor ( 221710011 , 4SI1 ) Dosen Pembimbing : Lutﬁ Rahmatuti Maghﬁroh Ringkasan—Aplikasi Romantik Online adalah aplikasi berba- sis web untuk pengelolaan rekomendasi kegiatan statistik. Rekomendasi kegiatan statistik merupakan salah satu layanan utama dari Badan Pusat Statistik ( BPS ) kepada penyelenggara kegiatan statistik. Dalam proses pembuatan aplikasi ternyata hanya berfokus pada kegunaan fungsi aplikasi akan tetapi antarmukanya tidak diperhatikan. Oleh karena itu peneliti akan melakukan perancangan kembali antarmuka aplikasi romantik online dengan melibatkan pengguna. Berdasarkan hasil evalu- asi antarmuka lama dengan menggunakan kuesioner evaluasi heuristik dan QUIS dapat dikatakan bahwa aplikasi masih perlu dikembangkan antarmukanya serta antarmukanya termasuk kategori buruk. Proses perancangan antarmuka menggunakan metode user-centered design , dimana solusi desain akan di- lakukan secara bertahap yaitu iterasi pertama wireframe low ﬁdelity , kemudian iterasi kedua wireframe high ﬁdelity dan iterasi terakhir prototype. Hasil penelitian ini adalah rancangan desain antarmuka baru berupa prototype. Pada evaluasi antarmuka baru menunjukkan bahwa kepuasan pengguna telah meningkat serta masalah pada indikator-indikator usability pada antarmuka baru lebih baik dari antarmuka lama. Kata Kunci—Evaluasi Heuristik , User-Centered Design , Ro- mantik Online. I. LATAR BELAKANG Undang-Undang Republik Indonesia Nomor 16 Tahun 1997 tentang statistik [ 1 ] menekankan bahwa Badan Pusat Statistik ( BPS ) merupakan lembaga yang diberi tugas dan tanggung jawab terhadap penyelenggaraan statistik di Indonesia. Instansi pemerintah wajib memberitahukan , mengikuti rekomendasi BPS sebelum menyelenggarakan kegiatan statistik , dan meny- erahkan hasil penyelenggaraan kepada BPS. Kewajiban terse- but guna menghindari terjadinya duplikasi penyelenggaraan kegiatan statistik , mendorong diperolehnya hasil yang secara teknis dapat dipertanggung jawabkan , serta mengurangi ker- aguan konsumen data atas beberapa sajian jenis data yang sama tetapi angkanya berbeda [ 2 ] . Berdasarkan Peraturan Pemerintah Nomor 51 Tahun 1999 tentang penyelenggaraan statistik [ 3 ] , BPS memiliki kewenan- gan untuk memberikan rekomendasi penyelenggaraan kegiatan survei statistik sektoral. Perkembangan teknologi dan infor- masi yang semakin pesat mendorong BPS membangun ap- likasi rekomendasi kegiatan statistik ( romantik ) online berbasis web yang dapat di akses melalui https : / / romantik.bps.go.id dengan harapan proses pelaksanaan kegiatan rekomendasi statistik dapat dilaksanakan secara eﬁsien [ 2 ] . Aplikasi ro- mantik online adalah suatu aplikasi berbasis web untuk pen- gelolaan rekomendasi kegiatan statistik. Aplikasi romantik online bermanfaat baik dari sisi internal ( BPS ) dan juga eksternal ( penyelenggara kegiatan statistik ) . Manfaat dari sisi internal yaitu memudahkan dalam memberikan rekomen- dasi kegiatan statistik , memudahkan monitoring , dan seba- gai media dokumentasi kegiatan statistik sektoral. Ada pula manfaat dari sisi eksternal yaitu memudahkan Kemente- rian / Lembaga / Organisasi Perangkat Daerah ( K / L / PD ) mem- beritahukan rencana kegiatan statistiknya tanpa harus datang ke BPS , memudahkan pengajuan pertanyaan terkait dengan mekanisme rekomendasi kegiatan statistik , dan sebagai alat bantu untuk menghindari duplikasi kegiatan statistik [ 2 ] . Tetapi menurut wawancara dari Kasi Rekomendasi Kegiatan ternyata hanya Statistik , dalam proses pembuatan aplikasi berfokus pada kegunaan fungsi aplikasi akan tetapi antar- mukanya tidak diperhatikan. Pada penelitian ini dilakukan evaluasi awal untuk menda- patkan masalah pada antarmuka pengguna aplikasi romantik online. Alat evaluasi menggunakan kuesioner evaluasi heuris- tik [ 4 ] untuk usability dan Questionnarie for User Interface Satisfaction ( QUIS ) [ 5 ] untuk kepuasan pengguna. Tan , Liu dan Bishu [ 6 ] percaya evaluasi heuristik harus dilakukan pada tahap awal proses pengembangan desain antarmuka pengguna. Perbedaan evaluasi heuristik dibandingkan metode lain ter- letak pada kecepatan dalam menemukan masalah usability [ 7 ] . Sedangkan penggunaan QUIS untuk mengukur kepuasan pengguna yang mana merupakan ukuran penting dalam ke- berhasilan sistem [ 8 ] .Dari hasil evaluasi awal tersebut dapat disimpulkan bahwa nilai kepuasan pengguna kurang dari tujuh , menurut Subekti [ 9 ] nilai ini berarti aplikasi masih perlu dikembangkan antarmukanya dan nilai hasil evaluasi heuristik di antara dua puluh sembilan hingga empat puluh sembilan termasuk kategori buruk , menurut Turner [ 4 ] kategori buruk berarti pengguna mengalami kesulitan dalam menggunakan aplikasi romantik online. Berdasarkan hasil tersebut , berarti diperlukan pengemban- gan antarmuka supaya pengguna tidak mengalami kesulitan dalam menggunakan aplikasi romantik online. Salah satu caranya adalah dengan perancangan kembali antarmuka peng- guna aplikasi romantik online. Dalam proses perancangan antarmuka , salah satu metode yang dapat digunakan adalah metode User-Centered Design ( UCD ) [ 10 ] . UCD adalah 1 / 8 proses desain berulang di mana desainer fokus pada pengguna dan kebutuhannya pada setiap fase proses desain [ 11 ] . Abras Chadia , dkk [ 10 ] dalam penelitian mereka menyimpulkan bahwa keterlibatan pengguna dalam desain dengan satu atau lain cara telah terbukti tertuju kepada pengembangan desain yang lebih bermanfaat dan memuaskan. Pada penelitian Danny Murillo dan Jeremias Herrera [ 12 ] juga menyimpulkan bahwa metode UCD memiliki kegunaan dan peran dalam proyek web atau digital yang tidak hanya berada dalam sebuah cakupan analisis sistem dan programmer. Nallan dan Jaiswal [ 13 ] menjelaskan bahwa perbedaan metode UCD dengan metode lain adalah pada fokus prinsip mereka , fokus UCD pada meningkatkan usability dan pengalaman pengguna. Memang umumnya metode UCD dianggap telah meningkatkan kegu- naan dan usability produk , meskipun tingkat adopsi metode ini tidak cukup merata di berbagai organisasi [ 14 ] , tetapi metode ini dapat menjembatani kesenjangan antara pengembang den- gan pengguna [ 15 ] , dan juga metode ini dapat menunjukkan manfaat terhadap kegunaan sistem , kualitas informasi , dan kualitas antarmuka. [ 16 ] . Oleh karena itu dengan keterli- batan pengguna pada proses perancangan akan meningkatkan kepuasan pengguna dan mengurangi masalah pada indikator- indikator usability dengan menggunakan metode UCD. II. TUJUAN PENELITIAN Berdasarkan latar belakang tersebut , maka tujuan dari penelitian ini adalah melakukan perancangan kembali antar- muka pengguna aplikasi romantik online untuk meningkatkan kepuasan pengguna dan mengurangi masalah pada indikator- indikator usability dengan menggunakan metode UCD. III. PENELITIAN TERKAIT Pada penelitian Johnson , dkk. [ 16 ] membahas secara mendetail bagaimana penerapan metode UCD dan bagaimana penerapan metode ini pada proses merancang kembali antar- muka. Penelitian ini menyimpulkan bahwa dengan metode ini dapat menunjukkan manfaat terhadap kegunaan sistem , kuali- tas informasi , dan kualitas antarmuka. Sama halnya penelitian yang dilakukan oleh Abras Chadia , dkk [ 10 ] yang menyim- pulkan bahwa keterlibatan pengguna dalam desain dengan satu atau lain cara telah terbukti tertuju kepada pengembangan desain yang lebih bermanfaat dan memuaskan. Kaitannya dengan penelitian ini adalah penggunaan metode UCD. Pada penelitian terkait yang dilakukan oleh Danny Murillo dan Jeremias Herrera [ 12 ] yang melakukan penelitian tentang penggunaan wireframe dan mockup pada merancang kem- bali situs web universitas menggunakan metode UCD. Pada proses evaluasi dan desain , mereka menggunakan wireframes karena memungkinkan pengguna untuk membuat evaluasi , dan juga memungkinkan untuk menunjukkan kemajuan proyek kepada institusi. Pada penelitian ini pesan yang mereka coba sampaikan bahwa teknik dan konsep metode UCD memiliki kegunaan dan peran dalam proyek web atau digital yang tidak hanya berada dalam sebuah cakupan analisis sistem dan Makalah Skripsi – Program Studi D-IV Komputasi Statistik programmer. Kaitannya dengan penelitian ini adalah penggu- naan metode yang sama serta penggunaan wireframe untuk menampilkan hasil rancangan desain kepada pengguna. IV. METODE PENELITIAN Proses dan tahapan yang dilakukan dalam penelitian ini dimulai dari identiﬁkasi masalah , dilanjutkan dengan studi literatur , berdasarkan studi literatur yang ada peneliti kemudian melalukan analisis. Ada dua analisis yang digunakan yaitu analisis kebutuhan pengguna dan analisis sistem yang berjalan. Analisis kebutuhan pengguna diperlukan dalam mendesain ulang , tujuannya untuk mengetahui karakter pengguna dalam menggunakan aplikasi [ 16 ] . Pada analisis sistem berjalan peneliti melakukan evaluasi awal. Alat evaluasi menggunakan kuesioner evaluasi heuristik [ 4 ] , QUIS [ 5 ] , [ 8 ] dan observasi sistem [ 12 ] . Kuesioner evaluasi heuristik dan QUIS akan dibagikan kepada empat orang responden , respondennya adalah pengguna dari aplikasi romantik online dari sisi pegawai BPS yang menggunakan aplikasi romantik online. Nielsen dan Molich [ 17 ] merekomen- dasikan jumlah responden berada di antara tiga hingga lima responden. Dari analisis-analisis yang telah dilakukan akan digunakan pada tahap perancangan. Proses perancangan desain antarmuka menggunakan metode UCD. Proses iterasi UCD terdapat em- pat fase dapat dilihat pada gambar 1 [ 11 ] , [ 18 ] yaitu : 1 ) Understand context of use Pada fase ini peneliti akan mengidentiﬁkasi dan mema- hami konteks di mana pengguna dapat menggunakan sistem dan untuk apa mereka menggunakan. 2 ) Specify user requirements Setelah memahami konteks di mana pengguna dapat menggunakan sistem dan untuk apa mereka meng- gunakan. Kemudian menentukan persyaratan / kebutuhan bisnis atau tujuan pengguna yang harus dipenuhi. 3 ) Design solutions Pada fase ini akan merancang / mengembangkan solusi desain yang dilakukan secara bertahap. 4 ) Evaluate against requirements Pada fase ini akan mengevaluasi apakah solusi desain su- dah sesuai terhadap konteks dan persyaratan / kebutuhan pengguna. Gambar 1. Metode UCD [ 11 ] Dalam proses perancangan akan dilakukan sebanyak tiga kali iterasi UCD yaitu iterasi yang pertama solusi desain berbentuk wireframe low ﬁdelity , kemudian pada iterasi berikutnya solusi desain berbentuk wireframe high ﬁdelity , dan 2 / 8 Makalah Skripsi – Program Studi D-IV Komputasi Statistik pada iterasi terakhir solusi desain berbentuk prototype [ 10 ] , [ 12 ] , [ 16 ] . Pada evaluasi iterasi pertama dan kedua berbeda dengan evaluasi awal , yaitu menggunakan tanggapan dan umpan balik dari pengguna dengan menggunakan kuesioner ”suka / tidak suka” beserta alasannya yang akan dibagikan kepada empat orang responden yang berbeda di setiap iterasinya. Sedangkan pada iterasi terakhir , evaluasi yang digunakan sama dengan evaluasi awal pada analisis sistem berjalan serta dibagikan kepada responden yang sama. Setelah semua iterasi dilakukan dan akan dilakukan perbandingan antara antarmuka lama dengan antarmuka baru. Proses dan tahapan disajikan dalam bentuk Gambar 2. Gambar 2. Alur Penelitian Gambar 3. Kerangka Pikir Penelitian V. KERANGKA PIKIR Penelitian dimulai dari identiﬁkasi masalah yaitu proses pembuatan aplikasi ternyata hanya berfokus pada kegunaan fungsi aplikasi akan tetapi antarmukanya tidak diperhatikan. Setelah dilakukan evaluasi awal ditemukan bahwa pengguna kesulitan menggunakan aplikasi dan kepuasan pengguna ku- rang. Oleh karena itu peneliti melakukan perancangan kem- bali antarmuka pengguna dengan melibatkan pengguna secara langsung untuk meningkatkan kepuasan pengguna dan men- gurangi masalah pada indikator-indikator usability. Untuk melakukan hal itu , penelitian ini menggunakan metode UCD yang mana metode ini menjembatani kesen- jangan antara pengembang dengan pengguna [ 15 ] . Menurut Chadia Abras , dkk. keuntungan utama dari metode ini adalah pemahaman yang lebih dari pengguna serta pengguna akan merasa bahwa ide dan saran mereka diperhitungankan selama proses perancangan desain. Sedangkan kerugiannya adalah memerlukan banyak waktu yang lebih dan biaya yang lebih [ 10 ] . Kemudian pada proses perancangan desain menerapkan tiga tujuan yaitu : ( 1 ) menyediakan fungsi yang tepat ; ( 2 ) menawarkan kegunaan dan keandalan yang lebih ; serta ( 3 ) melibatkan pengguna dengan ﬁtur-ﬁtur yang menyenangkan [ 19 ] . Dalam proses perancangan akan dilakukan sebanyak tiga kali iterasi UCD yaitu iterasi yang pertama solusi desain berbentuk wireframe low ﬁdelity , kemudian pada iterasi berikutnya solusi desain berbentuk wireframe high ﬁdelity , dan pada iterasi terakhir solusi desain berbentuk prototype [ 10 ] , [ 12 ] , [ 16 ] . Evaluasi awal akan menjadi dasar pada iterasi pertama , dilanjutkan membuat rancangan desain. Pada iterasi pertama dan kedua rancangan desain menggunakan alat desain Figma [ 20 ] , sedangkan pada iterasi terakhir akan berupa prototype yang sudah menjadi kode-kode program agar dapat langsung digunakan. Hasil penelitian berupa rancangan desain antarmuka baru di mana perbandingan antarmuka lama dan baru menun- jukkan bahwa kepuasan pengguna terhadap antarmuka baru meningkat serta masalah pada indikator-indikator usabil- ity pada antarmuka baru lebih baik dari antarmuka lama. Kerangka pikir penelitian disajikan dalam bentuk Gambar 3. VI. HASIL DAN PEMBAHASAN A. Analisis Kebutuhan Pengguna Berdasarkan dari jawaban responden didapatkan bahwa pengguna menggunakan aplikasi romantik online dengan Per- sonal Computer ( PC ) / Komputer. Sistem operasi yang digu- nakan pada PC / Komputer pengguna adalah windows , dan rata- rata lama penggunaan PC / Komputer dalam satu hari adalah 9 jam. Beberapa alasan pengguna menyukai menggunakan ap- likasi romantik online ini yaitu memangkas birokrasi , memu- dahkan dalam pengisian kuesioner , serta memudahkan dalam melakukan peninjauan terhadap survei ( setiap prosesnya dapat terpantau ) . Ada pula beberapa alasan mengapa pengguna tidak 3 / 8 Makalah Skripsi – Program Studi D-IV Komputasi Statistik ( karakter ) pada layar , dan indikator sistem cenderung tidak dapat diandalkan - dapat diandalkan. 3 ) Analisis Tugas Pada analisis ini dilakukan observasi dan studi literatur. Untuk mempermudah dalam observasi peneliti membuat Diagram hierarki analisis tugas ( HTA ) . Pada Gambar 4 menunjukkan bahwa ada langkah-langkah yang redun- dant dalam mencapai tujuannya. menyukai yaitu menu pada aplikasi kurang dapat dimengerti , tidak ada pengertian dari tiap-tiap pertanyaan yang ada di formulir pengisian pengajuan kegiatan statistik , tampilan awal kurang menarik , serta pengguna menganggap aplikasi ini masih agak rumit untuk digunakan oleh pengguna baru. Hasil analisis lingkungan pengguna menunjukkan bahwa pengguna menggunakan aplikasi romantik online di tempat dengan pencahayaan yang terang dengan skala empat dari lima dan dengan kebisingan tenang dengan skala dua dari lima , serta tersedia listrik , jaringan internet , komputer dan sumber daya lain yang diperlukan untuk menggunakan aplikasi romantik online. B. Analisis Sistem Berjalan 1 ) Evaluasi Heuristik Pada evaluasi ini ada sepuluh prinsip usability yang di- jabarkan menjadi empat puluh lima indikator. Hasil eval- uasi menunjukkan bahwa dari empat puluh lima indika- tor ditemukan dua puluh sembilan indikator berkategori buruk , empat belas indikator berkategori sangat buruk , dan dua indikator berkategori biasa. Selain itu nilai hasil evaluasi juga berada di antara dua puluh sembilan hingga empat puluh sembilan yang artinya termasuk kategori buruk , dan dapat diartikan bahwa pengguna mengalami kesulitan dalam menggunakan aplikasi. Hasil evaluasi disajikan dalam bentuk Tabel I. TABEL I HASIL EVALUASI HEURISTIK AWAL No. 1 Prinsip Usability Fitur dan Fungsi Kategori Buruk Beranda atau Halaman Awal Buruk 2 3 4 5 6 7 8 9 Navigasi Pencarian Kontrol dan Umpan Balik Formulir Kesalahan Konten dan Teks Bantuan 10 Performa Sangat Buruk Buruk Buruk Buruk Buruk Buruk Buruk Buruk Berdasarkan Tabel I , sepuluh prinsip usability diatas hanya navigasi yang berkategori sangat buruk dan lain- nya berkategori buruk. 2 ) Questionnarie for User Interface Satisfaction ( QUIS ) Gambar 4. Diagram hierarki analisis tugas ( HTA ) C. Iterasi I - Wireframe Low Fidelity Dari evaluasi ini dapat disimpulkan bahwa nilai kepuasan pengguna kurang dari tujuh , menurut Subekti [ 9 ] nilai ini berarti aplikasi masih perlu dikembangkan antarmukanya dan terdapat tiga indikator yang men- dapatkan nilai lebih dari tujuh yaitu indikator Sistem cenderung tidak memadai - memadai , indikator tulisan Tahap pertama dari iterasi ini adalah Understand context of use. Pada tahap ini berdasarkan analisis kebutuhan pengguna dapat disimpulkan bahwa pengguna menggunakan aplikasi pada PC / Komputer dan salah satu tujuan pengguna menggu- nakan aplikasi adalah memudahkan dalam pengisian kuesioner pada pengajuan rekomendasi survei. Tahap selanjutnya adalah 4 / 8 Makalah Skripsi – Program Studi D-IV Komputasi Statistik Specify user requirements. Setelah memahami konteks dan tujuan pengguna , peneliti menentukan kebutuhan pengguna yaitu formulir yang menyenangkan dan mudah , navigasi menu yang sederhana , dan terdapat bantuan pada pengisian formulir. Kemudian pada tahap Design solutions akan dibuat wire- frame low ﬁdelity. Pertama melakukan brainstorming solusi desain dengan membuat sketsa di kertas. Sketsa yang telah terbentuk akan diubah menjadi wireframe low ﬁdelity di Figma. Menurut Gemayel [ 21 ] langkah terbaik untuk membuat wireframe yaitu menggunakan elemen yang sederhana , warna harus abu-abu , menampilkan graﬁk dan gambar dengan bentuk kotak , dan memperhatikan ukuran layar. Selanjutnya di Figma akan dibuat sebuah frame dengan menekan ikon frame atau menekan tombol ”F” pada keyboard , lalu akan muncul pilihan ukuran layar. Setelah memilih ukuran layar akan dibuat elemen yang sesuai dengan sketsa yang ada. Ketika sketsa tidak mencakup kebutuhan pengguna , maka akan dilakukan brain- storming dengan Mood Board untuk memberikan gambaran ide atau pemikiran secara visual [ 22 ] . Peneliti mengumpulkan beberapa visual layout , gambar , tulisan , dan elemen yang dapat memenuhi kebutuhan pengguna. Salah satu rancangan desain dapat dilihat pada Gambar 5. Tahap terakhir adalah Evaluate against requirements. Dari rancangan desain wireframe low ﬁdelity yang selesai akan dilakukan evaluasi untuk mendapatkan umpan balik mengenai layout , serta komponen-komponen lainnya. Dari Tabel II dapat dikatakan bahwa jumlah pengguna yang suka lebih banyak dari pada jumlah yang tidak suka. Adapun alasan-alasan dari umpan balik ini akan dijadikan bahan evaluasi dan digunakan pada tahap iterasi selanjutnya. TABEL II UMPAN BALIK ITERASI I No. 1 Tampilan Halaman Depan Suka 4 Tidak Suka 0 2 3 4 5 6 7 8 9 10 11 12 13 Daftar Halaman Rekomendasi Rincian Konten Kegiatan Statistik Halaman Saya Halaman Rekomendasi Statistik Halaman FAQs Pengajuan Kegiatan Rekomendasi Halaman Panduan Halaman Bantuan Dukungan Halaman Pertanyaan Saya dan Halaman Tentang Kami Halaman Hubungi Kami Halaman Proﬁl Saya Halaman Pesan Notiﬁkasi 2 3 4 4 3 4 4 3 4 4 4 4 2 1 0 0 1 0 0 1 0 0 0 0 Gambar 5. Contoh Rancangan Wireframe Low Fidelity D. Iterasi II - Wireframe High Fidelity Pada tahap ini proses iterasi UCD dimulai dari tahap Design solutions. Solusi desain akan mengalami perubahan yang awalnya berupa wireframe low ﬁdelity menjadi wireframe high ﬁdelity. Perubahan yang berbeda yaitu adanya visual yang lebih jelas seperti warna , gambar , tipograﬁ , dan lainnya. Misalnya pada perancangan desain halaman depan , pertama melihat dan membaca hasil umpan balik Iterasi I , dapat dilihat pada tabel II. Dari tabel II dapat diketahui jumlah pengguna yang suka dan tidak suka beserta alasannya. Sete- lah mengetahui hal tersebut , dilanjutkan membuat rancangan desain wireframe high ﬁdelity. Kedua menyalin rancangan desain tampilan halaman depan dari wireframe low ﬁdelity. Kemudian mengganti warna utama menjadi warna biru tua , menurut Cheery [ 23 ] warna ini dapat membawa perasaan tenang , memberikan kesan dapat diandalkan , dan sering ada pada dekorasi kantor. Kemudian menambahkan gambar atau 5 / 8 ilustrasi untuk memberikan gambaran-gambaran dari kalimat atau kata di samping gambar. Gambar atau ilustrasi diperoleh dari pihak ketiga yaitu DrawKit [ 24 ] , sedangkan untuk ikon diperoleh dari pihak ketiga yaitu Font Awesome [ 25 ] . Pada ti- pograﬁ menyesuaikan warna pada latar belakang seperti ketika warna latar belakang biru maka warna tulisan menjadi putih , dan ketika warna latar belakang putih maka warna tulisan menjadi abu-abu tua , juga menyesuaikan ketebalan tulisan , mengatur jarak antar karakter yang ada pada tulisan. Ter- akhir menambahkan beberapa bentuk lingkaran yang masing- masing memiliki warna biru , hijau , dan jingga yang ukurannya berbeda-beda. Salah satu rancangan desain dapat dilihat pada Gambar 6. Makalah Skripsi – Program Studi D-IV Komputasi Statistik TABEL III UMPAN BALIK ITERASI II No. 1 Tampilan Halaman Depan Suka 3 Tidak Suka 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 Daftar Halaman Rekomendasi Rincian Konten Kegiatan Statistik Halaman Saya Halaman Rekomendasi Statistik Halaman FAQs Pengajuan Kegiatan Rekomendasi Halaman Panduan Halaman Bantuan Dukungan Halaman Pertanyaan Saya dan Halaman Tentang Kami Halaman Hubungi Kami Halaman Proﬁl Saya Halaman Pesan Notiﬁkasi Rincian Catatan Perbaikan Halaman Lihat Isian Form 4 3 4 4 4 3 4 4 2 3 4 4 4 3 0 1 0 0 0 1 0 0 2 1 0 0 0 1 E. Iterasi III - Prototype Pada tahap ini proses iterasi UCD dimulai dari tahap Design solutions. Solusi desain akan mengalami perubahan yang awal- nya berupa wireframe high ﬁdelity menjadi prototype berupa halaman web. Peneliti memanfaatkan salah satu ﬁtur dari Figma untuk mempermudah proses pengembangan prototype yaitu Tab In- spect. Tab Inspect memungkinkan untuk dapat melihat dan menyalin kode dan nilai yang ada dari sebuah desain. Setelah kode disalin , kemudian dilanjutkan pada berkas html dengan membuat tag element dengan atribut class yang diberi nilai unik untuk menandakan gaya atau style desainnya. Sementara itu pada berkas css akan ditambahkan nilai unik tersebut dan masukan nilai dan kode yang telah disalin dari Tab Inspect. Jika ada komponen memerlukan interaksi , maka akan ditam- bahkan berkas JavaScript untuk memberikan interaksinya. Setelah semua rancangan desain berubah menjadi halaman- halaman web. Untuk merapikan atau menyusun semua berkas , peneliti menggunakan package Webpack. Menurut Dulanga [ 26 ] Webpack memberikan kemudahan untuk menyusun kode dan mengompilasinya ke dalam output yang dioptimalkan. Se- lain itu Webpack bukan hanya dapat memudahkan membundel berkas-berkas modul , gambar , styles , assests , dan scripts tetapi juga dasar dari pengembangan web modern. Tahap terakhir adalah Evaluate against requirements. Dari rancangan desain wireframe low ﬁdelity yang selesai akan di- lakukan evaluasi akhir. Yang pertama adalah evaluasi heuristik. Berdasarkan Tabel IV , sepuluh prinsip usability di atas , hanya 6 / 8 Gambar 6. Contoh Rancangan Wireframe High Fidelity Tahap selanjutnya adalah Evaluate against requirements. Dari rancangan desain wireframe high ﬁdelity yang selesai akan dilakukan evaluasi. Dari Tabel III dapat dikatakan bahwa jumlah pengguna yang suka lebih banyak dari pada jumlah yang tidak suka. Adapun alasan-alasan dari umpan balik ini akan dijadikan bahan evaluasi dan digunakan pada tahap iterasi selanjutnya. formulir yang berkategori buruk sedangkan lainnya berkategori biasa dan baik. Pada evaluasi heuristik akhir ini , nilai hasil evaluasi berada di antara empat puluh sembilan hingga enam puluh sembilan yang artinya termasuk kategori biasa , dan dapat diartikan bahwa pengguna dapat menggunakan aplikasi dan dapat menyelesaikan tugas yang paling penting , namun pengalaman pengguna masih bisa ditingkatkan. Selain itu hasil evaluasi menunjukkan bahwa dari empat puluh lima indikator ditemukan dua indikator berkategori sangat buruk , sembilan belas indikator berkategori buruk , tiga belas indikator berkategori biasa , sembilan indikator berkategori baik , dan dua indikator berkategori sangat baik. TABEL IV HASIL EVALUASI HEURISTIK AKHIR No. 1 Prinsip Usability Fitur dan Fungsi Kategori Baik Makalah Skripsi – Program Studi D-IV Komputasi Statistik Gambar 7. Graﬁk Perbandingan Hasil Evaluasi QUIS Antarmuka Lama dan Baru Beranda atau Halaman Awal Biasa 2 3 4 5 6 7 8 9 Navigasi Pencarian Kontrol dan Umpan Balik Formulir Kesalahan Konten dan Teks Bantuan 10 Performa Biasa Baik Biasa Buruk Biasa Biasa Biasa Biasa Terakhir dilakukan evaluasi QUIS. Dari evaluasi ini dapat disimpulkan bahwa nilai kepuasan pengguna lebih dari tujuh dan tidak ada indikator yang memiliki nilai kurang dari tujuh. F. Perbandingan Antarmuka Lama dan Baru Perbandingan dilakukan dengan membandingkan hasil eval- uasi awal dengan evaluasi akhir. Perbandingan hasil evaluasi QUIS antarmuka lama dan baru dapat dilihat pada Gambar 7 yang menunjukkan bahwa kepuasan pengguna meningkat terhadap antarmuka baru dibanding antarmuka lama. Perbandingan hasil evaluasi heuristik antarmuka lama dan baru dapat dilihat pada Gambar 8 yang menunjukkan bahwa indikator-indikator usability pada antarmuka baru keseluruhan- nya mengalami peningkatan dapat diartikan bahwa masalah pada indikator-indikator usability pada antarmuka baru lebih baik dari antarmuka lama. Perbandingan-perbandingan tersebut menunjukkan bahwa kepuasan pengguna telah meningkat serta masalah pada indikator-indikator usability pada antarmuka baru lebih baik dari antarmuka lama. VII. PENUTUP Pada hasil evaluasi awal ditemukan bahwa dapat disim- pulkan pengguna kesulitan dalam menggunakan aplikasi dan antarmukanya masih perlu dikembangkan. Sehingga dilakukan Gambar 8. Graﬁk Perbandingan Hasil Evaluasi Heuristik Antarmuka Lama dan Baru perancangan kembali antarmuka dengan metode UCD. Dalam proses perancangan akan dilakukan sebanyak tiga kali iterasi UCD yaitu iterasi yang pertama solusi desain berbentuk wire- frame low ﬁdelity , kemudian pada iterasi berikutnya solusi desain berbentuk wireframe high ﬁdelity , dan pada iterasi terakhir solusi desain berbentuk prototype. Pada hasil akhir dapat dilihat bahwa rancangan antarmuka dapat meningkatkan kepuasan pengguna dan mengurangi masalah pada indikator- indikator usability dengan menggunakan metode UCD. DAFTAR PUSTAKA [ 1 ] Pemerintah Indonesia , Undang-Undang Republik Indonesia Nomor 16 Tahun 1997 Tentang Statistik. Jakarta : Sekretariat Negara , 1997. [ 2 ] Badan Pusat Statistik , Petunjuk Teknis Aplikasi Rekomendasi Kegiatan Statistik ( Romantik ) Online. Jakarta : Badan Pusat Statistik , 2019. [ 3 ] Pemerintah Indonesia , Peraturan Pemerintah Nomor 51 Tahun 1999 Tentang Penyelenggara Statistik. Jakarta : Sekretariat Negara , 1999. [ 4 ] N. Turner. ( 2011 , 2 ) A guide to carrying out usability reviews. [ Online ] . Available : http : / / www.uxforthemasses.com / usability-reviews / [ 5 ] Superadmin. ( 2012 , 10 ) Questionnaire for user interface satisfaction ( quis ) . [ Online ] . Available : https : / / ext.eurocontrol.int / ehp / ? q=node / 1611 [ 6 ] W.-S. Tan , D. Liu , and R. Bishu , “Web evaluation : Heuristic evaluation vs. user testing , ” International Journal of Industrial Ergonomics , vol. 39 , no. 4 , pp. 621–627 , July 2009. [ 7 ] M. Allen , L. M. Currie , S. Bakken , V. L. Patel , and J. J. Cimino , “Heuristic evaluation of paper-based web pages : A simpliﬁed inspection 7 / 8 Makalah Skripsi – Program Studi D-IV Komputasi Statistik usability methodology , ” Journal of Biomedical Informatics , vol. 39 , no. 4 , pp. 412–423 , August 2006. [ 8 ] J. P. Chin , V. A. Diehl , and K. L. Norman , “Development of an instru- ment measuring user satisfaction of the human-computer interface , ” in Proceedings of the SIGCHI Conference on Human Factors in Computing Systems , ser. CHI ’88. Washington , D.C. , USA : Association for Computing Machinery , May 1988 , pp. 213–218. [ 9 ] G. W. Subekti , Thrust : Sistem Informasi Manajemen Proyek Berbasis Jakarta : Android Pada Badan Pusat Statistik Republik Indonesia. Politeknek Statistika STIS , 2019. [ 10 ] C. Abras , D. Maloney-krichmar , and J. Preece , “User-centered design , ” in In Bainbridge , W. Encyclopedia of Human-Computer Interaction. Thousand Oaks : Sage Publications. Publications , 2004. [ 11 ] Interaction Design Foundation. User centered design. [ Online ] . Avail- able : https : / / www.interaction-design.org / literature / topics / user-centered- design [ 12 ] D. Murillo and J. Herrera , “Use of wireframes and mockup on the redesign of a university website using the methodology user centered design , ” in Memorias del VII Congreso Iberoamericano de Telematica , ser. CITA2015. Spain : Memorias del VII Congreso Iberoamericano de Telematica , Jan 2015 , pp. 239–242. [ 13 ] H. Nallan and M. Jaiswal. ( 2019 , 6 ) Ucd vs. design thinking. [ Online ] . Available : https : / / think.design / blog / ucd-vs-design-thinking / [ 14 ] J.-Y. Mao , K. Vredenburg , P. W. Smith , and T. Carey , “The state of user- centered design practice , ” Commun. ACM , vol. 48 , no. 3 , pp. 105–109 , March 2005. [ 15 ] C. Liang , W. Chou , Y. Hsu , and C.-C. Yang , “A user-centered design approach to develop a web-based instructional resource system for homeland education , ” Knowledge Management and E-Learning : An International Journal , vol. 1 , pp. 67–80 , 2009. [ 16 ] C. M. Johnson , T. R. Johnson , and J. Zhang , “A user-centered framework for redesigning health care interfaces , ” Journal of Biomedical Informat- ics , vol. 38 , no. 1 , pp. 75–87 , February 2005. [ 17 ] J. Nielsen and R. Molich , “Heuristic evaluation of user interfaces , ” in Proceedings of the SIGCHI Conference on Human Factors in Computing Systems , ser. CHI ’90. New York , NY , USA : Association for Computing Machinery , March 1990 , pp. 249–256. design [ 18 ] Usability.gov. User-centered [ Online ] . Available : basics. https : / / www.usability.gov / what-and-why / user-centered-design.html [ 19 ] B. Shneiderman , “Designing for fun : How can we design user interfaces to be more fun ? ” Interactions , vol. 11 , no. 5 , pp. 45–50 , September 2004. the ﬁght between ﬁgma and adobe xd ? [ Online ] . Available : https : / / uxdesign.cc / ﬁgma-vs-adobe-xd- d3a624cb7885 [ 21 ] T. Gemayel. ( 2019 , 8 ) How to wireframe. ( 2018 , 12 ) Who wins [ Online ] . Available : [ 20 ] A. Park. https : / / www.ﬁgma.com / blog / how-to-wireframe / [ 22 ] R. S. Berry. ( 2020 , 9 ) 11 inspiring mood board examples for your next design project. [ Online ] . Available : https : / / maze.co / blog / mood-board- examples / [ 23 ] K. Cherry. ( 2020 , 2 ) The color psychology of blue. [ Online ] . Available : https : / / www.verywellmind.com / the-color-psychology-of-blue-2795815 [ 24 ] V. Verma. ( 2019 , 8 ) 5 free design resources — illustrations. [ Online ] . Available : https : / / blog.prototypr.io / 5-free-design-resources-illustrations- 5bf4959cc6e4 [ 26 ] C. Dulanga. [ 25 ] V. Garcia. ( 2015 , 11 ) The beginners guide to font awesome. [ Online ] . Available : https : / / www.ostraining.com / blog / general / font-awesome / need ( 2021 , be webpack experts. frontend-developers-need-to-be-webpack-experts-32e734b6f04a to [ Online ] . Available : https : / / blog.bitsrc.io / why- developers 3 ) Why frontend 8 / 8
O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O B-TUJUAN I-TUJUAN I-TUJUAN I-TUJUAN I-TUJUAN I-TUJUAN I-TUJUAN I-TUJUAN I-TUJUAN I-TUJUAN O O O O O O O O B-METODE I-METODE I-METODE O B-METODE O O O O O O O O O O O O O O O O O B-METODE I-METODE I-METODE O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O B-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O B-METODE I-METODE O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O B-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O O
Makalah Skripsi – Program Studi D-IV Komputasi Statistik Perancangan Kembali Antarmuka Pengguna Aplikasi Romantik Online dengan Metode User-Centered Design Shiddaq Quthbuddin Pajriannor ( 221710011 , 4SI1 ) Dosen Pembimbing : Lutﬁ Rahmatuti Maghﬁroh Ringkasan—Aplikasi Romantik Online adalah aplikasi berba- sis web untuk pengelolaan rekomendasi kegiatan statistik. Rekomendasi kegiatan statistik merupakan salah satu layanan utama dari Badan Pusat Statistik ( BPS ) kepada penyelenggara kegiatan statistik. Dalam proses pembuatan aplikasi ternyata hanya berfokus pada kegunaan fungsi aplikasi akan tetapi antarmukanya tidak diperhatikan. Oleh karena itu peneliti akan melakukan perancangan kembali antarmuka aplikasi romantik online dengan melibatkan pengguna. Berdasarkan hasil evalu- asi antarmuka lama dengan menggunakan kuesioner evaluasi heuristik dan QUIS dapat dikatakan bahwa aplikasi masih perlu dikembangkan antarmukanya serta antarmukanya termasuk kategori buruk. Proses perancangan antarmuka menggunakan metode user-centered design , dimana solusi desain akan di- lakukan secara bertahap yaitu iterasi pertama wireframe low ﬁdelity , kemudian iterasi kedua wireframe high ﬁdelity dan iterasi terakhir prototype. Hasil penelitian ini adalah rancangan desain antarmuka baru berupa prototype. Pada evaluasi antarmuka baru menunjukkan bahwa kepuasan pengguna telah meningkat serta masalah pada indikator-indikator usability pada antarmuka baru lebih baik dari antarmuka lama. Kata Kunci—Evaluasi Heuristik , User-Centered Design , Ro- mantik Online.
VII. PENUTUP Pada hasil evaluasi awal ditemukan bahwa dapat disim- pulkan pengguna kesulitan dalam menggunakan aplikasi dan antarmukanya masih perlu dikembangkan. Sehingga dilakukan Gambar 8. Graﬁk Perbandingan Hasil Evaluasi Heuristik Antarmuka Lama dan Baru perancangan kembali antarmuka dengan metode UCD. Dalam proses perancangan akan dilakukan sebanyak tiga kali iterasi UCD yaitu iterasi yang pertama solusi desain berbentuk wire- frame low ﬁdelity , kemudian pada iterasi berikutnya solusi desain berbentuk wireframe high ﬁdelity , dan pada iterasi terakhir solusi desain berbentuk prototype. Pada hasil akhir dapat dilihat bahwa rancangan antarmuka dapat meningkatkan kepuasan pengguna dan mengurangi masalah pada indikator- indikator usability dengan menggunakan metode UCD.
tidak diperhatikan. Oleh karena itu peneliti akan melakukan perancangan kembali antarmuka aplikasi romantik online dengan melibatkan pengguna. Berdasarkan hasil evalu- asi antarmuka lama dengan menggunakan kuesioner evaluasi heuristik dan QUIS dapat dikatakan bahwa aplikasi masih perlu dikembangkan termasuk kategori buruk. Proses perancangan antarmuka menggunakan metode user-centered design , dimana solusi desain akan di- lakukan adalah rancangan desain antarmuka baru berupa prototype. Pada evaluasi antarmuka baru menunjukkan bahwa kepuasan pengguna telah meningkat serta masalah pada indikator-indikator usability pada antarmuka baru lebih baik dari antarmuka lama. Kata Kunci—Evaluasi Heuristik , User-Centered Design , Lama dan Baru perancangan kembali antarmuka dengan metode UCD. Dalam proses perancangan akan dilakukan sebanyak tiga pada iterasi terakhir solusi desain berbentuk prototype. Pada hasil akhir dapat dilihat bahwa rancangan antarmuka dapat meningkatkan kepuasan pengguna dan mengurangi masalah pada indikator- indikator usability dengan menggunakan metode UCD.
O O O O O O O B-TUJUAN I-TUJUAN I-TUJUAN I-TUJUAN I-TUJUAN I-TUJUAN I-TUJUAN I-TUJUAN I-TUJUAN I-TUJUAN O O O O O O O O B-METODE I-METODE I-METODE O B-METODE O O O O O O O O O O O O O O B-METODE I-METODE I-METODE O O O O O O O O O O O O O O B-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN O O O O O O O O O O O O O O B-METODE I-METODE O O O O O O O O O O O O O O B-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN I-TEMUAN