BAB I

PENDAHULUAN
1.1 Latar Belakang
Mendesain sesuatu bukanlah hal yang mudah, terlebih jika mendesain sesuatu
yang berhubungan dengan interaksi manusia dan komputer. Bukanlah sesuatu yang
sederhana jika membahas bagaimana agar menusia dan komputer dapat berinteraksi
dengan baik dan saling memahami. Desain yang buruk akan menghasilkan user
interface yang memalukan nantinya.
Mendesain user interface memiliki standar dan prinsip tertentu yang harus
dipenuhi. Berdasarkan prinsip tersebut maka akan dihasilkan interface yang
memenuhi standar yang dapat dipahami oleh masyarakat. Dewasa ini, cukup banyak
user interface yang beredar dan digunakan masyarakat. Namun, diantara user interface
tersebut,

terdapat

interface

yang

tidak

memenuhi

syarat

sehingga

dapat

membingungkan pengguna.
Interface Hall of Shame merupakan suatu pembahasan yang akan
menggambarkan bagaimana kesalahan desain yang pernah dan biasa ditemui pada
beberapa user interface. Dengan adanya pembahasan mengenai Interface Hall of
Shame diharapkan semua orang terkhusus para desainer dapat memahami standar
sebelum mendesain sebuah user interface.

1.2 Tujuan Penulisan

Dalam makalah ini akan dibahas mengenai beberapa prinsip desain dan hal-hal
yang berhubungan dengan Interface Hall Of Shame dengan tujuan memberikan
pemahaman dan pengetahuan mengenai bagaimana mendesain sebuah user interface
yang baik dan mudah dipahami serta memberikan beberapa contoh kasus Interface
Hall of Shame.

BAB II
PEMBAHASAN
2.1 Desain User Interface
Desain adalah sebuah kreatifitas dari pembuatan sesuatu yang dapat digunakan
dan berdaya guna. Desain user interface adalah desain komputer, peralatan, mesin,
perangkat komunikasi mobile, aplikasi perangkat lunak, dan situs web dengan fokus
pada pengalaman pengguna dan interaksi. Tujuan dari user interface design adalah
membuat interaksi pengguna sesederhana dan seefisien mungkin, dalam hal mencapai
tujuan pengguna-apa yang sering disebut pengguna desain yang berpusat. User
interface design yang bagus memfasilitasi dan menyelesaikan tugas di tangan tanpa
menarik perhatian yang tidak perlu pada dirinya sendiri.
User Interface sekarang ini merupakan faktor paling penting dalam menentukan
sukses atau tidaknya dari sebuah sistem komputer.
Apabila desain User Interface bagus, maka akan menghasilkan hal-hal berikut :
a. Efisiensi meningkat
b. Meningkatkan produktivitas
c. Mengurangi error
d. Mengurangi training
e. Menambah dukungan.

Desain User Interface adalah suatu proses iterativ yang menyertakan hubungan
dekat antara user dan desainer. Terdapat tiga inti aktivitas pada proses tersebut, yaitu :
1. User analysis
Memahami apa yang user akan lakukan pada sistem
2. System prototyping
Mengembangkan beberapa seri prototype untuk percobaan
3. Interface evaluation
Percobaan dengan prototype dan user tersebut

2.2 Prinsip Desain User Interface

Dalam mendesain sebuah UI, tidak hanya sekedar mendesain. Ada beberapa
pertimbangan dan pedoman yang harus dilakukan. Prinsip-prinsip pedoman tersebut
adalah, sebagai berikut :
a. Dialog yang sederhana dan natural ( Simple and natural dialogue)
Dialog yang sederhan dan natural dapat diwujudkan menggunakan user
conceptual model, menyesuaikan urutan tugas user, dan mengurangi mapping antara
interface dan tugas semantik. Sebuah User Interface haruslah menampilkan dengan
tepat informasi yang dibutuhkan oleh user dimana informasi tersebut tidak berlebihan,
sesuai urutannya, menghilangkan informasi yang tidak relevan, dan tidak
menambahkan navigasi lain yang tidak dibutuhkan. Contohnya pada CD player di
bawah ini. Desain yang sederhana sesuai kebutuhan pengguna.

b. Menggunakan bahasa user (Speak the users language)

Bahasa yang digunakan dapat dimengerti oleh user secara umum, walau pun
menggunakan singkatan atau sesuatu yang dihapal masih tetap bisa dipahami user.
Misalnya pada peringatan baterai kosong pada Windows OS.

c. Memperingan beban memori user ( Minimize users memory load)

Komputer sangat baik dalam hal mengingat sesuatu, namun manusia
sebaliknya. Maka dari itu, interface yang dibutuhkan adalah interface yang tidak
membebani user untuk mengingat dan menghapal banyak hal. Misalnya pada Ms
Word pada kotak dialog font. Berbagai macam jenis huruf, ukuran, style, dan efeknya
yang dipilih akan diperlihatkan pada kotak preview-nya.

Contoh interface di bawah sangat menyulitkan user untuk memahami dan mengingat
semua yang dijelaskan.

d. Konsisten
Konsisten atau tetap dalam bentuk bahasa dan grafis. Misalnya pada beberapa
informasi atau kontrol yang terdapat pada windows, yaitu letak tombol ok dan
cancel.

e. Membuktikan feedback
Membuktikan feedback berarti membuktikan kepada user secara visual bahwa
sedang terjadi proses komunikasi dua arah (two-way communication). Sehingga user
tidak merasa kebingungan atau pun penasaran atas apa yang sedang dan akan terjadi
selanjutnya.
Feedback yang baik adalah feedback yang se-spesifik mungkin berdasarkan
apa yang diinput user. Misalnya pada gambar di bawah yang memberikan spesifikasi
tentang apa yang sedang dilakukan sistem.

Berikut ini adalah beberapa bentuk feedback yang biasa diberikan oleh sistem :
1. Cursor (untuk transaksi singkat)

2. Dialog persentase yang telah selesai (estimasi waktu)

3. Random (untuk waktu yang tidak diketahui )

2.3 Kriteria Desain yang Baik

Dalam mendesain User Interface dibutuhkan kriteria tertentu. Kriteria tersebut
haruslah menghasilkan suatu interractive systeam yang baik. Untuk membangun
interactive system yang baik dibutuhkan hal-hal, sebagai berikut :
a. Menggabungkan pengetahuan tentang kemungkinan teknis dan psikologis, yakni
aspek psikologis.
b. Berorientasi pada hukum dan peraturan-peraturan, standar, aturan, pedoman style, dan
development tools (APIs UI builders).
c. Memiliki standard, yaitu DIN EN ISO 9241 parts 10-17 (since 1990), DIN EN ISO
13407 (1999), dan DIN EN ISO 14915 (2002) (multimedia)
Berdasarkan ISO 9241 part 110 tentang Dialogue Principle, menjelaskan
kriteria apa saja yang harus dipenuhi oleh sebuah dialog pada interface :
a. Sesuai dengan tugas yang dijalankan
Sebuah dialog dikatakan sesuai dengan tugas yang dijalanka, apabila dialog tersebut
mendukung user secara efektif dan efisien dalam menuntaskan tugasnya. Dialog
6

menampilkan kepada user hanya konsep-konsep yang berkaitan dengan tugas yang
dijalankan.
b. Self descriptiveness
Sebuah dialog dikatakan self-descriptiveness, apabila setiap dialog secara langsung
komprehensif memberikan feedback dari sistem atau menjelaskan kepada user apa
yang dimintanya dengan informasi yang relevan.

Non self-descriptiveness
Gambar disamping memberikan informasi yang ambigu.
Dimana kita dapat memasang mouse ?
Dimana kita dapat memasang keyboard?
Icon dibawahnya tidak memberikan informasi yang jelas,
Sekali pun memiliki warna yang berbeda

Self-descriptiveness
Gambar disamping adalah bentuk yang

serupa dengan gambar diatas, namun icon

mouse dan keyboard lebih jelas letaknya.
Sehingga user mudah memahami akan
memasang dimana sesuai kebutuhan.

c. Controllability
Sebuah dialog dikatakan controllability, apabila user dapat memelihara arah
dan kecepatan seluruh rangkaian interaksi sampai bertemu pada poin tujuan. Seperti,
kemampuan untuk membatalkan atau melanjutkan suatu dialog, dapat membatalkan
aksi (undo), dan menggunakan bahasa yang diketahui user.

d. Kesesuaian dengan apa yang diharapkan user

Sebuah dialog mendukung kesesuain dengan apa yang diharapkan user jika ia
sesuai dengan pengetahuan tugas user, edukasi, pengalaman, dan persetujuan.
Kesesuaian ini berdasarkan prinsip concistency. Apa yang diharapka user pada suatu
interface adalah sesuai dengan pengalamannya di masa lampau dengan bentuk
interface yang sama, sehingga perintah yang diberikan diharapkan sama.

Misalnya pada menu bar dan toolbar Microsoft word yang selalu berbentuk
seperti diatas. Sederetan menu bar yang disertai toolbar yang dibutuhkan dibawahnya.
Selain itu, jalan pintas pada Ms. Word selalu sama pada versi berapa pun, yakni ctrl+S
untuk menyimpan file, ctrl+c untuk memperbanyak, dan masih banyak lagi.

Contoh in-consistency external. Misalkan, apabila seseorang yang terbiasa

menggunakan ponsel sebagai kalkulator tentu akan kesulitan menggunakan kalkulator
biasa karena perbedaan letak angka pada kedua benda tersebut.

e.

Error tolerance
Eror tolerance apabila meskipun terjadi error pada saat menginput, kesalahan
masih dapat diperbaiki atau minimal terkoreksi secara otomatis.
Contohnya pada saat user salah menekan tombol close sebelum menyimpan
data pada Microsoft word, maka akan muncul kotak dialog yang akan menanyakan
kepastian untuk keluar atau menyimpan data terlebih dahulu. Contoh lain adalah pada
saat menghapus suatu file pada hardisk akan muncul kotak dialog terlebih dahulu.
8

Selain itu ada pula pencegahan error seperti pada USB yang akan dipasangkan
pada USB connector. Agar USB dapat terpasang dengan sesuai maka diberikan icon
sebagai penanda bahwa bagian tersebut adalah bagian atas USB.

f. Kesesuaian untuk individu

Kesesuaian untuk individu jika sistem dialog dibangun dengan memberikan
izin kepada user untuk memodifikasi seusuai kebutuhan individu user.

Contoh personalization pada Control Panel windows. Memberikan kebebasan user

untuk memodifikasi tampilan komputernya.

g. Kesesuaian untuk belajar

Dialog mendukung kesesuaian untuk belajar apabila dapat memandu user untuk
belajar.

Contohnya menu Help pada Internet Download Manager yang akan

memberikan beberapa tutorial maupun pengetahuan tentang Internet Download

Manager.

2.4 Interface Hall of Shame

Interface Hall of Shame adalah suatu keadaan yang tidak relevan atau menyimpang
dari suatu software interface. Interface Hall of Shame menggambarkan sebuah
kesalahan desain antarmuka sehingga dapat memberikan ketidaknyamanan dan
kebingungan terhadap user.

a. Contempt & Loathing

Suatu keadaan yang aneh dan menjengkelkan ketika user merasa diperintah atau
tersinggung atas dialog yang terdapat pada user interface.

Dialog diatas terdapat kata idiot yang akan menyinggun user karena marupakan
kata yang mengandung unsur penghinaan.
10

Adanya tanda seru yang mengileh kuti setiap kata justru akan dianggap oleh user
seperti suatu perintah yang diteriakkan.

Penggunaan huruf kapital biasanya untuk mengungkapkan kemarahan atau kekesalan.

Maka dari itu, tidak diharapkan untuk mendesain user interface dengan bentuk
kalimat yang menggunakan huruf kapital, selain karena kurang sopan, huruf kapital
juga sedikit mengganggu penglihatan.

b. Showing Confusion
Sebuah user interface haruslah mudah untuk dipahami dan tidak membuat user
bingung. Adanya kalimat yang ambigu akan membuat user tidak mengetahui apa yang
sebenarnya harus dilakukan.

Contoh diatas menampilkan suatu kondisi dimana user akan menghapus sebuah file.
Namun, sebuah kotak dialog muncul dengan kalimat yang mengatakan disk tidak
cukup dan menganjurkan untuk menghapus sebagian file terlebih dahulu. Padahal user
pada awalnya ingin menghapus sebuah file.

11

Kesalahan yang terjadi adalah pada bentuk kalimat yang ditampilkan. Kondisi diatas
menggambarkan bahwa sistem tidak dapat membuka suatu site, namun kalimat
lainnya mengatakan operasi telah sukses. Apakah kegagalan membuka suatu site
dapat dikatakan operasi telah sukses?

Hampir mirip dengan keadaan sebelumnya. Apakah kegagalan dalam menyalin file
dapat dikatakan operasi yang dilakukan berhasil? Jawabannya tentu tidak. Maka dari
itu, bentuk dialog yang seperti ini akan menimbulkan kebingungan untuk user.

Pada user interface diatas adalah untuk memilih warna backround dan text, namun hal
yang membingungkan adalah warna yang dipilih menggunakana kode bukanlah
pilihan menggunakan palet yang lebih mudah. Haruskah kode setiap warna diketahui
atau dihapal ?
c. Useless Output
Useless output berarti user interface memberikan keluaran yang tidak berguna dan
tidak memberikan pengetahuan apa pun.

Contoh diatas adalah bentuk useless output dimana informasi yang diberikan tidak
memiliki kegunanaan. Ikon telepon diatas dikatakan tidak untuk melakukan apa pun.
12

Pada Visual Basic Message 1 diatas, tidak diberikan kejelasan mengenai apa yang
sedang terjadi. Operasi apa yang tengah dilakukan oleh sistem tidak diterangkan pada
kotak dialog tersebut. Bahkan tidak muncul kalimat apa pun.

Visual Basic Messages 2 diatas menjelaskan error sistem terdapat dimana, namun
tidak memberikan spesifikasi error seperti apa yang sedang terjadi sehingga user tidak
tahu apa yang harus dilakukannya.

d. Use The Correct UI Control

Pada kotak dialog font di MS. Word 2003 menampilkan beberapa pilihan efek huruf.
Namun, pada bagian effects tidak jelas apakah pilihan tesebut merupakan checkboxes
atau option boxes karena semuanya dapat dicentang. Apa yang terjadi apabila
superscript dan subscript dicentang keduanya? Karena keduanya merupakan dua
bentuk efek yang bertolak belakang.

13

Tab dialog setting pada MS Web Studio dimana tampilannya tidak konsisten di
bagian tab (bagian kiri terpotong dan jika digeser maka bagian kanan terpotong).
Selain itu posisi panah yang terlalu berdekatan dengan ukuran masing-masing yang
terlalu kecil dapat mengganggu kenyamanan user.

e.

Inane Dialog Boxes

Inane dialog boxes adalah kotak dialog yang ambigu dan tidak jelas fungsinya.
Berikut beberapa contoh gambar inane dialog boxes:

14

BAB III
PENUTUP
3.1Kesimpulan
Mendesain suatu user interface yang baik dan mudah dipahami oleh user harus
memnuhi beberapa prinsip desain, yaitu :
a. Dialog yang sederhan dan natural
b. Menggunakan bahasa user
c. Memperingan beban memori user
d. Konsisten
e. Membuktikan feedback
Interface Hall of Shame adalah suatu keadaan yang menyimpang dari desain
interface yang merupakan kesalahan dan akan membiingungkan user. Seorang
desainer haruslah berpikir bagaimana agar dapat menghasilkan desain interface yang
mudah dipahami user. Selain itu, agar user interface yang dibuat tidak termasuk dalam
kategori Interface Hall of Shame.

15