Merancang Sistem Windows

10-Merancang Sistem Windows

TI1143 – Interaksi Manusia dan Komputer

Merancang Sistem Windows

Apa itu Window ? Restyandito, S.Kom, MSIS

Tentang Window

Diciptakan oleh Doug Engelbart @ Stanford (1960-an)

Berupa suatu kotak (rectangular) yang

dapat dipindahkan Biasanya dapat di ‘scroll’’ Isinya tergantung aplikasi (application driven) Kadang dapat dibagi-bagi menjadi beberapa subpanes Membuka / menutup menghasilkan animasi yang menunjuk pada file

Tentang Window

Fungsi

Membantu pengguna untuk f move, resize, scroll, transfer data between, dan mengatur multiple windows f Meningkatkan interaksi pengguna dengan fasilitas window untuk program-program aplikasi.

Memungkinkan pengguna membuka beberapa aplikasi atau dokumen sekaligus pada waktu yang bersamaan.

1



Tentang Window

Virtual devices: Piranti I/O yang hanya ada pada komputer

Tentang Window

Kasus khusus piranti masukan:

Input: Buttons Output: Dials, lights I/O: Sliders

Pemindahan fokus windows

interface component (widget) lihat contoh : desktopX

Click to focus Point to focus

Mengatur windows tunggal

Move Scroll Resize

2



Mengatur beberapa windows

Iconification Tiling Overlapping

Hal yang perlu diperhatikan dalam penempatan windows -> terakhir diaktifkan/ diaktifkan/dipakai, dipakai, -> keseimbangan banyaknya windows.

Standard Windows Controls

Komponen-Komponen Window

Basic Windows Components

Æ close Æ minimize Æ maximize Æ revert to previous Æ size2D Æ scroll bars

3



Basic Windows Components

Basic Windows Components Menus

Æ windows

Æ menus Æ controls

Æ control panels Æ dialogue boxes

Æ cursors

Basic Windows Components Controls

Basic WindowsDialogue Components Boxes

Kontrol pada layar yang ditampilkan oleh sistem untuk memberikan informasi sesuai konteks

Controls: generic for

buttons, sliders, check boxes (inclusive maupun exclusive)

Control panels: sekumpulan controls pada window Kadang kontrol tergantung pada konfirmasi user

Implicit pop-up menus (kalau user meng-click pada layar dimana saja) Explicit pop-up menus (dipicu oleh komponen interface seperti menu bar serta icon) Hierarchical pop up menus Gestures needed: press-drag-release Terkadang juga dilengkapi dengan dialogue boxes

memungkinkan user membuat pilihan mengetik/memasukkan informasi memilih dari serangkaian set pilihan informasi pemberitahuan

Modal dialogue boxes: memaksa user memberikan jawaban sebelum user dapat melakukan sesuatu Query boxes (system dialogue) Message boxes (memberitahu user bahwa sesuatu telah terjadi)

4



Basic Windows Components Cursor

Normal cursor Text input cursor System busy (watch) Progress indicator (sand clock)

Prinsip – Prinsip Perancangan Window

Keteraturan

Chaotic vs Ordered

Navigasi

Layout

Relationship

5



Kejelasan

kompleks vs sederhana

distinctiveness

emphasis

internal

external

real world

eDR 16.7

Konsistensi

More Window …

6


OpenLook WM

enlightment

KDE

ubuntu


7

Aple Aqua Mac OS Leopard

Mac OS Tiger



Research Pengembangan

8



What’s wrong with the existing ones? Improving Menu Interaction: a Comparison of Standard, Force Enhanced and Jumping Menus David Ahlstrom

Rainer Alexandrowicz

• Existing model deficient in mapping all possible activity scenarios.

Martin Hitz

Klagenfurt University Universitatsstrasse 65, A-9020 Klagenfurt, Austria [email protected]

A Review Arvind S

• “Long and time consuming” horizontal movements – really???

[email protected]

22C:196:001 Human-Computer Interaction. Fall 2006. Copyright © 2006 Juan Pablo Hourcade.

Force Enhanced Menus – Intuitive • Invisible “Force Fields” – coming to the aid of the hapless dude stuck with the evil menu!!! • Innovative cursor warping algorithm generates small cursor movements to enhance pointing – Based on cursor position – length and direction of previous cursor movement.



Jumping Menus – an Extension • Similar to Windows and Linux options – cursor jump to the “OK” button in dialog boxes. • Cursor “jumps” to sub-menu’s first item when sub-menus are opened. • Eliminates the need for horizontal movements.


9



Evaluation Trivia • Apparatus: – Windows XP running on 15-inch TFT monitor (1024 x 768 pixels)

• Participants: – Mouse Group • 12 volunteers (7 Male, 5 Female) • 18-34 years. 28 average age.

– Touchpad Group • 12 volunteers (8 Male, 4 Female) • 21-36 years. 27.4 average age.


Results – in a nutshell • Mouse – Errors • Numbers: – Jumping: 52, Standard: 14, Force Enhanced: 13

• Rate: 4 times higher for jumping menus • Error rate reduced with increase in trials.

• Touchpad – Errors • Numbers; – Jumping: 52, Standard; 29, Force enhanced: 23

• Rate: 2 times higher in jumping menus • Error rate reduced with increase in trials. 22C:196:001 Human-Computer Interaction. Fall 2006. Copyright © 2006 Juan Pablo Hourcade.

The Interaction Design of Microsoft Windows CE Sarah Zuberec Productivity Appliance Division, Microsoft Corp.

Presented By: Ugur Kuter Dept. of Computer Science, Univ. of Maryland, College Park, MD 20742

10



Evolution of Windows CE Design Handheld PCs (H/PCs) [1995]

Usability Testing: Controlled Experiments

People found the size of certain targets too small People were not able to identify the active areas on the interface People were confused with the selection / activation model

Evolution of Windows CE Design Handheld PCs (H/PCs) [1995]

New interface that strongly resembles Windows Desktop The same input/output characteristics, tasks and product goals Usability Testing

Most targets are perceived as too small to hit Single-tap activation is efficient Auto-save model fails

In other words, the interface design is failed!

Evolution of Windows CE Design Palm PC (P/PC) [1998]

Design Goals

Fit the H/PC interface into a smaller size

320 x 240 pixel screen

Provide quick information look-up and entry Enable information customization Make it smaller and easy to carry

Alternative Input/Output methods to H/PC

Hardware buttons for scrolling up/down Handwriting recognition and voice recording

11



Evolution of Windows CE Design Palm PC (P/PC) [1998]

Usability Testing: Controlled Experiments

Data entry using a small on-screen keyboard is tedious The use of keyboard is rated as easiest to use Subjects were the fastest and most accurate with the keyboard In general, handwriting recognizer is rated low as an input method

Evolution of Windows CE Design Auto PC (A/PC) [1998]

First product that deviates from the Windows 95 look designed to support tasks of a mobile professional while driving Uses New forms of Input/Output Methods

No stylus and no touch screen A numeric keypad for character inputs Speaker-independent voice command interface Sound feedback about the state of the system Infrared connections to H/PCs and P/PCs

12



Evolution of Windows CE Design Auto PC (A/PC) [1998]

Usability Testing: Field Studies

Interoperability of in-car equipment was compelling People usually plan their tasks before getting into the car They need to be kept informed about schedule changes The data is then synchronized at the office/home

Referensi

Preece, Rogers, Sharp, 1994, HumanHuman-Computer Interaction, Interaction, AddisonAddison-Wesley. ( hal 285285-306 ) Shneiderman, Ben, 2004, Designing the User Interface: Strategies for Effective HCI – 3rd Edition, 444-475 ) Edition, Pearson Education. ( hal 444-

13

Merancang Sistem Windows

Recommend Documents