---

1. 📖 Pengertian User Interface (UI)

6

🔍 Penjelasan

User Interface (UI) adalah antarmuka visual yang digunakan pengguna untuk berinteraksi dengan aplikasi mobile. UI mencakup semua elemen yang terlihat seperti tombol, teks, gambar, ikon, dan layout.

🧠 Narasi

UI merupakan wajah dari sebuah aplikasi. Pengguna pertama kali menilai aplikasi dari tampilannya sebelum mencoba fungsinya. Oleh karena itu, UI harus dirancang menarik, intuitif, dan mudah digunakan.

---

2. 🎯 Konsep UI/UX dalam Mobile

7

🔍 Perbedaan UI dan UX

Aspek	UI	UX
Fokus	Tampilan	Pengalaman pengguna
Tujuan	Estetika	Kemudahan penggunaan
Contoh	Warna, tombol	Navigasi, alur aplikasi

🧠 Narasi

UI dan UX saling berkaitan. UI yang bagus belum tentu memberikan UX yang baik jika alur aplikasi membingungkan. Dalam pengembangan mobile, keduanya harus berjalan seimbang.

---

3. 🧱 Konsep Layout dalam Android

7

🔍 Penjelasan

Layout adalah struktur yang mengatur posisi dan ukuran elemen UI pada layar.

📌 Hirarki Layout

• ViewGroup → wadah (container)
• View → elemen UI (button, text, dll)

🧠 Narasi

Layout menentukan bagaimana tampilan aplikasi disusun. Struktur yang baik akan membuat UI lebih responsif dan mudah dikembangkan.

---

4. 📐 Jenis-Jenis Layout Android

8

🔍 Jenis Layout

Layout	Fungsi
LinearLayout	Menyusun elemen secara vertikal/horizontal
RelativeLayout	Posisi relatif terhadap elemen lain
ConstraintLayout	Layout fleksibel dan kompleks
FrameLayout	Menumpuk elemen
GridLayout	Susunan grid

🧠 Narasi

ConstraintLayout saat ini menjadi standar karena fleksibel dan efisien dalam membuat UI modern.

---

5. 🧩 Komponen UI Dasar

8

🔍 Komponen Utama

• TextView → menampilkan teks
• EditText → input pengguna
• Button → aksi
• ImageView → gambar

🧠 Narasi

Komponen UI adalah elemen dasar yang membentuk tampilan aplikasi. Pengembang harus memahami fungsi setiap komponen agar dapat digunakan secara optimal.

---

6. 🧾 XML Layout dalam Android

7

🔍 Contoh XML

<LinearLayout
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">    <TextView
        android:text="Hello UI"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/></LinearLayout>

🧠 Narasi

XML digunakan untuk mendefinisikan tampilan UI secara deklaratif. Hal ini memisahkan antara logika program dan tampilan.

---

7. 🎨 Prinsip Desain UI Mobile

9

🔍 Prinsip Utama

• Consistency → konsistensi tampilan
• Simplicity → sederhana dan tidak rumit
• Visibility → elemen mudah terlihat
• Feedback → respon terhadap aksi pengguna

🧠 Narasi

Desain UI yang baik tidak hanya menarik tetapi juga memudahkan pengguna dalam berinteraksi dengan aplikasi.

---

8. 📱 Responsive Design

6

🔍 Penjelasan

Responsive design adalah kemampuan UI menyesuaikan diri dengan berbagai ukuran layar.

📌 Teknik

• Menggunakan dp (density-independent pixel)
• ConstraintLayout
• Resource berbeda (layout-sw600dp, dll)

🧠 Narasi

Karena banyaknya variasi perangkat Android, UI harus fleksibel agar tetap nyaman digunakan di semua perangkat.

---

9. 🔄 Event Handling pada UI

6

🔍 Contoh

button.setOnClickListener {
    println("Button diklik")
}

🧠 Narasi

Event handling memungkinkan aplikasi merespon interaksi pengguna seperti klik, swipe, atau input teks.

---

10. ⚠️ Kesalahan Umum dalam Desain UI

7

🔍 Kesalahan

• Tampilan terlalu penuh
• Navigasi membingungkan
• Warna tidak konsisten
• Tidak responsif

🧠 Narasi

Kesalahan desain UI dapat menyebabkan pengguna meninggalkan aplikasi. Oleh karena itu, penting untuk mengikuti prinsip desain yang baik.

---

📌 Kesimpulan

User Interface dan Layout merupakan aspek penting dalam pengembangan aplikasi mobile. UI yang baik tidak hanya menarik secara visual tetapi juga memberikan pengalaman pengguna yang nyaman dan efisien. Dengan memahami layout, komponen UI, serta prinsip desain, mahasiswa dapat membangun aplikasi yang profesional.

---

🎯 Latihan / Tugas

1. Buat layout sederhana menggunakan LinearLayout
2. Buat form input (nama & email)
3. Implementasikan tombol dengan event klik
4. Desain UI sederhana aplikasi login