Pemula · Kelas 9–12

Sistem grid

Kolom, baris, margin, dan gutter memberi kerangka tata letak.

Eksperimen visual

Jumlah kolom 65%

Ubah satu variabel, lalu perhatikan apa yang berbeda.

Pada katalog, grid membantu gambar dan keterangan menempati posisi yang konsisten. Elemen dapat memakai satu kolom atau melintasi beberapa kolom.

Mengapa penting?

Halaman yang padat lebih mudah ditata tanpa menebak setiap posisi.

↳ Hal yang perlu diingat

Kolom membantu menjaga hubungan posisi.

01 /

A Petunjuk kurang jelas

Blok tanpa struktur membuat tepi sulit diikuti.

B Petunjuk lebih jelas

Kolom membantu menjaga hubungan posisi.

Contoh untuk konteks ini. Pilihan terbaik bergantung pada pesan dan audiens.

Memaksa semua konten ke sel berukuran sama.

Bagaimana grid membantu ketika keterangan menjadi lebih panjang?

03 / CANVA + FIGMA

Buat katalog dua produk dengan grid dua kolom. Uji judul yang melintasi dua kolom.

Buat dua salinan halaman di Canva. Terapkan perubahan pada bentuk atau teks di versi kedua. Bandingkan pada ukuran tampil sebenarnya.

Duplikasikan frame di Figma. Ubah properti layer yang terkait, gunakan guides atau auto layout jika membantu, lalu bandingkan kedua frame.

Latihan dilakukan mandiri di aplikasi pilihanmu. Tidak diperlukan koneksi akun.

04 /

Rujukan diperiksa 1 Oktober 2026. Eksperimen dan brief dibuat khusus untuk belajar.

Teori desain adalah panduan untuk diuji dalam konteks, bukan hukum universal.