Dunia perangkat lunak desain grafis sangat besar dan memiliki banyak persaingan. Figma adalah salah satu alat desain yang berlomba ke posisi teratas untuk desainer UX/UI di seluruh dunia. Tapi apa yang Anda ketahui tentang alat intuitif ini?
Meskipun sederhana, ada juga kurva pembelajaran jika Anda terbiasa dengan alat desain lainnya. Mari kita lihat Figma dan cara menggunakannya. Selamat datang di Gambar 101.
Apa itu figma?
Jika Anda pernah bekerja sebagai desainer grafis atau desainer web dalam beberapa tahun terakhir, Anda mungkin pernah mendengar tentang Figma. Anda bahkan mungkin telah menggunakannya.
Figma adalah alat desain dan terus menjadi favorit bagi para desainer digital, melampaui pilihan seperti Adobe XD, Adobe Photoshop, dan Sketch, untuk desain web dan banyak lagi. Namun, sejak Adobe mengakuisisi Figma pada tahun 2022, mungkin ada beberapa perubahan yang akan merombak papan peringkat.
Ada banyak kegunaan untuk Figma. Ini terutama digunakan untuk desain digital, dan Anda tidak dapat mendesain dalam CMYK untuk dicetak. Beberapa kegunaan utama Figma meliputi:
- Pembuatan prototipe
- Desain UX/UI
- Desain aplikasi
- desain web
- Desain presentasi
Kamu bisa gunakan plugin mockup Figma untuk membantu memamerkan desain Anda, mengonversi halaman web asli ke desain Figma menggunakan plugin, dan bahkan membuat template master untuk desain Figma untuk menghemat waktu Anda dalam jenis desain berulang.
Berapa Biaya Figma?
Anda dapat membuat akun Figma secara gratis di situs figma atau dengan mendownload aplikasi figma. Akun gratis menyediakan fungsionalitas untuk semua aspek desain aplikasi. Anda dapat mendesain dengan Figma dan FigJam—Alat kolaborasi Figma.
Jika Anda menggunakan Figma sebagai penghobi atau sebagai pekerja lepas tunggal, versi Free Forever hampir sempurna. Anda masih memiliki akses ke semua plugin, dapat mengundang kolaborator tanpa batas, menggunakan file pribadi tanpa batas, dan menggunakan Figma dari semua platform.
Sementara versi gratis Figma menawarkan lebih dari cukup untuk desainer standar mana pun, langganan Figma Professional memungkinkan Anda melakukannya undang rekan tim, bekerja dari perpustakaan tim, memiliki akses ke file Figma tak terbatas dan riwayat versi, dan banyak lagi, seharga $12 per bulan per editor. Jika Anda seorang pelajar atau pendidik, Anda bisa mendapatkan Figma Professional secara gratis.
Cara Menggunakan Figma: Dasar-Dasar
Apakah Anda menggunakan aplikasi Figma atau versi browser, Anda dapat dengan mudah mengikutinya.
Saat Anda membuka Figma, Anda akan diberikan opsi untuk memulai file Figma baru, file FigJam baru, atau mengimpor file yang dibuat di program lain, seperti Sketch atau Adobe XD. Jika Anda pernah menggunakan Figma sebelumnya, Anda juga akan melihat proyek Figma sebelumnya yang dapat Anda buka dan kerjakan.
Menavigasi Ruang Kerja Figma
Membuka file baru awalnya terlihat membosankan. Tidak seperti banyak program desain lainnya, Anda tidak memulai dengan artboard atau kanvas, tetapi halaman desain yang benar-benar kosong. Tetapi dengan pikiran yang penuh inspirasi, itu tidak akan lama menjadi ruang kosong.
Menu horizontal kiri atas dimulai dengan Menu utama ikon—logo Figma. Memilih Menu utama, Anda dapat menavigasi ke file Anda yang lain, tindakan cepat Figma, opsi file tipikal, dan akses ke plugin, widget, dan pustaka.
Selanjutnya, Anda akan menemukan Bergerak alat (V), dengan Skala alat (K) terletak di bawahnya. Alat-alat ini untuk memindahkan elemen atau menskalakan bagian desain Anda ke atas atau ke bawah. Dan di sebelah kanan alat ini, Anda akan melihat alat Wilayah, Bingkai (F), Bagian, Dan Mengiris, terletak bersama-sama.
Di Figma, bingkai adalah apa yang oleh program lain disebut artboard atau kanvas. Pilih Bingkai untuk menggambar kanvas ukuran khusus Anda. Saat dipilih, menu sebelah kanan akan menampilkan opsi bingkai siap pakai untuk ukuran perangkat umum: ponsel cerdas, tablet, desktop, jam tangan pintar, presentasi, dan opsi media sosial. Anda juga dapat mengeklik dan menyeret bingkai Anda secara langsung untuk menjadikannya ukuran khusus apa pun.
Kembali ke menu kiri atas, di sebelah kanan alat Wilayah adalah Membentuk peralatan, Pena alat, dan Teks alat. Kemudian, diikuti oleh Sumber Daya—Komponen, Plugin, Dan Widget—dan Tangan alat untuk memindahkan file Anda. Dan akhirnya, Komentar alat yang bagus untuk membuat catatan dan berkolaborasi dengan rekan satu tim.
Menu Desain Figma
Dengan bingkai yang dibuat, memilih judulnya akan mengaktifkan bingkai, siap untuk disain. Menu sebelah kanan menampilkan judul untuk Desain, Prototipe, Dan Memeriksa. Seperti namanya, opsi Desain adalah menu yang akan Anda gunakan untuk mendesain elemen pada bingkai Anda.
Sementara menu Desain awal agak sederhana, saat Anda menambahkan lebih banyak elemen ke desain Anda, opsi menu berkembang. Pada awalnya, menu berjalan dari atas ke bawah dengan alat perataan, alat pengatur ukuran, Tata letak otomatis, Kisi tata letak, Lapisan, Mengisi, Stroke, Efek, Dan Ekspor. Beberapa di antaranya diminimalkan secara default tetapi dengan mengklik + tanda, Anda dapat membuka menu apa saja atau menekan – untuk meminimalkannya.
Setelah Anda menggambar bingkai utama untuk proyek, Anda dapat menggunakan alat Bentuk atau alat Pena untuk menggambar bentuk atau tambahkan placeholder gambar, dan Anda dapat menambahkan teks menggunakan alat Teks dengan cara yang mungkin pernah Anda lakukan di tempat lain perangkat lunak.
Setelah Anda memiliki bentuk atau teks pada Frame, gunakan berbagai opsi menu sebelah kanan untuk mengedit dan mendesain elemen tersebut. Itu Lapisan menu menawarkan mode opacity dan blend; dengan Mengisi Anda dapat menambahkan warna atau menyisipkan gambar dengan beberapa fitur edit seperti Paparan, Kontras, Suhu, dan banyak lagi.
Saat Anda membangun lebih banyak elemen dalam proyek Anda, layer akan terbentuk di sebelah kiri Lapisan menu di sebelah Aktiva tab. Anda dapat mengeklik dua kali judul lapisan untuk menemukan elemennya, dan sebaliknya; Anda dapat mengklik dua kali elemen desain untuk menemukan lapisan yang disorot. Mengklik dua kali judul memungkinkan Anda mengganti namanya untuk organisasi yang optimal.
Menu Prototipe Figma
Di sebelah kanan Desain pilihan menu adalah Prototipe menu. Setelah Anda menyelesaikan aspek visual desain Anda dan mengatur kotak gambar dan teks di mana mereka harus pergi, Anda dapat menggunakan alat prototipe untuk menambahkan animasi dan transisi ke desain Anda.
Itu Prototipe menu memungkinkan Anda untuk menghubungkan bingkai atau komponen bersama-sama sebagai transisi. Anda dapat memilih urutan mana dan bagaimana setiap bingkai bertransisi ke yang lain.
Ini bekerja dengan baik jika Anda membuat presentasi Figma yang bergerak dari satu slide ke slide berikutnya, tetapi alat ini juga memungkinkan Anda memvisualisasikan animasi untuk tombol atau menu untuk aplikasi dan desain web. Anda dapat menambahkan beberapa transisi per halaman untuk semua hal yang berbeda, sehingga Anda dapat melihat bagaimana pengguna akan berinteraksi dengan situs Anda saat aktif.
Meskipun menggunakan Figma untuk mendesain situs web tidak sama dengan membuat situs web langsung, Anda dapat menyerahkan Figma Anda desain untuk tim pengembang Anda yang dapat membuat ulang interaksi prototipe Anda sebagai desain animasi kehidupan nyata untuk Anda situs web. Ini berarti Anda dapat beralih dari halaman ke halaman dari klik, waktu, atau interaksi lainnya.
Memulai Dengan Figma Itu Mudah
Sekarang Anda tahu cara menavigasi tata letak Figma dan cara kerja desain dasar dan alat prototipe. Karena Figma sangat mudah diakses, inilah waktunya untuk bermain-main dengan alat desain ini dan melihat apa yang dapat Anda buat.
