Desain User Interface: Pusat Pengembangan Dan Pemberdayaan Pendidik Dan Tenaga Kependidikan Pppptk Bbl 2017

Desain User Interface PROFESIONAL MODUL E REKAYASA PERANGKAT LUNAK

PUSAT PENGEMBANGAN DAN PEMBERDAYAAN PENDIDIK DAN TENAGA KEPENDIDIKAN PPPPTK BBL 2017

TUJUAN • Memberikan pemahaman kepada peserta diklat tentang desain antarmuka aplikasi pada perangkat bergerak. • Memberikan petunjuk kepada peserta diklat tentang prinsip-prinsip dalam desain antarmuka. • Memberikan petunjuk kepada peserta diklat tentang tata cara penyajian informasi dan dukungan user. 2

INDIKATOR • Merencanakan desain user interface pada aplikasi mobile.

3

SKENARIO Pengantar

Ceramah Praktikum Diskusi

Penguatan 4

MATERI

5

Desain Antarmuka • Desain Antarmuka (User Interface) bertujuan untuk menghasilkan media komunikasi yang efektif antara pemakai dan komputer. • Efektif artinya siap digunakan, dan hasilnya sesuai dg kebutuhan. • Kebutuhan disini adalah kebutuhan penggunanya.

6

Prinsip-prinsip dalam merancang user interface • • • • • •

User familiarity/mudah dikenali Consistency/“selalu begitu” Minimal surprise/tidak buat kaget user Recoverability/pemulihan User guidance/bantuan User diversity/keberagaman

7

5 tipe utama interaksi untuk user interaction • • • • •

Direct manipulation Menu selection Form fill-in Command language Natural language

8

Penyajian Informasi (Information Presentation) • Static information • Disajikan dengan jenis huruf khusus yang mudah dibaca atau diberi highlight dengan warna tertentu seperti pada Gambar 4 atau menggunakan icon yang mewakili • Bisa berupa informasi numeris atau teks.

9

Karakteristik Penyajian Digital dan Analog • Digital presentation – Singkat – hanya perlu sedikit tempat pada layar – Ketepatan nilai ditunjukkan

• Analogue presentation – Nilai terlihat sambil lalu – Untuk menunjukkan nilai relative

10

Penggunaan Warna pada desain Interface • Warna menambah dimensi ekstra pada suatu interface dan membantu user memahami struktur yang kompleks • Bisa dipakai untuk mewarnai-terang (highlight) hal-hal khusus • Kesalahan umum dalam penggunaan warna pada desain UI: – Menggunakan warna untuk mengkomunikasikan arti-merah bisa jadi peringatan atau ada kesalahan – Terlalu banyak gunakan macam warna 11

petunjuk penggunaan warna • • • •

Hindari penggunaan terlalu banyak warna Gunakan kode warna untuk mendukung operasi Pengguna bisa kendalikan warna untuk kode Desain monochrome kemudian tambahkan warna • Gunakan warna kode secara konsisten • Hindari pasangan warna yang tidak cocok/norak • Gunakan warna untuk menunjukkan perubahan status 12

User Support • semua fasilitas sistem untuk mendukung user termasuk on-line help, error messages, user manual • Error Messages sangat penting, karena error message yang buruk cenderung ditolak oleh user

13

Faktor dalam Desain Error message (pesan kesalahan) Faktor

Penjelasan

Context

User guidance memberikan pesan sesuai konteks yang dialami ole Pengguna

Experience

Pesan yang panjang mengganggu bagi yang sudah biasa, tapi bagi pengguna baru pesan yang pendek membingunkan. User guidance perlu menjawab kebutuhan ini

Skill level

Pesan dibuat sesuai dengan kemampuan pengguna dan

pengalamannya. Style

Harus bersifat positif. Lebih baik bersifat aktif dari pada pasif. Harus

sopan, tidak menghina atau bergurau Culture

Jika mungkin, pesan disesuaikan dengan budaya. Mungkin kata

atau warna yang digunakan disesuaikan dengan budaya setempat.

14

PRAKTIKUM

15