Download - PPT - Perancangan Antarmuka Pengguna
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
1/29
PerancanganAntarmuka Pengguna
FATHURAHMA, ST
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
2/29
Perancangan Antarmuka
Membuat perancangan interaktif untuk
mendukung pengguna dalam pekerjaan dan
kehidupan seharihari mereka
Perancangan ruang untuk k!munikasi
manusia dan interaksi
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
3/29
Mengapa"
#ebutuhan antarmuka $ang baik
Pembeli adalah raja
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
4/29
Faktan$a%
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
5/29
Prinsip Antarmuka
#eberagaman
Pencegahan er!r
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
6/29
Aturan Perancangan
#!nsistensi
Memungkinkan penggunaan sh!rtcuts
Feedback $ang inf!rmatif
Rancangan dial!g $ang terarah
Pencegahan dan penanganan er!r
#emudahan &re'ersal !f acti!n( Supp!rt internal l!cus !f c!ntr!l
Mengurangi isi sh!rt term mem!r$
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
7/29
Tujuann$a) #ebergunaan
#ebergunaan adalah mengukur kualitas
pengalaman pengguna ketika berinteraksi
dengan sistem * +ebsite, s!ft+are
aplikasi, tekn!l!gi m!bile, atau perangkat
pengguna lainn$a $ang di!perasikan
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
8/29
#!mp!nen Antarmuka
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
9/29
#ecenderungan dalam
Antarmuka
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
10/29
Pelaku Antarmuka
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
11/29
M!del Siklus Hidup
Menunjukkan bagaimana aktifitas $ang
berelasi satu sama lain
M!del siklus hidup terdiri dari)
* T!!ls manajemen
* Pen$ederhanaan 'ersi realitas
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
12/29
M!del Siklus Hidup
!nt!h m!del siklus hidup)
* -erdasarkan Rancang bangun s!ft+are ..
+aterfall, spiral, star, micr!s!ft
* -erdasarkan /M# .. rancang bangun
kebergunaan
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
13/29
M!del Perancangan /nteraksi
Sederhana
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
14/29
0aterfall M!del
Analisa
#ebutuhan
Perancangan
Peng!dean
Pengujian
Pera+atan
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
15/29
Spirall M!del
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
16/29
Star M!del
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
17/29
Penting11
Antarmuka 2 k!munikasi
#!munikasi 3 Satu Arah
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
18/29
Penting11
Antarmuka Pengguna 2 4alur 5 Arah
-agaimana berk!munikasi dengan
pengguna anda
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
19/29
Membangun #!munikasi 5 Arah
/ntruksi $ang jelas
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
20/29
Membangun%
Tiap aksi ada reaksi
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
21/29
Membangun%
Hindari Ambiguitas
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
22/29
06S/067
Menampilkan
sesuatu apa adan$a
A+al 89an peng!lah
kata 06S/067
menjadi standar
!nt!h) Ms 0!rd,
:!tus 0!rdPr!,!rel(s 0!rd Perfect
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
23/29
#euntungan 06S/067
Tampilan teks la$ar penuh
Tampilan d!kumen 2 hasil cetak
-entukbentuk kurs!r mengindikasikanpr!ses $ang jelas
Pengendalian kurs!r jelas dan alamiah
/k!n berlabel untuk aksi cepat Feedback $ang cepat
Pen$ediaan fungsi pembalik ;und! dapat menarik perhatian, namun bisa juga
mengganggu
Pastikan ik!n $ang dipilih terlihat dengan jelasketika dikelilingi !leh ik!nik!n $ang tidak terpilih
-uatlah setiap ik!n berbeda
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
26/29
Petunjuk%
Pastikan keselarasan dari setiap ik!n
sebagai bagian dari keluarga ik!n
Rancanglah animasi pergerakan
Tambahkan inf!rmasi detail, misal dengan
ba$angan, ketebalan, +arna atau animasi
?kspl!rasi penggunaan k!mbinasi daribeberapa ik!n untuk membuat aksi baru
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
27/29
Tingkatan Perancangan /k!n
:eksik) tanda $ang dibangkitkan mesin *
bentuk piksel, +arna, kecerlangan, kedap
kedip
Sintaktik) kemunculan dan perpindahan *
garis, p!la, bagian m!duler, ukuran,
bentuk
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
28/29
Tingkatan%
Semantik) represntasi !bjek * k!ngkrit 's
abstrak, bagian 's keseluruhan
Pragmatik) dapat dibaca, digunakan,
diidentifikasi, diingat, dan dinikmati
>inamik) resp!n ketika diklik *
highlighting, dragging, atau
pengk!mbinasian
-
7/24/2019 PPT - Perancangan Antarmuka Pengguna
29/29
Ped!man untuk Tampilan >ata
#!nsistensi untuk semua aspek
F!rmat $ang sudah dikenal
Mengurangi mem!ri jangka pendekpengguna