https://hellomotion.

academy 1
 Pendahuluan

S
ebuah desain yang baik tercipta dari sebuah proses pemilihan elemen elemen desain yang disusun dengan cermat untuk menciptakan representasi
visual dari ide dan imajinasi. Kelas Dasar Desain Grafis untuk Segala Profesi ini adalah pondasi dari setiap media visual, dari seni rupa hingga desain
aplikasi smartphone. Kelas ini akan memberikan kalian pengertian mendasar tentang design dan proses penciptaan sebuah design, disini juga kalian
akan belajar bagaimana menerapkan design yang baik dalam project kalian di masa depan.
Kelas ini terdiri dari dua level, level pertama kita akan membahas rincian elemen-elemen dasar dalam design, di level kedua kita akan menjelaskan prinsip
prinsip desain tentang bagaimana elemen design harus disatukan untuk menciptakan proyek visual yang menarik.

Yang kalian ikuti kali ini adalah kelas Prinsip Prinsip Design, tahukah kalian dengan apa saja yang disebut dengan elemen desain? elemen desain itu ada
tujuh yaitu Garis, Bidang, Bentuk, Tekstur, warna, Typography dan Ruang. Tiap tiap elemen ini perlu ditata sedemikian rupa agar terlihat bagus dan mudah
dipahami oleh audience. Untuk membantu menentukan bagaimana menata elemen desain pada karya kita nantinya, kita perlu mempelajari tata letak atau
layout dan komposisi. Beberapa designer ada yang menamakan topik ini dengan nama prinsip prinsip design.
Yang akan kita pelajari adalah;
Keseimbangan (balance),
Proporsi (proximity)
Alignment
Contrast
Hirarki
Dan repetisi

Di kelas ini kita tidak mewajibkan kalian harus memakai software grafis tertentu, pakailah software yang kalian bisa. walaupun itu hanya sekedar microsoft
word. Bagaimana jika kalian tidak bisa menguasai suatu software? kalian bisa mengikuti kelas ini dengan menggambar manual.

Harapan kami setelah kalian mengikuti kelas ini adalah, kalian bisa membuat design yang baik dan terlihat profesional

https://hellomotion.academy 1

 Sesi 1 Prinsip Design :
Balance
B
alance atau keseimbangan adalah pemerataan distribusi bobot visual
yang sama atau seimbang. Keseimbangan dapat dipengaruhi oleh
banyak hal, termasuk warna, ukuran, jumlah, dan space.
Ada dua pendekatan dasar untuk menyeimbangkan tiap tiap elemen pada
desain kita, yaitu Simetris dan Asimetris
Keseimbangan Simetris menempatkan
objek pada titik dimana ruang dalam satu
halaman itu terlihat seimbang. Ini seperti,
jika kita membelah suatu desain dari
tengah maka akan ditemukan bobot
visual yang sama antara satu sisi dengan
sisi yang lain.
Keseimbangan asimetris menciptakan
ilusi dari keseimbangan, keseimbangan
dalam contoh desain berikut tercipta dari
bobot visual yang ditempatkan secara
merata, yaitu logo perusahaan dan nama
orang tersebut.
https://hellomotion.academy
Banyak orang, termasuk desainer dan fotografer, menggunakan tehnik
komposisi yang disebut Rule of
Thirds dalam mengaplikasian prinsip
keseimbangan pada designnya. Kita
bisa membayangkan area layout
design dibagi menjadi 3x3.
Point of Interest gambar
ditempatkan pada salah satu garis
imajiner tadi, dengan demikian kita telah menciptakan keseimbangan visual
dengan sisa ruang yang ada.
Tehnik rule of third's ini bisa
membuat komposisi kita terlihat
menarik karena menurut penelitian,
mata manusia secara alami
mengikuti jalur ini ketika memindai
desain.
2

 Sesi 2 Prinsip Design :

Proximity

P
roximity atau Proporsi adalah segala sesuatu tentang menggunakan terbaca? Apa mata kamu terhenti lima kali saat hendak baca semuanya? Tentu
space atau ruang untuk menunjukkan hubungan visual dalam konten saja, karena ada lima konten terpisah di kartu nama.
yang kita buat.
Pengertian sederhananya seperti ini, ketika kita mendesain sesuatu pastikan Bandingkan dengan kartu nama berikut
konten yang saling berkaitan dikelompokkan bersama, misalnya blok teks
atau elemen grafis

Proximity ini penting karena proximity mendefinisikan cara pandang

manusia, kita secara tidak sadar melihat suatu objek berdasarkan relasi atau
sebuah hubungan.
Agar lebih jelas perhatikan kartu nama berikut

Sekarang, apakah kalian bingung harus mulai dari mana?, Setelah baca
bagian awal, mata kalian bergerak kemana? Lebih mudah untuk dipahami
kan?

Apa yang terjadi disini dapat dijelaskan oleh prinsip Proximity. Ketika
Bagian mana yang pertama kali kalian liat? Mungkin Bagian tengah, karena beberapa objek berada berdekatan, mereka bukan menjadi objek yang
paling tebal. Setelah itu, lalu kalian lanjut liat yang mana? Mayoritas pembaca terpisah melainkan menjadi satu kesatuan unit visual.
akan melihat dari pojok kiri atas, lalu ke kanan. Ini dikarenakan kita selalu
baca dari kiri ke kanan. Setelah selesai baca bagian yang terakhir, apa kalian
berhenti melihat atau terus melihat setiap pojok takut ada yang belum

https://hellomotion.academy 3

 
 
Sesi 2 Prinsip Design :
Proximity
Cara pengaplikasian prinsip design proximity pada desain cukup mudah,

Yaitu grup yang tidak terkait satu sama lain harus diberi jarak untuk
menekankan kurangnya hubungan antar elemen secara visual.

Tujuan utama dari prinsip proximity ini adalah membuat karya kalian
menjadi lebih teratur dan mudah untuk dipahami audience.

https://hellomotion.academy 4

Sesi 3 Prinsip Design :

Alignment

A
lignment atau pensejajaran elemen-elemen dalam layout merupakan
hal yang sering kita lakukan dalam proses mendesain.
Apapun bentuk desain yang dikerjakan, kita pasti akan dihadapkan
untuk memilih penggunaan alignment yang tepat.
Alignment sangatlah penting dalam desain untuk membangun suatu tampilan
yang indah secara estetis dan efektif secara fungsi.
Secara umum, alignment dibagi kepada empat format utama yaitu
Center (rata tengah)
Left (rata kiri)
Right (rata kanan)
Justify (rata kiri-kanan).
Center Alignment (rata tengah) dalam desain biasanya digunakan untuk
menampilkan keseimbangan dan fokus pada desain yang tidak memiliki
banyak konten/item.
Penggunaan center alignment akan lemah jika digunakan pada desain dengan
konten yang penuh dengan teks seperti buku dan halaman artikel pada web.
Ini dikarenakan tidak adanya garis batas teratur pada teks yang berfungsi
membuat tampilan lebih teratur dan terorganisir.
Selain itu, penggunaan Center Alignment akan membuat tampilan teks
berantakan dan tidak fokus, sehingga audience cenderung akan kebingungan
untuk menangkap setiap isi yang disampaikan pada teks.

https://hellomotion.academy 5

Sesi 3 Prinsip Design :

Alignment

Left Alignment (rata kiri) adalah standar penggunaan alinea teks untuk
Right Alignment (rata kanan) biasanya digunakan untuk menarik perhatian
halaman teks yang punya banyak konten.
pembaca. Format teks seperti ini akan memberikan kesan yang tidak biasa
dan cenderung menarik perhatian lebih.
Rata kiri akan menciptakan unsur keteraturan karena jarak antar satu kata
Biasanya penggunaan rata kanan akan berfungsi baik jika digunakan untuk
dengan kata lain sama. Selain itu, tampilan yang diatur rata kiri akan terlihat
desain yang minim konten seperti kartu nama, banner, dll.
lebih dinamis dan mudah untuk dibaca. Rata kiri cocok digunakan untuk blok
Yang perlu diperhatikan adalah, hindari penggunaan rata kanan untuk sebuah
teks pada halaman situs, buku, majalah, dsb.
halaman yang padat dengan teks.
Karena kita semua membaca dari kiri ke kanan. Sehingga akan lebih mudah
bagi pembaca untuk menangkap isi dari suatu halaman teks yang tampilan
bagian kirinya teratur.

https://hellomotion.academy 6

Sesi 3 Prinsip Design :
Alignment
Justify (rata kiri-kanan) sering kita lihat di buku buku dan surat kabar.
Kelemahan pada rata kiri-kanan ini adalah, jarak antar kata dalam paragraf
ada yang tidak sama, hal ini akan membuat sedikit ketidakberaturan pada teks
yang pada akhirnya membuat halaman sulit untuk dibaca.
Penggunaan rata kiri-kanan biasanya digunakan untuk layout dengan kolom
teks yang tidak begitu lebar seperti halaman koran.
https://hellomotion.academy
Alignment ini tidak selalu berhubungan dengan teks, kita juga bisa
mengaplikasikan prinsip ini pada elemen grafis. Kita bisa membayangkan
konten dalam design kita dibagi dalam garis garis, seperti contoh berikut.
Kalian bisa perhatikan ada garis imajiner yang memusatkan setiap gambar ke
teks? Setiap pengelompokan konten juga diberi jarak yang sama. Perhatian
terhadap hal detail seperti inilah yang membuat komposisi kita lebih mudah
dinavigasi.
Tanpa alignment yang konsisten, komposisi kita akan terasa tidak teratur dan
agak berantakan.
7

Sesi 4 Prinsip Design

Kontras

K
ontras dapat dikatakan sebuah perbedaan visual yang signifikan dari
sebuah objek terhadap objek lain atau object didekatnya. Biasanya
kontras digunakan untuk menciptakan pusat perhatian atau juga
memberi penekanan pada sebuah elemen.
2. Selain dengan value, kita bisa juga menggunakan skema warna tertentu
Dengan memberikan kontras pada elemen tertentu, pandangan audience akan
tertuju pada informasi yang lebih penting daripada informasi lainnya. Hal ini
perlu dilakukan agar pesan dapat tersampaikan secara lebih efektif.
Jika hal itu tidak dilakukan, maka yang terjadi adalah komposisi desain yang
terlihat ramai atau sesak karena masing-masing elemen desain saling
bersaing merebut perhatian pembaca. Akibatnya, dapat terjadi distorsi
informasi dan pesan menjadi tidak tersampaikan dengan baik.
Disini kita bisa menggunakan teks dengan warna terang yang di
kombinasikan dengan gambar latar yang berwarna gelap atau bahkan
sebaliknya.
pada desain kita untuk menciptakan kontras. Kita bisa menggunakan
skema complimentary, split complimentary atau juga skema warna
triadic. Kita juga bisa membuat prinsip desain kontras dengan
mengkombinasikan warna hangat dengan warna dingin. Seperti pada
contoh berikut ini, penggunaan warna latar berwarna biru yang bersifat
dingin mampu membuat foto objek dan tombol yang berwarna kuning
menjadi lebih menonjol.

Ada berbagai cara untuk membuat prinsip kontras pada design kita,

1. Menggunakan kombinasi warna dengan value yang berbeda.

Untuk menciptakan prinsip kontras kita bisa menggunakan warna yang
gelap dikombinasikan dengan warna yang terang seperti pada contoh
berikut ini

https://hellomotion.academy 8

 Sesi 4 Prinsip Design

Kontras
3. Kombinasi lain adalah kita bisa menggunakan perpaduan intensitas warna,
warna yang bersaturasi tinggi dikombinasikan dengan warna yang
bersaturasi rendah.
5. Kita juga bisa membuat prinsip kontras dengan menggunakan kombinasi
font dan style yang berlawanan namun saling melengkapi.
Kombinasi style font berikut ini bisa kalian jadikan referensi,
Bold dengan Thin, Regular dengan Oblique, Monospace dengan Condensed
Straight dengan Curved, Huruf Sambung dengan Huruf Lepas dan Huruf Kecil
dengan Huruf Kapital

Tentunya beberapa contoh yang disebutkan tadi hanya sebagian saja dari
sekian banyak cara menerapkan prinsip kontras pada desain kita. Kalian bisa
menemukan banyak inspirasi lain diluar sana

Pada contoh berikut ini: teks berwarna oranye yang bersaturasi tinggi
menjadi lebih menonjol ketika digabungkan dengan latar yang berwarna
hijau dengan saturasi rendah, kalau kalian perhatikan desain ini
menggunakan skema warna complimentary, dengan mengubah intensitas
warnanya kita bisa membuat kombinasi warna kontras yang tidak biasa

4. Selanjutnya kita bisa mengkombinasikan bentuk geometris dengan bentuk

organik

https://hellomotion.academy 9

 Sesi 5 Prinsip Design

Hirarki Visual

H
irarki visual adalah sebuah metode pengorganisasian elemen desain
dalam suatu urutan kepentingan.
Contoh sederhananya seperti ini:

Sekarang lihat perubahan yang terjadi.

Ke mana arah pandangan mata kalian saat pertama kali melihat kotak dalam
ilustrasi di atas? Mungkin kalian akan mulai dari kotak di sebelah kiri, karena
terbiasa membaca dari kiri ke kanan. Bisa jadi kalian malah mengarahkan
pandangan pada kotak di tengah terlebih dahulu, atau pun dari arah kanan ke
kiri.
Kini perhatian kalian tertuju pada kotak di bagian kiri atas, bukan? Sedikit
perubahan warna mampu mengarahkan mata ke kotak tersebut. Hal ini
menjadikan seakan-akan kotak tersebut adalah yang paling penting dilihat.
Inilah yang dinamakan dengan Hierarki Visual.

Intinya adalah, tidak ada panduan utama bagi mata karena semua berbentuk
dan berwarna sama.

https://hellomotion.academy 10

Sesi 5 Prinsip Design

Hirarki Visual
Dalam desain, hirarki digunakan untuk; Bagaimana cara mengaplikasikan prinsip hirarki kedalam karya kita?
• Memberi kesan struktur, Cara termudahnya adalah dengan mengatur ukuran font!
• Membuat organisasi visual
• Memberi penekanan Mengatur ukuran huruf
• Membantu audience dalam menavigasi desain dan adalah cara terbaik dalam
• Mencerna informasi dengan mudah menciptakan kontras
diantara elemen tipografi
Dengan menggunakan hirarki, kita bisa mengontrol bagaimana audience yang berbeda pada desain
berinteraksi dengan konten dan untuk memastikan bahwa informasi yang kita, terutama jika kita
dipaparkan sudah di navigasi dan dicerna dengan urutan yang kita inginkan. hanya menggunakan satu
jenis huruf.
Penataan layout pada surat kabar adalah sebuah contoh klasik dari hirarki

Surat kabar menggunakan tiga level hirarki tipografi yaitu headline,
subheadline dan bodycopy bisa kita lihat disini, perhatian mata kita akan
tertuju pada headline terlebih dahulu, lalu sub headline lalu ke body copy.
Cara lainnya adalah dengan menambahkan warna yang kontras pada salah
satu elemen pada desain kita
sama seperti prinsip design kontras, dengan menggunakan warna kita bisa
membuat suatu elemen lebih menonjol dibandingkan dengan elemen yang lain

https://hellomotion.academy 11

 Sesi 6 Prinsip Design

Repetisi

R
epetisi adalah penggunaan kembali elemen yang sama atau serupa di Sebagai contoh, perhatikan logo bank mandiri berikut,
seluruh desain. Pengulangan elemen visual yang dimaksud pada
repetisi adalah sangat berbeda dengan pola, pola atau pattern lebih
berkaitan dengan gaya visual atau karya seni visual dalam keseluruhan karya
desain
Sedangkan repetisi digunakan untuk menciptakan rasa kesatuan visual dan
konsistensi di seluruh karya yang kita buat

Bisa dikatakan bahwa repetisi dalam desain adalah semacam pencucian otak
secara visual, semakin sering kita melihat sesuatu maka sesuatu itu akan
menjadi semakin mudah kita kenali. Perlu diingat, suka atau tidak suka,
Kita bisa lihat logo ini terdiri dari dua warna yaitu biru dongker dan kuning
repetisi itu mudah memberikan impresi kepada audience.
Jika diperhatikan lebih lanjut lagi, penggunaan warna ini sangat dominan di
Dan sudah menjadi sifat alami manusia untuk menemukan kenyamanan dan
web resmi dari bank mandiri,
ketertarikan pada sesuatu yang sudah dikenali sebelumnya.
Tidak cuma itu saja, perhatikan atm bank mandiri ini.
Contoh penggunaan repetisi dalam desain banyak terdapat pada branding.
Kalau kita perhatikan pada brand brand yang baik akan ada penggunaan gaya
grafis yang konsisten.

Repetisi dapat bermanifestasi dalam beragam bentuk seperti penggunaan

warna tertentu atau skema warna tertentu, penggunaan yang konsisten dari
jenis huruf atau serangkaian tipografi, bentuk dan motif, pola dan sebagainya.

https://hellomotion.academy 12

Sesi 6 Prinsip Design

Repetisi
Kantor cabang Bahkan pada aplikasi mobile banking

Semua hal ini bertujuan agar ketika kita melihat kombinasi warna biru
dongker dan warna kuning tersebut maka kita akan langsung mengingatnya
Suasana interior kantor cabang
sebagai Bank Mandiri.

Semua ini dilakukan bukan sebagai kebetulan, ini adalah desain yang
dirancang dengan penuh perencanaan untuk menciptakan tampilan yang
mudah dikenali, dan mudah diingat. Karena pada sebuah branding, mudah
dikenali dan mudah diingat adalah sebuah hal yang sangat penting.

https://hellomotion.academy 13