• Tidak ada hasil yang ditemukan

Desain UI

Dalam dokumen Dasar-Dasar Rekayasa Perangkat Lunak (Halaman 107-111)

Terdapat dua hal yang harus diperhatikan oleh seorang designer saat membuat UI, yaitu User dan Interface.

User

• Mudah digunakan

• Mudah dipahami

• Tidak membingungkan

• Jelas (antara tombol, link, bisa di klik atau tidak)

Interface

• Clean

• Rapi

• Modern

• Keren

• Kekinian

• Colorfull

• Tidak membosankan Untuk menghasilkan UI (User Interface) yang baik, harus memperhatikan 2 hal di atas. Kata User ditempatkan di depan kata Interface, karena UI yang baik selalu memperhatikan dan mengutamakan user. UI yang baik akan membantu user. Dan, UI yang baik akan membuat user nyaman menggunakannya.

Untuk menjadi desainer UI, lebih diutamakan fokus pada bagian Interface. Dalam pembuatan UI, Anda harus memikirkan tentang bagaimana nanti user memakainya. Contohnya: Sebuah Tombol. Saat mendesain sebuah tombol, harus dipikirkan “Apakah user tahu kalau ini tombol yang bisa di-klik?”. Tetapi, hal yang tidak kalah penting adalah harus diketahui bagaimana bentuk tombol itu. Maka dari itu, sebagai permulaan UI untuk fokus di

bagian Interface -nya terlebih dahulu agar familier dengan bentuk- bentuk UI.

Apakah familier dengan tool seperti Photoshop? GIMP? atau software sejenis lainnya? Jika belum, maka sebaiknya mulai belajar menggunakan software tersebut. Langkah pertama untuk menjadi UI Designer adalah mencoba untuk membuat UI. Tidak perlu bingung mau mulai dari mana atau mau mendesain apa.

Cukup memilih desain-desain interface yang ada di internet. Pilih yang disukai lalu jiplaklah, buat semirip mungkin. Bisa browsing di situs seperti dribbble.com, behance.net atau kreavi.com. Banyak sekali desain UI di sana.

Kenapa harus menjiplak desain? Hal ini untuk membuat familier dengan UI. Bagaimana bentuk tombol, ukuran teks, jarak antar baris kalimat, jarak tiap elemennya.

Jadi, Semakin sering menjiplak sebuah desain, maka akan semakin familier dengan ukuran setiap elemen UI. Tapi ingat, jiplak menjiplak ini hanya untuk kepentingan belajar. BUKAN untuk di-upload di sosial media ataupun situs portfolio.

Jika telah menjiplak UI berkali-kali, maka sudah terbiasa membuat tombol, terbiasa membuat dropdown, input text, dan elemen-elemen UI lainnya. Kini, saatnya untuk membuat UI sendiri. Caranya gampang, Pertama, tentukan platform terlebih dahulu. Tentukan apa yang akan dibuat, design untuk mobile app (Android/iOS), design untuk web, atau bahkan design untuk smartwatch app?

Setelah itu, tentukan tema design-nya. Ingin membuat tampilan untuk aplikasi kesehatan? website artikel teknologi? atau tampilan untuk aplikasi pemesanan makanan? Setelah platform dan tema sudah dipilih, kini saatnya browsing lagi design-design yang disukai. Tapi kali ini, carilah design yang sesuai dengan platform dan tema yang dipilih.

Pilih dua design yang paling disukai, dan coba buat sesuatu yang baru dari hasil kombinasi dua design tersebut.

Saat mendesain sebuah UI, pikirkanlah bagaimana nanti user memakainya. Untuk melatih hal itu, biasakanlah mendesain

dengan sebuah alasan. Apa artinya? Design yang dibuat, komponen yang dibuat, sebaiknya memiliki alasan yang kuat kenapa diletakkan seperti itu atau berbentuk seperti itu.

Gambar 43. Contoh Desain UI Modifikasi dari Dua UI Jiplakan

Contoh 1:

Mengapa menunya ada di bawah?

Mengapa aplikasi ini memiliki tiga menu utama. Dan dalam penggunaan aplikasi ini, user cenderung berpindah-pindah dari menu satu ke menu utama lain-nya dalam selang waktu relatif singkat. Maka dari itu, untuk mempermudah user, tiga menu utama ditaruh di bawah dan sisanya ditaruh di menu more yang terletak di paling kanan.

Mengapa ada tulisan yang tebal dan ada yang tidak tebal?

Ini adalah menu Inbox, tulisan yang tebal sebagai penanda belum dibaca.

Dan yang tidak tebal sebagai penanda sudah pernah dibaca.

Sehingga memudahkan user untuk membedakannya.

Contoh 2:

Terdapat dua input-an tanggal, tetapi mengapa beda? Padahal sama-sama memilih tanggal. Coba bayangkan jika menjadi user. Untuk mengisi tanggal lahir, lebih mudah memakai format pengisian yang atas atau yang bawah?

Tentu lebih mudah memakai format yang atas. Karena, cukup mudah mengingat tanggal lahir. Dan dengan cepat akan mengisi hari, bulan dan tahunnya. Tapi, coba bayang-kan jika menggunakan format pengisian yang bawah, berapa kali harus mengklik tombol back untuk menuju bulan Maret 1980.

Kemudian untuk input-an tanggal pembayaran, mengapa format pengisiannya harus seperti itu? Ini adalah form konfirmasi pembayaran, setelah user melakukan pembayaran, biasanya user akan langsung mengkonfirmasikan pembayarannya. Coba bayangkan, jika user harus mengisi dengan format pengisian seperti tanggal lahir. Cukup merepotkan user, karena harus mengingat hari ini tanggal berapa. Tapi dengan format pengisian seperti di design, ketika user memilih tanggal, maka akan terbuka kalender bulan ini, dengan tanggal hari ini ditandai biru. Sehingga user dengan mudah memilih tanggal pembayarannya.

Contoh 3:

Mengapa menunya ada di kiri dan vertikal ke bawah? apakah karena ini dashboard yang tren-nya selalu meletakkan menu di sebelah kiri?

Meletakkan menu di kiri dan vertikal ke bawah, per- timbangannya adalah skalabilitas.

Sebelum merancang design ini, kami menganalisa bahwa ke depannya, menu di dashboard ini akan bertambah dan per- tambahannya bisa cukup banyak. Jika membuat design menu-nya secara horizontal, maka kelak jika menunya sangat banyak, akan terjadi masalah pada layout-nya.

Tentu tidak diinginkan melihat dua baris menu terletak di bagian atas. Maka dari itu, diputuskan untuk membuat design menu-nya secara vertikal ke bawah. Jadi, jika ada pertambahan menu, tidak akan terjadi masalah pada layout-nya.

Dalam dokumen Dasar-Dasar Rekayasa Perangkat Lunak (Halaman 107-111)

Dokumen terkait