Good Or Bad Design Graphic
Desain grafis adalah sebuah bentuk seni dengan tujuan untuk memecahkan masalah komunikasi melalui kombinasi elemen grafis seperti bentuk, garis, warna, dan sebagainya. Visual yang tercipta diharapkan dapat menjadi sarana penyampaian informasi atau pesan secara jelas dan efektif, bahkan mampu membentuk persepsi manusia akan sebuah hal.
Perlu kamu tahu bahwa dalam desain grafis, tulisan pun juga dinamakan sebagai gambar. Mengapa? Karena tulisan merupakan bentuk abstraksi simbol-simbol yang dapat dibunyikan. Ilmu tentang desain grafis biasanya sering disebut Desain Komunikasi Visual (DKV).
Apa kewajiban seorang desainer grafis?
Seorang desainer grafis memiliki tujuan penting, yaitu sebagai pemecah masalah (problem solver). Bagaimana membuat orang mengerti pesan yang ingin disampaikan melalui visual yang dihasilkan? Tugas ini tidaklah mudah untuk dilaksanakan. Seorang desainer grafis harus memiliki kemampuan kognitif sekaligus keterampilan visual agar mampu menyampaikan pesan dengan tepat dan mudah dimengerti.
Apa saja prinsip yang ada dalam desain grafis?
Seperti halnya manusia yang memiliki prinsip yang ia pegang teguh dalam menjalani kehidupan, begitu pula dengan desainer grafis. Ada prinsip-prinsip yang harus dipegang teguh saat menghasilkan karya-karya yang luar biasa.
Prinsip utama yang wajib menjadi pedoman setiap desainer grafis adalah bahwa setiap desain yang dihasilkan harus bersifat komunikatif, karena kegunaan desain itu sendiri tak lain adalah sebagai sarana komunikasi, seperti yang telah disampaikan di atas.
Prinsip-prinsip pendukung lainnya yang juga sebaiknya dipegang teguh oleh para desainer grafis adalah kesederhanaan, keseimbangan, kesatuan, penekanan, irama dan proporsi. Kami mencoba menjelaskannya secara sederhana saja di dalam artikel ini.
Mengapa kesederhanaan? Tujuan dari desain adalah memudahkan pembaca memahami apa yang disampaikan. Oleh karena itu, kesederhanaan perlu diingat pada saat desainer grafis melakukan pekerjaannya.
Bagaimana dengan keseimbangan? Secara visual, desain baiknya memiliki dua keseimbangan, yaitu keseimbangan formal dan keseimbangan informal. Keseimbangan formal misalnya berupa konsistensi dalam penggunaan elemen-elemen desain. Sementara yang dimaksud dengan keseimbangan informal adalah desain sebaiknya meninggalkan kesan dinamis dan fleksibel.
Prinsip ketiga adalah kesatuan. Isi pokok dari komposisi suatu desain harus dapat menyatu sehingga terlihat utuh sebagai satu kesatuan.
Lalu, apa itu penekanan? Penekanan, atau istilah kerennya aksentuasi, adalah bahwa sebuah desain harus dapat menarik perhatian orang yang melihatnya. Desain yang berhasil adalah desain yang mampu membuat target audience-nya mengerti sehingga mereka pun tergerak untuk dapat membagikan informasi tersebut kepada orang lain.
Irama, bagaimana dengan irama? Sebuah karya seni selalu memiliki unsur-unsur pendukung. Irama merupakan pengulangan dari unsur-unsur tersebut.
Prinsip terakhir dalam desain grafis adalah proporsi. Untuk memperoleh keseimbangan desain diperlukan perbandingan. Agar sebuah bidang terlihat proporsional, perbandingan matematisnya harus tepat.
Apa saja unsur yang ada dalam desain grafis?
Desain harus memiliki unsur-unsur penting ini: garis, bentuk, tekstur, ruang, ukuran dan warna.
Unsur dasar yang diperlukan untuk membentuk sesuatu adalah garis. Tanpa adanya garis, unsur desain yang satu dan yang lain tidak bisa terhubung.
Unsur kedua dalam desain grafis adalah bentuk. Bentuk-bentuk umum yang diketahui orang banyak antara lain segitiga, lingkaran, persegi dan persegi panjang.
Lalu, yang ketiga adalah tekstur. Apa itu tekstur? Tekstur adalah tampilan luar dari sebuah bentuk yang dapat dilihat atau dirasakan.
Unsur berikutnya adalah ruang. Ruang diperlukan untuk memperindah sebuah desain. Bayangkan jika tidak ada jarak sama sekali, bentuk-bentuk yang ada di dalam desain akan saling menempel.
Selanjutnya, ada ukuran. Objek yang memiliki ukuran yang lebih besar atau dominan mengindikasikan bahwa objek tersebut lebih penting dibanding objek yang berukuran kecil. Itulah pentingnya unsur ukuran.
Warna melengkapi unsur-unsur yang harus ada dalam sebuah desain. Pemilihan warna sangatlah penting dalam menentukan keindahan suatu desain. Pemilihan warna berpengaruh terhadap kesan yang diterima oleh pembaca. Pemilihan warna dapat memengaruhi suasana hati seseorang. Masing-masing warna juga memiliki profil identitasnya sendiri.
“LAYOUT”
1. Keseimbangan / Balance
Seimbang yang dimaksud adalah bukan rata kiri dan kanan saja, seimbang yang dimaksud adalah proporsional dalam menempatkan komponen desain seperti text, gambar, warna dan lain lain.
2. Kesesuaian / Proximity
Desain bukan hanya untuk membuat sesuatu karya seni tapi juga untuk menyampaikan pesan pembuatnya kepada orang lain. Tapi hal lain yang perlu diperhatikan adalah kesesuaian atau “nyambung”nya apa yang ditampilkan dengan apa yang ingin disampaikan.
Misalnya tidak menampilkan warna ceria untuk poster sumbangan korban gempa atau korban perang. Atau menampilkan gambar pekerja tambang untuk promosi sekolah.
3. Kesejajaran / Alignment
Pengaturan letak suatu objek pada halaman desain sangat mempengaruhi pesan ataupun kenyamanan pengguna dalam melihat suatu desain grafis.
4. Konsistensi
Suatu desain akan mudah dikenali dari warna, bentuk, jenis huruf ataupun komponen lain. Untuk itu gunakan hal yang sama pada setiap desain untuk menjadi ciri khas.
5. Kontras
Penggunaan komponen yang berbeda akan memudahkan pengguna memahami pesan dari hasil karya desain yang kita buat, makanya gunakan komponen yang berbeda seperti warna misalnya agar dapat membedakan satu elemen dengan yang lainnya.
Tapi Apakah Terlihat Profesional Saja Cukup?
Pernahkah Anda datang mengunjungi sebuah halaman website dan kemudian Anda menilai desain nya “unik”,”bagus”, “menarik”, “minimalist”, “kurang bagus”, “biasa saja”, “professional looks”, “saya suka bagian yang ini” dan lain sebagainya.? Dari pertanyaan-pertanyaan yang muncul, sebenarnya darimana penilaian yang subyektif itu muncul?
Seeing is believing. But Feeling is The Truth — Thomas Fuller
Keindahan memang tidak memiliki standar yang pasti. Akan tetapi, ada prinsip desain yang perlu Anda patuhi agar website Anda memiliki nilai estetika tinggi, atau setidaknya tampil menarik.
Ulasan kali ini membahas tentang Prinsip Gestalt dalam sebuah desain, terutama dalam desain website beserta penerapannya.
Apa Itu Gestalt?
Untuk menjawab pertanyaan ini pertama cobalah lihat baik-baik gambar di bawah ini.
Apa yang Anda lihat mungkin cuma sebatas warna hitam, putih dan tidak berbentuk, tapi perhatikan lagi lebih seksama. Kemudian lihatlah bentuk dalam lingkaran merah yang kami tandai.
Dari warna hitam dan putih yang tidak berbentuk di atas tampak gambar anjing bercorak hitam putih (Dalmatian) yang sedang mengendus tanah di bawah pohon. Jika dilihat sekilas memang anjing tersebut tidak terlalu tampak jelas. Namun dari bagian-bagiannya (kaki, telinga, hidung, ekor, leher, dan lain-lain) Anda dapat menyimpulkan bahwa ini adalah gambar anjing, berdasarkan bagian-bagian komponen yang terlihat oleh mata Anda.
Hal yang sama terjadi untuk setiap desain website yang tidak pernah dirasakan dengan mengidentifikasi bagian-bagiannya (header, navigation, konten, tombol, tab, dan lain-lain).
Desain yang dirasakan secara keseluruhan oleh pengunjung adalah pada pandangan pertama.
Kebanyakan orang tidak menyadari bahwa mata manusia pertama-tama melihat bentuk keseluruhan desain apapun itu, sebelum kemudian mulai fokus pada hal yang lebih mendetail. Agar lebih jelas, coba perhatikan gambar berikut ini:
Pada awalnya Anda hanya akan melihat 2 orang yang saling berhadapan, kemudian mata Anda akan tertuju pada 2 orang yang memakai topi dengan satu orang di sebelah kanan memainkan gitar, setelah itu mata Anda akan tertuju pada seorang wanita yang berada di depan pintu.
Gestalt berasal dari bahasa Jerman yang berarti bentuk. Prinsip Gestalt awalnya dikembangkan oleh Max Wertheimer (1880–1943), seorang psikolog kelahiran Austro-Hungaria. Seiring berjalannya waktu, prinsip ini kemudian juga dikembangkan oleh Wolfgang Köhler (1929), Kurt Koffka (1935), dan Wolfgang Metzger (1936).
Prinsip Gestalt adalah aturan yang menjelaskan bagaimana mata manusia membuat persepsi elemen visual.
Prinsip ini bertujuan untuk menunjukkan bagaimana suatu bentuk yang kompleks dapat dikurangi dengan bentuk yang lebih sederhana. Di samping itu, tujuannya adalah untuk menjelaskan bagaimana mata memandang bentuk sebagai bentuk yang tunggal kemudian bersatu menjadi bentuk keseluruhan dari unsur-unsur sederhana yang terpisah.
Ada 10 Prinsip Gestalt yang berkaitan dalam konteks desain. Sepuluh hal inilah yang sebaiknya Anda pahami sebelum membuat website untuk kesuksesan bisnis Anda.
1. Prinsip Simplicity (Kesederhanaan)
Simplicity adalah prinsip dasar dari Gestalt. Elemen yang sederhana, jelas, dan teratur dapat menyampaikan pesan secara jelas dan tidak membingungkan. Ketika dihadapkan dengan bentuk kompleks, mata cenderung menata kembali obyek yang tidak beraturan menjadi komponen sederhana atau menjadi satu kesatuan sederhana.
Prinsip ini mengedepankan kesederhanaan dalam desain. Fokus pada fitur/elemen yang benar-benar dibutuhkan, sehingga menghasilkan desain yang sederhana, fungsional clean dan teratur.
Sebagai contoh, Anda akan lebih mudah untuk melihat gambar di sebelah kanan atas bahwa benda itu terdiri dari lingkaran, persegi dan segitiga yang sederhana daripada gambar disebelah kiri sebagai bentuk kompleks dan ambigu.
Agar lebih jelas, berikut adalah contoh penerapan prinsip simplicity pada desain website seperti yang digunakan pada website by-Form.
Website dengan menggunakan komposisi foto yang hampir memenuhi layar sebagai latar belakang dengan dipadukan teks copy sederhana yang dapat mewakili untuk menjelaskan produk yang dijual serta penempatan menu yang teratur membuat website by-form ini terkesan sederhana, rapi, clean namun tetap profesional.
2. Prinsip Similarity
Similarity juga dikenal sebagai invarian, yaitu prinsip kesamaan atau kemiripan dalam segi hal bentuk, warna, dan ukuran. Prinsip ini menyatakan bahwa …
Mata manusia cenderung untuk membangun hubungan antara unsur-unsur yang sama dalam sebuah desain. Kesamaan dapat dicapai dengan menggunakan elemen dasar seperti bentuk, warna, dan ukuran.
Similarity dalam website sering digunakan pada element seperti links dan content. Simak contohnya di website PatternTap berikut ini.
Website ini menggunakan Prinsip Similarity pada content website dengan kesamaan bentuk kotak (card) untuk setiap linknya.Semua kotak (card) juga menampilkan perilaku yang sama ketika Anda meletakkan mouse (hover) di atas card, hal ini menciptakan pengalaman yang memperkuat prinsip Similarity.
3. Prinsip Proximity
Prinsip ini juga dapat disebut sebagai prinsip pengelompokan. Prinsip ini dapat dipenuhi apabila ada jarak/spasi antara elemen satu dengan elemen lain. Prinsip ini menjelaskan bagaimana …
Mata manusia mempersepsikan hubungan antara unsur-unsur visual bahwa hal-hal yang berdekatan satu sama lain dianggap lebih terkait/ satu kelompok daripada hal-hal yang terpisah.
Penerapan prinsip ini pada umumnya selalu ada dalam setiap website. Untuk lebih jelasnya perhatikan contoh website localbrand berikut ini.
Dari tampilan website ini dapat dikelompokkan menjadi 6 elemen dasar antara lain:
- Link Navigasi utama pada sisi atas
- Link untuk memfilter berdasarkan kategori
- Link untuk memfilter berdasarkan Brand
- Thumbnail untuk setiap produk
- Link Navigasi pada footer
- Link social media beserta informasi pembayaran
4. Prinsip Uniform Connectedness (Kelompok yang Saling Terhubung)
Hampir sama seperti prinsip proximity, Uniform Connectedness menyebabkan mata untuk melihat elemen terhubung satu sama lain karena warna, garis, frame, atau bentuk lainnya.
Prinsip Uniform Conectedness menyatakan bahwa:
Elemen yang dihubungkan oleh properti visual seragam dianggap sebagai lebih terkait dari unsur-unsur yang tidak terhubung
Dalam desain website, prinsip Uniform Connectedness pada umumnya diterapkan dalam elemen navigasi tab dan dropdown menu, dikelompokkan karena saling memiliki keterkaitan satu sama lain. Sebagai contoh, lihatlah bagian menu website vet.co.uk yang menggunakan sistem dropdown untuk mengelompokkan satu kategori yang sama.
5. Prinsip Continuation
Prinsip continuation terjadi ketika mata dipaksa untuk bergerak melalui satu objek dan terus ke objek lain. Prinsip ini menegaskan bahwa …
Mata manusia mengikuti garis, kurva atau urutan bentuk untuk menentukan hubungan antar elemen desain
Pada kedua gambar di atas, Anda akan melihat garis melengkung dengan garis vertikal saling melalui. Prinsip kelanjutan di sini lebih kuat daripada kesamaan warna. Buktinya, mata akan meneruskan lingkaran merah di garis melengkung dan mengaitkan dengan lingkaran hitam di sepanjang kurva yang sama, daripada mengaitkan lingkaran merah di garis vertikal maupun horizontal.
Penerapan prinsip ini pada elemen website sering dijumpai pada waktu melakukan checkout terutama pada bagian progress indicator. Sebagai contoh, lihatlah proses checkout pada website topman berikut ini.
6. Prinsip Symmetry and Order
Obyek yang simetris memberikan perasaan berimbang dan harmoni kepada mata. Komposisi adalah fokus utama prinsip ini. Sederhananya, komposisi seharusnya tidak memberikan rasa gangguan atau ketidakseimbangan, karena pengunjung yang melihat akan membuang-buang waktu mencoba untuk menemukan elemen yang hilang, daripada berfokus pada pesan yang Anda tampilkan. Prinsip symmetry menegaskan bahwa …
Setiap elemen desain dianggap seimbang satu dengan yang lain dalam kelompok yang sama.
Anda dapat mencapai titik simetris dengan membuat keseimbangan yang baik dalam elemen desain Anda seperti gambar di atas. Hasilnya, Anda akan mendapatkan tampilan yang simetris, selaras, dan harmonis.
Sebagai contoh, lihatlah website Apple di atas, desain yang simetris dibentuk dari foto produk Mac Pro sebagai pusat perhatian pengunjung, diikuti desain menu utama pada bagian atas dan teks headline yang disertai background hitam. Jika ditarik garis lurus secara vertikal tepat di tengah-tengah layout halaman website, Anda akan mendapatkan 2 halaman web yang simetris.
7. Prinsip Figure/Ground (Multi-stability)
Prinsip Multi-stability menjelaskan bahwa …
Mata akan memisahkan seluruh obyek dari latar belakangnya untuk memahami apa yang sedang dilihat.
Hal ini mengacu pada hubungan antara unsur-unsur positif dan ruang negatif. Persepsi seseorang saat melihat suatu objek di bagian atas akan lebih kuat daripada latar belakangnya, terutama pada saat objek dan latar belakangnya ditampilkan secara bersamaan.
Dalam contoh sederhana di atas, ada dua macam objek berbeda dari gambar, meskipun keduanya memiliki komposisi yang identik. Gambar di sebelah kiri menunjukkan objek hitam berada di bidang putih (background). Sementara itu, gambar di sebelah kanan menunjukkan objek hitam dengan lubang di dalamnya. Secara umum hubungan seperti ini dipahami dengan nama ‘kontras’. Prinsip Gestalt ini dapat dikatakan prinsip terpenting dalam teori Gestalt karena yang dilakukan orang ketika mereka mengarahkan pandangan mereks unsur-unsur pertama yang dilihat adalah Figure (yang membutuhkan perhatian segera) dan yang Background (tidak begitu penting namun tetap membantu memberikan konteks penjelas).
Sebagai contoh, penerapan prinsip ini pada website srgtechnologies terletak bagian bagian landing page sebagai figure yaitu semua teks dan grafis sedangkan sebagai Ground yaitu foto pada backgroundnya.
Contoh lain penerapan prinsip ini dalam elemen desain website biasa dipakai ketika menggunakan popup/modal. Agar lebih jelas, silakan lihat gambar di bawah ini.
8. Prinsip Closure (Reification)
Ketika melihat susunan objek dengan unsur yang kompleks, mata cenderung untuk mencari pola tunggal yang dikenali.
Kesan pertama Anda ketika melihat gambar di atas adalah melihat bidang segitiga, meskipun pada gambar adalah 3 buah obyek hitam lingkaran yang tidak sempurna. Otak manusia mengisi informasi yang hilang untuk membuat pola tunggal yang Anda kenali. Prinsip Closure menjelaskan bahwa …
mata manusia memiliki kecenderungan untuk menyelesaikan bentuk yang tidak lengkap kemudian merasionalisasi secara keseluruhan.
Contoh penerapannya dapat Anda lihat pada website Jens Lehmann berikut.
Menggunakan gambar yang diletakkan didepan teks sehingga menutupi pesan dibelakangnya sengaja digunakan untuk merangsang kerja mata dan otak Anda, sehingga Anda mampu mengisi bagian yang hilang dari teks yang tertutupi. Walaupun teks pesan tertutupi Anda masih bisa membacanya. Halaman depan website ini juga memanfaatkan prinsip figure/ground, simplicity, dan symmetry yang sudah dijelaskan pada bagian sebelumnya.
9. Prinsip Common Fate
Secara sederhana prinsip ini bisa dibilang seperti ini:
Mata manusia cenderung melihat unsur-unsur yang bergerak bersama-sama sebagai suatu kelompok yang lebih mirip satu sama lain daripada unsur yang diam atau bergerak ke arah yang berbeda.
Dengan kata lain, jika Anda memiliki sekelompok objek, dan objek-objek yang semua bergerak ke arah yang sama, maka Anda akan secara otomatis melihat benda-benda itu jauh lebih terkait satu sama lain daripada benda-benda yang tidak bergerak atau mereka yang bergerak dalam arah berlawanan.
Sebagai contoh pada gambar diatas titik merah yang bergerak pada arah yang sama dalam setiap baris lebih terkait satu sama lain daripada mereka ke jalur lain dari titik merah yang bergerak kearah yang berbeda.
Penerapan pada element website bisa terlihat pada dropdown menu, seperti yang diterapkan pada menu Linkedin, prinsip ini berfungsi untuk meghubungkan antara menu dengan sub-menu. Bila Anda memindahkan kursor anda lebih dari satu item menu, kemudian bergerak (hover) sub-menu maka akan tampil dengan pergerakan ke arah yang sama dari menu pertama dg lain.
10. Prinsip Focal Point
Focal Point berhubungan dengan prinsip similarity, terlebih karena ada kesamaan di antara unsur-unsur obyek lainnya.
Prinsip ini menyatakan bahwa …
Obyek dengan point of interest akan lebih cepat ditangkap mata dan lebih menarik perhatian karena adanya penekanan atau perbedaan dari unsur objek lainnya.
Pada gambar di atas, fokus mata Anda akan ditarik ke objek square (kotak). Ini karena pengaruh bentuk yang berbeda dan warna yang berasal dari unsur-unsur lain serta penambahan efek dropshadow untuk memberi penekanan pada objek. Seperti inilah prinsip focal point bekerja.
Penerapan pada website sering digunakan terutama pada foto/gambar dan teks pada homepage dengan ukuran yang lebih besar, untuk menarik perhatian pengunjung supaya tertarik dengan poin utama yang ingin ditunjukan. Sebagai contoh, perhatikan website Design of The World berikut ini.
Focal point pada website ini tertuju pada frame/kotak Orée Artisans karena dari segi bentuk frame/kotak produk ini lebih besar daripada elemen kotak yang lain, sehingga mata Anda akan tertarik untuk melihat pada kotak ini.
Kesimpulan
Keindahan memang tidak memiliki standar yang pasti. Namun, pemahaman dasar terhadap prinsip Gestalt ini akan membantu Anda membuat desain website yang tepat. Tujuannya, tentu saja, agar Anda dapat mencitrakan binis maupun diri Anda melalui media website dengan lebih baik.
Review Website Y’Vette
Perhatikan tampilan website berikut. Bagaimana menurut Anda tampilan desain website berikut ?
Apakah anda tertarik untuk membacanya ? Apa saja informasi yang Anda peroleh dari website tersebut ? Layout desain grafis website ini sungguh berantakan dan tidak tertata rapi. Kata- kata dan objek yang satu dengan yang lainnya tidak memiliki white space , saling menimpa, tulisannya yang berbeda dan warnanya sangat mencolok.
Sekarang, bandingkanlah dengan website di bawah ini. Apakah Anda merasa nyaman dan mmampe memperoleh informasi di dalamnya?
Melalui gambar tersebut, kita dapat memahami setiap komponen-komponen yang ada. Desain yang saya buat memiliki konsep pengelompokan serta sistem grid. Selain itu setiap komponen tertata rapi dengan adanya ruang putih, sehingga memudahkan pengguna mencari apa yang ia butuhkan.
Demikian tulisan saya ,semoga bermanfaat.
