Mengenal Fitur Pada Figma

sumber : photo by Unsplash

Figma memiliki fungsi yang berbeda dengan aplikasi desain grafis lainnya seperti Adobe Photoshop maupun Adobe Illustrator.

Figma memiliki fitur-fitur yang mendukung untuk mendesain UI (User Interface/Tampilan Pengguna) sebuah website ataupun aplikasi secara efektif dan efisien.

Figma memiliki kemiripan dengan Adobe XD dan Sketch, namun ada berbagai keunggulan yang membuat Figma lebih populer dibandingkan pesaingnya. Figma memiliki beberapa fungsi, antara lain:

  • Membuat wireframe/Low Fidelity design
  • Membuat tampilan UI/High Fidelity design
  • Membuat Prototype dan memperlihatkan hasil design
  • Mengedit gambar dengan fitur terbatas (tidak selengkap aplikasi seperti Adobe Photoshop)
  • Melakukan kolaborasi dengan designer lain maupun klien secara bersamaan
  • Membuat design untuk kebutuhan konten media sosial
  • Membuat design mockup aplikasi mobile maupun website
  • Brainstorming ide dengan FigJam

Cara Kerja Figma

Figma memiliki tampilan yang cukup mudah untuk dipahami dan cara kerja yang sederhana. Anda dapat melakukan langkah-langkah berikut untuk menggunakan Figma:

  • Buka website figma.com atau download aplikasi desktop untuk Windows atau MacOS, lalu lakukan registrasi akun dengan akun Google Anda.
  • Setelah registrasi, Anda dapat login menggunakan akun tersebut.
  • Pada halaman dashboard, terdapat beberapa fitur yang biasanya sering digunakan.
  • Untuk membuat file baru, klik “new design file” atau klik “draft” di panel kiri jika ingin membuat draft baru.
  • Tampilan awal akan seperti ini. Ada berbagai menu di atas, panel layers dan assets di sebelah kiri, serta panel design, prototype, dan inspect di sebelah kanan.
  • Untuk membuat UI sebuah aplikasi atau website, Anda dapat memilih Frame sesuai ukuran device yang akan digunakan. Menu Frame ada di atas (ketiga dari kiri), dan panel kanan akan berubah menjadi beberapa pilihan ukuran frame yang dapat dipilih, mulai dari ukuran HP hingga layar desktop. Ukuran ini juga dapat diubah secara manual.
  • Ketika sudah memilih frame (contoh: iPhone 14), maka akan muncul frame dengan ukuran pixel yang sesuai dengan layar dari device yang terpilih dan layer frame tersebut akan muncul di panel layer di sebelah kiri. Panel kanan akan berubah menjadi properties dari layer terpilih yang dapat diubah sesuai keinginan.
  • Buatlah design yang Anda inginkan. Jika sudah selesai, Anda dapat menampilkannya dengan klik menu “Prototype” di panel kanan, dan pilih device yang sesuai, lalu klik tombol icon “Play” yang ada di pojok kanan atas.
  • Gambar diatas adalah tampilan pada fitur Prototype
  • Anda juga dapat melakukan export design ke dalam beberapa format seperti PNG, JPG, atau SVG. Pilih frame yang ingin di-export. Lalu di panel kanan, scroll ke bawah untuk melihat menu export. Pilih format yang ingin diinginkan, kemudian klik button “Export”.

Subscribe

Related articles

Memahami Microservices dengan Laravel

Microservices adalah pendekatan dalam pengembangan perangkat lunak di mana...

Tailwind CSS: Panduan Lengkap dan Keunggulannya

Tailwind CSS adalah salah satu framework CSS yang semakin...

Bagaimana sih cara menjadi Web Developer?

Memulai Karier sebagai Web Developer Meskipun sudah mengetahui berbagai keterampilan...

Laravel 11 : Send Mail by Gmail SMTP

Mengirim Email Menggunakan Gmail SMTP di Laravel 11 Mengirim email...

Cara mendapatkan Kredensial token email

Mendapatkan Credential Token Email di Laravel Dalam aplikasi web modern,...

LEAVE A REPLY

Please enter your comment!
Please enter your name here