DESAIN GRAFIS

Salah satu kriteria penting dari sebuah antar muka adalah tampilan yang menarik.

Perancang tampilan selain harus mempunyai jiwa seni yang memadai, juga harus mengerti selera pengguna secara umum

Perlu dokumentasi untuk semua pekerjaan yang dilakukan.

Dokumentasi yang baik, dapat mengubah rancangannya apabila rancangan tersebut mengalami perubahan disesuaikan dengan usulan dari pengguna atau karena alasan lain.

Dokumentasi rancangan dapat dikerjakan atau dilakukan dalam beberapa cara :

a.   Membuat sketsa pada kertas

b.  Menggunakan peranti prototipe GUI (Graphic User Interface)

c.  Menuliskan tekstual yang menjelaskan tentang kaitan antara satu jendela dengan jendela lainnya

d. Menggunakan peranti bantu yang disebut CASE (Computer-Aided Software Engineering)

Desain dibuat berdasarkan pada :

-      Tugas user

-      Kemampuan user

-      Kebutuhan user

-      Konteks (berkaitan dengan sistemnya)

Filosofi Desain

Kesukaan personal :

o   Elemen-elemen visual ekonomi

o   Less is more (kurang lebih)

o   Bersih, terorganisasi dengan baik

Prinsip Desain Grafik

§  Metaphor (kiasan)         

o   Aplikasi dari nama atau deskripsi istilah obyek lain yang tidak dapat diartikan secara harafiah (jelas/nyata)

§  Clarity (kejelasan)

o Harus ada alasan yang kuat mengapa kita menggunakan suatu  elemen dalam suatu interface.

§  Consistency (ketetapan)

o Konsisten dalam layout, warna, image, icon, typografi, teks, dll.

o   Konsisten baik dalam layar dan antar layar

o   Selalu ada metaphora dimanapun

o   Platform dapat memiliki satu gaya pengarahan

§  Aligment (Perataan)

o   Untuk perataan gunakan rata kiri. Gaya negara-negara Barat dimulai dari kiri atas

o   Mengijinkan mata untuk menguraikan tampilan dengan lebih mudah

o   Grids

~ Garis-garis vertikal dan horizontal (tersembunyi)  membantu mengalokasikan komponen-komponen jendela

~       Meratakan yang berkaitan

~       Kelompokkan item-item berdasarkan logika

~       Meminimalisasi jumlah kontrol, mengurangi kekacauan

§  Proximity (Kedekatan)

o   Item-item yang berkaitan ditampilkan bersama-sama

o   Jarak mengimplikasikan tidak ada hubungan

§  Contrast (Keserasian tampilan)

o   Membuat pengguna tertarik

o   Memandu mata pengguna melihat keseluruhan interface

o   Memperkuat fokus

o   Membedakan kontrol yang aktif

o   Mengatur item yang paling penting

Penghematan Elemen Visual

§  Gunakan elemen visual Seperlunya

§  Minimalkan border-border dan outline yang berat

§  Minimalkan ketidakrapihan

§  Minimalkan jumlah dari kendali

Teknik Koding

§  Blinking (berkelap-kelip)

o   Baik untuk menangkap atensi tetapi gunakan dengan hemat

§  Reverse Video, bold

o   Baik untuk membuat sesuatu sangat menonjol

o   Sekali lagi gunakan dengan hemat

Tipografi

§  Karater-karakter dan simbol-simbol harus mudah dinyatakan dengan jelas dan dapat dibedakan.

o   Menghindari penggunaan  huruf besar yang berlebihan.

o   Dari penelitian menemukan bahwa dengan mencampur huruf akan meningkatkan kecepatan membaca.

§  Mudah dibaca

o   Memudahkan membaca dengan teks yang banyak.

§  Mempunyai sifat yang mudah dibaca

o   Memudahkan untuk  mengenali teks 

Fonts

Ukuran huruf yang digunakan

Warna (atribut, asosiasi)

§  Atribut warna

o   Hue (corak)

-      Native color, pigment

o   Saturation (penjenuhan)

-      Kebersihan relatif, keadaan terang, atau mengintensifkan warna

o   Value (nilai)

-      Keadaan terang atau gelap dari warna

WARNA	MAKNA POSITIF	MAKNA NEGATIF
Merah	Kekuatan, energi, tenaga, hasrat , cinta. Dengan sedikit memberikan warna merah bisa menimbulkan gairah, membangkitkan semangat, mendorong keinginan.	Bahaya, perang, kekejaman, kekerasan, api, darah. Terlalu banyak warna merah bisa disangka terlalu agresif.
Merah Muda	Kewanitaan (feminim), keremajaan (masa muda).	Naif, kelemahan, kekurangan
Orange	Kehangatan, bersemangat, ceria, keseimbangan, musim gugur, menimbulkan getaran.	Meminta dan mencari perhatian
Kuning	Sinar matahari, emas, kekayaan, keberuntungan, kehidupan.	Tidak jujur, pengecut, cemburu, iri hati, penghianatan, penipuan, kebohongan, resiko, sakit
Hijau	Alam, lingkungan, hidup, pertumbuhan, stabil, santai kesuburan, harapan.	Kecemburuan, nasib buruk, iri hati, dengki.
Biru	Kepercayaan, kesetiaan, ketenangan, kedamaian, ketulusan, kesejukan, air, awan, harmoni, kebersihan, konservatif, percaya diri, penyembuhan.	Merupakan warna yang aman dipakai untuk Kesedihan, kedinginan, depresi, penurunan vitalitas.
Ungu	Kebangsawanan, perubahan, spiritual.	Kesombongan, keangkuhan, kejam, kasar, duka cita, royal, rumit
Coklat	Tanah, bumi, netral, hangat, keamanan, perlindungan.	Tumpul, kotor, membosankan.
Abu – abu	Modern, cerdas, bersih, kokoh, masa depan, intelektual.	Umur tua, kesedihan, bosan.
Putih	Kesucian, kebersihan, kemurnian, kesederhanaan, damai, kebaikan, disiplin, perawan, perkawinan, musim dingin, musim salju.	Kematian ( budaya timur ), dingin, mandul, steril, klinik, hampa.
Hitam	Kekuatan, keanggunan, kemewahan, misteri, kecanggihan, kemakmuran, kepuasan, pengalaman, keras, kokoh, sangat kuat.	Kematian ( budaya barat ), takut, setan, kesedihan, duka cita, marah, anonim, penyesalan.

§  Petunjuk pewarnaan

o   Tampilkan image-image warna pada latar belakang hitam

o   Pilih warna terang yang mudah dilihat

o   Hindari coklat dan hijau sebagai warna-warna untuk latar belakang

o   Pastikan warna-warna foreground (tampilan luar)kontras dalam keadaan terang dan hue dengan warna-warna background

o   Gunakan warna dengan hemat—Desain dalam b/w kemudian tambahkan warna yang sesuai

o   Gunakan warna untuk mengambarkan atensi, komunikasi organisasi, untuk mengindikasi status, untuk mendirikan hubungan-hubungan

o   Hindari penggunaan warna dalam cara-cara yang berkaitan dengan non tugas

Desain Icon

§  Mempresentasikan obyek atau tindakan yang mudah dikenal secara luas

§  Mewakili obyek atau tindakan dalam cara yang lazim dan dikenali

§  Batasan jumlah icon-icon yang berbeda

§  Buat icon yang menonjol dari latar belakang

§  Pastikan bahwa icon-icon yang telah diseleksi satu persatu secara jelas dapat dilihat jika dikelilingi dengan icon-icon yang tidak terseleksi.

§  Buat setiap icon berbeda

§  Buat anggota-anggota icon-icon yang harmonis dari kumpulan icon

§  Hindari perincian yang berlebihan