MODUL PELATIHAN – MINGGU 7

Web Design Professional Program

Topik: Branding Website & Penyempurnaan Desain

1. Tujuan Pembelajaran

A. Pengetahuan:

– Memahami konsep branding visual dalam website.

– Mengetahui elemen-elemen desain yang mempengaruhi tampilan profesional.

B. Keterampilan:

– Menyempurnakan style website: warna, tipografi, ikon, dan elemen visual.

– Menata ulang halaman agar konsisten dan harmonis.

– Menyelaraskan desain antar halaman (Home, About, Services, Portfolio, Contact).

C. Sikap:

– Konsisten dalam gaya desain.

– Mengutamakan keterbacaan dan kenyamanan pengguna (user-friendly).

2. Materi Pembelajaran Minggu 7

Sesi 1 – Membangun Branding Website

• Branding adalah identitas visual yang membuat website terlihat profesional dan konsisten.

• Elemen branding penting:

   – Warna utama dan warna sekunder

   – Tipografi judul dan isi

   – Ikon dan ilustrasi pendukung

   – Suara dan tone konten

• Tips memilih warna:

   – Gunakan 1 warna utama, 1 warna aksen, dan 1 warna netral.

   – Pastikan kontras baik untuk keterbacaan.

Sesi 2 – Penyempurnaan Warna & Typography

• Langkah-langkah di Elementor / Astra Customize:

   1. Buka Appearance → Customize → Global.

   2. Atur ulang palette warna sesuai branding.

   3. Pilih font judul (H1–H6) dan font isi yang konsisten.

• Tips typography:

   – Gunakan maksimal 2 jenis font.

   – Gunakan ukuran H1 yang jelas dan tegas.

   – Perhatikan line height agar teks nyaman dibaca.

Sesi 3 – Menambahkan Elemen Visual Pendukung

• Elemen visual kecil membuat website lebih hidup:

   – Ikon layanan

   – Divider (garis pemisah)

   – Shape dekoratif (lingkaran, kotak, wave)

   – Background section (warna blok atau gradient)

• Langkah:

   1. Tambahkan icon box pada bagian layanan.

   2. Gunakan divider untuk memisahkan section.

   3. Gunakan shape background sesuai kebutuhan.

Sesi 4 – Menyelaraskan Desain Antar Halaman

• Semua halaman harus selaras dalam:

   – Warna

   – Font

   – Jarak (spacing)

   – Gaya ikon

   – Gaya tombol (border radius, warna, hover)

• Checklist penyelarasan:

   – Apakah setiap halaman memiliki header yang sama?

   – Apakah tombol CTA konsisten?

   – Apakah foto/gambar memiliki filter atau style yang sama?

   – Apakah margin/padding antar section rapi?

3. Output Minggu Ketujuh

– Website memiliki branding visual yang konsisten.

– Warna, font, ikon, dan elemen visual selaras.

– Tampilan seluruh halaman rapi dan profesional.

– Pengalaman pengguna meningkat berkat desain yang lebih harmonis.

4. Tugas Mingguan

1. Terapkan palette warna final ke seluruh halaman.

2. Pastikan semua judul (H1–H2) konsisten dalam ukuran dan warna.

3. Tambahkan minimal 3 ikon baru pada bagian layanan.

4. Rapikan spacing pada semua halaman (Home, About, Services, Portfolio, Contact).

5. Kirimkan link website versi final draft kepada instruktur.