-
Okay, mari kita mulai dengan menambahkan elemen persegi panjang ke dalam kanvas sebagai ilustrasi dari banner. Pertama, pilih Rectangle (R) pada Shape Tools.
Kemudian buat elemen sesuai dengan ukuran yang diinginkan. Anda juga dapat melakukan drag and drop untuk memindahkan elemen.
Dalam aplikasi Figma terdapat garis bantu berwarna merah yang membantu Anda untuk membuat elemen yang presisi. -
Selanjutnya untuk membuat garis silang, Anda perlu menggunakan Line (P) pada Shape Tools.
Untuk menggunakannya cukup drag dari lokasi awal sampai lokasi akhir seperti ini:
Seperti yang Anda lihat, Figma akan membantu Anda untuk meletakkan titik sehingga desain menjadi lebih rapi. -
Kemudian kita akan mengubah warna garis tersebut menjadi abu-abu. Untuk memilih lebih dari satu elemen, tekan Shift sambil memilih elemen lainnya. Kemudian pada bagian stroke, ganti warnanya menggunakan Hex Color seperti 969696 atau menggunakan color picker seperti ini:
-
Kemudian untuk memudahkan manajemen elemen, kita akan menggabungkan beberapa elemen menjadi sebuah grup. Caranya yaitu blok atau pilih elemen yang ingin digabungkan, kemudian klik kanan dan pilih Group selection (Ctrl + G).
Hasilnya dapat dilihat pada panel di sebelah kiri. Anda juga dapat mengubah namanya dengan klik dua kali supaya lebih mudah dicari ketika elemen semakin banyak nanti.
Storyboard dan Wireframe
Latihan Membuat Banner
Langkah pertama dari latihan menggambar Wireframe ini yaitu membuat bagian yang paling atas terlebih dahulu, yaitu banner. Berikut ini adalah langkah-langkahnya: