Pengantar
Mendisain sebuah user interface, didalam membangun sistem adalah sangat penting
Pengalaman terhadap user interface akan mempengaruhi tingkah laku user terhadap
sistem
Bagaimana memdisain yang efektif user interface memiliki cabang ilmu sendiri yaitu
Human Computer Interaction (HCI) atau dalam bahasa indonesianya adalah Interaksi
Manusia Komputer(IMK)
Ilmu IMK memadukan physicology dan ergomonic dalam mendisain interaksi manusia
komputer
Frekuensi penggunaan
Pendekatan terstruktur
Pendekatan Ethnographic
Pendekatan Scenario-Based
Evaluasi interface
Food Co, ingin membuat sebuah sistem tele-sales yang dapat menangani
order dari tempat jauh melalui telepon
Jawaban:
Tugas utama yang Tugas rutin, solusi tertutup, opsi Tugas tidak rutin, solusi
dilakukan user terbatas terbuka, opsi tidak terbatas
Tipe dari user Petugas yang ditugaskan, tidak ada Bisa siapa saja, seseorang yang
pilihan harus menggunakan sistem ini membutuhkan sistem itu
untuk menyelesaikannya
Jumlah training Training dilakukan dalam bagian Tidak perlu ada training
yang diperlukan pekerjaan
Setiap tahap dipecah lagi menjadi tahap yang lebih spesifik lagi, dan tahap yang
spesifik lagi dipecah lagi menjadi tugas-tugas
Desain User Alokasi elemen dari tugas sistem, menetapkan bagaimana komunikasi user
Interface dengan sistem
Dilakukan dengan berbagai disiplin ilmu antara lain dengan metode riset, untuk
mendapatkan obyektifitas yang diinginkan
Pendekatan Scenario-Based
Pendekatan menggunakan narasi skenario yang dilakukan dilakukan oleh user dalam
menjalankan program tersebut
Contoh Scenario
User memilih Add dari menu
Sebuah daftar even kampanye muncul di list box selanjutnya.user memilih salah satu
kampanye
Daftar iklan muncul di list box selanjutnya, user kemudian memilih salah satu iklan
Kemudian user memasukkan tanggal dan waktu event tersebut akan dilaksanakan
Ketika komputer pertama kali diperkenalkan secara komersial pada tahun 50-an, mesin ini
sangat sulit dipakai dan sangat tidak praktis. Hal demikian karena waktu itu komputer
merupakan mesin yang sangat mahal dan besar, hanya dipakai dikalangan tertentu, misalnya para
ilmuwan atau ahli-ahli teknik.
Setelah komputer pribadi (PC) diperkenalkan pada tahun 70-an, maka berkembanglah
penggunaan teknologi ini secara cepat dan mengagumkan ke berbagai penjuru kehidupan
(pendidikan, perdagangan, pertahanan, perusahaan, dan sebagainya).
Sistem rancangan dituntut harus bisa memenuhi kebutuhan pemakai, sistem harus mempunyai
kecocokkan dengan kebutuhan pemakai atau suatu sistem yang dirancang harus berorientasi
kepada pemakai. Pada awal tahun 70-an ini, juga mulai muncul isu teknik antarmuka
pemakai(user interface) yang diketahui sebagai Man-Machine Interaction (MMI) atau Interaksi
Manusia-Mesin.
Para peneliti akademis mengatakan suatu rancangan sistem yang berorientasi kepada pemakai,
yang memperhatikan kapabilitas dan kelemahan pemakai ataupun sistem (komputer) akan
memberi kontribusi kepada interaksi manusia komputer yang lebih baik.
DESAIN
Desain biasa diterjemahkan sebagai seni terapan, arsitektur, dan berbagai pencapaian kreatif
lainnya. Proses desain pada umumnya memperhitungkan aspek fungsi, estetik dan berbagai
macam aspek lainnya, yang biasanya datanya didapatkan dari riset, pemikiran, brainstorming,
maupun dari desain yang sudah ada sebelumnya. Dalam IMK merupakan fase perancangan yang
kreatif. Pada fase ini tujuan perancangan harus terlihat.
Tujuan perancangan adalah untuk lebih mendalami pemahaman terhadap sekumpulan nilai,
sekelompok orang, atau domain. Selain itu adalah memberikan teknik yang dapat dihandalkan
untuk perancangan secara berulang dari sistem interaktif yang sukses dan berdaya guna. Tujuan
utama disusunnya berbagai cara interaksi manusia & komputer : untuk mempermudah manusia
dalam mengoperasikan komputer dan mendapatkan berbagai umpan balik yang ia perlukan
selama ia bekerja pada sebuah sistem komputer.
Faktor penting dalam membuat disain sistem interaksi yang baik adalah penggunaan notasi yang
tepat untuk merekam dan mendiskusikan kemungkinan-kemungkinan.
Teknik yang lazim digunakan antara lain:
• Spesifikasi dalam bahasa alami: cenderung bertele-tele, samar-samar, dan membingungkan.
• Bahasa formal dan semiformal: efektif untuk bahasa perintah.
• Menu-tree structures: menunjukkan tata letak menu. Tidak menunjukkan seluruh aksi yang
mungkin.
1. Analisa
2. Desain
3. Evaluasi (iterate kembali ke Desain)
4. Implementation Pelaksanaan
5. Penyebaran
Contoh .
Penerapan Teori UCD Pada Pembuatan Aplikasi Apotik “Purworedjo”
Langkah-langkah yang dilakukan mengacu pada konsep UCD
1. Usefullness
2. Learnability
3. Effectiveness
4. attitude
Usefullness
1. produk memungkinkan user untuk mencapai tujuannya, dan tugas yang didesain sesuai
dengan kebutuhan user.
Learnability
1. dapat dipelajari dengan mudah sehingga pencari informasi tidak perlu dilatih terlebih
dahulu menggunakannya, bagian sirkulasi dapat menggunakannya dengan baik dengan
latihan maksimal 2 kali
2. cara mengukur dengan observasi langsung bagi pencari informasi, dan uji coba bagi
petugas Apotik
Effectiveness
1. Sistem informasi dapat memberi layanan pemrosesan data secara akurat baik bagi pencari
informasi, bagian pelayanan Online maupun administrator.
2. cara mengukur, misal dengan pengolahan basisdata yang bebas error
Attitude
Informasi dalam memory jangka panjang sematik diturunkan dari memory jangka
panjang episodic. Struktur memory semantik, yaitu menyediakan akses ke informasi,
merepresentasikan hubungan diantara bit– bit (bagian kecil) informasi, mendukung inferensia.
1. Penyimpanan informasi
≥ Struktur, arti dan familitas membuat informasi lebih mudah untuk diingat
2. Proses melupakan
© Decay (penghilangan) : informasi hilang secara bertahap tetapi sangat lambat
terjadinya
© Yang lama mungkin tercampur denagn yang baru : pencegahan proaktif (proactive
inhibition), maak mungkin akan lupa sama sekali
© Memory dipilih dan dipengaruhi oleh emosi, dapat dipilih mana untuk yang
dilupakan Informasi retrieval (temu kembali informasi)
© Recall (pengingat kembali) : informasi diproduksi dari memory. Dapat dibantu dengan
bantuan petunjuk, seperti misalnya kategori dan juga perumpanpamaan / perbandingan
4. Proses Kognitif
Ketika seseorang memproses suatu informasi, ada tiga unsur utama dalam sistem memori
yang terlibat, yaitu memori penginderaan (sensory memory), memori bekerja (working memory)
dan memori jangka panjang (long term memory). Secara umum, memori penginderaan dan
memori bekerja mempunyai keterbatasan dalam menyimpan (menahan) informasi, baik jumlah
maupun durasinya. Memori
penginderaan berfungsi untuk mempersepsikan informasi yang diterima oleh alat indera,
yang kemudian akan dipilih dan diberi makna oleh memori bekerja. Memori pekerja berfungsi
untuk mengorganisasikan informasi tersebut, membentuk (mengkonstruksi) pengetahuan dan
menyimpannya ke memori jangka panjang. Memori jangka panjang mempunyai ketakterbatasan
dalam menyimpan informasi.
Informasi di dalam memori jangka panjang berperan penting dalam proses-proses kognitif
selanjutnya.Proses kognitif dalam sistem memori ini menentukan
bagaimana pengetahuan dibangun dan disimpan dengan baik oleh seseorang. Oleh karenanya,
prinsip kerja (fungsi) dari setiap unsur di sistem memori berkonsekuensi dalam penyajian materi
pembelajaran.
1. Prinsip Design
Desain biasa diterjemahkan sebagai seni terapan, dan berbagai pencapaian kreatif lainnya.
Dalam sebuah kalimat, kata “desain” bisa digunakan baik sebagai kata benda maupun kata kerja.
Sebagai kata kerja, “desain” memiliki arti “proses untuk membuat dan menciptakan obyek
baru”. Sebagai kata benda, “desain” digunakan untuk menyebut hasil akhir dari sebuah proses
kreatif, baik itu berwujud sebuah rencana, proposal, atau berbentuk obyek nyata.
Proses desain pada umumnya memperhitungkan aspek fungsi, estetik dan berbagai macam aspek
lainnya, yang biasanya datanya didapatkan dari riset, pemikiran, brainstorming, maupun dari
desain yang sudah ada sebelumnya. Akhir-akhir ini, proses (secara umum) juga dianggap
sebagai produk dari desain, sehingga muncul istilah “perancangan proses”. Salah satu contoh
dari perancangan proses adalah perancangan proses dalam industri kimia.
Berawal dari minat sang desainer (perancang) untuk memilih, menciptakan, ilustrasi baik berupa
foto maupun tulisan.
Antara lain: Proses pembuatan. Metoda merancang. Produk yang dihasilkan (rancangan). Serta
disiplin ilmu yang digunakan (disain).
- Desain Grafik
a). Sesuatu yang seseorang lihat pertama kali, dan menimbulkan kesan serta mempengaruhi
tingkat emosi (mood)
b). Salah satu bentuk seni lukis (gambar) terapan yang memberikan kebebasan kepada sang
desainer (perancang) untuk memilih, menciptakan, atau mengatur elemen rupa seperti ilustrasi,
foto, tulisan, dan garis di atas suatu permukaan dengan tujuan untuk diproduksi dan
dikomunikasikan sebagai sebuah pesan. Gambar maupun tanda yang digunakan bisa berupa
tipografi atau media lainnya seperti gambar atau fotografi.Desain grafis umumnya diterapkan
dalam dunia periklanan, packaging, perfilman, dan lain-lain.
Desain grafis adalah suatu bentuk komunikasi visual yang menggunakan gambar untuk
menyampaikan informasi atau pesan seefektif mungkin. Dalam disain grafis, teks juga dianggap
gambar karena merupakan hasil abstraksi simbol-simbol yang bisa dibunyikan. disain grafis
diterapkan dalam disain komunikasi dan fine art. Seperti jenis disain lainnya, disain grafis dapat
merujuk kepada proses pembuatan, metoda merancang, produk yang dihasilkan (rancangan),
atau pun disiplin ilmu yang digunakan (disain). Seni disain grafis mencakup kemampuan
kognitif dan keterampilan visual, termasuk di dalamnya tipografi, ilustrasi, fotografi,
pengolahan gambar, dan tata letak.
Ø Filosofi Desain
· Tidak berlebihan
2.Kejelasan. Setiap elemen yang digunakan pada interface harus beralasan dalam penggunaannya.
Memperjelas pesan yang diberikan. Memberikan relax pada mata dalam menatap elemen-
elemen saat beraktifitas. Menawarkan kesederhanaan, enak dilihat, berkelas dan jelas
3. Konsisten
Ø Teknik Koding
· Digunakan sepintas lalu, baik untuk menarik perhatian tapi jarang digunakan
· Mengabaikan penggunaan video,baik untuk membuat sesuatu menjadi solid tapi jarang
digunakan.Mungkin menarik mata tapi dapat mengganggu setelah beberapa waktu.
Ø Tipografi (typography)
- Menghindari penggunaan upper case (huruf besar) pada tiap huruf dalam suatu pengetikan
naskah
- Berdasarkan studi di temukan bahwa penggunaan campuran huruf kecil dan besar
mempercepat proses membaca
· Mudah dibaca
· Mudah dikenali dengan adanya sekumpulan jenis huruf yang digunakan untuk mengetik suatu
naskah/teks
Ø Fonts
Ø Jangan sering menggunakan bold, italic, dan huruf besar untuk sebagian besar
teks/naskah,memperlambat proses baca
Warna dapat didefinisikan secara obyektif/fisik sebagai sifat cahaya yang dipancarkan, atau
secara subyektif/psikologis sebagai bagian dari pengalaman indera pengelihatan. Secara
obyektif atau fisik, warna dapat diberikan oleh panjang gelombang. Dilihat dari panjang
gelombang, cahaya yang tampak oleh mata merupakan salah satu bentuk pancaran energi yang
merupakan bagian yang sempit dari gelombang elektromagnetik.
Cahaya yang dapat ditangkap indera manusia mempunyai panjang gelombang 380 sampai 780
nanometer. Cahaya antara dua jarak nanometer tersebut dapat diurai melalui prisma kaca
menjadi warna-warna pelangi yang disebut spectrum atau warna cahaya, mulai berkas cahaya
warna ungu, violet, biru, hijau, kuning, jingga, hingga merah. Di luar cahaya ungu /violet
terdapat gelombang-gelombang ultraviolet, sinar X, sinar gamma, dan sinar cosmic. Di luar
cahaya merah terdapat gelombang / sinar inframerah, gelombang Hertz, gelombang Radio
pendek, dan gelombang radio panjang, yang banyak digunakan untuk pemancaran radio dan TV.
Proses terlihatnya warna adalah dikarenakan adanya cahaya yang menimpa suatu benda, dan
benda tersebut memantulkan cahaya ke mata (retina) kita hingga terlihatlah warna. Benda
berwarna merah karena sifat pigmen benda tersebut memantulkan warna merah dan menyerap
warna lainnya. Benda berwarna hitam karena sifat pigmen benda tersebut menyerap semua
warna pelangi. Sebaliknya suatu benda berwarna putih karena sifat pigmen benda tersebut
memantulkan semua warna pelangi. Sebagai bagian dari elemen tata rupa, warna memegang
peran sebagai sarana untuk lebih mempertegas dan memperkuat kesan atau tujuan dari sebuah
karya desain. Dalam perencanaan corporate identity, warna mempunyai fungsi untuk
memperkuat aspek identitas.
Lebih lanjut dikatakan oleh Henry Dreyfuss , bahwa warna digunakan dalam simbol-simbol
grafis untuk mempertegas maksud dari simbol-simbol tersebut . Sebagai contoh adalah
penggunaan warna merah pada segitiga pengaman, warna-warna yang digunakan untuk traffic
light merah untuk berhenti, kuning untuk bersiap-siap dan hijau untuk jalan. Dari contoh tersebut
ternyata pengaruh warna mampu memberikan impresi yang cepat dan kuat. Kemampuan warna
menciptakan impresi, mampu menimbulkan efek-efek tertentu. Secara psikologis diuraikan oleh
J. Linschoten dan Drs. Mansyur tentang warna sbb: Warna-warna itu bukanlah suatu gejala yang
hanya dapat diamati saja, warna itu mempengaruhi kelakuan, memegang peranan penting dalam
penilaian estetis dan turut menentukan suka tidaknya kita akan bermacam-macam benda. Dari
pemahaman diatas dapat dijelaskan bahwa warna, selain hanya dapat dilihat dengan mata
ternyata mampu mempengaruhi perilaku seseorang, mempengaruhi penilaian estetis dan turut
menentukan suka tidaknya seseorang pada suatu benda.
Berikut kami sajikan potensi karakter warna yang mampu memberikan kesan pada seseorang
sbb :
1.Hitam, sebagai warna yang tertua (gelap) dengan sendirinya menjadi lambang untuk sifat
gulita dan kegelapan (juga dalam hal emosi).
3.Abu-abu, merupakan warna yang paling netral dengan tidak adanya sifat atau kehidupan
spesifik.
4.Merah, bersifat menaklukkan, ekspansif (meluas), dominan (berkuasa), aktif dan vital (hidup),
panas membara, peringatan, penyerangan, cinta.
5.Kuning, dengan sinarnya yang bersifat kurang dalam, merupakan wakil dari hal-hal atau benda
yang bersifat cahaya, momentum dan mengesankan kebahagiaan, keceriaan dan hati-hati
6.Biru, sebagai warna yang menimbulkan kesan dalamnya sesuatu (dediepte), sifat yang tak
terhingga dan transenden, disamping itu memiliki sifat tantangan.
7.Hijau, mempunyai sifat keseimbangan dan selaras, membangkitkan ketenangan dan tempat
mengumpulkan daya-daya baru, identik dengan pertumbuhan dalam lingkungan,pasukan
perdamaian,kepuasan
9.Orange, warna yang identik dengan musim gugur, penuh kehangatan, halloween.
10.Coklat, warna yang mengesankan hangat, identik dengan musim gugur, kotor, bumi
11.Ungu, warna yang identik dengan kesetiaan, kepuasan, Barney (tokoh boneka berwarna
ungu)
Dari sekian banyak warna, dapat dibagi dalam beberapa bagian yang sering dinamakan dengan
sistem warna Prang System yang ditemukan oleh Louis Prang pada 1876 atau disebut juga
sebagai atribut warna meliputi :
1.Hue, adalah istilah yang digunakan untuk menunjukkan nama dari suatu warna, seperti merah,
biru, hijau dsb.
2.Value, adalah dimensi kedua atau mengenai terang gelapnya warna. Contohnya adalah
tingkatan warna dari putih hingga hitam.
Selain Prang System terdapat beberapa sistem warna lain yakni, CMYK atau Process Color
System, Munsell Color System, Ostwald Color System, Schopenhauer/Goethe Weighted Color
System, Substractive Color System serta Additive Color/RGB Color System. Diantara bermacam
sistem warna diatas, kini yang banyak dipergunakan dalam industri media visual cetak adalah
CMYK atau Process Color System yang membagi warna dasarnya menjadi Cyan, Magenta,
Yellow dan Black. Sedangkan RGB Color System dipergunakan dalam industri media visual
elektronika. Pada monitor, skema jenis RGB adalah sbb:
· Gunakan warna sesuai kebutuhan,disain dibuat dalam b/w dan ditambahkan warna lain
sesuai kebutuhan
· Gunakan warna untuk menarik perhatian user, komunikasi terarah, identifikasi status,
menjalin hubungan antar elemen
· Hindari penggunaan warna pada pekerjaan yang sifatnya non-task, untuk layar yang
kebanyakan terdiri dari teks, warna dapat membantu ketika user harus mencari /membedakan
bagian2 tertentu
· Gunakan warna b/w atau abu-abu, atau b/w saja untuk tampilan interface
Ø Desain Icon
Merancang tugas/pekerjaan
· Menampilkan objek atau aksi dalam tata cara yang mudah dikenali dan di ingat
· Pastikan bahwa pada salah satu icon yang dipilih terlihat lebih terang dari yang lain
· Tiap icon menggunakan simbol yang berbeda satu dengan yang lain