B. PENDAHULUAN
Desain User Interface atau yang biasa disebut dengan Desain Antarmuka Pengguna adalah
desain yang digunakan untuk komputer, mesin, perangkat komunikasi, aplikasi perangkat lunak,
sistem operasi dan situs web yang berfokus pada User Experience dan interaksi. Desain User
Interface yang baik akan mempermudah interaksi antara manusia dengan mesin. Sebuah sistem
antarmuka pengguna memiliki peranti masukkan (seperti keyboard, mouse, dan media input
lainnya), peranti keluaran (seperti monitor, printer), masukan dari pengguna seperti garis,
gerakan mouse dan ketikan keyboard) dan hasil yang dikeluarkan oleh komputer (seperti grafik,
User Interface merupakan bagian dari program dimana di dalamnya terjadi interaksi antara
manusia dan komputer. Seorang developer yang membuat program harus memikirkan bagian
user interface agar program yang dibuatnya dapat berfungsi dengan baik, sehingga pengguna
akan merasa ketika berinteraksi dengan komputer menggunakan tampilan antarmuka (interaksi)
D. PRINSIP PERANCANGAN
Tampilan visual merupakan hal yang penting dalam interaksi manusia dan komputer. karena
keberadaan komputer adalah untuk membantu pekerjaan manusia. sehingga komputer dalam
tampilan visual dimonitornya tersebut harus memenuhi beberapa klasifikasi, agar mudah
mengerti manusia. kalau bahasa aslinya komputasi itu bilangan biner, maka bingung juga tuh
kalau bit-bit yang ada tidak interpretasikan kedalam visualnya manusia. salah satu tujuannya
simple saja, yaitu karena ingin informasi yang disampaikan lewat komputer itu mudah dipahami.
dan kalau kita bicara tampilan maka bisa berarti tampilan software yang kita buat, atau tampilan
Prinsip Umum Perancangan User Interface oleh Deborah J. Mayhew, dengan General Principles
Of UI Design, ada 17 prisip yang harus dipahami para perancang sistem, terutama untuk
mendapatkan hasil maksimal dari tampilan yang dibuat. anda tidak perlu bingung dengan apa
yang dimaksud tampilan, karena salah satunya adalah tampilan web ini.
berbeda user bisa jadi kebutuhan tampilannya berbeda. misalnya, jika aplikasi diperuntukkan
bagi anak-anak, maka jangan menggunakan istilah atau tampilan orang dewasa.
2. Product Compatibility, istilah ini mengartikan bahwa produk aplikasi yang dihasilkan juga
harus sesuai. memiliki tampilan yang sama/serupa. baik untuk user yang awam maupun yang
ahli.
3. Task Compatibility, berarti fungsional dari task/tugas yang ada harus sesuai dengan tampilannya.
misal untuk pilihan report, orang akan langsung mengartikan akan ditampilkan laporan. sehingga
tampilan yang ada bukanlah tipe data (dari sisi pemrogram). coba kalau pilihanya database,
grafik, evaluasi (dimana ketiga hal itu sebenarnya adalah laporan), ribet !bisa kebayang kalau
tampilan yang ada hanya untuk satu pekerjaan saja. misal untuk kirim mail, kita harus membuka
4. Work Flow Compatibility. adalah user interface yang mempermudah alur kerja kita. dengan
satu tampilan dan memiliki fungsi Ui yang banyak / lebih dari satu fungsi.
5. Consistency. contohnya, jika anda menggunakan istilah save yang berarti simpan, maka gunakan
terus istilah itu. kalau yang tidak konsisten, kadang menggunakan save, kadang simpan, atau
apalah.
6. Familiarity, contohnya dengan icon. anda pasti akan lebih familiar jika mengartikan icon
disket sebagai perintah untuk menyimpan. maka jangan ganti dengan gambar kuda, mana ada
sintax yang repot hanya untuk mempertebal huruf, cukup dengan ctrl+B.
9. Control, berikan kontrol penuh pada user, tentunya dengan sebaik mungkin dan jangan sampai
merusak sistem. tipikal user biasanya tidak mau terlalu banyak aturan.
10. WYSIWYG, What You See Is What You Get, buatlah tampilan mirip seperti kehidupan nyata
user. dan pastikan fungsionalitas yang ada berjalan sesuai tujuan. user ingin tempe jangan
11. Flexibility, UI tidak hanya menggunakan Keyboard saja atau mouse saja,tapi dapat juga dengan
touch screen.
12. Responsiveness, tampilan yang dibuat harus ada responnya. misal, yang sering kita lihat ketika
13. Invisible Technology. sebagai programmer handal kita tidak boleh sombong (dan harus tetap
rajin nabung). user tidak penting mengetahui algoritma apa yang kita gunakan, max sort, bubble
sort, quick sort, atau apa sort, walaupun itu bagian dari keahlian. yang user tahu cukup fungsinya
14. Robustness itu artinya handal, bisa mengakomodir kesalahan user. jangan malah error, apalagi
sampai crash.
15. Protection adalah melindungi user dari kesalahan yang umum dilakukan. misalnya dengan
16. Ease of Learning. tanpa harus ada pelatihan, tanpa harus baca tutorial, tanpa harus sekolah
tinggi-tinggi, user sudah bisa menggunakan tampilan aplikasi buatan anda. mudah dipelajari.
17. Ease of use. harus mudah digunakan. seperti halnya menggunakan fungsionalitas yang ada di
keseharian kita. misal tombol yang ada, harus mudah dong nekennya, nggak usah pake tenaga
ekstra.
Proses yang secara rinci menggambarkan bagaimana perancangan dan pengembangan antarmuka
terlihat pada gambar di atas. Empat tahap utama dalam proses tersebut adalah:
antarmuka, kita harus mengetahui masalah apa yang ingin pengguna selesaikan dan bagaimana
· Menganalisa user environments.
2. Merancang Antarmuka.
Dalam merancang antarmuka ada beberapa tahapan yang harus dilalui, yaitu:
Hal pertama yang bisa dilakukan dalam membangun antarmuka adalah membangun prototype.
Membangun prototypeadalah cara yang berharga dalam membuat rancangan awal dan membuat
desain alternatif dan konsep, bukan untuk membangun kode yang akan digunakan sebagai bagian
dari produk.
Evaluasi kegunaan adalah bagian penting dari proses pengembangan, untuk mengetahui
bagaimana tanggapan pengguna terhadap antarmuka yang telah dibuat. Evaluasi ini akan
digunakan untuk memperbaiki kekurangan pada antarmuka yang telah dibangun. Aturan emas
yang digunakan untuk merancang dan mengembangakan produk. IBM Common User Access
(CUA) interface design guide adalah yang pertama kali mendeskripsikan proses perancangan
User Interface adalah mekanisme user melakukan interaksi dengan sistem atau aplikasi, sehingga
pengguna dan aplikasi dapat saling berkomunikasi. Ada lima macam antarmuka yang dapat
digunakan untuk menjembatani interaksi antara pengguna dengan aplikasi multimedia interaktif,
yaitu direct manipulation, menu selection, form Fill in, command language dan natural language
1. Direct Manipulation
Direct Manipulation (Pengoperasian secara langsung) yaitu interaksi langsung dengan objek
pada layar misalnya drag and drop. Kelebihan interaksi ini adalah waktu pembelajaran pengguna
sangat singkat, umpan balik (feedback) langsung diberikan pada tiap aksi sehingga kesalahan
terdeteksi dan diperbaiki dengan cepat. Kekurangannya adalah antarmuka tipe ini rumit dan
memerlukan banyak fasilitas pada sistem komputer, cocok untuk penggambaran secara visual
Menu Selection atau pilihan berbentuk menu adalah tipe bentuk antarmuka yang menyediakan
daftar pilihan perintah. Pengguna tidak perlu lagi mengingat script command, pengetikan
3. Form Fill In
Form Fill In adalah salah satu bentuk antarmuka yang memberikan kesempatan pengguna dalam
mengisi form dengan sederhana dan mudah dipelajari. Kekurangan yaitu memerlukan banyak
tempat dilayar jika pilihan pengisiannya banyak dan harus menyesuaikan dengan form manual
Coomand Language adalah tipe antarmuka yang mengharuskan pengguna untuk menuliskan
perintah yang sudah ditentukan pada program. Kelebihannya perintah diketikan langsung pada
sistem, dapat dengan mudah diterapkan pada terminal, kombinasi perintah dapat dilakukan.
Misal copy file dan rename nama file. Kekurangannya perintah harus dipelajari dan diingat cara
penggunaannya, tidak ccok untuk pengguna biasa, sering terjadi kesalahan menggunakan
Natural Language bentuk antarmuka dengan menggunakan bahasa alami untuk berinteraksi.
Seperti pada saat kita melakukan pencarian dimesin pencari di internet. Kelebihannya perintah
dalam bentuk bahasa alami, dengan kosa kata yang terbatas (singkat) misalnya kata kunci yang