Tulisan ini dibuat untuk menjawab
soal berikut: Apa aturan desain untuk Logo, Website, Dekstop dan Aplikasi Mobile?
Matakuliah: Desain Pemodelan
Grafik
Dosen: Andreas Hadiyono
========================================================================
Tulisan ini dibuat untuk memenuhi tugas dari seorang
dosen, tantangan yang beliau berikan adalah untuk mencari tahu aturan apa saja
yang perlu diperhatikan dalam pembuatan desain Logo, Website, Desktop dan
Aplikasi Mobile. Berikut aturan –aturan yang telah saya dapatkan dan saya
rangkum dari berbagai referensi.
A.
Aturan
Standar Desain Logo
1.
Jangan menggunakan lebih dari 3 warna.
2.
Hilangkan semua hal yang tidak perlu
atau tidak penting dalam logo tersebut..
3.
Tulisan harus cukup mudah terbaca bahkan oleh
seorang manula, sesuaikan
ukuran font/huruf.
4.
Logo yang dibuat harus bisa dikenali
dengan mudah, biasanya menggunakan bentuk sederhana.
5.
Buat logo dengan bentuk dan layout yang
unik.
6.
Lupakan apapun yang dipikirkan oleh
orang terdekat Anda, ingat Anda membuatnya untuk siapa..
7.
Konfirmasikan bahwa logo yang anda buat terlihat menarik bagi lebih
dari hanya tiga (3) orang.
8.
Jangan menggabungkan unsur-unsur dari logo
populer dan mengklaimnya sebagai karya asli.
9.
Jangan gunakan clipart dalam kondisi apapun.
10.
Logo harus bisa dibuat menjadi warna
hitam putih tanpa menghilangkan bentuk asli logo berwarna..
11.
Pastikan bahwa logo dikenali ketika
terbalik.
12.
Pastikan bahwa logo dikenali ketika
ukurannya
diubah.
13.
Jika logo
berisi ikon atau simbol, serta teks, tempatkan masing-masing sehingga
mereka melengkapi satu sama lain.
14.
Hindari membuat desain dengan tren logo
terbaru, buat logo dengan desain yang bisa dipakai sepanjang jaman.
15.
Jangan gunakan efek khusus (termasuk: gradien,
bayangan, refleksi, dan light
bursts).
16.
Fit logo
ke dalam layout persegi
jika mungkin, hindari layout yang
kurang/tidak jelas.
17.
Hindari detail yang rumit.
18.
Pertimbangkan tempat dan cara yang berbeda dimana
dan bagaimana logo tersebut akan disajikan.
19.
Citrakan logo yang berani dan percaya
diri, yang
bisa membuat orang tidak
pernah bosan
melihatnya.
20.
Sadarilah bahwa anda tidak akan membuat
logo yang sempurna.
21.
Gunakan garis-garis tajam untuk bisnis yang tajam, garis-garis
halus untuk bisnis halus.
22.
Logo harus bisa mewakili apa yang ingin
disampaikan dan dikomunikasikan.
23.
Sebuah gambar foto tidak dibuat untuk
sebuah logo.
24.
Anda harus mengejutkan customers dengan tampilan
logo anda.
25.
Jangan menggunakan lebih dari dua jenis font/huruf.
26.
Setiap elemen logo harus selaras. Kiri,
tengah, kanan, atas, atau bawah.
27.
Logo harus terlihat padat, tanpa unsur
trailing.
28.
Cari tahu siapa saja yang akan
melihat/menikmati logo tersebut sebelum anda berpijak untuk memikirkan ide desain logo.
29.
Selalu memilih fungsi lebih dari inovasi.
30.
Jika nama merek mudah diingat, buatlah
itu sebagai sebuah logo.
31.
Logo harus dikenali ketika dilihat
dalam cermin.
32.
Bahkan perusahaan besar membutuhkan logo kecil.
33.
Semua orang harus suka logo tersebut,
tidak hanya yang perusahaan yang memakai tetapi juga yang sekedar melihatnya..
34.
Buat variasi. Semakin banyak variasi, semakin besar kemungkinan anda untuk mendapatkan yang baik
dan benar.
35.
Logo harus dipakai secara konsisten
dalam segala kegunaan yang berbeda. Warna, bentuk, atau hal semacamnya. Kondisi
atau keadaan logo terlihat sama.
36.
Logo harus mudah dideskripsikan /
dijelaskan maksudnya.
37.
Jangan gunakan slogan di dalam
logo.
38.
Buatlah ide desain
menggunakan sketsa gambar terlebih dulu menggunakan
kertas dan pensil kemudian anda bisa bernjak untuk membuatnya menjadi logo
digital memakai komputer.
39.
Menjaga desain tetap
sederhana.
40.
Jangan gunakan simbol globe dunia.
41.
Logo yang dibuat tidak boleh mengacaukan
/ mengalihkan fokus (distract).
42.
Harus jujur terhadap apa yang ingin
disampaikan dan apa yang diwakili, tidak dibuat-buat menjadi sesuatu yang bagus
tapi tak mewakili artinya / tidak sesuai.
43.
Logo harus
seimbang secara visual.
44.
Hindari warna
yang terlalu menyala, warna neon/berpendar, gelap, dan kusam.
45.
Master logo digital dibuat dalam format vektor agar proses perubahan ukuran tidak
berubah (bitmap akan blur ).
B.
Aturan
Standar Desain Website
1.
Logo
a.
Logo /judul website diposisikan dibagian
kiri atas halaman website anda.
b.
Jika klik pada logo, user harus
diarahkan pada halaman home.
2.
Navigasi
a.
Gunakan kata “Home”, bukan “front page”,
“welcome”, “nama organisasi” atau lainnya di bagian navigasi untuk menunjuk
pada halaman home.
b.
Pertahankan posisi navigasi anda tetap
konsisten meskipun telah berpindah-pindah halaman. Karena sadar atau tidak,
navigasi adalah identitas yang menyatukan setiap halaman yang berbeda pada
website anda.
c.
Menu navigasi harus berubah warna ketika
dikunjungi user. Dengan demikian user tahu dimana lokasi mereka saat ini.
d.
Gunakan navigasi breadcrumb untuk lebih
mudah menunjukan suasana konten halaman anda secara hirarki.
3.
Font/Huruf
a.
Gunakan huruf yang masuk akal (minimal
12px atau lebih besar) untuk memudahkan keterbacaan.
b.
Pastikan ukuran font didefinisikan pada
CSS dengan ‘em’ atau %, bukan px agar desain anda bisa lebih responsive apabila
dibuka pada layar dengan resolusi lebih besar/lebih kecil.
c.
Gunakan tipe huruf sans-serif jika ingin
mudah untuk dibaca pada ukuran yang lebih kecil.
d.
Sedangkan tipe huruf Serif lebih mudah
untuk dibaca pada ukuran yang lebih besar.
e.
Gunakan line hight berukuran 1.4 atau
1.5 em.
f.
Gunakan ukuran font, warna dan style
yang berbeda pada tag BlockQuote, H1, H2, dst untuk menunjukan prioritas
konten.
4.
Teks
a.
Gunakan panjang baris 45-60 karakter,
sama seperti sebuah buku novel standar.
b.
Gunakan warna abu-abu gelap pada teks
anda disamping warna hitam pada background putih.
c.
Jangan gunakan semua kata dalam huruf
capital, karena bentuk/shape bisa membantu pengenalan huruf dengan lebih mudah.
d.
Teks harus ringkas dan dapat dipindai.
e.
Pertahankan konsistensi layout, warna
dan tipografi disseluruh bagian pada website anda.
5.
Link
a.
Pastikan link anda berganti warna atau
style ketika dikunjungi.
b.
Berikan style underline pada link,
kecuali untuk kepentingan navigasi.
c.
Jangan sekalipun menggunakan kalimat
“klik disini” sebagai anchor teks dari sebuah link, namun gunakan keyword, agar
anda dapat keuntungan dari SEO.
d.
Ketika memasang link, beri penjelasan
singkat mengenai link yang anda pasang, misalnya 1-5 kalimat. Dengan demikian
user tahu lebih dulu dengan apa yang akan mereka dapatkan.
e.
Gunakan atribut title pada link anda
untuk menambah kontekstual informasi halaman anda.
f.
Jangan membuka link-link anda pada
window/tab baru, kecuali link untuk mengunduh PDF atau dokumen lain yang
sifatnya embed.
6.
Konten/Artikel
a.
Publish / posting konten baru secara
rutin, jangan “set-forget”. Sebab website adalah sebuah upaya yang
berkelanjutan.
b.
Pastikan setiap halaman anda mengandung
informasi yang berharga untuk disampaikan.
c.
Bagilah artikel anda ke dalam
bagian-bagian dan sub judul-sub judul untuk membuat konten jadi lebih nyaman
dibaca.
d.
Bagilah artikel yang panjang ke dalam
beberapa halaman.
e.
Jangan mencuri konten/plagiat. Termasuk
didalamnya adalah menggunakan sembarang gambar yang anda temukan di google,
maupun copy-paste artikel yang menurut anda menarik. Lebih baik ssediakan
konten yang lebih original.
f.
Menulislah untuk dibaca orang lain,
bukan untuk mesin pencari. Sejak pengunjung anda lebih penting daripada rangking halaman google.
g.
Menulislah dengan aturan piramida
terbalik. Artinya informasi penting dan berharga dibagian atas.
h.
Diakhir artikel anda, selalu berikan
semangat pada pembaca agar mereka mau engage dengan anda dibagian
komentar/forum.
i.
Gunakan related post untuk menghubungkan
tulisan satu dengan tulisan anda lainnya yang berkaitan.
j.
Optimasi konten gambar (dengan
mengecilkan dimensi dan ukuran file gambar) yang ditampilkan di halaman web
untuk mempercepat loading website anda.
7.
Gunakan aturan center untuk layouting
konten-konten yang tampil di layar.
8.
Gunakan lebar halaman yang sesuai dengan
audiens website anda. Mereka yang paruh baya menggunakan resolusi yang lebih
rendah, sedangkan mereka yang melek teknologi menggunakan resolusi yang lebih
tinggi. Jadi anda harus memutuskan apakah lebar halaman anda mainly responsive
untuk resolusi rendah atau tinggi.
9.
Dengarkan saran user anda dan biarkan
mereka mendikte perubahan pada website anda (user contered design).
10.
Minimalkan aktivitas klik user. Misalnya
ketika pertama mengunjungi website anda, user disuguhi dengan halaman “selamat
datang, klik disini untuk melanjutkan” yang sebenarnya tidak mendukung satupun
informasi yang berharga.
11.
Masukan identitas kontak anda dibagian
top/bottom website anda. Dengan demikian, user tidak perlu mengeluarkan effort
ekstra untuk bisa menghubungi anda.
12.
Jangan terlalu banyak memasang ads jika
hal ini bisa mengesankan informasi penting website anda Nampak seperti iklan.
13.
Jangan mengganggu konsentrasi visitor
anda dengan jendela pop up.
14.
Jangan mengalihkan perhatian pengunjung
anda dengan teks berkedip-kedip, animasi gif yang hebring, atau backsound mp3
(apalagi illegal). Kadang, ssesuatu yang simple bis ajauh lebih berkesan.
15.
Jangan mendesain ulang elemen-elemen
user interface yang sudah standar seperti cursor dan scrollbar.
16.
Gunakan button untuk bagian submit form.
Bukan teks.
17.
Bicara tentang form, jagalah agar form
anda tetap ringkas, cukup tanyakan apa yang benar-benar anda butuhkan disini.
18.
Gunakan form url yang pendek dan enak
dibaca.
19.
Ciptakan halaman 404 yang dapat membantu
orang lain menemukan konten alternative dengan lebih mudah.
20.
Fitur search harus bisa menampilkan
hasil pencarian yang mengandung frasa yang dicari.
21.
Website anda harus lebih print friendly,
yakni punya stylesheet halaman print sendiri.
22.
Lengkapi website anda dengan sitemap
standar yang halamannya memuat informasi berupa teks saja.
23.
Ciptakan penghargaan bagi mereka yang
datang lagi ke website anda, seperti ucapan selamat datang kembali misalnya.
24.
Uji website anda pada semua browser,
versi, dan system operasi yang berbeda. Website yang baik adalah website yang
responsive, yakni bisa tampil dengan baik pada semua brousser dan resolusi.
C.
Aturan
Desain Desktop
1.
Janan terlalu banyak menggunakan font
yang berbeda-beda
Gunakan
maksimal empat jenis font/huruf dalam desktop yang anda buat, walaupun begitu
yang lebih baik adalah penggunaan dua jenis font saja. Hal itu bertujuan untuk membatasi jumlah tipografi
yang berbeda.
Konsistenlah dalam penggunaan font, sebuah font yang berbeda untuk setiap judul misalnya, justru
akan membingungkan dan dapat membuat desain anda terlihat berantakan.
Jika harus menggunakan lebih dari dua
font, mungkin berikut ini bisa menjadi acuan agar desain anda tidak terlalu
berantakan. Pilih font untuk body
copy dan satu lagi untuk berita
utama. Gunakan huruf tebal,
miring, dan ukuran font tersebut
untuk keterangan, subpos, deck, dan
elemen desain lainnya. Tergantung
pada desain anda mungkin menggunakan font ketiga untuk topi awal, tarik-kutipan, atau item
yang dipilih lainnya. Anda
bisa menambahkan font keempat untuk nomor halaman atau sebagai font tubuh
sekunder untuk sidebar,
tetapi biasanya dua atau tiga sudah cukup.
2.
Gunakan rata-kiri (left-aligned) atau
teks-penuh (full-justifikasi) untuk layout
Ada
yang mengatakan teks-penuh lebih baik daripada rata-kiri, tapi itu tidak
sepenuhnya benar.
Semua itu tergantung pada
tujuan, audience, font, margin, spasi, dan elemen lainnya pada
halaman, pilihan yang paling tepat adalah keselarasan
yang bekerja untuk desain tertentu.
-Teks-Penuh (full-justifikasi)
Sering dianggap lebih formal, terlihat kurang rapih daripada teks rata-kiri karena untuk membuat teks rata kanan dan kiri (justified) kadang terlihat lebih memaksakan dengan pelebaran jarak spasi.
Mungkin lebih akrab bagi pembaca pada beberapa jenis publikasi, seperti buku dan surat kabar. Beberapa orang secara alami tertarik pada "kerapian" teks yang berbaris sempurna di sisi kiri dan kanan.
Sering dianggap lebih formal, terlihat kurang rapih daripada teks rata-kiri karena untuk membuat teks rata kanan dan kiri (justified) kadang terlihat lebih memaksakan dengan pelebaran jarak spasi.
Mungkin lebih akrab bagi pembaca pada beberapa jenis publikasi, seperti buku dan surat kabar. Beberapa orang secara alami tertarik pada "kerapian" teks yang berbaris sempurna di sisi kiri dan kanan.
-Teks rata-kiri
(left-aligned)
Sering dianggap lebih informal, dan
lebih rapih dari full-justifikasi.
Walaupun begitu tepi kanan compang-camping karena unsur ruang putih.
Umumnya jenis teks
rata-kiri lebih memudahkan dalam bekerja (yaitu membutuhkan sedikit
waktu, perhatian, dan tweaking dari desainer
untuk membuatnya terlihat bagus).
Intinya
apapun yang kita gunakan pilihlah alignment yang paling masuk akal untuk desain dan yang
secara efektif mengkomunikasikan pesan Anda
3.
Keseimbangan panjang garis dan ukuran
font.
Semakin panjang garis, semakin besar ukuran font yang digunakan, semakin pendek garis, semakin kecil
pula font.
Jika ukuran yang diinginkan dari jenis dan panjang
garis yang digunakan dalam tata
letak halaman tidak kompatibel, salah
satu dari mereka harus berubah. Biasanya
ukuran fontlah
yang akan disesuaikan
tetapi jangan takut untuk mengevaluasi kembali tata letak halaman
anda untuk mengakomodasi kolom teks yang lebih luas atau
sempit.
4.
Penggunaan huruf
capital dengan tepat
Penggunaan huruf capital dalam satu kata
penuh atau bahkan dalam satu kalimat penuh dianggap bahwa si penulis sedang
berteriak. Maka penulisan kata dengan huruf capital hanya diperbolehkan untuk
penulisan akronim, seperti NASA,
dan singkatan seperti PM atau AS dll.
5.
Gunakan Frames, box, Borders
dengan Tujuan yang
benar
-
Gunakan frame dan batas tepi untuk
menambah daya tarik pada dokumen anda dan untuk meningkatkan daya keterbacaan
iklan, brosur buku,
dan laporan tahunan anda,
namun tidak berlebihan.
-
Frame membentuk
sebuah penghalang yang harus dilewati
pembaca. Terlalu
banyak frame/kotak dapat mengalihkan perhatian pembaca sampai mereka kehilangan focus dan kebingungan ke
frame mana
mereka harus melanjutkan bacaannya. Maka dari
itu anda harus tahu tujuan dari setiap frame, kotak, atau
perbatasan yang anda gunakan.
-
Gunakan frame untuk mengelompokan informasi terkait atau grafis.
D. Aturan Design dalam Aplikasi Mobile
1.
Menawarkan feedback informative
2.
Mendesain dialog untk yield closure
3.
Menawarkan penanganan error yang
sederhana
4.
Membolehkan reversal yang mudah
5.
Mendukung bagian internal dari
kontrol
6.
Mereduksi load memori jangka pendek
7.
Memungkinkan user untuk menggunakan
shortcut
8.
Desain konteks multiple dan dinamis.
9.
Desai dibuat agar user bisa mengatur
konfigurasi yang diinginkan
10.
Desain agar user bisa mengoprasikan
dengan satu tangan (kiri/kanan) atau dua tangan
11.
Desain aplikasi bisa menyesuaikan
lingkungan kerja user secara otomatis.
12.
Desain perangkat dengan ukuran kecil
13.
Menyediakan pemilihan huruf atau kata
pada input teks.
14.
Desain kecepatan dan recovery
15.
Memungkinkan aplikasi dihentikan,
dimulai maupun dilanjutkan tanpa masalah
16.
Desain interaksi
top-down. Menampilkan struktur informasi yang dapat dipilih detail
17.
Desain personalisasi. Personalisasi
aturan dan desain sesuai yang diinginkan user.
18.
Desain memiliki tampilan yang menarik
dan interaktif saat digunakan.
Itulah informasi yang dapat saya bagikan untuk kali
ini, semoga bermanfaat.
Sumber referensi: