Membuat desain UI menggunakan figma
Hallo semuanya kembali lagi nih dengan saya Atika Karlina, gimana teman-teman kabarnya? semoga pada sehat yaa aamiin. Nah kali ini saya akan membuat desain UI menggunakan figma nii teman-teman, sebelumnya udah pada tau belum sii apa itu figma? Figma adalah tool desain berupa website yang terhubung dengan cloud sehingga bisa digunakan kapanpun dan dimanapun melalui internet. Bagaimana sih caranya agar bisa masuk dan mengunakan figma? Nah jika teman-teman ingin membuka dan menggunakan figma teman-teman bisa mendownload aplikasi nya atau teman-teman juga bisa masuk dan login melalui google, ketik saja https://www.figma.com
Oke teman-teman ini adalah contoh mendesain UI menggunakan figma yaitu membuat tampilan login dan sign up pada handphone.
1. Pastikan teman-teman sudah login di figma mengunakan akun google atau lewat gmail.
2. Klik tanda kotak yang saya birukan lalu klik kembali frame dan pilih tampilan yang akan teman-teman bikin kalo saya make yang android small..png)
3. Nah nanti akan muncul halaman seperti ini.png)
4.  Klik tanda kotak seperti gambar dibawah ini, lalu kli Rectangle.png)
5.  Ganti ukuran dan warna sesuai yang teman-teman inginkan.png)
6. Lakukan hal yang sama seperti yang awal yaitu pencet tanda kotak dan klik Rectengle , lalu klik dan tarik seperti gambar sesuai desain yang teman-teman inginkan dan pilih ukuran beserta warna yang teman-teman inginkan.
7. Lalu teman-teman klik tanda T di atas dan ketik Login tempatkan dan pilih ukuran beserta warna yang teman-teman inginkan.
8. Klik kembali tanda kotak dan klik Rectengle lalu bentuk sesuai bentuk logo yang teman-teman inginkan kalo saya bentuk kotak kecil 2 buah, jangan lupa untuk mengatur ukuran beserta warna dan posisikan sesuai yang teman-teman inginkan.
9. Untuk membuat kolom seperti di gambar teman-teman lakukan hal yang sama yaitu klik tanda kotak dan klik Rectengel, lalu bentuk dan pilih ukuran beserta warna yang ingin teman-teman inginkan, buat kolom seperti ini 2 kali untuk penempatan Username dan Password..png)
10. Nah untuk membuat kolom login seperti digambar teman-teman pilih gambar kotak di atas lagi lalu klik Rectengle lagi kemudian bentuk pilih ukuran dan warna yang diinginkan. Kalo sudah teman-teman klik simbol T diatas lalu ketik dibawah login menggunakan ide teman-teman sendiri atau bisa menggunakan yang saya gunakan tersebut.
11.  Untuk membuat tampilan kedua teman-teman bisa pencet simbol kotak lagi lalu pencet Rectengle lalu pilih tampilan yang diinginkan, kalo saya pilih android small lagi karna yang awal saya make itu, atau jika kalian tidak mau ribet membikin nya lagi teman-teman bisa mengcopy saja..png)
12. Seperti ini jika teman-teman tidak ingin ribet teman-teman bisa mengcopy nya untuk tampilan yang kedua hanya saja teman-teman bisa menambahkan 1 kolom lagi di bawah kolom password..png)
10.

.png)
.png)
.png)
.png)
Komentar
Posting Komentar