Penunjang dan Panduan Perancangan Restyandito, S.Kom, MSIS.

Slides:



Advertisements
Presentasi serupa
Desain Web R0312 – Grafik Komputer.
Advertisements

Interaksi Manusia dan Komputer
Interaksi Manusia dan Komputer
PERANCANGAN ANTARMUKA - 2
Pengujian Software - Pelaksanaan
Interaksi Manusia dan Komputer Pendahuluan Oleh : ANISYA, S.KOM Teknik Informatika Fakultas Teknologi Informatika ITP 2013 Pertemuan 01 Oleh : Anisya,
INTERAKSI MANUSIA DAN KOMPUTER
Interaksi Manusia dan Komputer (IMK) Dosen : Tata Sumitra M
Prototype.
Interaksi Manusia dan Komputer
Pengelolaan Proyek Sistem Informasi
Dialog berbasis text dan pengisian borang
Prototyping Aplikasi Teknologi Informasi
Pemilihan Menu dan Pengisian Formulir
Teori, Prinsip, dan Pedoman
Interaksi Manusia dan Komputer (IMK) 2 SKS Dosen : Yulistia,S. Kom. ,M
Teori , Prinsip, dan Pedoman
Interaksi Manusia Dan Komputer (Interaksi)
Interaksi Manusia dengan Komputer
Pertemuan 3 Menu dan Formulir
Sumber Slide : Inayatullah,M.Si
PROSES-PROSES PERANGKAT LUNAK
komponen antarmuka pengguna
Desain Input & Output.
Interaksi Manusia dan Komputer
Aplikasi Browser gambar menggunakan Visual Basic 6. 0 Dendy B
KONSEP USER INTERFACE.
PriNciples That Guide Practice
Interaksi Manusia & Komputer Pendahuluan
Pengantar Pemrograman Basis Data (PPBD)
Interaksi Manusia & Komputer Penanganan Kesalahan dan Help Dokumentasi
INTERAKSI MANUSIA & KOMPUTER
IMK: PENANGANAN KESALAHAN
PERANCANGAN INTERFACE USER
Interaksi Manusia & Komputer Ragam Dialog
Interaksi Manusia dan Komputer
Interaksi Manusia & Komputer Prototyping
Teori, Prinsip, dan Pedoman
KONSEP INTERFACE
Pengenalan Sistem Operasi
Human Computer Interaction (3)
Pertemuan 3 RAGAM DIALOG.
8 ATURAN EMAS DALAM PERANCANGAN USER INTERFACE
PERANCANGAN ANTARMUKA/TAMPILAN
Perancangan Tampilan.
Teori, Prinsip, dan Pedoman
Mobile Device User Interface
USER INTERFACE.
Persentasi Kelompok REKAYASA PIRANTI LUNAK
Teori , Prinsip, dan Pedoman
Pengenalan Borland Delphi 7.0
Persentasi Kelompok REKAYASA PIRANTI LUNAK
Human-Computer Dialogue
Pertemuan 3 RAGAM DIALOG.
PENANGANAN KESALAHAN DAN HELP DOKUMENTASI
Pertemuan 3 RAGAM DIALOG.
INTERAKSI MANUSIA dan KOMPUTER (HUMAN COMPUTER INTERACTION)
ANALISA DAN PERANCANGAN
Abdu Hari Wijaya Nurul Fajri
PENGANTAR KOMPUTER DAN TEKNOLOGI INFORMASI 1B
Interaksi Manusia Komputer [IF ]
Rekayasa Perangkat Lunak
Perancangan Tampilan.
MODEL PROSES PERANGKAT LUNAK
Perancangan Tampilan.
Perancangan Tampilan.
Perancangan Tampilan.
KONSEP USER INTERFACE PENGANTAR KOMPUTER DAN TEKNOLOGI INFORMASI 1B.
ALGORITMA DAN PEMROGRAMAN 2B
Interaksi Manusia dan Komputer (IMK) 3 SKS
Transcript presentasi:

Penunjang dan Panduan Perancangan Restyandito, S.Kom, MSIS

Penunjang Desain

Mendukung Proses Desain  Proses pengembangan perangkat lunak yang komplek, seperti the star membutuhkan perhatian besar dalam berkoordinasi  Dukungan dibutuhkan bukan hanya utnuk ‘task individual’ tetapi juga untuk koordinasi dan produksi  Bukan hal yang mudah

Pendukung Perancang  Kini perancang tidak perlu menulis program dalam bahasa mesin  High level programming  Interface builders

Pendukung Perancang  Memungkinkan perancang untuk membuat abstraksi dari suatu detail  Beberapa hasil observasi dapat dibuat dengan perangkat lunak

Faktor Pendukung  Pengalaman Perancang  Perancang pemula cenderung berkonsentrasi pada detail  Ahli memiliki pandangan menyeluruh terhadap suatu rancangan dan implikasinya  Solusi yang sudah diketahui sebelumnya  Perancangan didasarkan pada pengalaman sebelumnya  Dekomposisi masalah menjadi sub-sub tugas yang tertutup untuk mengurangi kompleksitas  Alternatif rancangan yang dijajagi dan dievaluasi  Simulasi perancangan  Strategi penalaran (reasoning strategy) : berpindah-pindah diantara tingkat abstraksi dan detail.

Teknik Memperoleh Ide

Supporting Design Teams  Kebanyakan masalah perancangan hanya dapat dipecah (decomposable) sebagian, dan membutuhkan komunikasi diantara para perancang  Metode komunikasi yang efektif:  Informal descriptions  meetings (waktu yang digunakan untuk dialogue conventions)  Kerja kelompok: sulit, tetapi perlu, menghabiskan paling banyak waktu dan tidak selalu efektif

Supporting Design Teams  The Design Room

Macam-macam Perbedaan Penunjang/Dukungan  Mengarahkan desainer untuk meningkatkan pedoman-pedoman kerja tim  Menunjang untuk komunikasi dan pengambilan keputusan desain  Penunjang software untuk menangkap ide-ide, penggalian alternatif-alternatif, pengambilan keputusan dalam desain form yang dibaca sistem

Panduan Perancangan ( Prinsip-Prinsip & Aturan )

Panduan Perancangan Dasar-Dasar & Aturan 1  Pedoman desain antarmuka : high level, luasnya prinsip/dasar penerapan secara langsung  Contoh sederhana dari luasnya cakupan prinsip dasar pesan yang dapat diterapkan :  mengetahui populasi pengguna  mengetahui populasi pengguna  kurangi beban kognitive pemakai  kurangi beban kognitive pemakai  teknik penanganan error  teknik penanganan error  mempertahankan konsistensi & kejelasan  mempertahankan konsistensi & kejelasan

Panduan Perancangan Dasar-Dasar & Aturan 2  Prinsip dasar yang harus diterapkan secara praktis, disesuaikan dengan konteks kegunaan/penggunaan Contoh: kurangi beban cognitive -> minimalkan proses belajar/memahami dengan desain yang konsisten  posisi icon-icon menu selalu konsisten  posisi icon-icon menu selalu konsisten  menggunakan icon instruksi standar, misalkan abort,  menggunakan icon instruksi standar, misalkan abort, quit, exit dan sebagainya quit, exit dan sebagainya  dan hal-hal lain untuk menangani akhir program, dst  dan hal-hal lain untuk menangani akhir program, dst  Aturan-aturan desain ? berdasarkan prinsip-prinsip : instruksi langsung bagi desainer/perancang

Prinsip & Aturan  Perlu pedoman pengembangan dengan memperhatikan asumsi psikologi yang benar  Contoh : prinsip bahwa manusia akan mengingat dengan benar item sebanyak  Penggunaan warna dengan benar, warna untuk pengelompokkan bukan untuk mengingat ? -> aturan dibuat bukan untuk perasaan  Aturan item menu dibuat bukan berdasar perasaan  Pedoman dibuat umum, tidak detail   detail form : huruf, bentuk teks box, dst   apakah perlu kesepakatan kecerahan warna ? atau hanya dibagian tertentu ?   logo/banner selalu kiri atas ? atau lainnya ?

Darimana Panduan didapat ?  Ada dua sumber utama - teori psikologi - pengalaman yang mudah dipergunakan  Sering ada pertentangan pedoman : pertukaran kebutuhan/keperluan - pengalaman akan sangat membantu - beberapa hal sepele : aplikasi harus divisualisasikan, dikonseptualisasikan dan kejelasan pemakai bahasa (Microsoft ’92)  Contoh : pedoman pembuatan form

Pedoman/Panduan Desain Form-Fill (Schneiderman, 1992)  Kejelasan judul : terminologi komputer  Intruksi mudah dipahami : gunakan bahasa yang familiar, yang singkat  Dikelompokan secara logis dan urutan field pilihan : field relasi yang berdekatan, urutan harusnya merefleksikan dengan kebiasaan yang sesuai  Visualisasi yang sesuai permintaan : spasi, jika tersedia tempat pada form tersebut diposisikan sebaik mungkin  Penggunaan label-label yang umum/familiar  Singkatan & istilah-istilah yang konsisten

Pedoman/Panduan Desain Form-Fill (Schneiderman, 1992)  Batas/boundaries : gunakan underscore untuk mengindikasikan bahwa pilihan kata/karakter tersebut yang akan diproses/dipilih  Perpindahan kursor yang sederhana/simple : kursor, TAB  Koreksi kesalahan : backspace dan pemindahan kursor  Pesan kesalahan untuk menangani masukan yang tidak seusai dengan aturan  Pilihan field dengan diberikan tanda  Pesan yang menjelasakan field : tampilkan pada lokasi yang konsisten ketika kursor pada field tersebut  Signal/tanda penyelesaian : dibuat tanda khusus saat proses form selesai

Pedoman/Panduan Desain 3D Interfaces (Brooks, 1988)  Pilihan secara eksplisit sesuai metafor antarmuka membantu pengambilan keputusan  Pengguna membutuhkan waktu yang lama dan memerlukan banyak isyarat/ tanda untuk mengenali mental model dari lingkungan program  Pengguna sering memerlukan tampilan yang sesuai dengan dunia nyata dan mengenalinya  Secara detail memberi pertolongan bagi pengguna untuk melakukan aktifitas : pindah ke bagian yang lebih dalam/detil saat obyek berganti/pindah  Menambah dengan cara pemahaman lain : suara,...

Pedoman/Panduan Desain 3D Interfaces (Brooks, 1988)  Membantu pengguna mengontrol banyak variabel secara dinamis dengan penempatan/pengelompokkan variabel yang berelasi pada satu kelompok, membagi/memisah piranti masukan  Ada dua model kursor yang diperlukan untuk membedakan pengontrolan : - memindahkan area yang ditampilkan/dipilih - memilih menu dan memasukkan masukan/input pengguna seharusnya dapat mengoperasikan dua fungsi kursor tersebut dengan enak/senang/nyaman.

Pedoman Gaya/Mode Rumah  Kumpulan aturan menghasilkan aplikasi yang memiliki kesamaan cara pandang dan ‘citra’/sentuhan  Menambah pengetahuan/pemahaman para pemakai  Dan sebagainya

Evaluasi Pedoman  Pada umumnya (keseringan/terkadang) pedoman berisi masukan yang bertentangan  Masukan yang bertentangan ini sering menghilangkan nilai-nilai ukuran atau standar dasar desain (misalnya : informasi tentang pemakai atau profile user)  Pedoman seharunya diaplikasikan/diterapkan dengan bijaksana/tepat  Bagaimana salah satu pedoman dalam evaluasi ? - mengetahui kepakaran orang lain - kepakaran individual - selalu mencari hubungan/relasi

Referensi  Preece, Rogers, Sharp, 1994, Human-Computer Interaction, Addison-Wesley. ( hal )

The End