Ada teman saya melalui pesan facebook merequest cara membuat form login website untuk projeknya membuat aplikasi android. Form login tesebut konsepnya flat dan ada background lingkaran dibelakang form tersebut. Tutorial ini juga sebagai latihan dari tutorial sebelumnya yaitu :
Berikut ini adalah desain form yang diminta:
- Membuat Objek Kotak, Lingkaran dll pada CorelDraw
- Mewarnai Fill dan Outline Objek pada CorelDraw
- Membuat Tulisan pada CorelDraw
- Transformasi Objek pada CorelDraw dan
- Modifikasi Objek dengan Shape Tool
Berikut ini adalah desain form yang diminta:
- Buatlah lembar kerja baru dan pilih Web Page (960 x 960) pada size, unit pixel dan resolusi 96 dpi.
- Buatlah persegi dengan ukuran 350 px x 350 px sebagai objek bantu
- Buat lingkaran untuk background kemudian buat objek kotak untuk bayangan background menyatu dengannya (pada saat membuat kotak titik awal drag berada di bagian tengah atas lingkaran / quadrant atas) dan geser sehingga tingginya sama seperti tinggi lingkaran.
- Memutar objek bayangan lingkaran (kotak) : Klik 2x pada kotak kemudian Drag & Drop pusat rotasi kotak ke pusat rotasi lingkaran.
- Kemudian atur pada property bar -45 derajat pada bagian rotasi kemudian Enter atau Drag & Drop pada tanda rotasi + Ctrl di keyboard kemudian putar ke bawah.
- Klik kanan pada kotak bayangan lingkaran kemudian pilih Convert to Curve atau Klik Objeknya terus Ctrl + Q
- Atur objek bayangan tesebut dengan Shape Tool (F10) sehingga membentuk gambar berikut.
- Warnai Objek lingkaran ( RGB 160 217 246 atau heksa ##A0D9F6) dan kotak bayangan kemudian klik pada kotak bayangan dan tekan Shift + PageDown di keyboard
- Buatlah kotak untuk username, password dan login kemudian masukan icon yang sesuai. (Tips: buatlah untuk username saja sampai selesai kemudian yang lainnya copy paste)
- Buatlah tulisan pada form username, password dan login kemudian warnai objek tersebut dan hilangkan oultine/garis pinggir.
- Berikan sedikit tambahan sentuhan drop shadow pada bagian form untuk mempercantiknya.
- Selesai dan export komponen yang diperlukan untuk web misalnya bagian backgroundnya saja karena biasanya desain formnya nanti dibuat dengan paduan HTML dan CSS , biasanya format export PNG yang mendukung transparansi dan loading yang ringan.
Demikian tutorial membuat form login website dengan CorelDraw dan semoga berhasil. #GRAFISin
0 komentar:
Posting Komentar