Akses Selamanya
Masuk /
Daftar
Our Happy Students
Review setelah bergabung di kelas UI Grid System & Auto Layout : Bikin Landing Page dari Nol
Kelas Online Gratis
UI Grid System & Auto Layout : Bikin Landing Page dari Nol
Released date July 2025
Last updated March 2026
Member
998 enrolled
Lesson Type
Video Only
Tingkatan
Sertifikat
Konsultasi
-17 lessons (2.2 hours)
Develop Your Skills
Grid System dan Auto Layout adalah dua komponen penting dalam dunia UI Design modern, khususnya saat membangun desain landing page yang tertata dan responsif. Banyak perusahaan teknologi seperti Google dan Shopify menerapkan sistem grid secara konsisten agar desain tetap scalable dan mudah dimaintain oleh tim desain besar.
Di kelas ini, kita akan belajar dari nol bagaimana memahami Grid System, mengatur ukuran kolom, margin, dan gutter, serta mengimplementasikannya langsung di Figma menggunakan fitur Auto Layout. Kita juga akan membangun struktur desain landing page secara menyeluruh — mulai dari header, hero section, hingga testimonial dan footer.
Kelas ini cocok untuk Anda yang ingin memahami prinsip dasar layouting secara sistematis serta ingin menguasai Auto Layout di Figma agar workflow desain lebih efisien. Silakan daftar kelas gratis ini untuk mempelajari desain landing page yang presisi dan profesional. Sampai jumpa di kelas!
Key Points
Memahami prinsip dasar Grid System pada UI Design
Menentukan ukuran column, gutter, dan margin yang tepat untuk berbagai device
Menguasai fitur Auto Layout di Figma untuk membangun layout yang fleksibel
Membangun struktur landing page dari header hingga footer
Menerapkan grid dan auto layout secara real-time ke dalam desain landing page
Designed For
Anda yang ingin memahami Basic Grid System
Anda yang tertarik mendesain landing page yang rapi dan responsif
Anda yang ingin menguasai Auto Layout untuk efisiensi kerja di Figma
Anda yang ingin memiliki portofolio UI Design yang solid dan terstruktur
Anda yang ingin bekerja secara profesional dengan prinsip layouting yang benar
Course Lessons
Learn With Expert
Dhimas Prio
Product Designer
(56.8K)
Carto
Full-Stack Developer
materi yang sangat bagus untuk memulai mempelajari desain UI dengan figma read more
06 Mar 2026
.png)
Nur Kholiq Yoga Witanto
UI Designer
materi yang disampaikan sangat mudah dipahami dan saya sebagai pemula figma user dapat memahami apa yang disampaikan oleh pemateri read more
03 Mar 2026
Huzaifi Al Madani
UI Designer
penyampaian terhadap tema sangat teratur dan mudah untuk di ikuti, sekarang saya paham akan kegunaan grid system dan Auto Layout. Thanks read more
23 Jan 2026
Adli Dzil Ikram
Lifetime Learner
Belajar dari dasar, diberikan pemahaman dengan jelas, terimakasih untuk coursenya untuk menambah wawasan modal ilmu kedepannya read more
09 Dec 2025
Adnan Yazid Ardiansyah
Full-Stack Developer
Materi kelas ini sangat terstruktur dan mudah diikuti, bahkan untuk pemula. read more
30 Oct 2025
Belum ada review
Tools Pendukung
Lengkapi semua pendukung di bawah sebelum belajar
Figma
Software
#Starter
Start to Invest 100%
Langkah yang tepat untuk berinvestasi kepada
ilmu pengetahuan
yang
baru di bidang IT
Basic - Rp 0
Akses dan pelajari kelas Starter secara gratis tanpa sertifikat
Bayar 0 rupiah
Akses kelas selamanya
Plus - Rp 50,000
Unlock benefit lainnya yang bisa
didapatkan di kelas
Starter
Sekali bayar saja
Akses kelas selamanya
Sertifikat kelas
(327)
UI Grid System & Auto Layout : Bikin Landing Page dari Nol
-
Alasan Kelas Ini DibuatVideo 2 minutes
-
Penjelasan Grid SystemVideo 3 minutes
-
Grid di Semua Ukuran DeviceVideo 10 minutes
-
Praktik Grid di FigmaVideo 7 minutes
-
Penjelasan Auto LayoutVideo 5 minutes
-
Intro to Figma Auto LayoutVideo 11 minutes
-
Figma Playground Auto LayoutVideo 20 minutes
-
Import AssetVideo 1 minutes
-
Sign Up UIVideo 11 minutes
-
Sign In UIVideo 2 minutes
-
Navigation and Hero SectionVideo 12 minutes
-
Client and Benefit SectionVideo 10 minutes
-
Pricing SectionVideo 9 minutes
-
Testimonial SectionVideo 6 minutes
-
FAQ and Footer SectionVideo 15 minutes
-
Auto Layout vs Group vs FrameVideo 5 minutes
-
KesimpulanVideo 3 minutes
Member
998
Lesson Type
Video Only
Tingkatan
Sertifikat
Konsultasi
-
Develop Your Skills
Grid System dan Auto Layout adalah dua komponen penting dalam dunia UI Design modern, khususnya saat membangun desain landing page yang tertata dan responsif. Banyak perusahaan teknologi seperti Google dan Shopify menerapkan sistem grid secara konsisten agar desain tetap scalable dan mudah dimaintain oleh tim desain besar.
Di kelas ini, kita akan belajar dari nol bagaimana memahami Grid System, mengatur ukuran kolom, margin, dan gutter, serta mengimplementasikannya langsung di Figma menggunakan fitur Auto Layout. Kita juga akan membangun struktur desain landing page secara menyeluruh — mulai dari header, hero section, hingga testimonial dan footer.
Kelas ini cocok untuk Anda yang ingin memahami prinsip dasar layouting secara sistematis serta ingin menguasai Auto Layout di Figma agar workflow desain lebih efisien. Silakan daftar kelas gratis ini untuk mempelajari desain landing page yang presisi dan profesional. Sampai jumpa di kelas!
read more
Learn With Expert
Key Points
-
Memahami prinsip dasar Grid System pada UI Design
-
Menentukan ukuran column, gutter, dan margin yang tepat untuk berbagai device
-
Menguasai fitur Auto Layout di Figma untuk membangun layout yang fleksibel
-
Membangun struktur landing page dari header hingga footer
-
Menerapkan grid dan auto layout secara real-time ke dalam desain landing page
Created For
-
Anda yang ingin memahami Basic Grid System
-
Anda yang tertarik mendesain landing page yang rapi dan responsif
-
Anda yang ingin menguasai Auto Layout untuk efisiensi kerja di Figma
-
Anda yang ingin memiliki portofolio UI Design yang solid dan terstruktur
-
Anda yang ingin bekerja secara profesional dengan prinsip layouting yang benar
For Your Career
Akses Selamanya
Belajar lebih santai & produktif
998
Happy Students
Happy Students
carto
Full-Stack Developer
materi yang sangat bagus untuk memulai mempelajari desain UI dengan figma
06 Mar 2026
Nur Kholiq Yoga Witanto
UI Designer
materi yang disampaikan sangat mudah dipahami dan saya sebagai pemula figma user dapat memahami apa yang disampaikan oleh pemateri
03 Mar 2026
Huzaifi Al Madani
UI Designer
penyampaian terhadap tema sangat teratur dan mudah untuk di ikuti, sekarang saya paham akan kegunaan grid system dan Auto Layout. Thanks
23 Jan 2026
nur rahman
UI Designer
Bagus dan mudah di mengerti untuk menambah wawasan
11 Jan 2026
Adli Dzil Ikram
Lifetime Learner
Belajar dari dasar, diberikan pemahaman dengan jelas, terimakasih untuk coursenya untuk menambah wawasan modal ilmu kedepannya
09 Dec 2025
Adnan Yazid Ardiansyah
Full-Stack Developer
Materi kelas ini sangat terstruktur dan mudah diikuti, bahkan untuk pemula.
30 Oct 2025
Tools Pendukung
Pertanyaan Umum
Langkah yang tepat untuk berinvestasi kepada
ilmu
pengetahuan yang baru di bidang IT
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.
