Belajar Membuat Website untuk Menjadi Desainer Website
Kelas ini tidak hanya menambah wawasanmu untuk menjadi seorang web designer. Tetapi juga memberikan wawasan kepada kamu tentang bagaimana menyelesaikan suatu proyek website dengan client.
BEGINNER1 penilaian15 peserta
Tentang Kelas
Kelas ini tidak hanya menambah wawasanmu untuk menjadi seorang web designer. Tetapi juga memberikan wawasan kepada kamu tentang bagaimana menyelesaikan suatu proyek website dengan client. Tidak hanya teori saja, di kelas ini kamu akan dengan bisa merancang tampilan website yang baik mulai dari wireframing, prototyping dan menuangkan rancangan tadi menjadi website yang dapat digunakan tanpa banyak belajar pemrograman. Kelas ini cocok sekali untuk kamu yang ingin memulai profesi sebagai web designer atau web developer dengan mudah dan murah.
Adapun modul yang akan kamu pelajari seperti:
- Menganalisis kebutuhan bisnis
- Menuangkan kebutuhan bisnis ke rancangan desain web
- Mengonversi desain web menjadi halaman web
- Menambahkan efek animasi pada halaman web
- Menuliskan kode HTML & CSS tambahan
Di akhir pelatihan, diharapkan kamu mampu mendesain website menggunakan aplikasi Figma dan mengkonversinya ke dalam bentuk file HTML menggunakan aplikasi Wordpress Elementor dan code editor secara tepat sesuai dengan desain yang telah dibuat.
Daftar Materi
| Pengenalan Kelas | 00.00 | |
| Prasyarat Kemampuan | 00.00 | |
| Prasyarat Tools | 00.00 | |
| Mekanisme Belajar | 00.00 | |
| Evaluasi | 00.00 | |
| Glosarium | 00.00 |
| Pengantar menganalisis kebutuhan bisnis | 01:35 | |
| Menggali dan memahami kebutuhan bisnis | 05:08 | |
| Studi kasus menyusun daftar pertanyaan wawancara untuk menggali kebutuhan bisnis | 09:21 | |
| Menuangkan kebutuhan bisnis menjadi poin-poin spesifikasi antarmuka web | 02:48 | |
| Studi kasus wawancara dan mencatat kebutuhan bisnis ke dalam bentuk poin-poin spesifikasi antarmuka web | 10:05 | |
| Tips dan trik menggali informasi bisnis untuk kebutuhan pembuatan website | 02:36 | |
| Rangkuman Menganalisis kebutuhan bisnis | 00.00 |
| Pengantar menuangkan kebutuhan bisnis ke dalam rancangan desain web | 01:01 | |
| Antarmuka aplikasi Figma | 05:09 | |
| Studi kasus membuat project baru di Figma | 03:55 | |
| Tips dan trik penggunaan shortcut di aplikasi Figma | 06:04 | |
| Pengenalan Website | 04:18 | |
| Responsive Web Design | 02:33 | |
| Komponen Website | 03:12 | |
| Dasar User Interface | 04:00 | |
| Studi kasus membuat komponen website di Figma dan manipulasi parameter komponen part 1 | 09:30 | |
| Studi kasus membuat komponen website di Figma dan manipulasi parameter komponen part 2 | 05:50 | |
| Tips mendapatkan gambar ilustrasi yang bagus dan legal | 03:46 | |
| Tips memainkan kombinasi warna dan spasi | 06:00 | |
| Dasar User Experience | 03:12 | |
| Studi kasus membuat simulasi alur website di Figma | 05:02 | |
| Studi kasus menuangkan poin-poin spesifikasi bisnis ke dalam desain web | 01:00 | |
| Instalasi Plugin Figma | 06:07 | |
| Mengatur Grid Desain | 06:30 | |
| Merancang Style Typography | 09:50 | |
| Merancang Style Warna | 08:03 | |
| Merancang Komponen Header & Footer Part 1 | 09:52 | |
| Merancang Komponen Header & Footer Part 2 | 04:59 | |
| Merancang Komponen Header & Footer Part 3 | 07:57 | |
| Merancang Komponen Jumbotron Part 1 | 08:03 | |
| Merancang Komponen Jumbotron Part 2 | 07:41 | |
| Merancang Komponen Segmen Title | 06:01 | |
| Merancang Komponen Segmen Part 1 | 06:42 | |
| Merancang Komponen Segmen Part 2 | 06:15 | |
| Merancang Komponen Card Part 1 | 09:24 | |
| Merancang Komponen Card Part 2 | 05:53 | |
| Merancang Komponen Carousel | 07:36 | |
| Merancang Komponen Button Slider | 03:52 | |
| Merancang Komponen Testimoni | 07:12 | |
| Merancang Page Home Part 1 | 07:04 | |
| Merancang Page Home Part 2 | 08:20 | |
| Merancang Page Home Part 3 | 09:06 | |
| Merancang Page Visi Misi | 07:19 | |
| Merancang Page Galeri | 05:21 | |
| Merancang Page Kerjasama | 09:47 | |
| Merancang Page Program Studi | 09:28 | |
| Merancang Page Lowongan Kerja | 02:32 | |
| Merancang Page Lulusan Part 1 | 08:17 | |
| Merancang Page Lulusan Part 2 | 07:40 | |
| Merancang Page Blog | 03:49 | |
| Merancang Prototype Design Part 1 | 09:23 | |
| Merancang Prototype Design Part 2 | 07:48 | |
| Rangkuman Menuangkan kebutuhan bisnis ke dalam rancangan desain web | 00.00 |
| Pengantar | 03:18 | |
| Instalasi Laragon | 07:17 | |
| Instalasi Wordpress | 04:39 | |
| Antarmuka aplikasi wordpress | 05:17 | |
| Studi kasus membuat halaman web berdasarkan desain yang telah dibuat | 01:12 | |
| Instalasi plugin Elementor | 02:46 | |
| Mengatur Global Setting | 08:16 | |
| Membuat Header Part 1 | 09:57 | |
| Membuat Header Part 2 | 04:52 | |
| Membuat Footer | 09:47 | |
| Membuat Jumbotron dan Sambutan pada Page Home Part 1 | 05:48 | |
| Membuat Jumbotron dan Sambutan pada Page Home Part 2 | 06:54 | |
| Membuat Carousel pada Page Home Part 1 | 06:00 | |
| Membuat Carousel pada Page Home Part 2 | 10:01 | |
| Membuat Page Visi Misi | 06:25 | |
| Membuat Page Galeri | 04:33 | |
| Membuat Page Kerjasama Part 1 | 07:10 | |
| Membuat Page Kerjasama Part 2 | 04:46 | |
| Membuat Page Program Studi Part 1 | 08:19 | |
| Membuat Page Program Studi Part 2 | 05:17 | |
| Membuat Page Lowongan Kerja | 03:25 | |
| Membuat Page Lulusan Part 1 | 07:18 | |
| Membuat Page Lulusan Part 2 | 04:29 | |
| Membuat Page Blog | 03:57 | |
| Publish website | 08:51 | |
| Tips dan trik membangun halaman web lebih cepat dan tepat dengan desain | 04:04 | |
| Rangkuman Mengonversi desain web menjadi halaman web | 00.00 |
| Pengantar Menambahkan Efek Animasi pada Halaman Web | 02:05 | |
| Animasi web dengan JS dan CSS | 03:31 | |
| Studi kasus menambahkan animasi pada komponen di halaman web | 06:07 | |
| Tips menambahkan animasi yang cocok untuk memperindah tampilan halaman web | 02:46 | |
| Rangkuman Menambahkan efek animasi pada halaman web | 00.00 |
| Pengantar | 02:28 | |
| Dasar-dasar penggunaan code editor | 05:18 | |
| Dasar-dasar HTML | 03:04 | |
| Dasar-dasar CSS | 05:25 | |
| Studi kasus menambahkan kode HTML dan CSS pada bagian spesifik untuk tepat menyesuaikan halaman web dengan desain yang telah dibuat part 1 | 07:58 | |
| Studi kasus menambahkan kode HTML dan CSS pada bagian spesifik untuk tepat menyesuaikan halaman web dengan desain yang telah dibuat part 2 | 03:20 | |
| Tips mempelajari HTML dan CSS yang mudah dan menyenangkan | 02:59 | |
| Rangkuman Menuliskan kode HTML dan CSS tambahan | 00.00 |
Penyusun Materi
Yusuf Fazeri
Belum ada keterangan
Testimoni Oleh Siswa
5.0
(1 reviews)
5 Bintang
0%
4 Bintang
0%
3 Bintang
0%
2 Bintang
0%
1 Bintang
0%
Teguh Slamet Priyono
Sangat membantu belajar, menambah wawasan bagi yang ingin jadi desainer web/buka jasa web. Authornya keren, Mantap, Solutif,