Fakultas Ilmu Komputer
Universitas Brawijaya
977
Analisis dan Perbaikan Situs Web Sekolah Menggunakan Pendekatan
Goal-Directed Design
(Studi Kasus: SMA Negeri 1 Pasuruan)
Yhanuar Alkhamislam1, Retno Indah Rokhmawati2, Hanifah Muslimah Az-Zahra3
Program Studi Sistem Informasi, Fakultas Ilmu Komputer, Universitas Brawijaya Email: 1[email protected], 2[email protected], 3[email protected]
Abstrak
SMA Negeri 1 Pasuruan adalah salah satu instansi sekolah menengah atas yang memanfaatkan situs web sebagai salah satu pusat informasi untuk masyarakat. Namun dalam penggunaannya, masih ditemukan beberapa permasalahan seperti minimnya pembaruan konten berita, konten video yang sebagian tampilannya terpotong, terdapat halaman konseling namun tidak memiliki isi konten sehingga mengurangi tingkat kenyamanan pengalaman pengguna. Goal-Directed Design (GDD) digunakan sebagai langkah tepat untuk menyelesaikan permasalahan tersebut karena berfokus pada tujuan pengguna yang dikolaborasikan dengan tujuan organisasi. Terdapat 6 fase GDD yaitu Research yakni melakukan pengujian awal menggunakan User Experience Questionnaire (UEQ) dan wawancara kepada pengguna. Kemudian pada fase Modelling dilakukan proses penentuan identifikasi kelompok pengguna, tujuan organisasi, dan membuat persona. Pada fase Requirements Definition dilakukan pengelompokan masalah, konfirmasi ulang rekomendasi perbaikan kepada pihak sekolah selaku
stakeholder, dan perancangan desain struktur informasi halaman web menggunakan card sorting.
Kemudian fase Wireframe dan Refinement dilakukan pembuatan rancangan dan desain prototype untuk bahan perbandingan dengan desain awal. Dan pada fase terakhir, Design Support dilakukan pengujian UEQ terhadap desain solusi dan dibandingkan dengan hasil pengujian UEQ pada tahap Research.. Hasil pengujian desain awal pada tahap Research didapatkan sebaran rata-rata -0,39 hingga 0,99 (dibawah rata-rata). Hasil pengujian desain solusi memiliki sebaran rata-rata antara 1,58-2,01 yang dikonversikan dalam data benchmark berada pada level diatas rata-rata sehingga dapat dikatakan bahwa desain solusi dapat menjadi rekomendasi perbaikan situs web SMA Negeri 1 Pasuruan.
Kata kunci: Goal-Directed Design, User Experience Questionnaire, Card Sorting, Wireframe, Prototype Abstract
SMA Negeri 1 Pasuruan is one of the senior high school that uses the website as one of the information centers for the people. But in its use, there are still some problems found, such as the lack of updates on news content, video content that has partially cut off screen, a counseling page but does not have content so it can reduces the level of comfort of the user experience. Goal-Directed Design (GDD) is used as an appropriate step to solve these problems because it focuses on user goals that are collaborated with organizational goals. There are 6 phases of GDD namely; Research, namely conducting initial testing using the User Experience Questionnaire (UEQ) and interviews with users. Then in the Modeling phase, the process of determining the identification of user groups, organizational goals, and making persona. In the Requirements Definition phase, problem grouping, reconfirmation of recommendations for improvement to stakeholders, and designing web page information structure design using card sorting. Then the Wireframe and Refinement phase is carried out making designs and prototype designs for material comparison with the initial design. And in the last phase, Design Support is carried out UEQ testing of the solution design and compared with the results of the UEQ testing at the Research phase. The initial design test results at the Research phase obtained an average distribution of -0.39 to 0.99 (below average) . The results of testing the design of solutions have an average distribution between 1.58-2.01 converted in the benchmark data at a level above the average so that it can be said that the solution design can be a recommendation to improve the website of SMA Negeri 1 Pasuruan.
1. PENDAHULUAN
Dalam memberikan pelayanan informasinya kepada masyarakat, SMA Negeri 1 Pasuruan memanfaatkan situs web yang memberikan informasi mengenai prestasi, informasi Penerimaan Peserta Didik Baru (PPDB), serta informasi-informasi lainnya yang ditujukan kepada warga sekolah maupun masyarakat.
Dalam kasus penelitian ini, pada bulan Agustus 2019 telah dilakukan observasi awal oleh peneliti terhadap situs web SMA Negeri 1 Pasuruan. Peneliti menemukan beberapa hal yang perlu dikembangkan agar mampu memenuhi kebutuhan pengguna antara lain tersedianya fitur konseling namun hanya berisikan halaman tanpa adanya konten, header situs web yang memiliki resolusi rendah & tidak sesuai dengan ukuran container pada header, video profil sekolah yang tidak sesuai dengan ukuran container atau terpotong sehingga konten yang disajikan tidak informatif dan mengurangi kenyamanan pengguna. Aspek user interface perlu diperhatikan karena mampu meningkatkan ketertarikan siswa ataupun pengguna lainnya terhadap situs web (9241-210, 2010). Desain antarmuka yang buruk akan cenderung membuat pengguna akan meninggalkan situs web tersebut (Kalan, 2017).
Berkaitan dengan perbaikan antarmuka dan pengalaman pengguna situs web SMA Negeri 1 Pasuruan, di dalam HCI terdapat metode kerangka kerja yang berfokus kepada tujuan yaitu Goal-Directed Design sebagai metode perancangan user interface yang dikembangkan oleh Alan Cooper. Goal-Directed Design memiliki karakteristik fokus terhadap tujuan yang ingin dicapai oleh pengguna.
Goal-Directed Design dipilih karena pada tahapannya
terdapat proses kolaborasi dengan stakeholder sehingga mampu menyelaraskan antara tujuan pengguna dan tujuan perusahaan/instansi.
Goal-Directed Design memiliki 6 fase atau tahapan
antara lain Research, Modeling, Requirements
Definition, Design Framework, Design Refinement, dan Design Support yang terdapat
proses terlibatnya perancang/peneliti, manajemen stakeholder, dan teknologi untuk melakukan kolaborasi dalam perancangan produk tersebut (Cooper et al., 2014).
Kemudian untuk memperkuat hasil
observasi, dibutuhkan pengujian yang mampu mengukur tingkat pengalaman pengguna dengan aspek kualitas yang berbeda sekaligus mudah dan cepat digunakan yaitu User Experience
Questionnaire (UEQ). UEQ terdiri dari 6 skala
yang mencakup persepsi pengalaman pengguna secara komprehensif dan mampu mengekspresikan perasaan, kesan, dan sikap yang dirasakan oleh pengguna saat menggunakan produk yang diuji (Schrepp, Hinderks, & Thomaschewski, 2017a).
Hasil pengujian awal menggunakan UEQ menunjukkan bahwa data benchmark situs web SMA Negeri 1 Pasuruan pada kategori skala
Perspicuity mendapatkan skor Below Average
dan pada skala Attractiveness, Efficiency,
Dependability, Stimulation, Novelty
mendapatkan skor Bad.
Pengujian selanjutnya adalah melakukan wawancara kepada narasumber untuk mengetahui lebih dalam hal apa saja yang menyebabkan rendahnya tingkat pengalaman pengguna situs web SMA Negeri 1 Pasuruan. Hasil dari wawancara tersebut memiliki beragam pokok permasalahan, salah satunya adalah perbaikan dari sisi antarmuka dan tidak tercapainya tujuan dari pengguna dalam mengakses situs web tersebut.
Berdasarkan permasalahan yang telah dijabarkan diatas, maka perlu dilakukannya penelitian dan memberikan perbaikan antarmuka dalam bentuk prototype dan diuji menggunakan UEQ. Kemudian hasil dari UEQ desain
prototype dibandingkan dengan desain awal dan
memberikan grafik benchmark apakah desain
prototype lebih baik dibandingkan dengan
desain awal sehingga dapat memberikan perbaikan nilai positif terhadap situs web SMA Negeri 1 Pasuruan.
2. LANDASAN KEPUSTAKAAN
2.1. User Experience Questionnaire
User Experience Questionnaire (UEQ)
adalah suatu alat bantu pengolahan data untuk mengukur skala pengalaman pengguna yang mudah diaplikasikan, terpercaya dan valid, dan dapat digabungkan dengan metode evaluasi lain untuk melengkapi data dengan penilaian kualitas subjektif (Laugwitz et al., 2008). Kuesioner tersebut mendukung respon pengguna untuk segera mengungkapkan perasaan, kesan, dan
sikap yang muncul ketika menggunakan produk tersebut (Schrepp et al., 2017a). UEQ membebaskan peneliti untuk menentukan jumlah partisipan. Namun jika dalam cakupan area kecil, jumlah partisipan dapat ditentukan antara 20 hingga 40 orang (Hinderks, et. al., 2019).
UEQ mempunyai 6 skala dengan total 26 item antara lain; Attractiveness kesan secara umum pengguna terhadap produk, Efficiency yaitu kemungkinan penggunaan produk dengan cepat dan efisien tanpa melakukan hal-hal yang tak perlu, Perspicuity yaitu kemudahan pengguna dalam mengenali produk dan cara menggunakan produk, Dependability yaitu impresi pengguna dalam mengendalikan interaksi yang diberikan produk tersebut,
Stimulation yaitu tingkat keasyikan pengguna
dan kemampuan untuk memotivasi pengguna dalam menggunakan produk tersebut, Novelty yaitu ketertarikan minat pengguna terhadap tingkat inovatif dan kreativitas produk tersebut. 2.2. Card Sorting
Card Sorting adalah metode yang digunakan untuk membantu merancang atau mengavualuasi suatu struktur komponen informasi dalam suatu situs web. Dalam sesi
card sorting, peserta/responden memasukkan
komponen-komponen yang telah disediakan ke dalam kategori yang menurut mereka masuk akal dan mereka dapat menentukan label pada setiap kategori. Card sort akan membantu peneliti untuk memahami harapan pengguna dan memahami topik dan konten yang dikembangkan. Teknik card sorting dapat dilakukan kepada 15 responden (Cooper et al., 2014).
2.3. Sitemap
Sitemap adalah representasi diagram dari
sistem hierarkis. Biasanya menggambarkan hubungan parent-child antara halaman di situs web, menunjukkan bagaimana subhalaman dapat diatur di bawah pengelompokan halamannya (Nielsen, 2008).
3. METODOLOGI PENELITIAN
Adapun langkah-langkah yang digunakan dalam penelitian “Analisis dan Rekomendasi Perbaikan Situs Web Menggunakan Pendekatan
Goal-Directed Design” terdapat 6 tahap seperti
pada Gambar 1 sebagai berikut:
Gambar 1 – Alur penelitian
4. PENGUMPULAN DAN ANALISIS
DATA
4.1. Research
Pada tahap ini dilakukan pengumpulan data oleh peneliti dengan cara membagikan User
Experience Questionnaire (UEQ) kepada siswa
aktif SMA Negeri 1 Pasuruan sebagai pengguna. Pengisian kuesioner dilakukan secara online dan telah menghasilkan sebanyak 40 orang responden. Kemudian untuk mendeteksi jawaban acak atau tidak serius maka dilakukan heuristik sederhana. Jika terdapat perbedaan besar pada skor critical (≥3) maka data tersebut memiliki pola data yang bermasalah dan disarankan untuk menghapus data responden tesebut. Dari 40 responden, terdapat 10 orang yang memiliki skor critical ≥3 sehingga tersisa 30 orang responden yang dinyatakan berada dalam kategori aman. Tahap selanjutnya adalah mengkonfirmasi apakah semua item pada skala mengukur kualitas yang sama menggunakan
cronbach’s alpha data yang mendeskripsikan
konsistensi dari setiap atribut pada suatu skala. Tabel 1 – Skala Cronbach’s Alpha
Scale Average Alpha Attractiveness 0,57 0,89 Perspicuity 0,62 0,87 Efficiency 0,46 0,77 Dependability 0,33 0,66 Stimulation 0,65 0,88 Novelty 0,53 0,82
Hasil dari konsistensi data responden menggunakan perhitungan Cronbach’s Alpha pada Tabel 1 menghasilkan nilai 0,89 pada skala
pada skala Efficiency, 0,66 pada skala
Dependability, 0,88 pada Stimulation, dan 0,82
pada skala Novelty. Dari nilai tersebut, mengindikasikan bahwa semua skala telah memiliki konsistensi yang cukup dan membuktikan bahwa semua responden tepat dalam menginterpretasikan atribut-atribut pada setiap skala.
Tabel 2 - Nilai rata-rata dan variansi setiap skala UEQ
Skala Rata-Rata Variansi
Attractiveness 0,278 1.41 Perspicuity 0,992 1,59 Efficiency 0,250 1,53 Dependability 0,583 1,17 Stimulation 0,008 2,18 Novelty -0,392 1,59
Berdasarkan Tabel 2 menghasilkan rata-rata pada skala Attractiveness sebesar 0,278 dengan variansi 1,41. Kemudian pada skala
Perspicuity menghasilkan rata-rata sebesar
0,992 dengan variansi 1,59. Efficiency
menghasilkan rata-rata 0,250 dengan variansi 1,53. Dependability menghasilkan rata-rata 0,583 dengan variansi 1,17. Stimulation menghasilkan rata-rata 0,008 dengan variansi 2,18 dan Novelty menghasilkan rata-rata -0,392 dengan variansi 1,59. Skala yang menunjukkan nilai rata-rata antara -0,8 sampai 0,8 diartikan bahwa memiliki user experience yang netral, sedangkan jika dibawah -0,8 memiliki user
experience negatif, dan jika diatas 0,8 maka
memiliki user experience positif (Schrepp, 2017). Berdasarkan hasil rata-rata diatas, hanya skala Perspicuity yang memiliki nilai positif dengan skor 0,992 (diatas 0,8) sedangkan skala lainnya memiliki nilai yang netral (antara -0,8 dan 0,8).
Gambar 2 - Benchmark perbandingan dengan produk lain
Berdasarkan Gambar 2 menunjukkan bahwa situs web SMA Negeri 1 Pasuruan dikategori 1 skala yaitu Perspicuity yang mendapatkan skor Below Average dan pada skala Attractiveness, Efficiency, Dependability,
Stimulation, Novelty mendapatkan skor Bad.
Untuk mengetahui permasalahan lebih mendalam yang menyebabkan skor tersebut dibawah rata-rata maka perlu dilakukan wawancara individu kepada siswa SMA Negeri 1 Pasuruan.
Wawancara dilakukan kepada 3 pengguna yaitu siswa SMA Negeri 1 Pasuruan. Hasil wawancara dijabarkan ke dalam bentuk Tabel 3 berikut.
Tabel 3 – Hasil wawancara
No. Rekomendasi Perbaikan Kode
Perbaikan 1 Melakukan pembaruan
desain antarmuka yang lebih atraktif dan sesuai dengan tema pendidikan.
KP_1A
Menghapus kolase foto latar belakang.
KP_1B
Menambahkan fitur informasi jadwal pelajaran.
KP_1C
Menambahkan informasi detail guru seperti NIP dan bidang mata pelajaran.
KP_1D
Memperbarui konten secara berkala.
KP_1E 2 Memperbarui konten secara
berkala dan informatif.
KP_2A -1,00 -0,50 0,00 0,50 1,00 1,50 2,00 2,50 Att ra ctiv en e ss Pe rs p icuit y Ef fici e n cy De p en d ab ility Stim u lat ion N ov e lty Excellent Good Above Average Below Average Bad Mean
Memperbarui desain antarmuka, menu navigasi, dan homepage untuk menambah daya tarik pengunjung.
KP_2B
Menambahkan fitur layanan pengaduan.
KP_2C
Menghapus fitur konseling,
karena konseling
membutuhkan kontak
personal secara langsung antara konseli dan konselor.
KP_2D
Menyeragamkan tema foto profil guru dan menambah informasi NIP untuk kebutuhan tugas.
KP_2E
Mengorganisir ulang menu navigasi sesuai dengan konteks.
KP_2F
Menghilangkan kolase foto sebagai background atau diperbarui dengan kualitas yang lebih bagus.
KP_2G
3 Update konten secara rutin. KP_3A Merombak semua desain
antarmuka yang lebih menarik.
KP_3B
Tampilan awal homepage agar diberikan slide foto/video promosi.
KP_3C
Mengganti background dengan warna putih atau menyesuaikan tema desain baru.
KP_3D
4.2. Modelling
Pada tahap ini akan mengidentifikasi kelompok pengguna yang berpengaruh dalam penelitian ini. Berdasarkan hasil analisis wawancara pada terkait pengalaman pengguna terhadap situs web SMA Negeri 1 Pasuruan dihasilkan dua kelompok pengguna yang dijelaskan pada Tabel 4 berikut.
Tabel 4 - Identifikasi kelompok pengguna
Kelompok Pengguna Peran
Pelajar SMA Negeri 1 Pasuruan
Memperoleh informasi
mengenai kegiatan
akademik, non-akademik, esktrakurikuler, dan
fitur-fitur yang menunjang kebutuhan siswa.
Pengguna Umum Memperoleh informasi
mengenai prestasi sekolah, penerimaan peserta didik baru, kegiatan sekolah. Dalam suatu organisasi memiliki tujuan tertentu dalam melaksanakan proses bisnisnya. Penelitian yang menggunakan metode
Goal-Directed Design diperlukan proses penyelarasan
antara tujuan pengguna dengan tujuan organisasi. Berikut adalah tujuan dari situs web SMA Negeri 1 Pasuruan pada Tabel 5.
Tabel 5 – Tujuan Situs Web SMA Negeri 1 Pasuruan
Nomor Tujuan Organisasi
1 Sebagai wadah penyebaran informasi dan wujud branding ke masyarakat 2 Memberikan informasi prestasi sekolah
dalam ajang olimpiade sains dan komputer di tingkat kota, provinsi, nasional, dan internasional
3 Memudahkan masyarakat dalam
mencari informasi pendaftaran peserta siswa didik baru
Selanjutnya diperlukan membuat persona untuk memahami karakteristik dan masalah kebutuhan berdasarkan kelompok pengguna yang telah dibuat yaitu persona Pelajar SMA Negeri 1 Pasuruan dan persona Pengguna Umum. Berikut persona dari pelajar SMA Negeri 1 Pasuruan dan persona pengguna umum. Tabel 6 – Persona Pelajar SMA Negeri 1 Pasuruan Demografi Usia: 15-18 tahun
Jenis Kelamin: Laki-laki dan Perempuan
Peserta didik aktif di SMA Negeri 1 Pasuruan
Perangkat PC/Laptop
Smartphone
Aktivitas Pelajar aktif di SMA Negeri 1 Pasuruan Mengikuti kegiatan organisasi/ekstrakurikuler Tingkah laku dan lingkungan
Antusias dalam mencari informasi beasiswa sekolah dan perguruan tinggi.
Akses internet mudah diakses di lingkungan sekolah dan tempat tinggal siswa.
Terbiasa menggunakan internet dalam mengakses situs web untuk
mencari informasi yang
dibutuhkan.
Memperhatikan aspek desain sebagai hal ketertarikan dan kenyamanan pada sebuah situs web.
Tujuan Mendapatkan informasi beasiswa dan kegiatan lomba
Mendapatkan informasi pendaftaran PTN/PTK ataupun sekolah lanjut perguruan tinggi lainnya
Mendapatkan informasi mengenai seputar kegiatan ekstrakurikuler
Terpenuhi segala kebutuhan akademik seperti informasi jadwal pelajaran, informasi biodata guru untuk keperluan laporan
Tantangan Kurangnya daya tarik pada desain antarmuka situs web, terdapat fitur yang tidak sesuai ekspektasi
Tidak mendapatkan informasi terkini mengenai kegiatan, ataupun pengumuman perihal lomba atau beasiswa
Terganggu dengan latar belakang web dan beberapa komponen gambar pecah
Berita terlalu usang, tidak terkini Pada Tabel 6 merupakan persona pelajar SMA Negeri 1 Pasuruan yang dibuat berdasarkan hasil analisis wawancara. Kemudian penulis membuat persona kedua yaitu persona pengguna umum. Pengguna umum yang dimaksud adalah masyarakat yang bukan pelajar aktif SMA Negeri 1 Pasuruan. Berikut adalah persona pengguna umum yang disajikan pada Tabel 7.
Tabel 7 – Persona Pengguna Umum Demografi Usia: 13-60 tahun
Jenis Kelamin: Laki-laki dan Perempuan
Masyarakat umum yang bukan peserta didik aktif di SMA Negeri 1 Pasuruan
Perangkat PC/Laptop
Smartphone Aktivitas Masyarakat umum Tingkah laku
dan lingkungan
Memperhatikan aspek desain sebagai hal ketertarikan dan kenyamanan pada sebuah situs web.
Menganggap bahwa branding sekolah bisa dilakukan melalui situs web.
Antusias dalam mencari informasi penerimaan peserta didik baru atau beasiswa untuk teman, anggota keluarga atau dirinya sendiri (calon peserta didik SMA).
Mempunyai bisnis yang berhubungan dengan sekolah.
Tujuan Mendapatkan informasi
pendaftaran peserta didik baru (PPDB)
Mendapatkan informasi mengenai prestasi-prestasi yang pernah diraih SMA Negeri 1 Pasuruan
Bermitra dengan pihak sekolah Tantangan Tidak mendapatkan informasi
terkini mengenai kegiatan sekolah, ataupun pengumuman perihal PPDB
Berita terlalu usang, tidak terkini
4.3. Requirements Definition
Pada tahap ini akan dilakukan pengelompokan permasalahan yang dialami pengguna berdasarkan hasil wawancara dan rekomendasi pengguna yang akan digunakan sebagai pertimbangan desain perbaikan. Pengelompokan masalah ini dilakukan untuk menyederhanakan masalah dan rekomendasi karena hasil dari wawancara narasumber terdapat poin-poin yang memiliki aspek sama. Proses konfirmasi ulang kepada stakeholder mengenai rekomendasi-rekomendasi perbaikan oleh pengguna. Data pada Tabel 3 diberikan kepada stakeholder untuk mengkonfirmasi apakah mereka setuju dengan aspek perbaikan tersebut. Setiap aspek permasalahan pada Tabel 3 disetujui oleh stakeholder sebagai solusi perbaikan.
Selanjutnya adalah menentukan rancangan struktur informasi berdasarkan kebutuhan dari pengguna menggunakan teknik card sorting. Setelah seluruh hasil proses card sorting didapat, maka selanjutnya adalah membuat hirarki peta halaman web menggunakan bentuk sitemap yang berfungsi sebagai acuan dalam perancangan desain situs web. Berikut adalah hasil dari susunan sitemap pada Gambar 3 berikut.
Gambar 3 – Sitemap Prototype situs web SMA Negeri 1 Pasuruan
5. PENGEMBANGAN DAN PENGUJIAN
DESAIN SOLUSI
5.1. Wireframe
Pada tahap ini akan dilakukan pembuatan rancangan desain solusi antarmuka berdasarkan komponen-komponen berupa wireframe. Dari setiap halaman wireframe desain solusi terdapat nomor-nomor yang berisikan tentang penjelasan dari komponen tersebut. Halaman wireframe dibuat berdasarkan hasil pengelompokan masalah dan rekomendasi perbaikan dan
sitemap.
Gambar 4 – Wireframe halaman beranda Pada Gambar 4 bagian nomor 1 merupakan tampilan untuk header rancangan situs web. Kemudian pada bagian nomor 2
1
2
3
3
4
5
6
7
menampilkan foto carousel yang berfungsi sebagai welcome page dan branding tageline SMA Negeri 1 Pasuruan. Kemudian pada bagian nomor 3 menampilkan informasi singkat mengenai sekolah. Pada bagian nomor 4 menampilkan informasi mengenai video profil sekolah. Selanjutnya bagian nomor 5 menampilkan container yang berisikan informasi pengumuman, beasiswa, dan perlombaan. Nomor 6 menampilkan berita kegiatan sekolah dan nomor 7 disediakan untuk
footer halaman yang berisikan informasi alamat
dan kontak sekolah. 5.2. Prototype
Desain wireframe antarmuka yang telah dibuat pada subbab 5.1 dikembangkan menjadi desain prototype yang mendekati wujud akhir dengan diberikan warna, gambar, dan interaksi keseluruhan komponen sehingga mampu mewakili rekomendasi desain solusi produk. Desain prototype ini akan digunakan sebagai pengujian akhir untuk membandingkan tingkat keberhasilan dengan desain sebelum perbaikan.
Penentuan warna tema halaman web diambil dari elemen warna logo SMA Negeri 1 Pasuruan menggunakan aplikasi berbasis web
Coolor.co yang mampu dengan cepat membuat
skema warna berdasarkan gambar. Adapun hasil dari pembuatan skema warna pada Gambar 5 berikut.
Gambar 5 – Skema warna prototype
Gambar 6 – Prototype halaman beranda Pada Gambar 6 merupakan halaman beranda. Carousel foto kegiatan pembelajaran siswa dihadirkan untuk memberikan kesan pendidikan. Pada sisi atas terdapat menu
navigasi yang selalu menempel di atas walaupun halaman sedang digulir ke bawah. Kemudian disajikan tampilan konten informasi singkat mengenai penerimaan siswa baru. Konten PPDB diletakkan pada posisi atas untuk menjawab kode KK_09 yang merupakan rekomendasi konten yang muncul di beranda. Di bagian bawahnya merupakan gabungan dari kode KK_04 yaitu informasi singkat mengenai SMASA dan KK_16 yaitu video profil sekolah. Selanjutnya konten informasi lomba (KK_08), beasiswa (KK_14), pengumuman sekolah (KK_01) dan berita kegiatan yang telah dilaksanakan oleh SMA Negeri 1 Pasuruan. 5.3. Pengujian Prototype
Setelah proses perancangan desain solusi prototype telah selesai, maka dilakukan pengujian menggunakan User Experience
Questionnaire (UEQ) untuk membandingkan
dengan desain awal sebelum perbaikan. Adapun 30 narasumber yang berasal dari kelompok pengguna siswa aktif SMA Negeri 1 Pasuruan dan masyarakat umum yang pernah mengakses desain awal situs web SMA Negeri 1 Pasuruan. Dari 30 responden tersebut, skala critical atau tingkat keseriusan responden berada di bawah angka 3 yang berarti keseluruhan responden berada pada skor aman dan menjawab secara serius.
Kemudian pada tahap berikutnya adalah mengkonfirmasi apakah semua item pada skala mengukur kualitas yang sama menggunakan
cronhach’s alpha data yang mendeskripsikan
konsistensi dari setiap atribut pada suatu skala. Beberapa peraturan menyatakan bahwa nilai antara >0,6 sampai >0.7 sebagai level yang sudah mencukupi (Schrepp et al., 2017).
Tabel 8 – Hasil cronbach’s Alpha Desain Prototype
Scale Average Alpha Attractiveness 0,62 0,91 Perspicuity 0,41 0,73 Efficiency 0,53 0,82 Dependability 0,43 0,75 Stimulation 0,66 0,88 Novelty 0,32 0,65
Hasil dari konsistensi data responden menggunakan perhitungan cronbach’s alpha pada Tabel 5.1 menyatakan bahwa seluruh skala berada pada level di atas 0,6 yang berarti level tersebut sudah cukup konsisten.
Gambar 7 – Benchmark Desain Prototype Pada Gambar 7 merupakan hasil benchmark pengujian UEQ terhadap desain solusi prototype menghasilkan pada skala Attractiveness dengan nilai rata-rata 2,01 mendapatkan skor Excellent, skala Perspicuity dengan nilai rata-rata 1,90 mendapatkan skor Good, skala Efficiency dengan nilai rata-rata 1,89 mendapatkan skor
Excellent, skala Dependability dengan nilai
rata-rata 1,58 mendapatkan skor Good, skala
Stimulation dengan nilai rata-rata 1,96 mendapatkan skor Excellent dan skala Novelty dengan nilai rata-rata 1,92 mendapatkan skor
Excellent.
5.4. Hasil Perbandingan Desain Awal Dengan Desain Solusi
Pada User Experience Questionnaire (UEQ) terdapat excel-sheet yang memiliki fungsi membandingkan 2 produk untuk mengukur skala pengalaman pengguna dari setiap produk. Data pengujian UEQ terhadap desain awal dan data pengujian UEQ terhadap desain solusi dimasukkan ke excel-sheet yang tersedia. Adapun hasil dari perbandingan tersebut menghasilkan grafik seperti berikut.
Gambar 8 – Grafik hasil perbandingan desain awal dengan desain solusi
-1,00 -0,50 0,00 0,50 1,00 1,50 2,00 2,50 Att ra ctiv en e ss Pe rs p icu ity Ef fici e n cy De p en d ab ility Stim u lat ion N ov e lty Excellent Good Above Average Below Average Bad -1,50 -1,00 -0,50 0,00 0,50 1,00 1,50 2,00 2,50
Pada Gambar 8 di atas merupakan grafik hasil perbandingan antara 2 produk yaitu UEQ desain awal (grafik biru) dengan UEQ desain solusi (grafik merah). Dari grafik tersebut, terlihat seluruh grafik desain solusi memiliki perbedaan yang signifikan dan nilai lebih dari 1,5. Berikut adalah tabel data detail dari masing-masing skala.
Tabel 9 - Tabel data 1 (pengujian UEQ desain awal) dan data 2 (pengujian UEQ desain solusi)
Skala Data 1 Data 2 Selisih Rata-Rata Ra ta -Ra ta Sta nd a r Dev ia si Ra ta -Ra ta Sta nd a r Dev ia si Attractive-ness 0,28 1,19 2,01 0,82 1,73 Perspicuity 0,99 1,26 1,90 0,77 0,91 Efficiency 0,25 1,24 1,89 0,93 1,64 Dependa-bility 0,58 1,08 1,58 0,89 1,00 Stimula-tion 0,01 1,48 1,96 0,93 1,95 Novelty -0,39 1,26 1,92 0,80 2,31
Berdasarkan data perbandingan pada Tabel 9 bahwa rata-rata dari keseluruhan skala memiliki perbedaan yang signifikan. Pada skala
Attractiveness memiliki perbedaan rata-rata
sebesar 1,73. Kemudian pada Perspicuity memiliki perbedaan rata-rata 0,91. Skala
Efficiency memiliki perbedaan rata-rata 1,64.
Skala Dependability memiliki perbedaan rata-rata 1,00. Skala Stimulation memiliki perbedaan rata-rata 1,95. Skala Novelty memiliki perbedaan rata-rata 2,31.
Perbedaan signifikan tersebut diperoleh berdasarkan usaha peneliti yang menekankan pada kebutuhan dan tujuan dari stakeholder dan memberikan perbaikan desain antarmuka yang futuristis, sederhana, dan intuitif sehingga tidak menimbulkan banyak tugas baru oleh pengguna untuk mempelajari keseluruhan interaksi antarmuka situs web SMA Negeri 1 Pasuruan.
6. KESIMPULAN DAN SARAN
Penelitian analisis dan perbaikan situs web SMA Negeri 1 Pasuruan telah dilaksanakan, maka peneliti dapat menyimpulkan sebagai berikut:
1. Hasil analisis menggunakan Goal-Directed
Design digunakan untuk framework
penelitian untuk mendapatkan tujuan dari pengguna. Pada fase Research telah dilakukan User Experience Questionnaire (UEQ) didapatkan bahwa 1 skala berada di level low average dan 5 skala level Bad. Peneliti melakukan wawancara kepada kelompok pengguna yang menyatakan bahwa situs web SMA Negeri 1 Pasuruan perlu perombakan dalam hal desain antarmuka dan menambahkan fitur-fitur yang menunjang kebutuhan siswa. Kemudian fase Modelling dilakukan pemodelan karakter pengguna menggunakan persona. Selanjutnya pada fase Requirements Definition dilakukan pengelompokan masalah dan rekomendasi perbaikan hasil dari wawancara kepada narasumber. Kemudian peneliti juga melakukan pengujian Card Sorting untuk mendapatkan judul menu dan submenu navigasi dan konten-konten apa saja yang hadir di halaman beranda. Hasil dari pengujian Card Sorting tersebut digambarkan dalam bentuk Sitemap. 2. Wireframe disesuaikan dengan kebutuhan
dan tujuan pengguna agar dapat menjadi desain solusi perbaikan. Tahap awal pembuatan wireframe yaitu membuat komponen seperti breadcrumbs, menu navigasi, tombol pencarian, dan footer. Selain itu juga menentukan Grid halaman untuk memudahkan dalam mengatur tatak letak komponen web. Selanjutnya membuat kerangka halaman.
3. Selanjutnya pada fase refinement dilakukan pembuatan desain solusi berupa prototype yang akan dibandingkan dengan desain awal. Prototype dibuat berdasarkan hasil pada fase framework yang diberikan warna, konten, dan komponen-komponen agar
prototype tersebut dapat mewakili sebagai
wujud desain solusi.
4. Hasil uji perbandingan UEQ desain awal dengan desain solusi menggunakan
excel-sheet yang telah tersedia menyatakan
bahwa seluruh skala pada desain solusi memiliki perbedaan positif yang cukup signifikan.
Peneliti menyarankan pada penelitian selanjutnya untuk melakukan pengujian di awal sebelum penelitian untuk dapat menentukan
tolok ukur diperlukannya pengembangan suatu produk. Selain itu apabila menggunakan teknik
card sorting sangat dimungkinkan terjadinya
redudansi konten di beberapa kategori. Peneliti menyarankan untuk memisahkan konten yang sifatnya utama (master) dan konten yang sifatnya pintasan (shortcut).
7. DAFTAR PUSTAKA
Cooper, A., Reimann, R., Cronin, D., Noessel, C., Csizmadi, J., & LeMoine, D. (2014).
About Face - The Essentials of Interaction Design (4th ed., Vol. 13). USA: John
Wiley & Sons, Inc.
Izabal, S. V., Aknuranda, I., & Az-zahra, H. M. (2018). Evaluasi dan Perbaikan User Experience Menggunakan User Experience Questionnaire ( UEQ ) dan Focus Group Discussion ( FGD ) pada Situs Web FILKOM Apps Mahasiswa Fakultas Ilmu Komputer Universitas Brawijaya. Jurnal Pengembangan Teknologi Informasi Dan Ilmu Komputer (J-PTIIK) Universitas Brawijaya, 2(9),
3224–3232.
Laugwitz, B., Held, T., & Schrepp, M. (2008).
Construction and Evaluation of User Experience Questionnaire. Springer-Verlag Berlin Heidelberg.
Leavitt, M., & Shneiderman, B. (2013).
Research-Based Web Design & Usability Guidelines. Washington DC: U.S. Department of Health and Human Services (HHS) and U.S. General Services Administration (GSA).
Schrepp, M., Hinderks, A., & Thomaschewski, J. (2017a). Construction of a Benchmark for the User Experience Questionnaire (UEQ). International Journal of Interactive Multimedia and Artificial Intelligence, 4(4), 40. https://doi.org/10.9781/ijimai.2017.445 Tejamukti, A. A., Az-zahra, H. M., &
Rokhmawati, R. I. (2018). Pengembangan Antarmuka Website PPPA Daarul Qur ’ an Malang Dengan Menggunakan Metode Goal Directed Design. Pengembangan
Teknologi Informasi Dan Ilmu Komputer, 2(12), 6277–6285. Retrieved from
