User Interface

Pertemuan ke-13 tanggal 19 Mei " User Interface "

Pengantar UI 

Merujuk pada proses merancang antarmuka pengguna yang efektif,intuitif,dan menarik untuk apk atau sistem. Tujuannya untuk memaatikan pengguna dapat berinterksi dengan produk secara mudah dan menyenangkan.

Konsep penting dalam desain UI :

1. Desain berpusat pada pengguna (User-Centered Desain)

2. Kesederhanaan (Simplicity)

3. Konsistensi (Consistency)

4. Hierarki Visual (Visual Hierarchy)

5. Umpan Balik(Feedback)

6. Aksebility (Accessibility)

7. Responsif 

8. Estetik

9. Fungsionalitas 

10. Prorotipe dan pengujian (Prorotyping and Testing)

Komponen Utama UI

1.Elemen Visual                     

• buttons,
• icons,
• text,
• images,
• colors,
• layout

2.Elemen Interaktif 

• forms,
• menus,
• navigation,
• animations

3. Elemen Informasi 

• error messages,
• notifacation,
• tooltips

Jenis Jenis UI

1. Graphical User Interface (GUI) : Antarmuka berbasis grafis yang menggunakan elemen visual. Contoh : aplikasi desktop, website, atau aplikasi mobile

2. Command-Line Interface (CLI) : Antarmuka berbasis teks dimana pengguna memasukkan perintah untuk berinteraksi dengan sistem. Contoh : terminal disistem operasi

3. Voice User Interface (VUI) : Antarmuka memungkinkan pengguna berinteraksi dengan sisten menggunakan suara. Contoh : asisten virtual seperti alexa

4. Touch User Interface (TUI) : Antarmuka yang dirancang khusus untuk layar sentuh. Contoh : smartphone atau tablet

5. Gesture-Based Interface : Antarmuka yang menggunakan gerakan tubuh untuk berinterksi dengan sistem . Contohnya teknologi AR atau VR

Tujuan utama user interface (UI) adalah menciptakan pengalaman pengguna yang mudah, intuitif, dan menyenangkan.

Hubungan User Interface  (UI) vs User Experience (UX)

UI (User Interface) dan UX (User Experience) adalah dua hal yang saling berkaitan dan penting dalam desain produk digital. UI adalah tentang bagaimana tampilan antarmuka produk, sementara UX adalah tentang bagaimana pengguna merasakan dan berinteraksi dengan produk tersebut. Keduanya bekerja sama untuk menciptakan pengalaman pengguna yang positif dan memuaskan. 

Jenis Konsistensi dalam Desain

1. Konsistensi Visual

    Elemen seperti warna, font, ukuran teks, ikon dan tombol harus seragam diseluruh antarmuka. Contohnya tombol simpan harus memiliki gaya yang sama disemua halaman.

2. Konsistensi Fungsional

    Elemen yang memiliki fungsi serupa harus berperilaku sama. Contoh tombol kembali harus selalu mengarahkan pengguna ke halaman sebelumnya.

3. Konsistensi dalam bahasa

    Gunakan terminologi yang konsisten untuk label, pesan, dan instruksi. Contoh jika menggunakan kata hapus disatu tempat, jangan gunakan buang ditempat lain.

4. Konsistensi dalam tata letak

    Pola tata letak harus konsisten diseluruh halaman dan layar. Contoh navigasi utama selalu ditempatkan dibagian atas halaman

5. Konsistensi dalam interaksi

    Pola interaksi seperti animasi, efek hover, atau respons terhadap klik harus seragam.