Membuat konten Anda dapat di-scroll di Figma melibatkan navigasi tab samping. Sayangnya, itu tidak otomatis muncul di antarmuka pengguna utama. Konten yang dapat digulir berguna ketika Anda ingin menyajikan banyak informasi dalam bingkai desain Anda. Beberapa contohnya mencakup laman landas, antarmuka aplikasi, atau jendela pop-up.
Artikel ini akan menjelaskan cara membuat desain Figma Anda dapat di-scroll.
bagaimana cara mengetahui ram apa yang Anda miliki?
Memasang Teks yang Dapat Digulir ke dalam Bentuk
Mari kita mulai dengan membuat teks yang dapat digulir dalam bentuk sederhana. Ini adalah contoh paling umum dari teks yang dapat digulir, dan Anda dapat menambahkan fitur lain seperti warna, font, dan kerangka sesudahnya.
Begini cara melakukannya:
- Buat bentuk dasar. Untuk contoh ini, kami merekomendasikan membuat persegi panjang vertikal. Anda dapat melakukannya dengan memilih alat persegi panjang di sidebar kiri atau menggunakan perintah “R”. Tahan kiri, klik pada titik kanvas, dan gambar bentuknya.
- Di sidebar kanan, di bawah tab desain, beri tanda centang di sebelah opsi 'konten klip'.
- Pilih alat teks untuk membuat kotak teks dan letakkan di dalam bingkai yang dapat digulir. Ketik atau salin-tempel konten apa pun yang Anda gunakan.
- Pilih bingkai dan buka tab prototipe di sisi kanan antarmuka Anda. Kemudian, pilih opsi “overflow scrolling” dan gaya yang Anda inginkan. Di sini kita akan memilih “pengguliran vertikal.”
Setelah Anda mengklik opsi pengguliran luapan pada tab prototipe, ada beberapa gaya. Kita memilih yang vertikal karena kita menggunakan persegi panjang vertikal sebagai contoh. Ini memungkinkan Anda membaca teks dari atas ke bawah. Beberapa gaya lainnya antara lain:
- Pengguliran horizontal – Pengguna dapat menggulir teks dari kiri ke kanan dalam beberapa contoh. Opsi ini lebih disukai jika Anda membuat desain dalam format lansekap.
- Tanpa pengguliran – Jika Anda ingin mengunci konten di tempatnya, pilih opsi tanpa pengguliran.
- Kedua arah – Buat desain dengan banyak konten dan gulir secara vertikal dan horizontal.
Anda harus menggunakan fitur yang dapat digulir dalam desain Anda untuk meminimalkan upaya (klik) yang digunakan pembaca saat berinteraksi dengan konten. Mereka dapat menggeser atau menggunakan roda mouse alih-alih mengeklik atau mengetuk banyak teks.
Cara Mendesain Komponen yang Dapat Digulir
Bergantung pada produk Anda, Anda perlu merancang bingkai konten dan konten itu sendiri. Prosesnya melibatkan penambahan warna, font, dan kemungkinan komponen lainnya ke keseluruhan desain. Mengubah elemen-elemen ini mudah, namun memilih estetika yang tepat memerlukan pertimbangan yang cermat.
Cara Mengubah Font Desain Anda yang Dapat Digulir
Hal pertama yang perlu Anda lakukan adalah mengubah font pada desain yang dapat digulir. Figma menawarkan berbagai gaya untuk Anda pilih. Inilah metode paling sederhana:
- Pilih konten dalam bingkai yang dapat digulir yang ingin Anda ubah.
- Arahkan ke menu tarik-turun yang terletak di kiri atas dan pilih.
- Gulir font hingga Anda menemukan font yang ingin Anda gunakan.
Jika merek yang Anda desain memiliki tipografi tertentu, kemungkinan besar Anda akan memilih tipografi yang sama agar konsisten dengan citra merek. Jika Anda memiliki lebih banyak ruang gerak, Anda harus bereksperimen dengan berbagai contoh sebelum memilih yang tepat.
Beberapa pertimbangannya antara lain:
- Tujuan desain – Memilih tipografi harus sesuai dengan maksud desain Anda. Jika Anda ingin menyampaikan banyak informasi dengan jelas, gunakan font yang tidak terlalu dekoratif namun elegan.
- Komponen lainnya – Font Anda adalah elemen visual seperti elemen lainnya dalam desain Anda. Itu harus cocok dengan bingkai dan komponen lain yang Anda sertakan.
- Estetika dan branding secara keseluruhan – Nuansa umum merek juga harus memengaruhi font pilihan Anda. Misalnya, layanan pengiriman bunga tidak akan menampilkan font yang sama dengan halaman arahan SAAS.
Meskipun memilih font yang benar mungkin memerlukan beberapa eksperimen, beberapa contoh font konkret adalah opsi yang paling dapat diandalkan:
- Roboto – Jika Anda ingin bermain aman, gunakan Roboto. Ini dianggap sebagai font serbaguna dan netral dengan banyak kegunaan. Karena sangat mudah dipahami, banyak yang memilih Roboto untuk petunjuk dan halaman arahan.
- Poppins – Untuk daya tarik yang ramah namun modern dan bersih, pilih Poppins. Font ini lebih membulat dan membuat teks menjadi menarik dan mudah dibaca.
- Raleway – Saat mendesain merek mewah yang canggih, Anda mungkin ingin mempertimbangkan Raleway. Umumnya tipis tetapi memiliki variasi bobot yang berbeda dan tampilan keseluruhan yang elegan.
- Lato – Ramah, dapat diandalkan, dan serius adalah kata-kata yang tepat untuk menggambarkan font ini. Desainer dapat menggunakan Lato untuk judul dan teks paragraf yang mengutamakan keterbacaan dan kejelasan.
Anda juga ingin mempertimbangkan ukuran font dan gaya teks pilihan Anda. Umumnya, huruf tebal digunakan untuk judul atau segmen yang diberi penekanan, sedangkan huruf miring digunakan untuk tanda kutip.
Mengubah Warna Bentuk Bingkai
Selain mengubah font, Anda juga ingin mengubah warna bentuk bingkai Anda. Sekali lagi, rona pastinya akan bergantung pada merek yang Anda desain atau estetika Anda. Untungnya, antarmuka Figma memudahkan pemilihan warna.
Inilah cara Anda dapat mengubah warna bingkai:
- Pilih bingkai yang ingin Anda edit.
- Lapisan tersebut akan muncul di sidebar kanan. Arahkan ke bagian 'isi'.
- Pilih “+” untuk menambahkan isian.
- Jendela pemilih warna akan terbuka. Pilih warna isian dan gradien. Anda juga dapat mengetikkan kode hex jika Anda mengetahui warna pastinya.
Seperti elemen desain lainnya, Anda mungkin perlu bereksperimen dengan berbagai warna dan tampilannya dengan font pilihan Anda.
FAQ
Apakah ada perintah teks yang dapat digulir di Figma?
Sayangnya, tidak ada perintah untuk membuat teks dapat di-scroll di dalam Figma. Namun, Anda dapat menyelesaikan prosesnya hanya dalam beberapa klik menggunakan metode yang disebutkan di atas.
Bagaimana cara saya memutuskan opsi luapan mana yang saya inginkan?
Itu tergantung pada jenis teks yang Anda gunakan, desain keseluruhan, dan fungsinya. Gaya vertikal biasanya bagus untuk membaca teks berukuran besar.
Antarmuka perangkat apa yang biasanya memerlukan desain teks yang dapat digulir?
mengatur kodi di ponsel android
Contoh yang bagus adalah desain mock-up untuk sebuah aplikasi. Pengguna dapat menjadikan ponsel sebagai bingkai umum, sedangkan teks yang dapat digulir dapat menjadi antarmuka aplikasi.
Apakah Figma merupakan pilihan terbaik untuk membuat desain yang dapat digulir?
Figma adalah salah satu alat terbaik untuk membuat berbagai macam bentuk, termasuk desain yang dapat digulir. Lebih baik lagi, Figma gratis. Namun, Anda mungkin memiliki preferensi pribadi tertentu. Cobalah bereksperimen dengan beberapa platform, seperti Adobe Illustrator, hingga Anda menemukan alat yang paling cocok untuk Anda.
Jadikan Desain Anda Dapat Digulir dan Ramah Pengguna
Membuat teks apa pun dalam bingkai di Figma itu mudah. Cukup pilih bingkai lalu pindah ke opsi konten klip. Setelah selesai, Anda dapat memilih opsi pengguliran luapan. Demikian pula, Anda tidak boleh mengabaikan elemen desain penting lainnya, seperti warna dan bentuk bingkai serta font teks. Membuat desain Anda dapat di-scroll adalah pilihan yang tepat untuk halaman landing, antarmuka aplikasi, dan jendela pop-up. Ini membuat teks lebih mudah untuk dibaca sekilas daripada diklik, yang pada akhirnya meningkatkan pengalaman pengguna.
Apakah Anda merasa mudah untuk membuat konten Anda dapat di-scroll di Figma? Bagaimana dengan memilih font yang tepat? Beri tahu kami di bagian komentar di bawah.