Interaksi Manusia dan Komputer

Slides:



Advertisements
Presentasi serupa
TURUNAN/ DIFERENSIAL.
Advertisements

CHAPTER 7 Pengembangan Sistem
Memahami Etimologi Multimedia
MENGEMBANGKAN STRATEGI PEMBELAJARAN
Waktu Respons dan Kecepatan Tampil
Perth Chart & Critical Path Method
SOAL ESSAY KELAS XI IPS.
Lingkungan Pengembangan Antarmuka Pemakai
MENGGAMBAR TEKNIK ELEKTRONIKA Program Visio Technical.
Pertemuan 2 Pengambilan Keputusan, Model dan Dukungan
Pertemuan 7 DSS Development
KUESIONER, SKENARIO, USE CASE “AL-QURAN ONLINE BERBASIS WEB”
Lecturer : Bambang Warsuta, S.Kom, M.T.I
Interaksi Manusia dan Komputer
LUAS DAERAH LINGKARAN LANGKAH-LANGKAH :
Created by : Peningkatan kualitas Pendidikan Guru Produktif SMK di Kabupaten Indramayu Indramayu, 22 September 2007.
PROTOTYPING MODEL >> Kelompok 1: Windandini B.M.
L. Erawan. Each Area Need Different Expertise Pakar Bisnis Pakar Komunikasi Pakar Pengalaman Pengguna.
LIMIT FUNGSI LIMIT FUNGSI ALJABAR.
DASAR-DASAR PROSES KOMPUTER
Microsoft Powerpoint: Presentasi
Interaksi Manusia dan Komputer
PROTOTYPING.
PROTOTYPING Analisa Desain Sistem Informasi. Pendahuluan Prototipe merupakan simulasi atau animasi dari bakal sistem. Prototipe merupakan suatu metode.
Pembuatan Prototipe Perangkat Lunak
Prototype.
Protyping IMK-M5.
Langkah Membuat Blog (1) Buka
INTERAKSI MANUSIA DAN KOMPUTER
INTERAKSI MANUSIA DAN KOMPUTER
Tahapan Proyek Pembuatan Situs Web
Ragam Dialog Interaksi
Prototyping Aplikasi Teknologi Informasi
BAB 6 PERANCANGAN SISTEM secara umum
Mengelola isi halaman web
Pertemuan ke-1 Pengantar: Pengertian disain formulir Kegunaan formulir
Manajemen Proyek.
WISNU HENDRO MARTONO,M.Sc
PERANCANGAN SISTEM.
PROTOTYPING.
Desain, Prototipe dan Konstruksi
Pertemuan 1 PENGENALAN IMK.
BMC : Brainstorming and Harvesting
Kelompok 4 Agusta Sigit Dewantoro Almizan Dio Restu Saputra
Information Architecture web dasar Metode merancang situs web
HUMAN COMPUTER INTERACTION
Analisa Desain Sistem Informasi
INTERAKSI MANUSIA KOMPUTER
Interaksi Manusia dan Komputer
Pertemuan 1 PENGENALAN IMK.
Interaksi Manusia & Komputer Prototyping
Interaksi Manusia dan Komputer
Prototyping
Interaksi Manusia dan Komputer
PERANCANGAN SISTEM SECARA UMUM
PERANCANGAN ANTARMUKA/TAMPILAN
Pertemuan 5 Electronic Commerce
Interaksi Manusia dan Komputer
Interaksi Manusia dan Komputer
Sikllus Pengembangan Aplikasi Multimedia
Multimedia Authoring Tools
PROTOTYPING IMK 2015 Laseri, S.Kom.
PUTRI ISMA OKTAWIANI ( )
Analisa Desain Sistem Informasi
Prototyping Deskripsi Desain  Bagaimana kita menyatakan dengan cepat gagasan-gagasan desain ?  Tidak ada koding.
Pembangunan Prototaip
MODEL PROSES PERANGKAT LUNAK
Fathiah, S.T.,M.Eng Universitas Ubudiyah Indonesia
Fathiah, S.T.,M.Eng Universitas Ubudiyah Indonesia
Modul 5 Kegiatan Belajar 4: DESAIN MULTIMEDIA INTERAKTIF Kelompok 4: Nur Awaludin Warjito Totok Hermawan.
Transcript presentasi:

Interaksi Manusia dan Komputer Prototype Interaksi Manusia dan Komputer Pertemuan 5a

Topik Bahasan Pengertian prototype? Alasan membuat prototype? Kompromi dalam pembuatan prototype - vertical - horizontal Jenis-jenis teknik prototype - low fidelity - high fidelity 2 2

Pengertian prototype? Dalam perancangan sistem interaktif, prototype bisa berupa: Serangkaian skets layar Sebuah storyboard, i.e. a cartoon-like series of scenes Powerpoint slide show Video yang mensimulasikan penggunaan sebuah system Sebuah perangkat lunak dengan fungsionalitas terbatas yang ditulis dengan suatu bahasa pemrograman 3 3

Alasan membuat prototype? Evaluasi dan umpan balik sangat penting dalam perancangan Para Stakeholders dapat lebih mudah melihat, memegang, dan berinteraksi dengan prototype dari pada dengan dokumen atau gambar Anggota tim bisa berkomunikasi secara lebih efektif Lebih mudah mencoba ide-ide baru Mendorong pemikiran lebih dalam aspek perancangan yang sangat penting. prototype mendukung perancang dalam memilih alternatif rancangan 4 4

Hal-hal yang harus dibuat prototype? Technical issues Work flow, task design Screen layouts and information display Difficult, controversial, critical areas 5 5

Dua Pendekatan dalam Pembuatan Prototype Evolutionary: the prototype eventually becomes the product Revolutionary, or throwaway: the prototype is used to get the specs right, then discarded!! 6

Horizontal prototype: broad but only top-level 7

Vertical prototype: deep, but only some functions 8

Low-fidelity Prototyping Menggunakan media yang tidak sama dengan media sistem final, contoh: paper, cardboard Cepat, murah dan mudah diubah Contoh-contoh: sketches of screens, task sequences, etc ‘Post-it’ notes storyboards ‘Wizard-of-Oz’ 9 9

Paper prototyping 10

Powerpoint Prototyping Powerpoint Prototype Website 11 Source: Kelly, Maureen. “Interactive Prototypes with PowerPoint”. http://www.boxesandarrows.com/view/interactive

Form prototype Mengutamakan tampilan visual Hanya dummy, fungsi-fungsi tidak bekerja                                                                                                                                                                                                  Project inkwell “Spark” computing device concept Nintendo control pad mockup 12 Source: Buxton, Bill. Sketching User Experiences. Morgan Kaufman, 2007. Nintendo via 37signals.com blog, IDEO.

Storyboard Sering dibuat menurut sebuah skenario, memberikan gambaran lebih terinci. Serangkaian gambar/sketch yang memperlihatkan bagaimana pengguna bisa menjalankan aplikasi sesuai tugas Dilakukan pada awal proses perancangan 13 13

Storyboard = prototip berbasis kertas Alat untuk memvisualisasikan proyek anda: • Navigasi tampilan visual jalur-jalur navigasi • Interaktifitas dalam bentuk kata-kata di atas kertas • rancangan layar Layout dasar, warna dasar • Sketch kasar untuk key frames, menus, etc. Storyboarding is about conceptual thinking, not art. [Al Brown, Presentations magazine, 1997] 14

Membuat storyboard berdasarkan skenario 15 15

Rancangan layar terinci membuat implementasi mudah dan tidak ambigu 16

Pembuatan Sketch Pembuatan sketch sangat penting dalam pembuatan low-fidelity prototype Tidak tergantung pada ketrampilan menggambar, gunakan simbol-simbol sederhana. 17 17

Prototype berbasis kartu Kartu index (3 X 5 inches) Setiap kartu menggambarkan satu layar atau sebagian dari layar. Sering dipakai dalam pengembangan situs web. 18 18

Kartu Index Umum dipakai dalam pengembangan situs web Juga berguna untuk aplikasi dengan jumlah layar yang banyak Setiap kartu mewakili sebuah layar. Sangat membantu dalam mengorganisasikan situs web. Bisa membantu dalam pembuatan arsitektur informasi 19

20

‘Wizard-of-Oz’ prototyping Pengguna mengira mereka berinteraksi dengan komputer, padahal seorang pengembang memberikan output secara manual menggantikan sistem. Biasanya dilakukan di awal proses perancangan untuk memahami keinginan pengguna. What is ‘wrong’ with this approach? User >Blurb blurb >Do this >Why? 21 21

High-fidelity prototyping Menggunakan materi seperti produk final. Prototip lebih tampak seperti sistem final dari pada versi low-fidelity Perangkat lunak yang sering digunakan seperti Macromedia Director, Visual Basic, dan Smalltalk. Ada bahaya karena bisa mengakibatkan pengguna mengira sudah mendapatkan sistem yang sudah jadi 22 22