Cara Menggunakan Auto Layout di Figma
Auto Layout adalah alat penting untuk setiap desainer dan pengguna Figma. Fitur ini memungkinkan Anda melakukan perubahan seperti mengubah ukuran atau memposisikan ulang bingkai dan objek. Tata Letak Otomatis akan memungkinkan Anda untuk menyesuaikan tinggi dan berat elemen, misalnya, dengan pengaturan otomatis, memotong setengah pekerjaan Anda.
Karena ukuran layar berubah berdasarkan perangkat atau browser yang akan digunakan pengguna untuk mengakses situs web, Tata Letak Otomatis membuat elemen di dalam bingkai menyesuaikan dengan perubahan tersebut. Hal ini membuat layout dan struktur terlihat lebih presisi dan sinergis. Baca terus untuk mengetahui cara menggunakan Tata Letak Otomatis di Figma dan fitur-fiturnya.
Menggunakan Tata Letak Otomatis
Untuk menggunakan Tata Letak Otomatis dan semua fiturnya, Anda harus menambahkannya terlebih dahulu ke bingkai Anda sedang dikerjakan, yang bisa berupa bingkai baru atau bingkai dengan konten, objek, dan komponen. Setelah Anda memilih bingkai atau objek, berikut cara menambahkan Tata Letak Otomatis ke dalamnya:
Tekan “Alt + A”keyboard Anda (Berfungsi pada Mac dan Windows).Klik kanan pada objek atau komponen dan klik Tata Letak Otomatis (Anda harus menambahkan fitur ini ke setiap komponen karena tidak mungkin dilakukan secara massal). Ketuk ikon plus di sebelah opsi”Tata Letak Otomatis”di menu pada Figma.
Selain menambahkan Tata Letak Otomatis ke bingkai Anda, Anda dapat melakukan berbagai hal, mulai dari menumpuk bingkai hingga menggandakan, mengatur, dan menghapus objek.
Menambah dan Menghapus Objek
Menambahkan objek ke bingkai cukup mudah. Anda hanya perlu mengambil objek yang ingin ditambahkan dan mengikuti indikatornya. Dan jika Anda akan menghapusnya, seret kembali dan tekan hapus. Jika Anda memilih untuk menambahkan objek yang lebih besar dari bingkai induk, Anda harus menghindari pengaturan default Figma untuk dapat melakukannya. Anda dapat melakukannya dengan menahan tombol”Ctrl”untuk Windows dan”Command”untuk Mac.
Menggandakan Objek
Jika Anda ingin menambahkan dua objek identik atau lebih ke bingkai, Anda dapat menggandakannya, yang merupakan fitur Lapisan Otomatis yang berguna. Begini caranya:
Ketuk objek yang ingin Anda duplikasi.
Tahan tombol “Ctrl”dan “D”secara bersamaan jika Anda menggunakan Windows.
Untuk Mac, buat duplikat dengan menahan tombol “Command”dan “D”.
Mengatur Objek
Jika Anda tidak menyukai tampilan bingkai Anda dan pengaturan objek dan komponen di dalamnya, Anda dapat mengaturnya kembali. Jika Anda telah menggabungkan dua layer, Anda harus melewati pengaturan default Figma dengan menekan”Ctrl”untuk Windows dan”Command”untuk Mac untuk mengakses opsi deep select dan memindahkan komponen dari layer awal. Namun, jika itu adalah satu bingkai, Anda dapat memilih objek dan memindahkannya ke tempat lain, serupa dengan menambahkan objek, atau menggunakan tombol panah.
Tingkat Tata Letak Otomatis
Fitur lain dari Tata Letak Otomatis sedang menggabungkan lebih banyak bingkai menjadi satu untuk membuat antarmuka yang lebih rumit di mana Anda dapat melapisi berbagai tingkat Tata Letak Otomatis seperti tombol dan baris tombol, pos, dan garis waktu. Setiap level memungkinkan Anda untuk menambahkan objek lebih lanjut ke bingkai Anda. Level baris tombol dan tombol bersifat horizontal, sedangkan postingan adalah lapisan vertikal tempat Anda dapat memasukkan deskripsi, gambar, dll.
Saat Anda menumpuk dua bingkai, keduanya akan bergabung dan mendapatkan properti dari bingkai induk. Ini memungkinkan pengguna untuk mengimplementasikan objek yang dapat disesuaikan. Anda dapat mengambil satu dan meletakkannya di bingkai lain untuk menggabungkan dua bingkai. Untuk melakukannya, Anda harus:
Memilih satu bingkai dan semua yang ingin Anda tambahkan ke dalamnya.
Tekan “Shift + A”untuk menambahkan bingkai Tata Letak Otomatis.
Fungsi Tata Letak Otomatis
Opsi Tata Letak Otomatis di Figma memiliki banyak properti atau fungsi berharga, mulai dari arah dan urutan susun hingga penspasian, pengubahan ukuran, dan perataan. Bagian ini akan membahas tentang masing-masing fungsi ini lebih detail.
Arah
Seperti namanya, arah mengacu pada urutan objek dalam bingkai. Saat menggunakan Tata Letak Otomatis, objek dapat ditempatkan:
Vertikal – Objek ditempatkan pada sumbu y. Opsi ini cocok untuk daftar, menu, umpan berita, dll.Horisontal – Objek dan komponen pada sumbu x (tombol, ikon, dll.).Posisi bungkus – Objek diatur dalam beberapa kolom dan baris.
Urutan Susun
Anda dapat memilih urutan susun mana yang paling sesuai dengan bingkai Anda. Ini adalah perubahan visual saja karena urutan susun tetap sama (jika 1,2,3, tetap 1,2,3 tetapi dengan penyesuaian visual). Saat objek ditumpuk satu sama lain, Anda dapat memilih mana yang akan berada di atas. Jadi, misalnya, jika Anda memiliki tiga hal yang ditandai 1, 2, dan 3, Anda dapat memilih 1 atau 3. Begini caranya:
Pilih bingkai Tata Letak Otomatis.
Arahkan ke opsi Tata Letak Otomatis di sebelah kanan layar Anda.
Ketuk tiga titik horizontal untuk membuka opsi lanjutan.
Temukan opsi “Penumpukan Kanvas”.
Pilih “Pertama di atas”atau “Terakhir di atas.”
Posisi Absolut
Properti “Aliran Lapisan”lainnya adalah posisi absolut, terlepas dari urutan dan arah susun. Fitur ini memungkinkan Anda menempatkan objek di mana pun Anda mau, mengabaikan batas bingkai. Berikut cara mengaktifkannya:
Ambil objek dan letakkan di dalam bingkai.
Di menu sebelah kanan, di sebelah nilai untuk “X”dan “Y,”ketuk ikon persegi tanpa tepi dengan plus di dalamnya.
Pindahkan objek di sepanjang garis bingkai.
Pengaturan Celah
Ada beberapa fitur yang dapat Anda sesuaikan terkait jarak, seperti celah. Anda memiliki dua cara untuk mengubah celah: otomatis dan mengetik celah tertentu. Jika Anda ingin celah Anda sebesar mungkin, maka Anda harus memilih pengaturan otomatis di menu Tata Letak Otomatis. Tetapi jika Anda akan memasukkan nilai Anda, ketikkan di dalam kotak yang telah ditentukan.
Selain itu, pengaturan celah dapat diatur untuk semua arah. Jika ikon Anda hanya horizontal dan vertikal, Anda dapat memilih celah horizontal di antaranya. Namun, jika berada dalam posisi membungkus, Anda dapat menyesuaikan setelan celah vertikal dan horizontal.
Pengaturan Perataan
Setelah menyiapkan fitur arah, padding, dan celah, Anda dapat menyesuaikan keselarasan objek anak dalam bingkai Anda karena fitur ini bergantung pada pengaturan jarak. Anda tidak dapat mengubah perataan setiap objek, tetapi pilih pola yang ditawarkan di menu Tata Letak Otomatis. Anda dapat mengklik kisi 3×3 di menu dan memilih perataan mana yang Anda inginkan. Hal ini dapat dilakukan dengan tombol panah atau tombol WSAD pada keyboard Anda.
Selain itu, Anda dapat memilih pengaturan otomatis di sini untuk mengalihkan perataan horizontal dan vertikal secara berurutan. Dengan nilai tertentu, Anda dapat memiliki kesembilan opsi (kiri atas, kiri bawah, kiri, kanan kiri, kanan bawah, dll.).
Anda juga dapat menyesuaikan perataan teks dengan mengaktifkan opsi ini dari menu dan menahan tombol”B”.
Mengubah Ukuran
Opsi mengubah ukuran Tata Letak Otomatis memiliki banyak properti tambahan seperti konten pelukan, opsi isi wadah, menyesuaikan lebar dan tinggi, dimensi, dll. Anda dapat memilih opsi otomatis jika Anda ingin nilai Anda tetap, tetapi itu membatasi kemungkinan. Untuk mengubah ukuran, disarankan untuk menyetel nilai Anda.
Anda dapat memilih nilai tetap atau menyetelnya ke maksimum atau dimensi minimum yang memungkinkan untuk lebar dan tinggi. Konten pelukan memungkinkan Anda menyesuaikan ukuran bingkai berdasarkan objek anak, sedangkan opsi wadah isian mengubah ukuran objek sesuai dengan bingkai induk.
Membuat Bingkai Unik Dengan Tata Letak Otomatis
Tata Letak Otomatis, sebagai salah satu fitur penting Figma, dapat menyesuaikan bingkai dan objek serta kompartemen di dalamnya sesuai keinginan Anda. Properti dan fiturnya banyak, memungkinkan Anda membuat produk yang tepat dan rapi. Tata Letak Otomatis adalah alat mendasar yang harus Anda kuasai sebelum bekerja di Figma.
Fungsi Tata Letak Otomatis mana yang paling sering Anda gunakan? Beri tahu kami di bagian komentar di bawah.
Penafian: Beberapa halaman di situs ini mungkin menyertakan tautan afiliasi. Ini tidak memengaruhi editorial kami dengan cara apa pun.
