Intro: Canvas
My canvas, my adventure
Last updated
Was this helpful?
My canvas, my adventure
Last updated
Was this helpful?
Sebelum beranjak ke dalam guideline, perlu diketahui elemen penting mendasar yang dapat mengurangi perbedaan implementasi ketika development sudah dijalankan. Yaitu penggunaan canvas dalam menciptakan desain.
Referensi canvas diambil dari statistik pengguna smartphone dunia, dengan mengambil tipe smartphone yang paling banyak digunakan baik bagi perangkat iOS maupun Android. Dari sini desainer dan developer diberikan kemudahan untuk menentukan ukuran canvas yang tepat dengan cara yang sederhana, yaitu:
Bisa dipilih sesuai arahan manajer, atau pertimbangan dari device yang digunakan klien.
Platform
iOS
Android
Device - Phone
iPhone X
Google Pixel 2
Canvas Size
375 x 812
411 x 731
Device - Tablet
iPad Pro 11"
Surface Pro 3
Canvas Size
834 x 1194
990 x 1440
Ukuran canvas pada tabel di atas sudah mencakup ukuran keseluruhan dari device yang dituju, seperti pada iPhone X, ukuran 375 x 812 sudah mencakup bagian atas (status bar) dan bawah (home indicator) yang mana merupakan unsafe area di mana sebaiknya tidak menaruh desain di area ini, dan menambahkan padding lebih sesuai ukuran dari area tersebut.
Desainer sebaiknya memberi padding atas sebesar 44px dan bawah sebesar 34px ketika menggunakan canvas iPhone X, atau menambahkan status bar dan home indicator pada desain.
Hal yang sama berlaku pada Google Pixel 2, di mana ukuran 411 x 731 sudah mencakup bagian status bar dan navigation button (back, home, running apps).
Desainer sebaiknya memberi padding atas sebesar 24px dan bawah sebesar 48px ketika menggunakan canvas Google Pixel 2, atau menambahkan status bar dan android navigation bar pada desain.
Referensi untuk bacaan lebih lanjut:
