Akses kelas selamanya

Ambil Promo
flash sale
hamburger-menu

Kelas Online
Complete UI Designer : User Flow, Visual Design, Prototype

Flow UI/UX design from start to finish

icon global
Release date May 2024
icon convert
Last updated September 2024
Member

152 enrolled

Tingkatan
level
Sertifikat
icon_check
Konsultasi
icon_check

Develop Your Skills

Dalam kelas ini, kita akan mempelajari proses pembuatan website pemesanan travel package "Travelia" melalui proses UI/UX design.

Materi yang akan diberikan meliputi tahapan Ideation yaitu brainstorming menentukan problem, goals, serta target user dan akan dilanjut dengan membuat MindMap dan User Flow agar proses mempermudah melihat gambaran besar interaksi antara product dan user.

Setelah itu kita akan merancang Ideation tersebut menjadi Wireframe, untuk mendapaatkan rancangan tampilan serta component yang akan digunakan pada project yang kita buat.

Selanjutnya kita akan membuat Component dan Style Guide di Figma, agar saat membuat tampilan Visual Design proses pengerjaannya menjadi lebih cepat dan efisien.

Next kita akan mempelajari cara membuat tampilan Visual Design dengan memanfaatkan fitur Auto Layout di figma, agar kita memahami layout yang dapat didevelop, sehingga mempermudah proses handoff ke developer.

Kelas ini sangat cocok untuk Kamu yang berminat menjadi UI/UX designer profesional. Untuk memudahkan pembelajaran, kamu bisa menonton dahulu Kelas Design Starter BWA. Dan jangan ragu untuk berkonsultasi langsung dengan Mentor ahli kami di forum kelas. Tunggu apalagi? Segera bergabung dikelas ini dan raih keterampilan desain yang dapat meningkatkan peluang karir kamu di masa depan. Kami tunggu kehadiran kamu di kelas!

Sneak Peek

Key Points

icon_check

Memahami flow UI/UX Design mulai dari Brainstorming hingga Handoff design ke developer

icon_check

Membuat proses ideation, persona, dan userflow untuk menciptakan produk yang fungsional serta sesuai dengan kebutuhan user

icon_check

Membuat component dan variant pada figma agar proses design menjadi lebih cepat dan efisien

icon_check

Memahami Auto Layout agar proses design tampilan layout menjadi jauh lebih cepat

Designed For

icon_check

Anda yang ingin punya portfolio design menarik

icon_check

Anda yang sedang mempelajari UI/UX Design

icon_check

Anda yang ingin mendalami figma lebih advance

icon_check

Anda yang ingin belajar membuat design website travel

Course Lessons

Learn With Expert

Mentor Dhimas Prio

Dhimas Prio

Product Designer

ic-star ic-star ic-star ic-star ic-star

(51.1K)

Our Happy Students

Review setelah bergabung di kelas Complete UI Designer : User Flow, Visual Design, Prototype

All Rating
Alirouf Rafani at BuildWithAngga
Alirouf Rafani

Full-Stack Developer

Mantap, Penjelasannya sangat detail. Jadi tertarik lebih untuk mendalami dunia UI/UX Disign read more

ic-star ic-star ic-star ic-star ic-star
apip idn at BuildWithAngga
Apip idn

Lifetime Learner

semoga bisa selalu di adakan lagi kelas seperti ini lagi read more

ic-star ic-star ic-star ic-star ic-star
Muhammad Sultan Al Faisal at BuildWithAngga
Muhammad Sultan Al Faisal

Lifetime Learner

Saya mendapat banyak sekali ilmu yang belum saya dapatkan sebelumnya dan juga saya dapat mendalami lagi ilmu tentang figma dan whimsical read more

ic-star ic-star ic-star ic-star ic-star
Aqila Umar at BuildWithAngga
Aqila Umar

Lifetime Learner

Sangat bermanfaat, Terima kasih kak read more

ic-star ic-star ic-star ic-star ic-star
ALFATIH at BuildWithAngga
ALFATIH

Lifetime Learner

Sangat memuaskan sekali Krena dengan kelas ini Wawasan saya bertambah read more

ic-star ic-star ic-star ic-star ic-star
Muhammad Nasriandi at BuildWithAngga
Muhammad Nasriandi

Full-Stack Developer

ic-star ic-star ic-star ic-star ic-star
Belum ada review
loader
Load More Reviews

Tools Pendukung

Lengkapi semua pendukung di bawah sebelum belajar

logo

Figma

Software Gratis

logo

Whimsical

Software Gratis

Low Risk, High Return

Investasi kepada diri kita sendiri memberikan
leverage kuat untuk masa depan karir kita

icon_check

Selamanya

Rp 455,000

Miliki kelas Premium secara permanen dan bangun sebuah projek nyata

icon_check

Akses kelas selamanya

icon_check

Premium rewards

icon_check

Career consultation

icon_check

Assets & group konsultasi

icon_check

Sertifikat kelulusan

icon_check

Lowongan magang dan kerja

Lihat Benefit Lainnya

Pertanyaan Umum

Langkah yang tepat untuk berinvestasi kepada
ilmu pengetahuan yang baru di bidang IT

Contact CS

Tingkatan kelas Premium yang kami miliki dibangun untuk All Levels yang memberartikan bahwa cocok untuk seluruh tingkatan. Kami juga menyarankan calon member untuk mengikuti kelas Starter (gratis) terlebih dahulu sebagai permulaan.

Sertifikat kelulusan kelas hanya tersedia pada kelas Premium. Dan untuk mendapatkannya, para member diwajibkan untuk menyelesaikan seluruh materi kelas dan juga Quiz yang telah disediakan oleh mentor.

Salah satu benefit unggulan kami adalah group konsultasi yang diberikan sebagai bonus untuk member yang telah mengikuti kelas Premium di platform BuildWithAngga. Silakan menghubungi Admin untk mendapatkan akses pada group tersebut.

Kami mengizinkan member yang telah mengikuti kelas Premium untuk menjual kembali projek kelas kepada klien, perusahaan, etc. Syarat utamanya adalah dengan memodifikasi sedikitnya yaitu 30% dari original project buatan mentor kelas tersebut.

Kami melarang member menjual atau membagikan hak akses kelas Premium kepada orang lain yang tidak terdaftar pada kelas tersebut. Mari kita support creators Indonesia dengan cara membeli kelas secara resmi dan satu akun hanya untuk satu pengguna saja.

Kami tidak memperbolehkan member menjual kembali materi kelas di BuildWithAngga. Kami siap melanjutkan kepada proses hukum apabila Anda terbukti benar memperjualbelikan kelas kami secara ilegal.
Foto kelas Complete UI Designer : User Flow, Visual Design, Prototype Foto kelas Complete UI Designer : User Flow, Visual Design, Prototype Foto kelas Complete UI Designer : User Flow, Visual Design, Prototype Foto kelas Complete UI Designer : User Flow, Visual Design, Prototype

Complete UI Designer : User Flow, Visual Design, Prototype

Flow UI/UX design from start to finish

  • lock
    User Flow : Sign In and Sign Up
    4 minutes
  • lock
    User Flow : Home Page Destination
    6 minutes
  • lock
    User Flow : Detail Destination
    3 minutes
  • lock
    User : Flow Booking Details
    3 minutes
  • lock
    User Flow : Checkout
    4 minutes
  • lock
    User Flow : Schedule List
    5 minutes
  • lock
    User Flow : Profile and Search
    3 minutes

  • lock
    Wireframe : Sign in and Sign Up
    9 minutes
  • lock
    Wireframe : Home Page Part 1
    10 minutes
  • lock
    Wireframe : Home Page Part 2
    8 minutes
  • lock
    Wireframe : Details Page
    14 minutes
  • lock
    Wireframe : Booking Details
    11 minutes
  • lock
    Wireframe : Payment Method
    5 minutes
  • lock
    Wireframe : Checkout and Success
    10 minutes
  • lock
    Wireframe : Schedule and Trip Detail
    10 minutes

  • lock
    Import Asset
    2 minutes
  • lock
    Highlight Style Text dan Color
    2 minutes
  • lock
    Style Guide : Text Style
    7 minutes
  • lock
    Style Guide : Color Style
    13 minutes

  • lock
    Introduction Auto Layout
    5 minutes
  • lock
    Explanation Rezising Auto Layout
    8 minutes
  • lock
    Explanation Flow Auto Layout
    4 minutes
  • lock
    Explanation Gap Auto Layout
    5 minutes
  • lock
    Explanation Padding Auto Layout
    3 minutes
  • lock
    Explanation Alignment Auto Layout
    4 minutes

  • lock
    Create Component Icons
    6 minutes

  • lock
    Create Component Button
    13 minutes
  • lock
    Adding Variant Component Button
    12 minutes

  • lock
    Create Component Input Field
    8 minutes
  • lock
    Adding Property Component Input Field
    7 minutes
  • lock
    Adding Variant Component Input Field
    8 minutes

  • lock
    Create Component Badge
    8 minutes
  • lock
    Adding Variant and State Component
    10 minutes

  • lock
    Create Sign In UI Screen
    14 minutes
  • lock
    Create Sign Up UI Screen
    11 minutes

  • lock
    Header and Categories Section
    13 minutes
  • lock
    Card Items Section
    12 minutes
  • lock
    Card Explore Section
    6 minutes
  • lock
    Navigation Section
    9 minutes
  • lock
    Revision and Add Category Screen
    14 minutes

  • lock
    Image Preview Section
    10 minutes
  • lock
    Information Section
    5 minutes
  • lock
    About Destination Section
    3 minutes
  • lock
    Testimonial Section
    14 minutes
  • lock
    Bottom Navigation Section
    4 minutes

  • lock
    Date and Trip Section
    11 minutes
  • lock
    Contact, Summary, and Bottom
    8 minutes

  • lock
    Create All Section Screen
    11 minutes

  • lock
    Detail Trip Section
    7 minutes
  • lock
    Payment and Transfer Proof Section
    11 minutes

  • lock
    Success All Section Screen
    5 minutes
  • lock
    Schedule All Section Screen
    11 minutes
  • lock
    Trip Details All Section Screen
    6 minutes

  • lock
    Prototype : Sign In and Sign Up
    8 minutes
  • lock
    Prototype : Home to Details
    6 minutes
  • lock
    Prototype : Preview Image
    8 minutes
  • lock
    Finalizing Prototype
    9 minutes
Develop Your Skills

Dalam kelas ini, kita akan mempelajari proses pembuatan website pemesanan travel package "Travelia" melalui proses UI/UX design.

Materi yang akan diberikan meliputi tahapan Ideation yaitu brainstorming menentukan problem, goals, serta target user dan akan dilanjut dengan membuat MindMap dan User Flow agar proses mempermudah melihat gambaran besar interaksi antara product dan user.

Setelah itu kita akan merancang Ideation tersebut menjadi Wireframe, untuk mendapaatkan rancangan tampilan serta component yang akan digunakan pada project yang kita buat.

Selanjutnya kita akan membuat Component dan Style Guide di Figma, agar saat membuat tampilan Visual Design proses pengerjaannya menjadi lebih cepat dan efisien.

Next kita akan mempelajari cara membuat tampilan Visual Design dengan memanfaatkan fitur Auto Layout di figma, agar kita memahami layout yang dapat didevelop, sehingga mempermudah proses handoff ke developer.

Kelas ini sangat cocok untuk Kamu yang berminat menjadi UI/UX designer profesional. Untuk memudahkan pembelajaran, kamu bisa menonton dahulu Kelas Design Starter BWA. Dan jangan ragu untuk berkonsultasi langsung dengan Mentor ahli kami di forum kelas. Tunggu apalagi? Segera bergabung dikelas ini dan raih keterampilan desain yang dapat meningkatkan peluang karir kamu di masa depan. Kami tunggu kehadiran kamu di kelas!

read more
Learn With Expert
Key Points
  • check
    Memahami flow UI/UX Design mulai dari Brainstorming hingga Handoff design ke developer
  • check
    Membuat proses ideation, persona, dan userflow untuk menciptakan produk yang fungsional serta sesuai dengan kebutuhan user
  • check
    Membuat component dan variant pada figma agar proses design menjadi lebih cepat dan efisien
  • check
    Memahami Auto Layout agar proses design tampilan layout menjadi jauh lebih cepat
Created For
  • check
    Anda yang ingin punya portfolio design menarik
  • check
    Anda yang sedang mempelajari UI/UX Design
  • check
    Anda yang ingin mendalami figma lebih advance
  • check
    Anda yang ingin belajar membuat design website travel
For Your Career
phone
Akses Selamanya
Belajar lebih santai & produktif
private
Assets & Grup Private
Diskusi belajar agar lebih terarah
project
Sertifikat & Portfolio
Gunakan untuk modal bekerja
152
Happy Students
Alirouf Rafani at BuildWithAngga
Alirouf Rafani

Full-Stack Developer

Mantap, Penjelasannya sangat detail. Jadi tertarik lebih untuk mendalami dunia UI/UX Disign

ic-star ic-star ic-star ic-star ic-star
apip idn at BuildWithAngga
apip idn

Lifetime Learner

semoga bisa selalu di adakan lagi kelas seperti ini lagi

ic-star ic-star ic-star ic-star ic-star
Muhammad Sultan Al Faisal at BuildWithAngga
Muhammad Sultan Al Faisal

Lifetime Learner

Saya mendapat banyak sekali ilmu yang belum saya dapatkan sebelumnya dan juga saya dapat mendalami lagi ilmu tentang figma dan whimsical

ic-star ic-star ic-star ic-star ic-star
Aqila Umar at BuildWithAngga
Aqila Umar

Lifetime Learner

Sangat bermanfaat, Terima kasih kak

ic-star ic-star ic-star ic-star ic-star
ALFATIH at BuildWithAngga
ALFATIH

Lifetime Learner

Sangat memuaskan sekali Krena dengan kelas ini Wawasan saya bertambah

ic-star ic-star ic-star ic-star ic-star
Muhammad Nasriandi at BuildWithAngga
Muhammad Nasriandi

Full-Stack Developer

Good

ic-star ic-star ic-star ic-star ic-star
loader

Pertanyaan Umum

Langkah yang tepat untuk berinvestasi kepada
ilmu pengetahuan yang baru di bidang IT

Contact CS

Tingkatan kelas Premium yang kami miliki dibangun untuk All Levels yang memberartikan bahwa cocok untuk seluruh tingkatan. Kami juga menyarankan calon member untuk mengikuti kelas Starter (gratis) terlebih dahulu sebagai permulaan.

Sertifikat kelulusan kelas hanya tersedia pada kelas Premium. Dan untuk mendapatkannya, para member diwajibkan untuk menyelesaikan seluruh materi kelas dan juga Quiz yang telah disediakan oleh mentor.

Salah satu benefit unggulan kami adalah group konsultasi yang diberikan sebagai bonus untuk member yang telah mengikuti kelas Premium di platform BuildWithAngga. Silakan menghubungi Admin untk mendapatkan akses pada group tersebut.

Kami mengizinkan member yang telah mengikuti kelas Premium untuk menjual kembali projek kelas kepada klien, perusahaan, etc. Syarat utamanya adalah dengan memodifikasi sedikitnya yaitu 30% dari original project buatan mentor kelas tersebut.

Kami melarang member menjual atau membagikan hak akses kelas Premium kepada orang lain yang tidak terdaftar pada kelas tersebut. Mari kita support creators Indonesia dengan cara membeli kelas secara resmi dan satu akun hanya untuk satu pengguna saja.

Kami tidak memperbolehkan member menjual kembali materi kelas di BuildWithAngga. Kami siap melanjutkan kepada proses hukum apabila Anda terbukti benar memperjualbelikan kelas kami secara ilegal.

Rp 455,000

arrow_upward