User Interface (UI)

By Seika生花 - March 14, 2020

Apa itu User Interface ?

User Interface (UI) atau Antarmuka Pengguna adalah bentuk visual atau tampilan grafis pada website atau aplikasi yang berhubungan langsung dengan pengguna (User) dan ditujukan pada penggunanya agar ada interaksi didalamnya. UI berfungsi untuk menghubungkan antara pengguna dengan sistem operasi/aplikasi/website, sehingga bisa digunakan.
UI berdasarkan platform nya dibagi menjadi tiga, yaitu :

1. Desktop (PC, Laptop, Notebook)

2. Mobile (Smartphone, tablet)

3. Website (Desktop & Mobile)

Perbandingan UI Dekstop dan Mobile :

Scrreen Size (Ukuran Layar)

-    Desktop = Large (besar)
-    Mobile = small (kecil)

Interaction (interaksi)

-    Desktop = cursor (kursor)
-    Mobile = gesture (Gerakan)

Organizing content (Mengatur Konten)

-    Desktop = columns (kolom)
-    Mobile = scrolling/portrait and landscape (scroll/potret dan bentang)

Functionality (kegunaan)

-    Desktop = big tasks
-    Mobile = experimental

UI Mobile

Interaksi pengguna dengan perangkat mobile harus dirancang sedemikian rupa sehingga rentang waktu tindakan pengguna lebih pendek dari pada di perangkat dekstop, tindakan harus sederhana namun terfokus.

Selain itu, ukuran layar pada perangkat mobile juga kecil sehingga jumlah informasi yang dapat ditampilkan terbatas. Desain UI haruslah cepat saat dibuka.

Metode pembuatan desain UI Mobile

-    Material design for android (MDfA)

MDfA adalah panduan untuk membuat desain UI pada sistem operasi Android yang mencakup visual, gerak, dan interaksi di seluruh platform dan perangkat.

MDfA ini merupakan template UI Android standar yang digunakan pada aplikasi bawaan atau aplikasi milik Google.

Semua panduan mengenai standar desain UI aplikasi Android tersedia secara lengkap, seperti tema, widgets, animasi, dan komponen UI lainnya.

-    Common Element Sets (CES)

CES merupakan seperangkat elemen UI yang umum atau populer digunakan oleh aplikasi dan muncul setidaknya satu kali pada desain UI lainnya.

CES pada UI bisa seperti desain tata letak, desain tombol, desain navigasi, desain form, desain produk dan lain sebagainya.

Komponen UI yang umum digunakan dapat merujuk dari desain aplikasi yang populer saat ini.

UI Website

Ui website haruslah :

-   Responsif, bisa di desktop dan mobile
-   Tampilan simpel dan mudah digunakan
-   Page speed bagus (cepat)

Metode Pembuatan Desain UI Website

Ada 3 prinsip dalam mendesain sebuah website menurut Veen’s design principles, yaitu bisa menjawab Pertanyaan :

1. Di mana saya?
2. Kemana saya bisa pergi?
3. Ada apa di sini?

Veen’s Design Principles





1. Menggambarkan website harus memiliki header yang menjelaskan website apa.

2. Menggambarkan adanya navigasi yang diposisikan di sidebar.


3. Menggambarkan konten dari website.


Jenis Desain UI Website

-   Static

Desain web memiliki ukuran tetap pada semua resolusi browser (pixel).

-   Fluid

Desain web dapat menyesuaikan lebar layout sesuai dengan resolusi browser (%).

-   Responsive

Desain web dapat berganti layout pada resolusi tertentu (desktop&mobile).

-   Responsive fluid

Gabungan Responsive & Fluid (%)

-   Horizontal Scrolling

Desain web dengan menampilkan konten Horizontal atau menyamping).

-   Parallax Scrolling

Desain web dengan layer atau hanya 1 halaman (one page/single page).
 

  • Share:

You Might Also Like

0 comments