Dialog Style: Direct Manipulation

dokumen-dokumen yang mirip
Pengantar Banyak riset yang telah dilakukan untuk membangun aplikasi NL, contoh bahasa yang digunakan : Inggris, Prancis, Arab & China Perbedaan aplik


Danang Wahyu Utomo

Interaksi Manusia-Komputer

Pertemuan 6 GAYA INTERAKSI DAN PERANGKAT INTERAKSI #1

Interaksi Manusia dan Komputer

PARADIGMA DAN PRINSIP INTERAKSI

Interaksi Manusia - Komputer

Danang Wahyu Utomo

RAGAM DIALOG / GAYA INTERAKSI

RAGAM DIALOG / GAYA INTERAKSI

PENDAHULUAN. Model interaksi. Ergonomi. Gaya interaksi. Konteks. terjemahan antara pengguna dan sistem. karakteristik fisik dari interaksi

Paradigma IMK INTERAKSI MANUSIA & KOMPUTER. LUTFI FANANI Semester Ganjil 2015/2016

USER INTERFACE DESIGN (UID)

RAGAM DIALOG. Aspek penting dalam dialog adalah gaya interaksi. Interaksi merupakan dialog antara manusia dan komputer

Manipulasi Langsung dan Lingkungan Maya. Interaksi Manusia dan Komputer Sesi 5

PENDAHULUAN. Mengapa Interaksi Manusia dan Komputer (Human Computer Interaction)?

Paradigma dan Prinsip Usability. Rima Dias Ramadhani

Pengertian Interaksi = komunikasi 2 arah antara manusia (user) dan sistem komputer.

Interaksi Manusia dan Komputer

lrl =? 1 -r.rlntrfif == E )'ti.,

Rekayasa Perangkat Lunak Semester Genap 2009/2010. Bahan Ajar Rekayasa Perangkat Lunak USER INTERFACE DESIGN (UID)

DIALOG DESAIN. 2. Sintaksis - Yaitu urutan dan struktur dari input dan output. - Pada bahasa manusia, ekuivalen dengan grammar suatu kalimat.

User Interface Design

Guidelines & Principles. Desain Antarmuka Pengguna MI1392 Pekan ke-4

PRINSIP UTAMA MENDESAIN ANTARMUKA (INTERFACE)

DESAIN ANTARMUKA PENGGUNA. System User Pengguna utama dari desain antarmuka sistem. Pemilik dimana desain antarmuka tersebut ditujukan.

Interaksi Manusia dan Komputer (Pengantar User Interface) Dosen : Agus Aan Jiwa Permana, S.Kom, M.Cs

User Interface Design (UID) Disiapkan oleh Umi Proboyekti, S.Kom, MLIS

4. Bahasa pemrograman dibawah ini yang masih berbentuk teks hasil outputnya adalah : a. Delphi b. Visual Basic b. Pascal d.

2. Bagian yang berfungsi menghasilkan informasi berdasarkan pengolahan data yang sudah dimasukan oleh pengguna lewat algoritma adalah definisi dari: a

Konfigurasi Desktop BAB 2

TEKNIK INTERAKSI. Chalifa Chazar Modul :

Pemilihan Tipe Windows

Bab 1a Case Tools - Case Studio 2

Merancang User Interface Berbasis Web E-commerce

Model User Interface. Dibuat Oleh: Anindito Yoga Pratama, S.T., MMSI

PRINSIP ANTARMUKA PENGGUNA KULIAH ONLINE : IMK IF SMT IV [2014] FB : IMK IF SMT IV [2014]

BAB 2 LANDASAN TEORI. yang saling berinteraksi untuk mencapai tujuan. yang dimaksud dengan data dan informasi? Data adalah fakta fakta yang

RAGAM DIALOG. Interaksi Manusia dan Komputer. Ratna Wardani

bidang REKAYASA IMPLIKASI PERFORMANSI PROFILE PENGGUNA TERHADAP PERANCANGAN ANTARMUKA PERANGKAT LUNAK MIRA KANIA SABARIAH

Danang Wahyu Utomo

DINAMIKA TEKNOLOGI April 2012 Vol. 5; No. 1; Hal

PEMILIHAN TIPE WINDOWS

Soal Pra UTS IMK. 3.Media bentuk sederhana dialog antara manusia dan komputer yang kurang menarik karena berisi teks adalah adalah : c.

KNOW YOUR USERS & CLIENTS

Interaksi Manusia & Komputer (Human Computer Interaction)

Interaksi Manusia dan Komputer

Pengembangan Sistem Informasi

INTERAKSI INTERAKSI. Definisi Interaksi. Kerangka Kerja Interaksi 3/21/2018. Output O. System S U User. I Input

BAB 2 TINJAUAN PUSTAKA

BAB 4 Pendekatan-Pendekatan Pengembangan Sistem

MINGGU 3. Faktor Komputer & Interaksi. Suzan Agustri

BAB III LANDASAN TEORI

Mendesain Window. Pertemuan 12. Memilih Jenis Window. Mendesain bagian window. 1. Document window. 3. Utility window. 2. Application window

BAB II ANALISIS ANTARMUKA PENGGUNA

CONCEPT. Menentukan tujuan : Memahami karakteristik user. Output. Tujuan dari multimedia, audiens yang menggunakan. Tingkat kemampuan audiens

TUGAS PERKULIAHAN MATA KULIAH DESAIN INTERAKSI (EL5131) OPSI : TEKNOLOGI MEDIA DIGITAL DAN GAME

GRAPHICAL USER INTER-

Jenis-Jenis Keyboard : 1.) QWERTY 2.) DVORAK 3.) KLOCKENBERG

Subsistem manajemen data terdiri dari elemen-elemen berikut ini:

User Profile. Desain Antarmuka Pengguna MI1392 Pekan ke-6

Chapter 1 INTRODUCTION TO COMPUTERIZED BASED INFORMATION SYSTEM. By MAHSINA, SE, MSI

Kata kunci : Aplikasi, Handphone, Perpustakaan Pribadi

SILABUS MATAKULIAH. Revisi : 0 Tanggal Berlaku : 1 September 2010

Modul 2. Pokok Bahasan: Alat Masukan (Input Devices)

Menerapkan pembuatan antar muka (User Intreface) pada aplikasi

RENCANA PELAKSANAAN PEMBELAJARAN

MEMBANGUN APLIKASI MOBILE DENGAN QT SDK DENGAN STUDI KASUS MONITORING RUANGAN MENGGUNAKAN KAMERA. Disusun oleh : NRP :

TSUNAMI AUGMENTED REALITY : INTERAKSI BERBASIS MARKER SEBAGAI POINTER

ANALISIS. memungkink. haji. berikut.

BAB III PERANCANGAN INTERAKSI

BAB 2 TINJAUAN TEORITIS. Kata komputer berasal dari bahasa latin yatu computare yang artinya menghitung, dalam bahasa

BAB I SEKILAS VISUAL STUDIO.NET 2008

3/24/2014 I N T E R A K S I. Pertemuan 4 Interaksi Manusia dan Komputer UDINUS. Apa Itu Interaksi? Komunikasi. system. user

PERBEDAAN UI DAN UX DALAM DUNIA DESIGNER

SATUAN ACARA PERKULIAHAN MATA KULIAH INTERAKSI MANUSIA KOMPUTER KODE MK: TE057209

INTERAKSI MANUSIA DAN KOMPUTER (HUMAN COMPUTER INTERACTION)

RENCANA PROGRAM KEGIATAN PERKULIAHAN SEMESTER (RPKPS)

DESAIN SISTEM MATERI KULIAH SISTEM INFORMASI MANAJEMEN JURUSAN MANAJEMEN FE _ UM

Equipment Monitoring Control Manajemen System Berbasis Web Application

PARADIGMA DAN PRINSIP INTERAKSI

USER and TASK ANALYSIS. Rima Dias Ramadhani

Kedua pertanyaan tersebut dapat dijawab dengan digunakan dua pendekatan, yaitu :

BAB 2 LANDASAN TEORI

PRAKTIKUM-2 PENGENALAN ARCVIEW

Kontrak Kuliah. Desain Sistem. Edi Sugiarto, S.Kom, M.Kom

Daftar Isi. Kata Pengantar...v Daftar Isi...vii CARA PENGGUNAAN BUKU LATIHAN MICROSOFT VISUAL FOXPRO

APLIKASI KOMPUTER- Perangkat Lunak Komputer

3 Langkah untuk memperbaiki antarmuka (interfaces) 1. Ubah sikap / pendirian dari profesional software 2. Gunakan body of knowledge yang berkembang te

Interior Design in Augmented Reality Environment

INTERAKSI MANUSIA DAN KOMPUTER

BAB 1 ASUMSI PERANAN PENGANALISIS SISTEM

Pengenalan Perangkat Keras

PENGENALAN KOMPUTER. PENGABDIAN MASYARAKAT Lokasi : The Learning Farm Perkebunan Teh Maleber Kp. Maleber, Ciherang Pacet, Cianjur, Jawa Barat

BAB 4 IMPLEMENTASI DAN TAMPILAN LAYAR

RAGAM DIALOG. Ragam Dialog (Dialogue Style) adalah cara yang digunakan untuk mengorganisasikan berbagai tehnik dialog.

BAB - III INTERAKSI By. By Ala n Ala Dix, D ix, Jan Ja et t Fin F lay, a y, Grego g ry o D ry. D Ab A owd o, wd, Russ us e s ll Be l ale a

INTERAKSI MANUSIA DAN MESIN

HASIL DAN PEMBAHASAN. Usia Muda (19-35) Penggunaan tangan. Tangan kanan. Tabel 2 Pengetahuan pengguna

Transkripsi:

Dialog Style: Direct Manipulation

Pengantar Direct Manipulation merupakan gaya dialog dimana aksi yang dilakukan oleh user dapat langsung terlihat pada obyek yang tampak di layar monitor. Seringkali juga disebut point and select interface. Direct manipulation biasanya menyertakan pointing device seperti mouse, trackball, atau touch screen, dan banyak menggunakan grafik dalam menampilkan obyek dan aksi.

Contoh Penerapan Beberapa aplikasi dimana direct manipulation digunakan: flight simulator, display-based text editors, battleship management, personnel system, database query by example, video games, CAD, manufacturing and process control, programming of industrial robots

Contoh Penerapan (lanjutan) Beberapa aplikasi dimana direct manipulation digunakan: office automation systems, windowing systems, visual programming, g, airline reservations, warehouse inventory, operating systems

Contoh Direct Manipulation Mengendarai mobil Jika kamu akan membelok ke kiri, apa yang kamu lakukan? Adakah umpan balik yang kamu peroleh? Bayangkan jika untuk mengemudikan mobil, harus menggunakan gaya dialog menu atau interface berbasis teks.

Awal Mula Pemanfaatan DM Sketch Pad, Ivan Sutherland, MIT, 1963

Awal Mula Pemanfaatan DM

Contoh DM pada Awal Mula PC Sang Pioner: Sang Pioner: Star, Xerox, 1981

Contoh DM pada Awal Mula PC

Contoh DM pada Awal Mula PC

Lisa Desktop, Apple, 1982

Contoh (lanjutan) Ketika gaya dialog DM digabungkan dengan berbagai Ketika gaya dialog DM digabungkan dengan berbagai gaya dialog yang lainnya.

Contoh (lanjutan)

Contoh Perkembangan DM

Contoh Contoh Perkembangan DM (lanjutan)

Contoh Contoh Perkembangan DM (lanjutan) Pemodelan 3D

Direct Manipulation: Properties Visibility of the object of interest. Rapid, reversible, incremental actions. Replacement of complex command language syntax by direct manipulation of the object of interest.

Contoh Desktop

Contoh Desktop

Keuntungan Direct Manipulation Easy to Learn and Remember Direct, WYSIWYG Flexible, Easily Reversible Actions Provides Context and Instant, Visual Feedback Exploits Human use of Visual-Spation Cues Less Error Prone (Less Error Messages)

Kerugian Direct Manipulation Not Self Explanatory Can be Inefficient May be Difficult to Design Recognizable Icons Icons Take Screen Real Estate than Words

Penggunaan Interface Dialog Manipulation Interface dengan dialog style function keys cocok untuk user dengan User Psychology Negative attitude Low motivation Knowledge and Experience Low typing skill Moderate system experience Moderate to high task experience Moderate application experience High frequency of use of other systems Low computer literacy Job and Task Characteristic Low frequency of use Moderate training Discretionary use High turnover rate Low task importance Low task structure

Prinsip Desain Dialog Direct Manipulation Konsisten dengan conceptual model yang baik, organisasi fungsi yang baik, screen layout dan desain yang baik, penggunaan warna yang efektif dan adanya error handling yang baik. Menyediakan alternatif antarmuka untuk frekuensi penggunaan yang tinggi. Pemilihan skema desain icon yang konsisten, konkret dan familiar. Desain icon harus menggambarkan object-relationship atau action yang akan dijalankan. Gunakan icon disertai dengan nama atau penjelasan.

Antarmuka Desktop Panduan: Beri keteranan nama/label pada setiap icon.

Antarmuka Desktop Panduan: Pilih strategi t windowing yang sesuai.

Tren Sejaran Desain Icon Empat level abstraksi yang berbeda-beda dapat ditemukan pada 80 tahun terakhir. Icon-icon masa kini menggambarkan abstraksi yang lebih baik dibandingkan dengan sebelumnya.

Re-desain Icon (1) Prinsip Desain: Hindari penggambaran detail pada desain icon. [see Deborah J. Mayhew, Principles and Guidelines in Software User Interface Design (1992) pp.316-331]

Re-desain Icon (2) Prinsip Desain: Desain icon-icon untuk mengkomunikasikan hubungan objek dan berabagai kemungkinan atribut. Lengkapi icon dengan nama/penjelasan. [see Deborah J. Mayhew, Principles and Guidelines in Software User Interface Design (1992) pp.316-331]

[taken from Dominic Paul T. Piamonte (2000): Using Multiple Performance Parameters in Testing Small Graphical Symbols. Doctoral thesis, Institutionen för Arbetsvetenskap Avdelningen för Industriell ergonomi. ISSN: 1402-1544]

WIMP: Window / Icon / Menu / Pointer Unit interaksi dengan user tanpa teks (catatan: dalam hal ini tanpa keyboard). Objek yang menarik adalah unit interaksi antara sistem dengan user.

Tren Perkembangan Antarmuka dengan DM Mobile Computing Ambient rooms and Cooperative buildings

Tampilan Informasi di Kaca Mobil Bagaimana jika beragam informasi tetang berkendara, informasi mobil dan data-data lain akan ditampilkan pada kaca depan mobil untuk menggantikan instrumen tradisional yang diletakkan pada dashboard?

Tampilan Informasi di Kaca Mobil (2)

Mesin Pemesanan Tiket & Vending Machine

Salah satu contoh perangkat VR, VirtuSphere.

The Designer s Outpost, UC Berkeley, 2001

Video Games Problem: Desain harus disesuaikan dengan beragam perbedaan dari segi user, sistem/platform, controller dsb.

Computer Aided-Design Computer Aided Manufacturing (CAM) Apa masalah yang muncul dalam proses desain antarmuka CAD/CAM?

Antarmuka 3D Antarmuka yang natural (seperti aslinya), selain lebih baik, juga mampu menarik minat pengguna.

Good 3D Antarmuka sosial + 3D dapat menjadi sangat powerfull dan realistis. Bagaimana cara desain antarmuka 3D agar menyerupai aslinya?

Electronic Performance Support System

Airline Applications

Dua Pembeda Area Interaksi Communication & Working Area Electronic documents Paper document Working Area

The Virtual Workbench KOSIMA Project

Phantom, Sensable Technologies, 1993

The PalmPilot Gaya dialog DM telah banyak sekali diterapkan dalam perangkat mobile baik yang dioperasikan dengan keypad maupun touch screen.

Mungkinkah peran buku digital ini dapat menggantikan kertas? CrossPad, IBM & Cross, 1998 Rocketbook, Gemstar, 2000

Elektronic Paper telah memungkinkan adanya koran/majalah digital seperti halnya koran/majalah yang menggunakan kertas. Electronic Paper, Xerox, 2000 Electronic Paper, MIT, 2001

Wearable Computer Masa Depan: Teknik DM akan memungkinkan perangkat komputer membantu setiap aktivitas it dengan cara dikenakan seperti halnya sebuah pakaian.

Wearable Computers, MIT, 1990s

Rumah Masa Depan Apa karakteristik desain rumah masa depan? Bill and Melinda Gates' $97 million house

Perkantoran Masa Depan Paperless office dengan menyediakan perangkat digital yang memaksimalkan gaya dialog DM.

Design Metaphors Substitute Channel Tool Akankah kelak, berbagai peran manusia benar-benar digantikan oleh mesin? 1000 2000 history