Bagikan melalui

Mendesain aplikasi Anda menggunakan kit UI

[Artikel ini adalah dokumentasi prarilis dan dapat berubah.]

Untuk membuat aplikasi dari Figma desain, Anda harus mulai dengan Buat Aplikasi dari Figma UI Kit. Kit UI terdiri dari komponen, aplikasi sampel, dan beberapa sumber daya tambahan seperti:

  • Informasi tentang hal yang didukung dan yang tidak.
  • Petunjuk langkah demi langkah tentang cara merancang aplikasi dalam Figma sehingga dapat dikonversi dalam Power Apps.
  • Daftar komponen yang didukung—mulai dari layar tingkat dasar hingga komponen individual seperti tombol, drop-down, dan input teks.
  • Panduan penting tentang cara menggunakan komponen.

Dapatkan kit UI

  1. Buka halaman Buat Aplikasi dari Figma UI Kit .
  2. Jika perlu, masuk dengan kredensial Figma Anda.
  3. Pilih Duplikat, lalu pilih tim tempat Figma Anda menjadi anggota. Untuk informasi selengkapnya tentang menduplikasi proyek di, Figma lihat Figma: Duplikat file atau proyek.
  4. Jika perlu, pilih panah bawah di samping nama file, dan pindahkan file dari draf Anda.

Baca petunjuk

Baca petunjuk dari halaman Baca ini terlebih dahulu dan Langkah 1: Memulai di dalam kit UI. Petunjuk pada halaman ini akan membantu Anda memahami panduan umum tentang menggunakan kit ini. Anda juga akan mempelajari lebih lanjut tentang sumber daya yang digunakan kit, seperti gaya font, panduan komponen, komponen yang didukung, dan banyak lagi.

Mendesain aplikasi Anda

Ikuti petunjuk di halaman Langkah 2: Desain aplikasi Anda di dalam kit UI untuk mulai menggunakan kit untuk membuat desain aplikasi Anda sendiri.

Hal yang boleh dan tidak boleh saat merancang

Kit berisi panduan terperinci tentang cara menggunakan komponen. Namun, berikut adalah beberapa hal yang boleh dan tidak boleh untuk diingat saat merancang aplikasi:

  • Baca setiap halaman dengan saksama agar proses desain dan proses konversi berjalan dengan lancar.
  • Desain hanya menggunakan komponen yang didukung dari kit ini.
  • Gunakan hanya font yang didukung yang terdaftar di kit.
  • Jangan mengubah nama komponen.
  • Jangan mengubah lapisan komponen.

Informasi selengkapnya

Kit juga menyediakan halaman tambahan untuk informasi lebih lanjut seperti diringkas di bawah:

  • Langkah 3: Konversi menjadi aplikasi - representasi visual dari mengubah desain aplikasi menjadi aplikasi. Untuk mengikuti petunjuk langkah demi langkah, lihat Membuat aplikasi kanvas dari. Figma
  • Langkah 4: Langkah berikutnya- menjelaskan kemungkinan langkah selanjutnya yang dapat Anda ambil untuk lebih mempersiapkan aplikasi Anda untuk skenario bisnis Anda. Langkah-langkah ini termasuk menghubungkan ke data, menambahkan logika aplikasi, menambahkan lebih banyak layar dan kontrol.
  • Komponen yang didukung- mencantumkan informasi tentang komponen yang didukung. Untuk informasi selengkapnya, lihat Komponen yang didukung oleh kit UI.

Langkah berikutnya: Membuat aplikasi kanvas dari Figma

Baca juga