Newest Info

Berita, info dan pengumuman terbaru berkaitan dengan perkembangan teknologi

Sketch Tutorial — Mari membuat design aplikasi iOS-Bag 8

28 Agustus 2017 | Dwinawan Hariwijaya via medium
post image

Pada artikel sebelumnya, kita telah mulai membuat konten berupa “card”, Dan sudah mulai mengisi bagian dalam “card tersebut”. Di artikel ini kita akan melanjutkan mengisi bagian tersebut. Yuk langsung saja…. 1. Membuat Avatar Buat lingkaran (tekan tombol “O”) dengan ukuran 20px X 20px Tempatkan di bawah teks dengan jarak 15px Beri nama “Oval” 2. Menaruh lingkaran ke dalam Folder Group Select “Oval” Lalu tekan Command + G Sehingga akan tercipta sebuah Folder Group di sebelah kiri. Beri nama folder tersebut “avatar” 3. Masukkan foto atau gambar Buka uifaces.com Pilih salah satu gambar lalu klik kanan dan pilih “Copy Image” Lalu setelah itu Select “Oval” Lalu tekan “Command + V” untuk mem-paste gambar 4. Posisikan foto di depan lingkaran Geser foto hingga menutupi lingkaran 5. Masking Gambar Select “Oval” di sidebar sebelah kiri Klik Kanan lalu pilih “Mask” 6. Foto akan masuk ke dalam lingkaran Anda akan mendapatkan hasil seperti dibawah ini 7. Posisikan Foto sesuai dengan lebar lingkaran Select Foto yang berada dalam lingkaran Sehingga akan muncul kotak untuk mengatur ukuran Posisikan sesuai dengan lebar lingkaran. Tekan Shift saat mengatur ukuran, agar foto tidak ter-strecth 8. Setelah Foto sudah terlihat pas, kini beri nama disampingnya Tekan T untuk mulai menulis Posisikan tulisan 10px dari avatar dan posisikan 23px dari batas bawah card 9. Satu card telah selesai dibuat Setelah melakukan langkah2 diatas, seharusnya Anda mendapatkan hasil seperti dibawah ini 10. Buat beberapa card dengan meng-copy card yang sudah ada Select Folder “Card 1” Tekan “Command + D” lalu geser card yang baru ke bawah Posisikan Card baru berjarak 15px dari card diatasnya Pada Tutorial bagian 8 ini seharusnya Anda mendapatkan tampilan seperti diatas ini. Jika Anda tidak mendapatkan tampilan seperti diatas silahkan periksa langkah langkah diatas atau Anda bisa menanyakan di kolom komentar bagian mana yang kurang jelas :) Bersambung ke bagian 9, Mohon ditunggu untuk bagian 9 nya :D. IndonesiaIT 2017, [...], Artikel ini di ambil dari feed medium, untuk pengalaman baca yang lebih baik, silahkan kunjungi situ aslinya. IndonesiaIT - Software Developer Terbaik. Baca Selengkapnya.