Desain dalam Interaksi Manusia dan Komputer



Filosofi Desain
Desain grafis dalam pandangan Ilmu Komunikasi adalah metode menyampaikan pesan visual berwujud teks dan gambar dari komunikator kepada komunikan. Dalam mendesain surat kabar misalnya, desainer grafis memerlukan pengetahuan tentang kebisaaan sang pembaca media agar dengan mudah mendesain tata letak dan visual yang cocok. Ini dengan motif agar pesan yang hendak disampaikan oleh media tersebut diterima dan sampai pada pembaca.

Prinsip Desain Grafik
Desain grafis juga memiliki prinsip seperti halnya manusia, seseorang dikenal karena prinsipnya, prinsip utama harus ditampilkan dalam sebuah desain grafis sehingga karya tersebut komunikatif, sedangkan unsur yang lainnya ditampilkan sekedar dan tidak mengalahkan unsur utama. Semuanya itu tergantung selera desainer grafis, klien dan khalayak yang menjadi sasaran pesan.
11. Metaphor (Metafora)
Metaphor atau metafora merupakan sebuah aplikasi dari nama atau deskripsi istilah objek lain yang tidak dapat diartikan secara harafiah.aplikasi ini menghubungkan antara presentasi dan elemen-elemen visual dengan item-item yang berkaitan. Contoh dari Metaphor adalah website toko online yang dimana pengunjung dibawa ke tempat seolah-olah mereka benar ada di toko online tersebut.
Contoh untuk website http://www.worldwidestore.com. Banyak sekali Methaphor yang terdapat di website tersebut. Secara garis besar, desain pada website tersebut membuat pengunjung merasa seperti sedang berbelanja di toko sebenarnya.
2. Clarity (Kejelasan)
Setiap membuat desain kita harus ada alasan yang kuat atau masuk akal dan jelas mengapa menggunakan setiap elemen yang berada dalam suatu interface yang kita buat, contoh peletakan suatu button, pembuat harus memiliki alasan mengapa diletakkan di tempat tersebut. Penggunaan elemen yang lebih sedikit akan lebih baik. Penggunaan background berwarna putih dianjurkan untuk memimpin mata dan membuat mata tidak lelah dengan aktifitas elemen yang ada pada suatu website.
Contoh untuk website http://www.schwab.com, dapat ditemukan prinsip Clarity (Kejelasan), website tersebut telah memenuhi salah satu syarat dalam prinsip Clarity yaitu penggunaan background yang berwarna putih.
3. Consistency (Ketetapan)
Dalam membuat desain haruslah memliki konsistensi dalam tampilan, pewarnaan, gambar, ikon, typography (model form yang digunakan pada suatu website), teks, dll. Harus ada konsistensi baik dalam layar maupun antar layar. Dan harus selalu ada metafora dimanapun juga. Setiap platform mungkin memiliki panduannya.
Contoh untuk website http://www.santafean.com memiliki prinsip konsistensi yang baik, baik dalam layar maupun antar layar. Desainnya cukup memukau dan menarik untuk dilihat.
4. Alignment (Perataan)
Untuk perataan desai dapat digunakan rata kiri, kanan atau tengah. Pada umumnya suatu teks pada website dimulai dari kiri atas (left alignment), dimana left alignment akan mengijinkan mata untuk menguraikan tampilan dengan lebih mudah. Selain itu dengan menggunakan bantuan garis akan membantu dalam hal perataan. Sembunyikan garis horizontal dan vertical untuk membantu mengalokasikan komponen window/jendela. Garis juga membantu menghubungkan hal-hal yang berhubungan dan memudahkan perataannya.
5. Proximity
Item-item yang berkaitan ditampilkan bersama pasti memiliki hubungan karena jarak yang jauh mengimplikasikan bahwa tidak ada hubungan antara item-item tersebut.
6. Contrast (Keserasian Tampilan)
Keserasian tampilan akan membuat pengunjung web tertarik pada web tsb. Kontras juga dapat memandu mata pengunjung untuk melihat keseluruhan interface. Keuntungan dari keserasian adalah untuk memperkuat fokus atau untuk memperkuat suatu interface. Kontras digunakan untuk membedakan aktifitas kendali. Juga dapat digunakan untuk men-set item yang paling utama. Item yang paling utama diberi highlight. Dengan mempergunakan geometri dapat membantu pengurutan. Kontras juga mendukung skimming secara cepat.

Pembuatan User Interface
Merupakan mekanisme komunikasi antara pengguna (user) dengan sistem. Digunakan untuk mempermudah user dalam mengkomunikasikan bentuk disain kedalam sebuah gambar, tulisan dsb.

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
Merupakan suatu ilmu dalam memilih dan menata huruf dengan pengaturan penyebarannya pada ruang-ruang yang tersedia, menggunakan gabungan bentuk huruf cetak, ukuran huruf, ketebalan garis, spasi antar huruf, garis pandu dan jarak antar baris. Sehingga dapat menolong pembaca untuk mendapatkan kenyamanan membaca semaksimal mungkin.
·         Karakter dan simbol dalam penggunaannya mudah dilihat dan dibedakan.
·         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
Adalah kumpulan lengkap dari karakter / huruf dalam satu bentuk desain, ukuran (size), dan gaya (style).
·         Menggunakan 1-2 huruf (maksimum 3 huruf).
·         Menggunakan jenis huruf normal,italic,bold.
·         Jangan sering menggunakan bold, italic, dan huruf besar untuk sebagian besar teks/naskah,memperlambat proses baca.
·         Ukuran huruf maksimum 1-3 jenis ukuran.
·         Perhatikan warna dari background teks


Warna
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).

2.      Putih
Sebagai warna yang paling terang, melambangkan cahaya, kesucian.

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.

8.      Pink
Warna yang identik dengan wanita, menarik/cantik, gulali.

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 :
·         Hue
Adalah istilah yang digunakan untuk menunjukkan nama dari suatu warna, seperti merah, biru, hijau dsb.

·         Value
Adalah dimensi kedua atau mengenai terang gelapnya warna. Contohnya adalah tingkatan warna dari putih hingga hitam.

·         Saturation/Intensity
Seringkali disebut dengan chroma, adalah dimensi yang berhubungan dengan cerah atau suramnya warna.

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:

Penuntun Penggunaan Warna
·         Tampilkan warna dengan latar belakang (background) gelap.
·         Pilih warna yang cerah untuk foreground (putih,hijau  dll).
·         Hindari penggunaan warna coklat dan hijau untuk background.
·         Kecerahan dan kombinasi warna pada foreground dan background kontras.
·         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.

Hal-hal yang perlu dipertimbangkan dalam penggunaan warna, yaitu:
·         Buta warna (cacat warna).
·         Monitor monochrome (hanya mengenal satu warna).
·         Pengkodean ekstra meningkatkan tampilan interface.

Desain Icon
Adalah proses merancang grafik simbol yang mewakili beberapa fantasi atau motif abstrak yang nyata, entitas atau tindakan.
·         Menampilkan objek atau aksi dalam tata cara yang mudah dikenali dan di ingat.
·         Keragaman icon berjumlah terbatas.
·         Icon dimunculkan pada latar belakang.
·         Pastikan bahwa pada salah satu icon yang dipilih terlihat lebih terang dari yang lain.
·         Tiap icon menggunakan simbol yang berbeda satu dengan yang lain.
·         Membuat icon yang sejenis ke dalam kelompok icon yang berkaitan.
·         Menghindari penggunaan icon terlalu terinci.

Comments