Advan – Salah satu keunggulan dari Sketch sebagai alat desain yaitu, tata letaknya yang ramah pengguna. Sehingga bahkan desainer aplikasi pemula pun dapat menggunakan aplikasi ini dengan mudah.
Di artikel ini, kamu akan belajar langkah demi langkah cara membuat desain aplikasi mobile yang menarik dan fungsional menggunakan Sketch.
Langkah-langkah Membuat Desain Aplikasi Mobile dengan Sketch
Dengan mengikuti langkah-langkah di bawah ini, kamu akan bisa dengan mudah membuat desain aplikasi mobile yang fungsional dan profesional. Simak tutorialnya!
1. Instalasi dan Pengaturan Awal
Pertama-tama, pastikan kamu sudah menginstal Sketch di komputer kamu. Sketch hanya tersedia untuk macOS, jadi pastikan kamu menggunakan Mac. Setelah menginstal Sketch, buka aplikasi dan mulai proyek baru.
2. Membuat Artboard
Artboard adalah kanvas di mana kamu akan membuat desainmu. Untuk membuat artboard baru, klik ikon “Artboard” di toolbar atau tekan `A` pada keyboard. Pilih ukuran yang sesuai untuk aplikasi mobile, misalnya, ukuran layar iPhone 11 (828 x 1792 px).
3. Menambahkan Grid dan Layout
Grid sangat penting untuk menjaga konsistensi desain. Kamu bisa menambahkan grid dengan cara membuka menu `View` > `Canvas` > `Layout Settings`. Atur kolom dan margin sesuai dengan kebutuhanmu. Grid akan membantu kamu dalam menempatkan elemen-elemen desain dengan rapi.
4. Mendesain Antarmuka Pengguna (UI)
Sekarang, saatnya untuk mulai mendesain UI. Mulailah dengan membuat elemen dasar seperti header, footer, dan tombol navigasi. Kamu bisa menggunakan alat “Rectangle” (`R`) untuk membuat bentuk dasar dan alat “Text” (`T`) untuk menambahkan teks.
5. Menggunakan Symbols
Symbols di Sketch memungkinkan kamu untuk membuat elemen UI yang dapat digunakan kembali. Misalnya, kamu bisa membuat tombol sebagai symbol.
Untuk membuat symbol, pilih elemen yang ingin kamu jadikan symbol, lalu klik kanan dan pilih `Create Symbol`. Kamu bisa mengedit symbol ini, dan setiap perubahan akan diterapkan ke semua instansinya.
6. Menambahkan Gambar dan Ikon
Kamu bisa menambahkan gambar dengan mudah ke dalam desainmu. Cukup drag dan drop gambar ke dalam artboard. Untuk ikon, kamu bisa menggunakan plugin seperti “Icons8” atau “Noun Project” untuk mencari dan mengimpor ikon yang sesuai dengan tema aplikasi kamu.
7. Prototyping
Sketch juga memiliki fitur prototyping yang memungkinkan kamu untuk membuat interaksi antara artboard. Kamu bisa menambahkan link dan animasi untuk melihat bagaimana tampilan aplikasi ketika digunakan. Untuk membuat prototype, klik `Prototype` di toolbar dan hubungkan elemen-elemen yang ingin kamu tambahkan interaksinya.
8. Menggunakan Plugins
Sketch memiliki banyak plugin yang bisa membantu meningkatkan produktivitas kamu. Beberapa plugin populer yang bisa kamu coba adalah “Craft” oleh InVision untuk mockup dan prototyping, serta “Zeplin” untuk kolaborasi dengan developer.
9. Eksport Desain
Setelah desainmu selesai, kamu bisa mengekspor artboard menjadi berbagai format seperti PNG, JPEG, atau PDF. Klik `File` > `Export` dan pilih format yang kamu inginkan.
Kamu juga bisa mengekspor aset individu dengan memilih elemen dan mengklik kanan untuk memilih `Export Selected`.
Untuk dapat meningkatkan produktivitas kamu dalam mendesain dengan aplikasi mobile pada Sketch, kamu tentu membutuhkan perangkat yang handal seperti Advan One PC yang menawarkan banyak keunggulan sehingga kamu akan menjadi seorang desainer yang produktif. ***
Editor: Adita Febriyanti