logo
logo icon

Kursus Lengkap UI/UX Design: Figma, Design Thinking, dan Prototyping

UI/UX Design
Kursus Lengkap UI/UX Design: Figma, Design Thinking, dan Prototyping
Teacher

admin

Last Update:

November 17, 2024

Review:
0(0)

About Course

Kursus Kursus Lengkap UI/UX Design: Figma, Design Thinking, dan Prototyping adalah pelatihan praktis yang dirancang untuk membekali Anda dengan keterampilan mendalam dalam merancang pengalaman pengguna yang efektif. Dengan menggunakan Figma dan metodologi Design Thinking, Anda akan mempelajari cara membuat desain UI/UX yang intuitif, responsif, dan interaktif, serta mengembangkan prototipe yang siap diuji. Kursus ini cocok bagi pemula dan profesional yang ingin menguasai teknik desain modern, mulai dari wireframing hingga usability testing, untuk menciptakan solusi digital yang benar-benar berfokus pada kebutuhan pengguna.

About Course

Kursus ini dirancang untuk memberikan pemahaman dan keterampilan praktis dalam mendesain pengalaman pengguna (UI/UX) yang efektif, mulai dari tahap perencanaan hingga implementasi dengan menggunakan alat desain modern seperti Figma. Dalam kursus ini, Anda akan mempelajari bagaimana menerapkan Design Thinking sebagai kerangka kerja dalam merancang solusi yang berfokus pada pengguna, serta bagaimana memanfaatkan Figma untuk membuat desain yang interaktif, responsif, dan sesuai dengan kebutuhan pengguna.

What Will You Learn?

  • Dasar-dasar UI/UX Design: Memahami konsep dasar dari User Interface (UI) dan User Experience (UX), serta perbedaan penting di antara keduanya untuk menciptakan pengalaman digital yang intuitif dan memuaskan.
  • Figma untuk Desain UI/UX: Cara menggunakan Figma, alat desain berbasis cloud yang populer, untuk merancang antarmuka pengguna, membuat prototipe interaktif, dan berkolaborasi secara efisien dalam tim.
  • Design Thinking: Langkah-langkah dalam proses Design Thinking, mulai dari empathize untuk memahami pengguna, define untuk menetapkan masalah yang tepat, hingga ideate dan prototype untuk merancang solusi kreatif dan efektif.
  • Prototyping & Interaktivitas: Teknik untuk membuat wireframes, interactive prototypes, dan elemen desain responsif di Figma. Anda juga akan mempelajari cara membuat animasi dan interaksi menggunakan microinteractions dan smart animate di Figma.
  • Usability Testing: Cara menguji dan mengevaluasi desain Anda melalui usability testing, serta bagaimana mengumpulkan feedback dari pengguna untuk meningkatkan desain.
  • Desain untuk Berbagai Platform: Mengoptimalkan desain untuk tampilan desktop, tablet, dan mobile, serta cara menggunakan Auto Layout dan responsive design untuk menciptakan antarmuka yang adaptif.

Course Content

1. UI (User Interface) dan UX (User Experience)

  • 1.1 Definisi UI (User Interface)
    03:37
  • 1.2 Definisi UX (User Experience)
    03:37
  • 1.3 Perbedaan UI dan UX
    03:17

2. Pengenalan Figma dan Figjam

3. Cara Mengunduh dan Menggunakan Figma

4. Design Thinking

5. Fase Empathize dalam UX

6. Fase Define dalam Design Thinking

7. Fase Ideate dalam Design Thinking

8. Fase Prototype dalam Design Thinking

9. Auto Layout dan Komponen di Figma

10. Tutorial Mendesain Landing Page

11. Fase Test dalam Design Thinking

12. Karir dan Penutup

13. Pengenalan Figma dan Fitur-fiturnya

14. Microinteraction di Figma

Student Ratings & Reviews

No Review Yet
No Review Yet
Free
Free access this course
  • Instructor
    admin
  • Language
    English

Payment :

img

Material Includes

  • 1. UI/UX Design Fundamentals
  • 1.1 Definisi UI (User Interface)
  • 1.2 Definisi UX (User Experience)
  • 1.3 Perbedaan UI dan UX
  • 2. Pengenalan Figma dan Figjam
  • 2.1 Pengenalan Figma
  • 2.2 Pengenalan Figjam
  • 3. Mengunduh dan Menggunakan Figma
  • 3.1 Cara Mengunduh Figma
  • 3.2 Cara Menginstall Figma
  • 3.3 Figma Web, Figma Desktop, dan Figma Mobile
  • 3.4 Fitur pada Figma
  • 4. Design Thinking
  • 4.1 Pengertian Design Thinking
  • 4.2 Fungsi Design Thinking
  • 4.3 Tahapan Design Thinking
  • 5. Fase Empathize dalam UX
  • 5.1 Fase Empathize – Understanding User dalam UX
  • 5.2 Pengertian Primary Research dan Secondary Research
  • 5.3 Melakukan Secondary Research Sederhana dalam UX
  • 5.4 Pengertian User Persona
  • 5.5 Cara Membuat User Persona
  • 6. Fase Define dalam Design Thinking
  • 6.1 Fase Define – Menentukan User Pain Point
  • 6.2 Menentukan Problem Statement dan How Might We
  • 7. Fase Ideate dalam Design Thinking
  • 7.1 Fase Ideate – Pembuatan Solution Idea
  • 7.2 Cara Menyusun Solution Idea
  • 7.3 Pengertian Affinity Diagram
  • 7.4 Cara Menyusun Affinity Diagram
  • 7.5 Pengertian Prioritization Idea
  • 7.6 Cara Melakukan Prioritization Idea
  • 7.7 Mengenal Metode Brainstorm Crazy 8
  • 7.8 Pengertian User Flow
  • 7.9 Cara Membuat User Flow
  • 8. Fase Prototype dalam Design Thinking
  • 8.1 Fase Prototype – Pengertian Wireframe
  • 8.2 Cara Membuat Wireframe Desktop
  • 8.3 Cara Membuat Wireframe Mobile
  • 8.4 Pengertian Design System
  • 8.5 Komponen Design System
  • 8.6 Panduan Membuat Text Style Desktop
  • 8.7 Panduan Membuat Text Style Mobile
  • 8.8 Panduan Membuat Color Style Desktop dan Mobile
  • 8.9 Panduan Membuat Grid Style Desktop
  • 8.10 Panduan Membuat Grid Style Mobile
  • 8.11 Panduan Membuat Effect Style Desktop dan Mobile
  • 9. Auto Layout dan Komponen di Figma
  • 9.1 Auto Layout pada Figma
  • 9.2 Component Library pada Figma
  • 9.3 Panduan Membuat Button Menggunakan Auto Layout
  • 9.4 Panduan Membuat Input Field Menggunakan Auto Layout
  • 9.5 Mengenal Responsive Design
  • 9.6 Mengenal Micro Interaction
  • 9.7 Panduan Membuat Interactive Radio Button
  • 9.8 Panduan Membuat Interactive Toggle Switch Button
  • 9.9 Panduan Membuat Interactive Checkbox Button
  • 9.10 Panduan Membuat Loading Bar
  • 9.11 Panduan Membuat Interactive Input Field
  • 9.12 Panduan Membuat Interactive Star Rating
  • 9.13 Panduan Membuat Interactive Floating Action Button
  • 10. Tutorial Mendesain Landing Page
  • 10.1 Tutorial Mendesain Header (Hero) Landing Page
  • 10.2 Tutorial Mendesain Body Landing Page
  • 10.3 Tutorial Mendesain Footer Landing Page
  • 10.4 Tutorial Mendesain Landing Page Mobile Version
  • 11. Fase Test dalam Design Thinking
  • 11.1 Fase Test – Mengenal Usability Testing
  • 11.2 Membuat Stimulus Usability Testing
  • 11.3 Membuat Dokumen Record Usability Testing
  • 11.4 Membuat Portfolio UI/UX Design
  • 12. Karir dan Penutup
  • 12.1 Berkarir Sebagai UI/UX Designer
  • 12.2 Penutup
  • 13. Pengenalan Figma dan Fitur-fiturnya
  • 13.1 Apa itu Figma
  • 13.2 Fitur-fitur Kece Figma
  • 13.3 Recreating Design di Figma
  • 13.4 Prototyping di Figma
  • 13.5 Tips dan Trik Figma
  • 14. Microinteraction di Figma
  • 14.1 Introduction to Microinteraction
  • 14.2 Smart Animate in Figma
  • 14.3 Tab Navigation Animation
  • 14.4 Custom Smart Animate Part 1
  • 14.5 Custom Smart Animate Part 2
  • 14.6 Building Onboarding Screen Part 1
  • 14.7 Building Onboarding Screen Part 2

Requirements

  • Requirements:
  • Komputer atau laptop dengan sistem operasi Windows, macOS, atau Linux
  • Koneksi internet yang stabil
  • Akun Figma (dapat dibuat gratis)
  • Software browser modern (Google Chrome, Firefox, Safari, dll.)
  • Keinginan untuk belajar desain UI/UX dan berlatih menggunakan Figma
  • Instructions:
  • Daftar untuk kursus ini melalui platform kursus yang ditentukan
  • Unduh dan instal Figma di komputer atau akses versi web di browser Anda
  • Pastikan Anda memiliki akun Figma yang aktif
  • Siapkan catatan atau alat untuk menyimpan ide dan wawasan selama kursus
  • Ikuti setiap modul secara berurutan untuk mendapatkan pemahaman yang komprehensif
  • Praktikkan setiap tutorial dan proyek desain yang diberikan
  • Gunakan Figma untuk membuat desain dan prototipe Anda sendiri
  • Lakukan usability testing dan evaluasi desain Anda berdasarkan feedback pengguna
  • Selesaikan tugas akhir atau proyek portofolio untuk menguji keterampilan Anda
  • Jangan ragu untuk bertanya atau mencari bantuan melalui forum atau komunitas yang tersedia

Audience

  • Desainer UI/UX Pemula
  • Desainer Grafis yang ingin beralih ke UI/UX
  • Pengembang Web atau Aplikasi
  • Mahasiswa Desain atau Teknologi
  • Profesional yang ingin memperdalam keterampilan UI/UX
  • Startup Founders atau Pengusaha
  • Freelancer di bidang desain digital
X