Standarisasi User Interfaces

Irfan Hamid
cetakk-id
Published in
3 min readAug 31, 2019
Photo by You X Ventures on Unsplash

Wireframe yang merupakan suatu kerangka dalam pemetaan fungsionalitas dan item-item yang dimasukan ke dalam halaman website sebelum proses desain sesungguhnya dimulai. Contohnya seperti header, content, footer, link, form grup, dll. Perancangan wireframe yang dilakukan UI Designer bisa menggunakan berbagai media dan teknik implementasi, seperti coretan kertas ataupun menggunakan tools desain wireframing. Secara garis besar visualisasi pada wireframe hanya berupa garis dan kotak yang mampu menggambarkan pemetaan awal dalam desain sistem.

Desain wireframe selanjutnya dijadikan landas acuan dalam proses pendesainan website. Beberapa tools seperti figma, invision studio, dll. merupakan sarana implementasi UI desainer dalam merancang wireframe menjadi UI secara keseluruhan untuk kemudian dieksekusi oleh tim front-end developer.

Dewasa ini, seiring berkembangnya kebutuhan industrial dan dunia bisnis khususnya di bidang sistem informasi menjadi tuntutan tersendiri bahwa UI desainer harus mampu menawarkan pengalaman yang menyenangkan,mudah dan berguna bagi audiens. Akses sistem informasi berbasis website saat ini bukan hanya berorientasi pada desktop semata, melainkan dapat melalui dimensi seluler yang menawarkan mobilitas bagi pengguna yang disempurnakan dengan desain yang apik. Faktor-faktor tersebut menjadi landasan bahwa perancangan UI harus memiliki standarisasi untuk memastikan desain memiliki nilai kosistensi.

Konsistensi juga memudahkan pengguna dalam mengenal fungsionalitas sistem. Standarisasi UI yang berbanding lurus dengan konsistensi desain menuntut beberapa aspek sebagai berikut :

Konsistensi penggunaan grafis

Contoh penyesuaian komposisi warna

Grafis berupa penggunaan warna, font, ukuran, ikon simbol dan tombol sangat diperlukan dalam perancangan desain. Tentu hal ini membutuhkan suatu standar agar memudahkan pengguna dalam mengoperasikan aplikasi. Oleh karena itu, kombinasi grafis juga menjadi pertimbangan tersendiri dalam menciptakan suatu desain yang user friendly. Prinsip tersebut juga dapat menciptakan pengalaman dan nuansa tersendiri yang dapat berkaitan dengan branding bisnis.

Konsistensi gaya desain

Konsistensi penggunaan visualisasi

Gambar, elemen, atau visualitas yang digunakan sebaiknya tidak terlalu ribet, melainkan suatu desain yang familiar serta memudahkan pengguna dalam memahami arti dan makna dalam sistem. Selain itu, konsistensi terhadap jenis gaya visual gambar atau elemen juga diperlukan agar desain sistem menjadi lebih menarik. Contohnya, jika desain yang dirancang menggunakan visual berupa ilustrasi sebaiknya diterapkan secara konsisten, atau tidak mencampurnya dengan foto agar menciptakan konsistensi yang baik.

Konsistensi dimensi

Dimensi dalam struktur desktop tidak semata-mata harus serupa saat berdimensi mobile, sehingga beberapa industri menerapkan PWA (Progressive Web Apps) pada sistem informasinya. Hal tersebut bertujuan agar pengguna lebih dipermudah dalam memahami alur aplikasi yang digunakan. Mobilitas yang sebelumnya dibahas juga menjadi aspek yang paling penting dalam memaksimalkan hasil desain versi mobile bagi suatu aplikasi website.

--

--