Membuat Website Sederhana dengan HTML dan FigmaPrakerja Video Belajar 9 Jam 14 Menit
KategoriTechnology & Software
Deskripsi
Judul : Membuat Website Sederhana dengan HTML dan Figma
Pelatihan ini menggunakan moda pembelajaran mandiri
Okupasi Pelatihan: Pengembang Web
Rujukan Okupasi: Indonesia’s Critical Occupation List (COL) 2018
Gambaran Pelatihan
Program ini memberikan pelatihan dasar untuk membuat website sederhana bagi seorang pengembang web. Seluruh materi akan disampaikan dalam bentuk pembelajaran mandiri yang mencakup video dan modul pembelajaran dengan berbagai ragam konten.
Kompetensi yang Dilatih
Melalui pelatihan ini, peserta akan mendapat pemahaman dasar tentang cara membuat website sederhana dengan menggunakan HTML dan Figma. Peserta akan mendalami komponen dasar User Interface, cara membuat desain website menggunakan Figma, merancang desain prototipe menggunakan Figma, membuat website menggunakan HTML, dan juga membuat website menggunakan wordpress.
Pelatihan ini menggunakan moda pembelajaran mandiri
Okupasi Pelatihan: Pengembang Web
Rujukan Okupasi: Indonesia’s Critical Occupation List (COL) 2018
Gambaran Pelatihan
Program ini memberikan pelatihan dasar untuk membuat website sederhana bagi seorang pengembang web. Seluruh materi akan disampaikan dalam bentuk pembelajaran mandiri yang mencakup video dan modul pembelajaran dengan berbagai ragam konten.
Kompetensi yang Dilatih
Melalui pelatihan ini, peserta akan mendapat pemahaman dasar tentang cara membuat website sederhana dengan menggunakan HTML dan Figma. Peserta akan mendalami komponen dasar User Interface, cara membuat desain website menggunakan Figma, merancang desain prototipe menggunakan Figma, membuat website menggunakan HTML, dan juga membuat website menggunakan wordpress.
Urutan Pembelajaran
Sesi 1: Dasar User Interface Website
Sesi 2: Pengenalan Desain Website dengan Menggunakan Figma
Sesi 3: Merancang Desain Prototype dengan Figma
Sesi 4: Membuat Website Sederhana dengan HTML
Sesi 5: Membuat Website dengan Wordpress
Sesi 1: Dasar User Interface Website
Sesi 2: Pengenalan Desain Website dengan Menggunakan Figma
Sesi 3: Merancang Desain Prototype dengan Figma
Sesi 4: Membuat Website Sederhana dengan HTML
Sesi 5: Membuat Website dengan Wordpress
Syarat Mengikuti Kelas :
1. Rentang usia 18-64 tahun
2. Minimal pendidikan SMP sederajat
3. Individu yang ingin berkarier pengembang website
4. Memiliki laptop/smartphone dan akses internet
5. Laptop yang sudah terinstal Microsoft Office dan akses internet untuk mengerjakan tugas
2. Minimal pendidikan SMP sederajat
3. Individu yang ingin berkarier pengembang website
4. Memiliki laptop/smartphone dan akses internet
5. Laptop yang sudah terinstal Microsoft Office dan akses internet untuk mengerjakan tugas
Selengkapnya
Tentang Instruktur
Reggy PermadiUI/UX Design Lead at Komunal Indonesia
Reggy Permadi merupakan UI/UX Design Lead di Komunal Indonesia. Ia memiliki berbagai pengalaman sebagai UI/UX Designer di beberapa industri seperti teknologi finansial dan telekomunikasi. Di Skill Academy, ia berkesempatan untuk membagikan ilmunya mengenai perancangan UI Design menggunakan Figma.
Indra KusumaSoftware Engineer Profesional
Jihan Ariya WiyanaDigital Marketing & WordPress Enthusiast
Silabus
86 Video
66 Kuis
12 Dokumen
Pre Exam
Exam
Sertifikat
AktivitasTotal: 190
Tipe
DurasiTotal: 9 jam 14 menit
Pre Test
Dasar User Interface Website
1.Pembuka
1.Pembuka
Video 8 menit 51 detik
2.Commit
2.Commit
Video 5 menit 37 detik
3.Kuis Pop Up: Commit
3.Kuis Pop Up: Commit
Quiz-
4.Pengenalan Macam-Macam UI
4.Pengenalan Macam-Macam UI
Video 5 menit 25 detik
5.Kuis Pop-Up: Pengenalan Macam-Macam UI
5.Kuis Pop-Up: Pengenalan Macam-Macam UI
H5P-
6.Beda UI Mobile dengan Desktop dan Tools Membuat UI
6.Beda UI Mobile dengan Desktop dan Tools Membuat UI
Video 6 menit 33 detik
7.Kuis Pop-Up: UI Mobile vs Desktop
7.Kuis Pop-Up: UI Mobile vs Desktop
Quiz-
8.UI vs UX: Apa Perbedaannya?
8.UI vs UX: Apa Perbedaannya?
PDF-
9.Elemen Dasar UI: Screen dan Grid
9.Elemen Dasar UI: Screen dan Grid
Video 8 menit 33 detik
10.Kuis Pop-Up: Elemen Screen dan Grid
10.Kuis Pop-Up: Elemen Screen dan Grid
Quiz-
11.Elemen Dasar UI: Spacing Methods dan Shadow
11.Elemen Dasar UI: Spacing Methods dan Shadow
Video 5 menit 35 detik
12.Kuis Pop-Up: Elemen Spacing Methods dan Shadow
12.Kuis Pop-Up: Elemen Spacing Methods dan Shadow
Quiz-
13.Typeface pada UI Design
13.Typeface pada UI Design
Video 4 menit
14.Kuis Pop-Up: Typeface pada UI Design
14.Kuis Pop-Up: Typeface pada UI Design
H5P-
15.Font Size dan Space
15.Font Size dan Space
Video 6 menit 34 detik
16.Kuis Pop-Up: Font Size dan Space
16.Kuis Pop-Up: Font Size dan Space
Quiz-
17.Tipografi: Font Pairing sampai Font Colors
17.Tipografi: Font Pairing sampai Font Colors
Video 6 menit 8 detik
18.Kuis Pop-Up: Tipografi
18.Kuis Pop-Up: Tipografi
Quiz-
19.Pengenalan Ikon
19.Pengenalan Ikon
Video 3 menit 42 detik
20.Kuis Pop-Up: Pengenalan Ikon
20.Kuis Pop-Up: Pengenalan Ikon
H5P-
21.Prinsip Penggunaan Ikon
21.Prinsip Penggunaan Ikon
Video 7 menit 18 detik
22.Kuis Pop-Up: Prinsip Penggunaan Ikon
22.Kuis Pop-Up: Prinsip Penggunaan Ikon
Quiz-
23.Teori Warna: Hue, Saturation, dan Value
23.Teori Warna: Hue, Saturation, dan Value
Video 3 menit 58 detik
24.Kuis Pop-Up: Teori Warna
24.Kuis Pop-Up: Teori Warna
Quiz-
25.Warna: Pertimbangan dalam Menentukannya
25.Warna: Pertimbangan dalam Menentukannya
Video 6 menit 28 detik
26.Kuis Pop-Up: Pertimbangan Menentukan Warna
26.Kuis Pop-Up: Pertimbangan Menentukan Warna
Quiz-
27.Prinsip Gestalt: Proximity
27.Prinsip Gestalt: Proximity
Video 5 menit 28 detik
28.Kuis Pop-Up: Prinsip Gestalt 1
28.Kuis Pop-Up: Prinsip Gestalt 1
H5P-
29.Prinsip Gestalt: Similarity sampai Closure
29.Prinsip Gestalt: Similarity sampai Closure
Video 6 menit 24 detik
30.Kuis Pop-Up: Prinsip Gestalt 2
30.Kuis Pop-Up: Prinsip Gestalt 2
Quiz-
31.Prinsip Gestalt: Symmetry sampai Common Fate
31.Prinsip Gestalt: Symmetry sampai Common Fate
Video 6 menit 30 detik
32.Kuis Pop-Up: Prinsip Gestalt 3
32.Kuis Pop-Up: Prinsip Gestalt 3
H5P-
33.Bedah UI Website 1 & 2
33.Bedah UI Website 1 & 2
Video 8 menit 54 detik
34.Kuis Pop-Up: Bedah UI Website 1 & 2
34.Kuis Pop-Up: Bedah UI Website 1 & 2
Quiz-
35.Bedah UI Website 3 & 4
35.Bedah UI Website 3 & 4
Video 8 menit 35 detik
36.Kuis Pop-Up: Bedah UI Website 3 & 4
36.Kuis Pop-Up: Bedah UI Website 3 & 4
Quiz-
37.Bedah UI Website 5
37.Bedah UI Website 5
Video 4 menit 42 detik
38.Kuis Pop-Up: Bedah UI Website 5
38.Kuis Pop-Up: Bedah UI Website 5
Quiz-
39.Interaction Design dalam UI dan Komponennya
39.Interaction Design dalam UI dan Komponennya
PDF-
40.Kuis : Dasar User Interface Website
40.Kuis : Dasar User Interface Website
Test-
Pengenalan Desain Website dengan Figma
Merancang Desain Prototype dengan Figma
Membuat Website Sederhana dengan HTML
Membuat Website dengan Wordpress
Post Test
Rekomendasi kelas lainnya
Durasi Kelas:
9 Jam 14 Menit
Harga Kelas: Rp 1.000.000
Durasi Kelas:9 Jam 14 Menit
Rp 0