LAPORAN PRAKTIKUM
INTERAKSI MANUSIA DAN KOMPUTER Kelas BP
Laporan 2
“GUI Control Bloopers, Navigation Bloopers, dan Textual Bloopers”
Nama Mahasiswa : Elisabeth Tiara Dewanti
NIM : 205314143
Program Studi / Fakultas : Informatika / Fakultas Sains dan Teknologi Dosen : Agnes Maria Polina, S.Kom, M.Sc.,
PROGRAM STUDI INFORMATIKA FAKULTAS SAINS DAN TEKNOLOGI
UNIVERSITAS SANATA DHARMA YOGYAKARTA
2022
Interaksi Manusia dan Komputer Modul Praktikum Minggu 2
“GUI Control Bloopers, Navigation Bloopers, dan Textual Bloopers”
A. Tujuan
1. Memahami guideline dalam design website
2. Memahami GUI control bloopers, navigation bloopers, dan textual bloopers 3. Menganalisa kesalahan yang terdapat dalam antarmuka website
B. Daftar website yang dinilai 1. www.usd.ac.id
2. www.indonesia.travel 3. www.computa.co.id C. Tugas Praktikum
Silakan baca guideline “GUI Bloopers 2.0”, kemudian lakukan analisis terhadap ketiga website di atas. Identifikasi kesalahan yang terdapat pada website berdasarkan guideline yang Anda baca.
Nama Website: www.usd.ac.id
No Bloopers Keterangan (penjelasan dan gambar) 1 GUI control bloopers
Blooper Using Command buttons as Toggles:
Keterangan :
Penggunaan tombol pencarian diatas membuat pengguna bingung dengan fungsinya (untuk mencari apa)
Blooper … : Blooper … :
…
2 Navigation bloopers
Blooper Window or page not identified :
Keterangan :
Bisa dilihat bahwa gambar diatas merupakan 2 dari beberapa contoh menunjukan bloopers jendela atau halaman tidak teridentifikasi, web ini tidak memberi tanda dimana sekarang pengguna berada, pada halaman ini tidak ditunjukan dimana halaman ini berada sekarang.
Bloopers seperti ini bisa dihindari dengan ditunjukkan oleh judul halaman yang terpisah dari bilah navigasi atau bisa meng-highlight bagian tersebut.
Blooper Self Link
Keterangan :
Pada gambar diatas menunjukan bloopers self link yang mana halaman web home menyertakan link aktif ke dirinya sendiri, dengan mengklik tautan semacam itu hanya akan memuat ualng halaman.
Blooper Competing search boxes :
Keterangan :
Ketika pengguna dihadapkan dengan beberapa kotak pencarian, mereka sering bertanya-tanya: "Yang mana yang harus saya gunakan?" "Apakah mereka berbeda?" "Apakah mereka mencari data
yang sama?" jadi bloopers seperti ini membingungkan pengguna.
Bloopers Distracting off-path buttons and links
Keterangan :
Pada web ini terjadi kesalahan pada Blooper Mengganggu tombol dan tautan di luar jalur yaitu pada bagian kanan pojok atas pada tulisan kecilnya saat user ingin menekan link tersebut pasti ada sedikit gangguan karena terdapat garis dibawahnya dan karna ukuran fontnya yang terlalu kecil sehingga user agak sulit untuk menekan link tersebut.
Blooper Same title on
different windows :
Keterangan :
Kesalahan pada tempat pengisian data tersebut adalah tidak adanya keterangan atau tulisan di bagian tersebut bahwa itu digunakan untuk menggisi apa. Sehingga user akan mengalami kebingungan saat pertama kali ingin membukanya. Sehingga harus diberikan judul dan keterangan supaya user dapat mengerti saat ingin membukanya.
Bloopers Distracting off-path buttons and links
Keterangan :
Pada gambar diatas merupakan bloopers yaitu tidak menyediakannya tombol kembali, untuk kembali pada web utamanya jadi Terpikat keluar jalur. Tidak bisa kembali
Blooper windows tittle doesn’t match command or link : terdapat pada page admisi
Keterangan :
Terdapat perbedaan judul menu dengan judul halaman yang muncul ketika menu di klik sehingga membuat bingung pengguna yang kurang awam dengan istilah admisi tersebut.
3 Textual bloopers
Blooper bad writing : terdapat pada page home
Keterangan :
Warna dari teks yang berada dalam kotak tersebut membuat pengguna sulit melihat ataupun membacanya sehingga perlu penggantian warna agar teks tersebut terlihat dan memudahkan pengguna untuk membacanya
Blooper text makes sense in isolation but is misleading in the GUI : terdapat pada page E-Journal
Keterangan :
Terdapat menu font size tetapi tidak terdapat pilihan ukuran maupun ukuran yang bisa dipilih
Blooper … :
…
Nama Website: www.indonesia.travel
No Bloopers Keterangan (penjelasan dan gambar) 1 GUI control bloopers
Blooper …
: Keterangan : Blooper …
:
Blooper … :
…
2 Navigation bloopers Blooper
Window or page not
identified :
Keterangan :
Bisa dilihat bahwa gambar diatas merupakan 1 dari beberapa contoh menunjukan bloopers jendela atau halaman tidak teridentifikasi, web ini tidak memberi tanda dimana sekarang pengguna berada, pada halaman ini tidak ditunjukan dimana halaman ini berada sekarang.
Bloopers seperti ini bisa dihindari dengan ditunjukkan oleh judul halaman yang terpisah dari bilah navigasi atau bisa meng-highlight bagian tersebut.
Blooper Self Link :
Keterangan :
Pada gambar diatas menunjukan bloopers self link yang mana halaman web home menyertakan link aktif ke dirinya sendiri, dengan mengklik tautan semacam itu hanya akan memuat ualng halaman. Pada saat
mengklik Book Now maka akan kembali kedirinya sendiri dan akan memuat halaman dimana jika kita sudah menscroll kebawah tetapi ketika kita klik link tersebut atau book now maka akan kembali keatas lagi.
Blooper windows tittle doesn’t match command or link : terdapat pada page jelajah#
diIndonesi a
Keterangan :
Terdapat perbedaan judul menu dengan judul halaman yang muncul ketika menu di klik sehingga membuat bingung pengguna yang baru menggunakan web ini
…
3 Textual bloopers Blooper
bad writing : terdapat pada page home
Keterangan :
Bisa dilihat pada gambar diatas bahwa itu sangat membingungkan karena tulisan dibawahnya tidak keliahatan sehingga pengguna akan bingung untuk memilih opsi.
Blooper … :
Blooper … :
…
Nama Website: www.computa.co.id
No Bloopers Keterangan (penjelasan dan gambar) 1 GUI control bloopers
Bloopers using command buttons as toggles : terdapat pada page laptop
Keterangan :
Penggunaan check box pada halaman diatas masih belum sesuai dikarenakan pada saat memberikan klik pada dua check box tersebut maka produk yang muncul hanya dari check box yang terakhir di klik Blooper
Using input controls for display- only data
Keterangan :
Bisa dilihat pada gambar diatas merupakan bloopers yang mana button bandingkan hanya berupa tampilan saja dan tidak dapat diklik atau tidak aktif yang mana membuat bingung pengguna yang akan membandingkan suatu barang.
Blooper Using input controls for display- only data
Keterangan :
area teks bergulir menampilkan dokumen hukum panjang yang tidak dapat diedit. Dimana ini membuat pengguna tidak bisa melihat secara keseluruhan isi dari konten tersebut.
…
2 Navigation bloopers
Blooper
… : Blooper
… :
…
3 Textual bloopers Blooper
bad writting : terdapat pada page login
Keterangan :
Teks yang terdapat di dalam kotak tersebut seharusnya berupa peringatan atau perintah saja seperti “sandi Anda salah”, “Sandi Anda salah, silahkan login kembali!” tidak perlu disertai kalimat “terdapat 1 error” yang malah membuat pengguna bingung nantinya
Blooper
… :
Blooper
… :
…
*satu tabel untuk penilaian satu website bit.ly/bloopersIMK2 → Guideline BLOOPERS