Redesigning Del Institute of Technology Website by Exploring Other Campus Websites: Case Study — About Del and Study Programs [1]
DAFTAR ISI
- Tahap I: Evaluasi Website IT Del
- Tahap II: Evaluasi Website Universitas
- Tahap III: Merancang Ulang Website IT Del
- Usability Testing
TAHAP I : EVALUASI WEBSITE IT DEL
Website merupakan ‘kebutuhan’ bagi sebuah organisasi atau institusi (termasuk perguruan tinggi) untuk melakukan promosi, komunikasi dan publikasi. Sehingga website sebaiknya dirancang sedemikian rupa agar promosi, komunikasi, dan publikasi dapat dijalankan dengan baik. Institut Teknologi Del merupakan institusi pendidikan yang juga memiliki website untuk promosi, komunikasi dan publikasi. Saat ini website Institut Teknologi Del (IT Del) [1] telah digunakan, namun sebaiknya dilakukan perbaikan di beberapa bagian yang ada dalam tulisan ini. Tulisan ini akan menjabarkan saran perbaikan dalam website IT Del yang dilakukan berfokus hanya pada halaman ‘Tentang Del’ dan ‘Program Pendidikan’.
1.1 Daftar Temuan Masalah
Tulisan ini akan membahas mengenai evaluasi website Institut Teknologi Del dengan batasan pada halaman Tentang Del (IT Del) dan halaman Program Pendidikan. Evaluasi website IT Del akan menggunakan 10 Heuristic Evaluation oleh Jacob Nielsen [2] sebagai guidlines. Heuristic evaluation berguna untuk menemukan dan membenarkan masalah dalam interface [3].
1.1.1 Halaman Tentang Del
Halaman Tentang Del memuat informasi mengenai Sejarah Del, Visi dan Misi, Sambutan Ketua Pembina Yayasan Del Jend TNI (Purn) Luhut B. Pandjaitan, Sambutan Rektor IT Del, Keunggulan IT Del, Struktur Organisasi, Senat Akademik IT Del, Testimonial, serta Fakta dan Angka. Evaluasi akan dikelompokkan berdasarkan poin di dalam 10 Heuristic Evaluation yang sesuai/terdapat pada evaluasi ini.
a. Visibility of System Status
Halaman Tentang Del didominasi oleh teks sehingga proses perpindahan halaman tidak berlangsung lama. Walau demikian, website ini tetap mengizinkan loader pada browser sehingga user dapat mengetahui bahwa sistem sedang bekerja untuk memindahkan halaman menuju halaman yang dingin di tampilkan. Hal ini cukup baik dan patut dipertahankan.
b. Match between System and The Real World
Teks yang disajikan pada halaman ini dibuat menggunakan Bahasa Indonesia sesuai ejaan yang disempurnakan (juga tersedia dalam bahasa Inggris). Dengan demikian, user dapat memahami isi halaman dengan baik. Hal ini patut dipertahankan.
c. User Control and Freedom
Halaman ini didominasi oleh teks yang panjang, misalnya pada halaman sejarah Del. Namun saat user berada pada bagian akhir dari teks, user diharuskan melalukan scroll up yang panjang untuk melanjutkan penggunaan website.
d. Consistency and Standard
Pada dropdown menu, website ini menggunakan desain yang sama pada setiap menu di dalam list. Sangat baik.
Namun pada bagian footer, terdapat kata contact us, latest tweets, find us on pada saat konfigurasi Bahasa Indonesia. Sebaiknya ada konsistensi bahasa dari setiap konfigurasi bahasa. Selain itu, terdapat satu bagan yang tampak terlalu kecil dari bagan lainnya yang membuat user kesulitan melihatnya.
e. Recognition Rather than Recall
Pada menu fakta dan angka, informasi dibagi berdasarkan anchor. Namun pada saat memilih anchor, user tidak menemukan penghubung untuk anchor lainnya. Sehingga user harus kembali ke halaman sebelumnya atau harus mengingat langkah dari awal untuk mengulangnya.
f. Aesthetic and Minimalist Design
Terdapat section upcoming events serta section latest tweets yang sejauh ini belum memberikan informasi.
Penempatan dan jarak kata yang kurang tepat dapat menyebabkan ambiguitas, misalnya: Judul Sejarah Del dan sub judul Yayasan Del. Karena terlalu rapat, membuat seakan-akan keduanya merupakan satu kesatuan.
1.1.2 Halaman Program Pendidikan
Halaman Program Pendidikan memuat informasi mengenai Fakultas Informatika dan Teknik Elektro, Fakultas Teknik Bioproses, Fakultas Teknik Industri, dan Kalender Akademik. Evaluasi akan dikelompokkan berdasarkan poin di dalam 10 Heuristic Evaluation yang sesuai/terdapat pada evaluasi ini.
a. Visibility of System Status
Sama seperti halaman Tentang Del, hal ini tetap mengizinkan loader dari browser untuk memastikan sistem bekerja.
b. Match between System and The Real World
Sama seperti halaman Tentang Del, halaman ini juga menggunakan bahasa Indonesia (dan bahasa Inggris) sehingga informasi dapat dihapami dengan baik.
c. User Control and Freedom
Pada halaman dengan konten yang panjang, misalnya Struktur Kurikulum Program Studi Informatika Program Sarjana, tidak ada tombol “kembali ke atas” yang menyebabkan user harus banyak melakukan scroll.
d. Consistency and Standard
Sama seperti halaman Tentang Del, bagian footer juga masih mengandung kata yang bukan bahasa Indonesia pada konfigurasi Bahasa Indonesia.
e. Recognition Rather than Recall
Banyaknya informasi yang disajikan memungkinkan konsentrasi user menjadi buyar saat harus mengingat langkah yang dilalui untuk menemukan current page. Sebaiknya hal ini dibantu dengan breadcrumb daripada memaksa user untuk mengingat path.
f. Flexbility and Efficiency of Use
Pada konten halaman, tidak jarang ditemukan link maupun tombol yang mengarahkan user ke halaman lain yang ada di dalam website yang sama. Hal ini mengurangi tingkat efisiensi karena membutuhkan banyak klik dari user. Masalah ini dapat diatasi dengan membuat arsitektur informasi yang baik pada menu.
g. Aesthetic and Minimalist Design
Tampilan halaman Program Pendidikan mirip dengan halaman Tentang Del. Tetapi terdapat beberapa perbedaan, diantaranya adalah jarak antar poin sangat jauh, padahal memiliki konteks yang sama.
Halaman Program Pendidikan dengan sub menu Fakultas Teknik Industri memiliki tombol yang memiliki ukuran yang bervariasi. Sebaiknya ukuran tombol disamakan dan tulisan rata tengah.
Pada sub menu Fakultas Informatikan dan Teknik Elektro terdapat tombol yang didahului dengan numbering yang sebenarnya tidak perlu dicantumkan.
Pada tabel kurikulum Sarjana, isi tabel menjadi wrap text padahal banyak whitespace di samping tabel.
1.1.1 Rangkuman hasil Heuristic Evaluation.
Berikut merupakan rangkuman dari hasil Heuristic Evaluation yang dilakukan terhadap menu Tentang Del dan menu Program Pendidikan.
Severity Rating
0 = Bukan termasuk masalah usability
1 = Cosmetic problem: cukup mengganggu user, tapi tidak terlalu menyebabkan masalah pada proses penyelesaian task user. Perbaikan tidak terlalu dibutuhkan
2 = Minor usability problem: berpotensi menyebabkan user mengalami kesulitan dalam proses penyelesaian task. Dibutuhkan perbaikan, tingkat prioritas rendah
3 = Major usability problem: sangat penting untuk diperbaiki, tingkat prioritas tinggi
4 = Usabillity catasthrope: wajib diperbaiki sebelum dapat digunakan
10 Usability Heuristics
[1] Visibility of System Status
[2] Match Between System and The Real World
[3] User Control and Freedom
[4] Consistency and Standard
[5] Error Prevention
[6] Recognition Rather Than Recall
[7] Flexibility and Efficiency of Use
[8] Aesthetic and Minimalist Design
[9] Help Users Recognize, Diagnose, and Recovers from Errors
[10] Help and Documentation
1.2 Rekomendasi Perbaikan
Sebutkan dan jelaskan rekomendasi untuk perbaikan/ redesign website IT Del.
a. Menambahkan tombol ‘kembali ke atas’
Tombol ini akan membantu pengguna yang melakukan scroll down yang cukup banyak sehingga waktu yang dibutuhkan pengguna untuk kembali ke konten paling atas di dalam halaman dapat lebih singkat/meningkatkan efisiensi waktu.
b. Menyamakan bahasa pada teks berdasarkan konfigurasi bahasa yang dipilih
Hal ini berguna untuk meningkatkan konsistensi bahasa dalam website sehingga isinya menjadi lebih baik.
c. Melakukan perbaikan ukuran teks dan gambar
Teks dan gambar akan memiliki ukuran yang sesuai untuk menghindari kesalahpahaman serta mengurai beban kerja mata pengguna untuk mengetahui detail gambar.
d. Menambahkan Breadcrumb
Fitur ini sangat membantu pengguna untuk mengidantifikasi “keberadaannya” di dalam website sehingga tidak memaksa pengguna untuk mengingat setiap flow yang telah ia lakukan.
e. Mereduksi konten yang memiliki kontribusi yang minim
Hal ini dapat memberikan space yang lebih sehingga dapat digunakan untuk melakukan hightlight terhadap konten yang perlu ditonjolkan.
f. Memperbaiki struktur informasi
Selain breadcrumb, penataan informasi yang baik juga dapat memudahkan pengguna untuk mengetahui kedudukan current page serta dapat memprediksi keberadaan informasi yang ingin didapatkan.
DAFTAR PUSTAKA
[1] “Institut Teknologi Del,” [Online]. Available: http://www.del.ac.id/. [Accessed May 2020].
[2] J. Nielsen, “10 Usability Heuristics for User Interface Design,” Nielsen Norman Group, 24 April 1994. [Online]. Available: https://www.nngroup.com/articles/ten-usability-heuristics/. [Accessed May 2020].
[3] R. Sianturi, “Heuristic Evaluation,” 3 April 2020. [Online]. Available: https://riyanthisianturi.com/heuristic-evaluation/. [Accessed May 2020].
