School of Information Systems

Aturan Mebuat Disain User Interface

Membuat sebuah desain website merupakan tugas yang menantang bagi para desainer untuk dituntut menjadi lebih kreatif & inovatif, selain dengan adanya aturan yang harus dipahami saat membuat sebuah desain pada suatu website, sebagai desainer juga perlu untuk membuat desain web semenarik mungkin. Berikut ini, 10 aturan terbaik desain UI yang wajib dipakai dalam mendesain suatu website:

1. Pahami Cara UI agar Berkesinambungan dengan UX

Hal paling pertama yang harus dilakukan yaitu, harus memahami cara UI agar dapat berkesinambungan dengan UX. Perancang UX harus perlu mempertimbangkan berbagai faktor seperti desain interaksi & arsitektur, copywriting, koordinasi dengan perancang & pemrogram, dan sebagainya.

Agar dapat menciptakan UI yang bagus, sebagai orang yang merancang UI harus mengandalkan informasi dari sudut pengalaman sih user, seperti mengidentifikasi masalah yan harus diselesaikan, cara arus user akan diputar, & menentukan area produk utama dan hierarki. Idealnya, pekerjaan dalam membuat UI akan dimulai setelah mendapatkan akses ke semua informasi, lalu Mockup akan dibuat, diuji & disetujui oleh perancang UX, dan terakhir sebuah produk akan dirilis tanpa adanya masalah.

2. Kenali User Anda

Jika ingin melakukan proses perencanaan suatu website, sebagai perancang UI dipasti sudah mempunyai gagasan atau ide mengenai kebutuhan user di masa depan. sebagai perancang UI diwajibkan untuk mempunyai gambaran yang jelas mengenai berbagai hal yang dibutuhkan agar banyak orang tertarik website yang kita buat, & memikirkan cara membuat desain yang mampu tampil menarik agar user tetap betah melihat tampilan web yang kita rancang.

3. Buat Sederhana & Konsisten

Salah satu ciri dari UI yang baik yaitu terlihat sederhana. Sebaiknya sebagai User, mereka tidak butuh peta untuk menavigasi aplikasi suatu website yang kita rancang. Untuk melakukannya, kita dapat memakai berbagai elemen seperti warna,, feedback, dan visual, yang semuanya dapat di lihat secara langsung oleh user. UI yang dirancang harus tetap konsisten di setiap desain yang dirancang. User harus dibuat senyaman mungkin agar user tetap betah melihat tampilan ui yang kita rancang di suatu website.

4. Terapkan Hierarki Visual

Elemen terpenting dari sebuah UI harus diperhatikan agar user dapat tertarik pada tampilan UI, dan sebuah desain berfungsi untuk menyediakan hasil yang maksimal, agar efek tersebut terasa bagi user.

5. Manfaatkan Tipografi dengan Baik

Cara lain yang elegan untuk membangun hierarki visual adalah dengan memakai tipografi yang sesuai. Ini tidak sesederhana memilih font yang bagus, karena setiap font memiliki kepribadian yang berbeda-beda, sehingga untuk berkomunikasi pada user, pilihan font harus dipengaruhi oleh karakteristik user yang menjadi target kita.

6. Gunakan Warna & Kontras dengan Benar

Warna bisa dipakai untuk menyampaikan hierarki visual, membangun hubungan antar elemen, & umumnya meningkatkan desain serta mampu menarik perhatian user. Saat mengerjakan desain UI, kita pasti ingin mempertahankan keselarasan warna  yang akan dipakai untuk menyampaikan isyarat visual, & menjaga skema warna yang relatif minimal. Sejatinya, warna yang kontras bisa dipakai untuk efek yang hebat agar bisa menarik perhatian user.

Aturan praktis yang bagus saat memilih suatu warna yang akan dipakai pada UI adalah warna yang lebih gelap cenderung membawa bobot visual yang lebih banyak, dan elemen semacam ini perlu diimbangi dengan warna yang lebih terang.

7. Mempertimbangkan Feedback

Feedback adalah hal yang tidak boleh dilupakan selama proses perancangan suatu tampilan UI. Salah satu keuntungan terbesar dari proyek website adalah bisa merancang berbagai fitur dari feedback yang diberikan oleh user untuk menyampaikan informasi penting kepada kita sebagai perancang suatu website.

8. Sederhanakan Form

Form adalah salah satu metode utama untuk berinteraksi dengan proyek suatu website. Kita harus mampu menyatukannya ke dalam desain UI-nya, tanpa adanya halangan yang bias menyebabkan user tidak tertarik. Jika proyek yang dibangun tidak mengharuskan user untuk mendaftar, kenapa tidak membuat Form menjadi sesederhana mungkin saja?, contohnya adalah twitter, mereka hampir tidak meminta informasi apa pun pada saat kita membuka situsnya. twitter, sekali lagi memberikan contoh bagus dengan form pendaftaran singkat & manis.

9. Berkolaborasi

Bergantung pada lingkup proyek, pada titik tertentu mungkin kita mendapati bekerja sebagai bagian dari tim, & di beberapa kondisi tertentu, merupakan hal yang penting untuk membagikan informasi yang sama kepada semua tim, untuk membuat UI yang relevan & bisa dipakai. Ada banyak alat kolaborasi yang tersedia untuk membantu tim tetap berada di jalur yang terbaik, seperti Slack, InVision, Google Keep, Trello, & Redpen.

10. Bawa Semua Hal Diatas

Merancang sebuah UI bukanlah tugas yang sederhana. Kita harus mempertimbangkan berbagai hal seperti informasi mengenai user yang menjadi target kita, & merancang kebutuhan user untuk menciptakan sebuah desain yang akan memenuhi & melampaui harapan sih user.UI yang dibuat harus mudah & nyaman dipakai, mudah dinavigasi, memakai warna yang tepat untuk user, memakai font yang tepat, mengintegrasikan feedback yang berguna, & tetap konsisten secara keseluruhan.

Tapi pada zaman sekarang ini, mungkin mendesain web tidaklah sesulit dulu karena pada browser sudah disediakan template untuk mendesain suatu web. Bagi sebagian orang, membangun website memakai design template bisa memberikan berbagai keuntungan. Namun tidak sedikit yang beranggapan bahwa design template belum cukup untuk memenuhi kebutuhan bisnis mereka.

Pemakaian design template sebenarnya tergantung dari kebutuhan masing-masing bisnis. Dengan mempertimbangkan segala kelebihan & kekurangannya, kita bisa memutuskan untuk membangun website menggunakan design template atau custom. Berikut kelebihan dan kekurangan dari design template.

Kelebihan Template Design

1.      Lebih hemat biaya

Kita bisa memperoleh design web yang menarik dengan harga yang relative jauh lebih murah dibandingkan dengan design custom. Design template ini bisa menjadi cara termurah untuk menjalankan bisnis secara online.

2.      Menghemat waktu pengembangan web

Kita cuma perlu menyiapkan teks, gambar, serta informasi lain yang mau ditampilkan di dalam website. Jika semua konten yang dibutuhkan telah tersedia, pengembangan website akan selesai dalam waktu yang relative sangat singkat. Jika kita ingin website bisnis bisa segera dijalankan, maka membangun web dengan design template merupakan solusi paling tepat.

3.      Transparansi tampilan website

Kita tidak perlu membayangkan seperti apa tampilan website kita, karena design yang kita pilih merupakan tampilan website yang akan kita pakai. Pada umumnya penyedia layanan memiliki beberapa pilihan design. Sebaiknya, kita memilih tampilan design yang cocok dengan brand & kebutuhan bisnis saja.

Kekurangan Template Design

1.      Tidak unik

Template yang kita pilih juga bisa digunakan oleh siapapun. Hal ini dapat membuat website kita terlihat tidak unik di mata customer. Meskipun demikian, kita masih bisa mengubah warna layout dan jenis text agar terlihat berbeda dibanding website yang lain.

2.      Kurang fleksibel

Karena dibuat dengan memakai template, maka sulit bagi kita untuk melakukan berbagai perubahan pada tampilan suatu website. Seperti yang dijelaskan sebelumnya, design template masih memungkinan untuk perubahan warna, jenis text, atau pun logo perusahaan, namun kita tidak bisa mengubah tata letak design karena dapat merusak design yang telah dibuat. Oleh karena itu, jika kita mau membuat website memakai design template maka sebaiknya kita memilih design yang cocok dengan branding produk bisnis kita.

3.      Sulit Dikustomisasi

Sebagian besar design template cuma mendukung halaman statis. Oleh karena itu, jika kita mempunyai database yang mau diintegrasikan ke dalam website, atau fitur interaktif lainnya maka kita membutuhkan bantuan dari pihak developer. Selain itu, template terkadang tidak mendukung untuk fitur yang ingin ditambahkan sehingga pembaruan tidak bisa dilakukan.

https://belajarkoding.net/10-aturan-desain-ui-yang-wajib-kamu-gunakan-pada-proyek-desain-web/

https://www.logique.co.id/blog/2019/06/13/kelebihan-dan-kekurangan-template-design/

Joni Suhartono