Monthly Subscription Starting at AED 99 + VAT
- Level Foundation
- Duration 40 hours
-
Offered by
About
Mendesain Web yang Responsif di Adobe XD adalah materi keenam dalam program yang akan membekali Anda dengan keterampilan yang dibutuhkan untuk melamar pekerjaan tingkat pemula dalam desain pengalaman pengguna (UX). Dalam materi ini, Anda akan merancang situs web responsif menggunakan Adobe XD, sebuah alat desain yang populer. Anda akan menyelesaikan proses desain dari awal hingga akhir: berempati kepada pengguna, menentukan titik kesulitan/masalah pengguna, menghasilkan ide untuk solusi desain, membuat wireframe dan purwarupa, serta menguji desain untuk mendapatkan masukan. Pada akhir materi ini, Anda akan memiliki sebuah proyek desain baru untuk dimasukkan ke dalam portofolio UX profesional Anda. Selain itu, Anda akan belajar cara mencari pekerjaan desain UX tingkat pemula, membuat resume yang menonjolkan keterampilan dan pencapaian Anda, serta membangun situs web portofolio profesional Anda. Desainer dan peneliti UX dari Google akan menjadi instruktur Anda, dan Anda akan terlibat langsung dalam menyelesaikan berbagai aktivitas yang mengambil skenario desain UX dari dunia nyata. Pembelajar yang berhasil menyelesaikan ketujuh materi program sertifikat ini akan memiliki keterampilan untuk melamar pekerjaan sebagai desainer UX pemula. Pada akhir materi ini, Anda akan mampu: - Menerapkan setiap langkah proses desain UX (berempati, mendefinisikan, memunculkan ide, membuat purwarupa, menguji) untuk membuat situs web yang responsif. - Mengembangkan desain dengan alat desain yang populer, Adobe XD. - Merencanakan arsitektur informasi dan membuat peta situs untuk desain situs web. - Menerapkan tata letak umum untuk laman web. - Merencanakan dan melakukan studi kegunaan untuk mengumpulkan masukan tentang desain. - Mengubah desain berdasarkan wawasan penelitian - Bekerja dengan sistem desain di Adobe XD. - Menambahkan proyek desain baru ke portofolio UX profesional Anda. - [Opsional] Membuat atau memperbarui resume yang berfokus pada UX. - [Opsional] Mempelajari cara mencari dan melamar pekerjaan tingkat pemula di bidang UX. Materi ini sesuai untuk desainer UX tingkat pemula yang telah menyelesaikan kelima materi Sertifikat Desain UX Google sebelumnya. Atau, pembelajar yang memerlukan pemahaman dasar yang kuat tentang proses desain; pengalaman membuat wireframe, maket, dan purwarupa; serta kemampuan untuk melakukan studi kegunaan. Tidak diperlukan pengalaman dengan Adobe XD sebelumnya.Modules
Pengantar Materi 6
-
2
Videos
-
3
Readings
-
1
Quiz
2
Videos
- Pengantar Materi 6: Responsive Web Design in Adobe XD (Mendesain Web Responsif di Adobe XD)
- Dave - Perjalanan saya menuju UX
3
Readings
- Selamat datang di Materi 6
- Pengantar proyek portofolio kedua
- Pilih petunjuk (prompt) proyek portofolio Anda yang kedua
1
Quiz
- Aktivitas: Kirimkan petunjuk proyek portofolio pilihan Anda
Pengantar Adobe XD
-
5
Videos
-
2
Readings
-
2
Discussion
-
2
Quiz
2
Discussions
- Bagikan kegembiraan Anda tentang mempelajari Adobe XD
- Membandingkan dan membedakan Adobe XD dan Figma
5
Videos
- Selamat datang di minggu 1
- Memahami website responsif
- Pengantar Adobe XD
- Memulai proyek di Adobe XD
- Jennifer - Menggunakan tool untuk desain digital
2
Readings
- Mulai menggunakan Adobe XD
- Opsional - Mulai menggunakan Figma
2
Quiz
- Uji pengetahuan Anda tentang desain website responsif
- Uji pengetahuan Anda tentang dasar-dasar Adobe XD
Rasa empati terhadap pengguna
-
2
Videos
-
6
Readings
-
2
Discussion
-
3
Quiz
2
Discussions
- Berdiskusi tentang pentingnya mempertimbangkan kebutuhan pengguna
- Berbagi pertanyaan wawancara
2
Videos
- Berempati dengan pengguna untuk memahami kebutuhan dan titik permasalahan mereka
- Membuat persona
6
Readings
- Mempelajari lebih lanjut tentang berempati dengan pengguna
- Lakukan wawancara untuk peta empati
- Membuat peta empati
- Contoh Aktivitas: Membuat sebuah peta empati
- Mempelajari lebih lanjut tentang persona
- Contoh Aktivitas: Membuat persona
3
Quiz
- Uji pengetahuan Anda tentang berempati dengan pengguna
- Aktivitas: Membuat sebuah peta empati
- Aktivitas: Membuat persona
Mendefinisikan kebutuhan pengguna
-
2
Videos
-
3
Readings
-
1
Discussion
-
1
Quiz
1
Discussions
- Buat dan bagikan cerita pengguna tentang diri Anda
2
Videos
- Membuat cerita pengguna
- Membuat peta perjalanan pengguna
3
Readings
- Pelajari lebih lanjut tentang cerita pengguna
- Pelajari lebih lanjut tentang peta perjalanan pengguna
- Contoh Aktivitas: Membuat cerita pengguna dan peta perjalanan pengguna
1
Quiz
- Aktivitas: Membuat cerita pengguna dan peta perjalanan pengguna
Mendefinisikan masalah
-
1
Videos
-
1
Readings
-
1
Quiz
1
Videos
- Mengembangkan pernyataan masalah
1
Readings
- Mempelajari lebih lanjut tentang pernyataan masalah
1
Quiz
- Uji pengetahuan Anda tentang pernyataan masalah
Ulasan minggu 1
-
1
Videos
-
1
Readings
-
1
PeerReview
1
Peer Review
- Tantangan mingguan 1: Menyusun pernyataan masalah.
1
Videos
- Akhir kata: Memulai proses desain UX: Berempati dan mendefinisikan
1
Readings
- Daftar istilah
Melakukan audit kompetitif
-
2
Videos
-
3
Readings
-
2
Quiz
2
Videos
- Selamat datang di Minggu ke-2
- Melakukan audit kompetitif
3
Readings
- Mempelajari lebih lanjut tentang audit kompetitif
- Contoh Aktivitas: Melakukan audit kompetitif untuk website Anda
- Pelajari selengkapnya tentang menggunakan audit kompetitif untuk ideasi
2
Quiz
- Aktivitas: Melakukan audit kompetitif untuk website Anda
- Refleksi Diri: Menggunakan penelitian kompetitif untuk menginformasikan desain
Menghasilkan ide untuk desain
-
2
Videos
-
2
Readings
-
1
Discussion
-
2
Quiz
1
Discussions
- Diskusikan teknik ideasi pilihan Anda
2
Videos
- Memunculkan ide menggunakan “How Might We”
- Memunculkan ide menggunakan “Crazy Eights”
2
Readings
- Pelajari lebih lanjut tentang “How Might We” dan “Crazy Eights”
- Contoh Aktivitas: Memunculkan ide untuk website Anda
2
Quiz
- Uji pengetahuan Anda tentang teknik ideasi
- Aktivitas: Memunculkan ide untuk website Anda
Merencanakan information architecture (arsitektur informasi)
-
4
Videos
-
2
Readings
-
1
Discussion
-
1
Quiz
-
1
Plugin
1
Discussions
- Diskusikan struktur website yang pernah Anda gunakan
4
Videos
- Merencanakan information architecture (arsitektur informasi)
- Mengeksplorasi struktur website yang umum
- Mengeksplorasi sitemap
- Membuat sitemap untuk website Anda
2
Readings
- Pelajari selengkapnya tentang arsitektur informasi
- Pelajari selengkapnya tentang membuat sitemap
1
Quiz
- Uji pengetahuan Anda tentang struktur website
Tinjauan Minggu ke-2
-
1
Videos
-
1
Readings
-
1
PeerReview
1
Peer Review
- Tantangan Mingguan 2: Membuat sitemap untuk website
1
Videos
- Kesimpulan: Melanjutkan proses desain UX: Ideate (Ideasi)
1
Readings
- Daftar istilah
Membuat wireframe kertas
-
3
Videos
-
3
Readings
-
1
Quiz
-
1
Plugin
3
Videos
- Selamat datang di minggu ke-3
- Menjelajahi tata letak umum untuk laman beranda situs web
- Dasar-dasar wireframe
3
Readings
- Pelajari lebih lanjut tentang tata letak situs web umum
- Mempelajari lebih lanjut tentang wireframe
- Contoh Kegiatan: Mulai membuat wireframe kertas untuk situs web Anda
1
Quiz
- Kegiatan: Mulai membuat wireframe kertas untuk situs web Anda
Merencanakan laman web yang responsif
-
2
Videos
-
3
Readings
-
1
Quiz
-
1
Plugin
2
Videos
- Merencanakan tata letak responsif
- Menyesuaikan tata letak halaman berdasarkan ukuran layar
3
Readings
- Pelajari lebih lanjut tentang menyusun tata letak responsif
- Elemen umum yang digunakan dalam desain responsif
- Contoh Kegiatan: Membuat variasi wireframe kertas
1
Quiz
- Kegiatan: Membuat variasi wireframe kertas
Membuat wireframe digital di Adobe XD
-
4
Videos
-
5
Readings
-
2
Quiz
4
Videos
- Melakukan transisi dari wireframe kertas ke digital
- Membuat wireframe digital di Adobe XD
- Membuat wireframe untuk ukuran layar tambahan di Adobe XD
- Jay - Mendesain dengan Adobe XD
5
Readings
- Pelajari lebih lanjut tentang membuat wireframe digital di Adobe XD
- Opsional - Membuat wireframe digital di Figma
- Contoh Kegiatan: Membuat wireframe digital untuk ukuran layar desktop
- Opsional - Membuat wireframe untuk ukuran layar tambahan di Figma
- Contoh Kegiatan: Membuat wireframe digital untuk ukuran layar tambahan
2
Quiz
- Kegiatan: Membuat wireframe digital untuk ukuran layar desktop
- Kegiatan: Membuat wireframe digital untuk ukuran layar tambahan
Menyempurnakan wireframe
-
2
Videos
-
1
Readings
-
1
Discussion
1
Discussions
- Mempertimbangkan heading, landmark, dan titik fokus dalam wireframe Anda
2
Videos
- Memperbaiki wireframe untuk meningkatkan aksesibilitas
- Mengevaluasi wireframe menggunakan Prinsip Gestalt
1
Readings
- Pelajari lebih lanjut tentang penerapan Prinsip Gestalt dalam wireframe
Ulasan minggu ke-3
-
1
Videos
-
1
Readings
-
1
PeerReview
1
Peer Review
- Tantangan Mingguan 3: Menyempurnakan wireframe untuk memenuhi standar
1
Videos
- Penutup: Membuat wireframe untuk situs web responsif
1
Readings
- Glosarium
Membuat purwarupa low-fidelity di Adobe XD
-
3
Videos
-
4
Readings
-
2
Quiz
3
Videos
- Selamat datang di minggu ke-4
- Memahami purwarupa low-fidelity
- Membuat purwarupa low-fidelity di Adobe XD
4
Readings
- Pelajari lebih lanjut tentang pembuatan purwarupa low-fidelity di Adobe XD
- Opsional - Membuat purwarupa low-fidelity di Figma
- Contoh Kegiatan: Membuat purwarupa low-fidelity untuk situs web responsif
- Memeriksa purwarupa low-fidelity
2
Quiz
- Uji pengetahuan Anda tentang wireframe vs purwarupa
- Kegiatan: Membuat purwarupa low-fidelity untuk situs web responsif
Merencanakan dan melakukan studi kegunaan untuk purwarupa low-fidelity
-
4
Videos
-
6
Readings
-
1
Discussion
-
4
Quiz
1
Discussions
- Bagikan wawasan dari studi kegunaan Anda
4
Videos
- Merencanakan studi penelitian UX
- Melakukan studi kegunaan
- Mengurangi bias dalam studi kegunaan
- Melakukan analisis dan sintesis pada hasil penelitian
6
Readings
- Pelajari lebih lanjut tentang cara merencanakan studi penelitian UX
- Contoh Kegiatan: Merencanakan studi penelitian UX
- Pelajari lebih lanjut tentang cara melakukan studi kegunaan
- Contoh Kegiatan: Melakukan studi kegunaan untuk purwarupa low-fidelity
- Pelajari lebih lanjut tentang cara menganalisis dan menyintesis hasil penelitian
- Contoh Kegiatan: Menganalisis dan menyintesis hasil studi kegunaan
4
Quiz
- Kegiatan: Merencanakan studi penelitian UX
- Refleksi Mandiri: Tentukan cara untuk mengurangi bias dalam studi Anda
- Kegiatan: Melakukan studi kegunaan untuk purwarupa low-fidelity
- Kegiatan: Menganalisis dan menyintesis hasil studi kegunaan
Melakukan iterasi pada desain berdasarkan temuan penelitian
-
1
Videos
-
1
Readings
-
1
Discussion
-
1
Quiz
1
Discussions
- Ceritakan bagaimana Anda melakukan iterasi pada desain berdasarkan wawasan penelitian
1
Videos
- Melakukan iterasi pada desain low-fidelity berdasarkan temuan penelitian
1
Readings
- Mempelajari lebih lanjut tentang cara iterasi pada desain low-fidelity
1
Quiz
- Uji pengetahuan Anda tentang memodifikasi desain berdasarkan temuan penelitian
Ulasan minggu ke-4
-
1
Videos
-
1
Readings
-
1
PeerReview
1
Peer Review
- Tantangan Mingguan 4: Memperbarui purwarupa low-fidelity berdasarkan wawasan studi kegunaan
1
Videos
- Akhir kata: Membuat dan menguji purwarupa low-fidelity
1
Readings
- Glosarium
Mulai mendesain mockup
-
2
Videos
-
3
Readings
-
1
Quiz
2
Videos
- Selamat datang di minggu ke-5
- Mulai mendesain mockup
3
Readings
- Pengantar elemen-elemen dasar desain visual
- Meninjau cara mengatur elemen dalam mockup
- Meninjau prinsip-prinsip desain visual
1
Quiz
- Uji pengetahuan Anda tentang dasar-dasar mockup
Buat mockup untuk website desktop
-
2
Videos
-
4
Readings
-
2
Quiz
2
Videos
- Mulai membuat mockup untuk beranda website di Adobe XD
- Melanjutkan membuat mockup untuk beranda website di Adobe XD
4
Readings
- Opsional - Mulai membuat mockup website di Figma
- Menambahkan gambar dan logo ke mockup di Adobe XD
- Menggunakan repeat grid untuk mendesain di Adobe XD
- Contoh Kegiatan: Membuat mockup untuk website
2
Quiz
- Uji pengetahuan Anda tentang membuat beranda di Adobe XD
- Aktivitas: Membuat mockup untuk website
Membuat mockup untuk website seluler
-
1
Videos
-
3
Readings
-
1
Quiz
1
Videos
- Membuat mockup untuk website seluler di Adobe XD
3
Readings
- Pelajari lebih lanjut tentang menu navigasi yang tersembunyi
- Opsional - Buat mockup untuk website seluler di Figma
- Contoh Kegiatan: Membuat mockup untuk beranda website seluler
1
Quiz
- Aktivitas: Membuat mockup untuk beranda website seluler
Bekerja dengan sistem desain
-
2
Videos
-
2
Readings
-
1
Discussion
-
3
Quiz
1
Discussions
- Bagikan sistem desain favorit Anda
2
Videos
- Bekerja dengan sistem desain
- Menggunakan sistem desain eksternal di Adobe XD
2
Readings
- Pelajari lebih lanjut tentang sistem desain
- Opsional - Contoh Aktivitas: Membuat lembar stiker di Figma
3
Quiz
- Uji pengetahuan Anda tentang bekerja dengan sistem desain
- Aktivitas: Mendokumentasikan keputusan desain Anda
- Opsional - Aktivitas: Membuat lembar stiker di Figma
Membuat purwarupa high-fidelity
-
2
Videos
-
1
Readings
-
1
Discussion
-
1
Quiz
1
Discussions
- Bagikan referensi tentang desain yang inklusif dan aksesibel
2
Videos
- Membuat purwarupa high-fidelity di Adobe XD
- Anotasi purwarupa untuk aksesibilitas web
1
Readings
- Pelajari lebih lanjut tentang aksesibilitas web
1
Quiz
- Uji pengetahuan Anda tentang aksesibilitas web
Ulasan minggu ke-5
-
1
Videos
-
1
Readings
-
1
PeerReview
1
Peer Review
- Ujian Mingguan ke-5: Membuat purwarupa high-fidelity untuk sebuah website
1
Videos
- Akhir kata: Membuat dan menguji desain high-fidelity
1
Readings
- Daftar istilah
Opsional - Uji purwarupa high-fidelity yang Anda buat
-
1
Videos
-
1
Readings
-
1
Quiz
1
Videos
- Opsional - Uji purwarupa high-fidelity yang Anda buat
1
Readings
- Opsional - Tinjau cara merencanakan dan melakukan studi kegunaan
1
Quiz
- Uji pengetahuan Anda tentang studi kegunaan
Menyerahkan desain
-
3
Videos
-
1
Readings
-
1
Quiz
3
Videos
- Selamat datang di Minggu ke-6
- Berkolaborasi dengan tim teknik
- Menyerahkan spesifikasi desain di Adobe XD
1
Readings
- Berkolaborasi secara jarak jauh dengan Adobe XD
1
Quiz
- Uji pengetahuan Anda tentang penyerahan desain
Menambahkan proyek ke portofolio Anda
-
1
Videos
-
1
Readings
-
1
Discussion
-
1
Quiz
-
1
PeerReview
1
Peer Review
- Menambahkan studi kasus baru ke portofolio Anda
1
Discussions
- Membagikan studi kasus tentang desain website yang ada di portofolio
1
Videos
- Menambahkan proyek ke portofolio Anda your portfolio
1
Readings
- Mempelajari lebih lanjut tentang studi kasus portofolio
1
Quiz
- Uji pengetahuan Anda tentang studi kasus dalam portofolio
Opsional - Mencari pekerjaan UX
-
5
Videos
-
4
Readings
-
3
Quiz
5
Videos
- Memahami pekerjaan yang dilakukan para desainer UX pada umumnya
- Mengeksplorasi jenis perusahaan tempat desainer UX bekerja
- Kenny - Ketekunan
- Mengidentifikasi tempat untuk melamar pekerjaan desain UX
- Memindai deskripsi pekerjaan untuk mencari kata-kata kunci
4
Readings
- Mempelajari lebih lanjut tentang pekerjaan di bidang pengalaman pengguna
- Menemukan peluang kerja di bidang desain UX
- Contoh Aktivitas: Mulai mencari pekerjaan UX menggunakan pelacak
- Contoh Aktivitas: Menyoroti kata-kata kunci dan persyaratan yang dibutuhkan dalam deskripsi pekerjaan
3
Quiz
- Refleksi Diri: Sampaikan tujuan dan minat profesional Anda
- Aktivitas: Mulai mencari pekerjaan UX menggunakan pelacak
- Aktivitas: Menyoroti kata-kata kunci dan persyaratan yang dibutuhkan dalam deskripsi pekerjaan
Opsional - Membuat resume desain UX
-
4
Videos
-
2
Readings
-
2
Quiz
4
Videos
- Memahami resume desain UX
- Dane - Nasehat saya untuk resume di bidang desain UX
- Tim - Nasihat seorang perekrut tentang resume desain UX
- Memperbarui resume berdasarkan deskripsi pekerjaan
2
Readings
- Elemen-elemen yang khas dalam resume desain UX
- Contoh Aktivitas: Membuat draf resume desain UX
2
Quiz
- Refleksi Diri: Pikirkan tentang informasi yang harus disertakan ke dalam resume Anda
- Aktivitas: Membuat draf resume desain UX
Ulasan Minggu ke-6
-
1
Videos
-
1
Readings
-
1
Quiz
1
Videos
- Kesimpulan: Mendokumentasikan hasil desain dan mencari pekerjaan
1
Readings
- Daftar istilah
1
Quiz
- Tantangan Mingguan 6: Mendokumentasikan hasil desain dan mencari pekerjaan
Ulasan materi
-
1
Videos
-
1
Readings
-
1
Discussion
1
Discussions
- Bagikan pengalaman Anda selama mengikuti materi
1
Videos
- Selamat, Anda telah menyelesaikan Materi 6: Mendesain Web responsif di Adobe XD
1
Readings
- Memulai materi berikutnya
Auto Summary
Unlock your potential in UX design with "Mendesain Web yang Responsif di Adobe XD." This foundational course, led by Google's UX experts, guides you through creating responsive websites using Adobe XD. Ideal for beginners, it covers the entire UX design process, from user empathy to prototyping and testing. Gain practical skills, build a professional portfolio, and learn job-seeking strategies. With a 2400-minute duration, this course is available through Coursera's Starter and Professional subscriptions. Perfect for aspiring UX designers ready to advance their careers.