Kiat-kiat Komponen di Figma

() translation by (you can also view the original English article)

Figma memungkinkan kita untuk mendesain dengan banyak komponen (components); repeatable object yang berperilaku sesuai dengan set aturan yang kita definisikan. Mari kita membahas beberapa tips and trick untuk membantu Anda memaksimalkan banyak komponen.

Tonton Tipsnya

1. Kombinasikan Kanyak Komponen untuk Mendistribusikan Perubahan dengan Mudah

Sebuah tombo, misalnya, mungkin merupakan komponen yang terdiri dari objek shape dan objek teks. Kami memiliki beberapa contoh tombol berikut, masing-masing sedikit berbeda tetapi semuanya mengikuti basic layout dan rules dalam tampilannya. Pada beberapa contoh, kita mungkin ingin untuk menghapus fill, hanya menyisakan stroke, dalam kasus lain kita akan mengganti fill color. Jika ini terjadi, jika kita mengubah fill color dari beberapa komponen, semua instance akan mencerminkan perubahan tersebut, kecuali yang di mana kami memilih untuk mengesampingkan fill-nya.

Tetapi jika kita mengubah property yang belum diganti, perubahan tersebut akan terlihat di semua contoh tombol tersebut

Cara bekerja seperti ini dapat menjadi pola pikir yang sangat membantu ketika membangun desain UI.

Combine Components to Propagate Changes Easily

2. Buat Simetri dengan Membalik Komponen

Jika Anda ingin membuat simetri atau pencerminan (mirroring), buatlah komponen setengah bagian dari sesuatu yang ingin Anda gunakan. Buat instance kedua dengan menahan ALT dan menyeret aslinya, lalu tekan SHIFT + H untuk membalik duplikatnya. Sekarang, setiap kali Anda mengubah yang asli, duplikatnya juga akan berubah, tetapi dengan cara sebaliknya.

Create Symmetry by Flipping Components in Figma

3. Buat Pola Pengulangan dengan Komponen Tiling

Anda dapat menggunakan banyak komponen untuk membuat background dan pola pengulangan yang mulus. Mulailah dengan membuat sebuah komponen tile (ubin) dengan ukuran apa saja yang Anda butuhkan, kemudian buat lebih banyak contoh dengan menahan ALT dan menyeret yang aslinya, sebaiknya lakukan beberapa kali di sepanjang setiap sumbu. Kemudian, ubah tile yang asli untuk menerapkan perubahan Anda semua tile-nya, sampai pola-pola tersebut match dengan mulus.

Selanjutnya Anda akan dapat mengekspor tile asli tersebut sebagai gambar yang berdiri sendiri, untuk menggunakannya di mana pun Anda membutuhkan tiling yang sempurna.

Create Repeating Patterns by Tiling Components

Sumber-sumber untuk Belajar Figma

Itulah beberapa kiat cepat untuk bekerja dengan banyak project, page, dan artboard di Figma. Untuk membantu Anda membawa banyak hal ke tingkat berikutnya, kami memiliki serangkaian kursus Figma di Tuts+:

Terimakasih banyak kepada Carmel DeAmicis dan Valerie Veteto untuk ringkasan tips komunitas reguler mereka — buka dan lihatlah!
blog.figma.com
www.figma.com