Pelatihan ini bertujuan untuk meningkatkan kemampuan web designer dalam visualisasi desain, pemahaman User Experience, HTML dan CSS, komunikasi dengan klien, serta time management melalui penggunaan alat-alat seperti Figma, penjelasan tentang UX, pembelajaran HTML dan CSS, penggunaan Discord untuk komunikasi, dan Trello untuk time management.

1. Pelatihan
WEB DESIGNER
“ TO BE BETTER WEB DESIGNER”

2. Tujuan Pelatihan
Pertama
Meningkatkan kemampuan
visualasisi design
Kedua
Meningkatkan pemahaman
User Experience (UX)
Ketiga
Meningkatkan pemahaman
HTML dan CSS
Keempat
Meningkatan kemampuan
komunikasi dengan client
ataupun tim
Kelima
Meningkatkan Time
Management masing-masing
individu

3. Materi Pelatihan
1. Visual Deisgn
Penggunaan Tool Figma
sebagai aplikasi design
website
2. User Experience (UX)
Pengertian dan Penerapan
UX
3. HTML dan CSS
Pengertian HTML dan CSS
4. Komunikasi yang baik
Penggunaan tool Discord
sebagai aplikasi komunikasi
dalam tim
5.Time Management
Penggunaan tool Trello
sebagai aplikasi time
management

4. Visual Design
5 Pengetahuan yang akan kita pelajari :
• Unity
• kesatuan (unity) dalam desain adalah adanya kohesi dan
keutuhan. Prinsip ini membuat semua elemen dalam
sebuah desain saling mendukung dan memperoleh
fokusnya masing-masing.
• Keseimbangan
• merupakan prinsip menyatukan semua elemen dalam
komposisi yang tepat.
• Kontras
• merupakan penggunaan elemen warna supaya informasi
yang informasi yang disampaikan sampai.
• Irama
• merupakan prinsip penyusunan elemen desain sesuai pola
tertentu.
• Fokus
• merupakan prinsip untuk menunjukkan poin penting atau
perhatian utama dari sebuah desain.

5. Figma
Figma adalah editor
grafis vektor dan alat
prototyping dengan
berbasis web serta
fitur offline tambahan
yang diaktifkan oleh
aplikasi desktop untuk
Mac OS dan Windows.
• Keunggulan Figma :
• Kolaborasi langsung (real
time)
• Lebih mudah mengelola
desain system
• Prototipe
• Menyediakan CSS

6. User Experience (UX)
User Experience adalah
bagaimana pengalaman
pengguna dalam
berinteraksi dengan
produk digital anda
Pengertian:

7. Penerapan UX
• Gunakan Desain
yang Simpel,
Konsisten, dan
Responsive
• Pahami Keinginan
dan Kebutuhan
Pengguna
• Pastikan Hal-hal
yang Penting
Menonjol
• Berikan Perjalanan
yang Lancar untuk
Pengguna

8. HTML & CSS
ANALOGI HTML & CSS

9. Rankuman 3 Materi
• Menggunakan Figma sebagai tool
design website
• Pemahaman & Cara Penerapan User
Experience (UX)
• Pemahaman HTML & CSS

10. Course Progress
Visual Design
User Experience
(UX)
HTML & CSS Komunikasi
Time
Management

11. Komunikasi yang
baik
Sebagai seorang web designer,
Anda tentu harus berkolaborasi
dengan klien atau rekan dari divisi
lain di tempat Anda bekerja. Oleh
sebab itu, skill komunikasi ini
penting dimiliki supaya tidak
terjadi miskomunikasi dan project
pembuatan website dapat berjalan
lancar dan sukses.

12. DISCORD
• Memudahkan
berkomunikasi
dengan para
anggota dari divisi
manapun
• Versi mobile yang
memudahkan
segala akses
• Tampilan yang
menarik dan
mudah digunakan

13. TIME MANAGEMENT

14. Rankuman Materi
• Menggunakan Figma sebagai tool
design website
• Pemahaman & Cara Penerapan User
Experience (UX)
• Pemahaman HTML & CSS
• Menggunakan Discord sebagai tool
komunikasi
• Meningkatkan Time Management
Masing-Masing Individu

15. Course Progress
Visual Design
User Experience
(UX)
HTML & CSS Komunikasi
Time
Management

16. TERIMA KASIH