Interaction modalities Command languages, direct manipulation, and WIMP.

Slides:



Advertisements
Similar presentations
Recuperação de Informação B Cap. 10: User Interfaces and Visualization , , , November 29, 1999.
Advertisements

Interaction Techniques Level 2 Prepared by: RHR First Prepared on: Nov 23, 2006 Last Modified on: Quality checked by: MOH Copyright 2004 Asia Pacific Institute.
Human Computer Interface
COMPUTER INTERFACES.
ORGANIZING THE CONTENT Physical Structure
MET CS 405/605 Human Computer Interface Design. Week 5 – Design  Interaction Style ~  Command Line  Menu Selection  Form Fill  Direct Manipulation.
User Interface Design Notes p7 T120B pavasario sem.
Ch 11 Cognitive Walkthroughs and Heuristic Evaluation Yonglei Tao School of Computing and Info Systems GVSU.
Interaction Styles Course 6, CMC, 07/10/03 Direct Manipulation
Dialog Styles. The Five Primary Styles of Interaction 4 Menu selection 4 Form fill-in 4 Command language 4 Natural language 4 Direct manipulation.
Dialog Styles. The Six Primary Styles of Interaction n Q & A n Menu selection n Form fill-in n Command language n Natural language n Direct manipulation.
Lecture 7 Date: 23rd February
1 / 31 CS 425/625 Software Engineering User Interface Design Based on Chapter 15 of the textbook [SE-6] Ian Sommerville, Software Engineering, 6 th Ed.,
User Interface Design: Methods of Interaction. Accepted design principles Interface design needs to consider the following issues: 1. Visual clarity 2.
Ch 7 & 8 Interaction Styles page 1 CS 368 Designing the Interaction Interaction Design The look and feel (appearance and behavior) of interaction objects.
Interaction Styles Interface Widgets. What are Interaction Styles?  A Collection of interface objects and associated techniques from which an interaction.
Dialog Design Command languages, direct manipulation, and WIMP.
ICS 463, Intro to Human Computer Interaction Design: 10. Interaction and Windows Dan Suthers.
Dialog Design Command languages, direct manipulation, and WIMP.
Dialog Design Command languages, direct manipulation, and WIMP.
© 2005 by Prentice Hall Chapter 3c Designing Interfaces and Dialogues.
Dialogue Styles.
Other Interaction Styles: Direct Manipulation, Haptic, Multimedia, Multimodal, Virtual Reality, Video Games Dr.s Barnes and Leventhal.
CSC450 Software Engineering
Human Computer Interface. Human Computer Interface? HCI is not just about software design HCI applies to more than just desktop PCs!!! No such thing as.
Chapter 6: Interfaces and interactions
Chapter 12 Designing Interfaces and Dialogues
Interfaces and interactions 1980’s
1 Applying cognitive theory We have a lot of models and concepts now –What good are they? Cognitive theory can be useful for things other than psychology.
Chapter 11: Interaction Styles. Interaction Styles Introduction: Interaction styles are primarily different ways in which a user and computer system can.
Chapter 6: Interfaces and interactions
Ch 6 - Menu-Based and Form Fill-In Interactions Yonglei Tao School of Computing & Info Systems GVSU.
11.10 Human Computer Interface www. ICT-Teacher.com.
User Interface Styles A method for getting information from the user or interfacing with a user. Usually, interfaces provide more than one style: Command.
Unit 1_9 Human Computer Interface. Why have an Interface? The user needs to issue instructions Problem diagnosis The Computer needs to tell the user what.
Lecture 6 User Interface Design
Computer Graphics Lecture 28 Fasih ur Rehman. Last Class GUI Attributes – Windows, icons, menus, pointing devices, graphics Advantages Design Process.
The ID process Identifying needs and establishing requirements Developing alternative designs that meet those requirements Building interactive versions.
Designing Interface Components. Components Navigation components - the user uses these components to give instructions. Input – Components that are used.
COMPSCI 345 S1 C and SoftEng 350 S1 C Interaction Styles Lecture 4 Chapter 2.3 (Heim)
SBD: Interaction Design Chris North cs3724: HCI. Problem scenarios summative evaluation Information scenarios claims about current practice analysis of.
Why do we need good user interfaces?. Goals of User Interfaces Usable – how much effort to do a task? – example: often-used buttons easier to find – example:
Fall 2002CS/PSY Dialog Design 1 Command languages and WIMP Command languages  Advantages, disadvantages  Design guidelines WIMP  Advantages, disadvantages.
Editors And Debugging Systems Other System Software Text Editors Interactive Debugging Systems UNIT 5 S.Sharmili Priyadarsini.
E.g.: MS-DOS interface. DIR C: /W /A:D will list all the directories in the root directory of drive C in wide list format. Disadvantage is that commands.
Interaction modalities Command languages, direct manipulation, and WIMP.
Chapter 6: Interfaces and interactions. Overview Introduce the notion of a paradigm Provide an overview of the many different kinds of interfaces –highlight.
Fall 2002CS/PSY Dialog Design 2 Direct Manipulation 1) Continuous visibility of the objects and actions of interest 2) Rapid, reversible, incremental.
Yonglei Tao School of Computing & Info Systems GVSU Ch 7 Design Guidelines.
FatMax Licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 2.5 LicenseCreative Commons Attribution-NonCommercial-ShareAlike 2.5.
Conceptual Model Design Informing the user what to do Lecture # 10 (a) Gabriel Spitz.
Styles of User Interface. Learning Objectives: By the end of this topic you should be able to: describe the characteristics of different styles of user.
Interaction Styles Chris North cs3724: HCI. Presentations mike miller sean king Vote: UI Hall of Fame/Shame?
Human Computer Interface INT211
A disciplined approach to analyzing malfunctions –Provides feedback into the redesign process 1.Play protocol, searching for malfunctions 2.Answer four.
Conceptual Model Design Informing the user what to do Lecture 10a Gabriel Spitz 1.
1 Unit E-Guidelines (c) elsaddik SEG 3210 User Interface Design & Implementation Prof. Dr.-Ing. Abdulmotaleb.
Human Computer Interaction Lecture 07 The Interaction.
Interaction Styles Common interaction styles command line interface menus natural language question/answer and query dialogue form-fills.
Human Computer Interaction (HCI)
11.10 Human Computer Interface
Human Computer Interface
Unit 2 User Interface Design.
dialogue … computer and user distinct styles of interaction
Chapter 6: Interfaces and interactions
Cooper Part III Interaction Details Designing for the Desktop
Dialog Design 1 Command languages and WIMP
Dialog Design 2 Direct Manipulation
What is Interaction? Communication User  System
Presentation transcript:

Interaction modalities Command languages, direct manipulation, and WIMP

What’s wrong with this? 0.Borrow a book from the library 1.go to the library 2. log in to library catalogue 2.1 access the search screen 2.2 enter search criteria 2.3 identify required book 2.4 note location 3.go to correct shelf and retrieve book 3.1 use library map to find shelf 4.take book to checkout counter

Now what’s wrong? 0.In order to borrow a book from the library 1.go to the library 1.1 enter library 1.2 go to computer 1.3 log into catalogue 2.find book 2.1 access library catalogue 2.2 access the search screen 2.3 enter search criteria 2.4 identify required book 2.5 note location 3.go to correct shelf and retrieve book 4.check out book

Don’t forget your plans! 0.In order to borrow a book from the library 1.go to the library 2.find the required book 2.1 access library catalogue 2.2 access the search screen 2.3 enter search criteria 2.4 identify required book 2.5 note location 3.go to correct shelf and retrieve book 4.check out book Plan 0: do 1, 2, 3; repeat 2, 3, if book not found; then do 4 Plan 2: do 2.1, 2.2; repeat 2.3 until found; 2.4, 2.5

Interface types 1980s interfaces Command line WIMP/GUI 1990s interfaces Advanced graphical (multimedia, virtual reality, information visualization) Web Speech (voice) Pen, gesture, and touch Appliance 2000s interfaces Mobile Multimodal Shareable Tangible Augmented and mixed reality Wearable Robotic

Interaction Styles 1. Command languages 2. WIMP - Window, Icon, Menu, Pointer 3. Direct manipulation 4. Speech/Natural language 5. Pen & Touch

General Issues in Interaction Style Who is in control - user or computer Initial training required Learning time to become proficient Special skills Speed of use Generality/flexibility Power Screen space required Computational resources required Match to the user’s activity

Command Languages Earliest UI interaction paradigm Examples: MS-DOS shell, UNIX, Linux Little or nothing is visible so… – Work primarily by recall, not recognition – Heavy memory load Poor choice for novices but...

CL Advantages Advantages for experts – Speed, conciseness % ls (hard to beat) – Can express actions beyond a limited set Flags, piping one command to another – Repetition, extensibility Scripting, macros – Easier implementation, less overhead – Power Abstraction, wild cards

CL Dangers With added power, comes added responsibility and danger – UNIX % rm -r * Deletes every file that you have, and you can’t get them back

CL Design Goals Consistency – Have options and arguments expressed the same way everywhere Good naming and abbreviations UNIX fails here because commands were developed by lots of different people at different organizations No guidelines provided

Names and Abbreviations Specificity versus Generality – General words More familiar, easier to accept – Specific (typically better) More descriptive, meaningful, distinctive – (Nonsense does surprisingly well in small set) Abbrevs. allow for faster actions – Expert performance begins to be dominated by motor times such as # of keystrokes – Not good idea for novices – (Allow but don’t require)

General Issues - CL Initial training required Learning time to become proficient Special skills Speed of use Generality/flexibility Power Screen space required Computational resources required Match to the user’s activity

Interaction Styles 1. Command language 2. WIMP 3. Direct Manipulation 4. Speech/Natural language 5. Gesture, pen, VR

WIMP/GUI interfaces Xerox Star first WIMP -> rise to GUIs Windows – could be scrolled, stretched, overlapped, opened, closed, and moved around the screen using the mouse Icons – represented applications, objects, commands, and tools that were opened when clicked on Menus – offering lists of options that could be scrolled through and selected Pointing device – a mouse controlling the cursor as a point of entry to the windows, menus, and icons on the screen

Windows Windows were invented to overcome physical constraints of a computer display – Overlapping windows make more efficient use of screen real estate – Can allow dragging and dropping between them – But can become cluttered or overwhelming Multiple windows can make it difficult to find desired one, so techniques used – Listing, iconising, shrinking

Questions How many windows do you generally have open at once? How do you arrange them? How do you switch between them?

Menus Advantages: – 1 keystroke or mouse operation vs. many – No memorization of commands – Limited input set Disadvantages: – Less direct user control - have to find correct menu / menu item – Not so readily extensible – Slower than keyboarding for experienced users, at least without accelerators

Menu Items Various types: – Flat – Cascading – Pop-up (contextual) Organization strategies – Create groups of logically similar items – Cover all possibilities – Ensure that items are non-overlapping – Keep wording concise, understandable

A Good Example Logical grouping Visual separation of groups Disabled items “grayed out” Shortcuts shown … indicates leads to dialogue

Icons Icons are assumed to be easier to learn and remember than commands Can be designed to be compact and variably positioned on a screen Issues: – Consistency – Legibility – Convey meaning

Simple icons

Newer icons

Pointers Choosing commands from menus and icons Allows users to specify location parameter of a command – Edit HERE, Put this file HERE Also displays system state info: – Tracking – Busy – Hints – Modes (text cursor vs. selection pointer)

General Issues - WIMP Who is in control - user or computer Initial training required Learning time to become proficient Special skills Speed of use Generality/flexibility Power Screen space required Computational resources required Match to the user’s activity

Direct Manipulation Essence Representation of reality that can be manipulated The user is able to apply intellect directly to the task The tool itself seems to disappear

Direct Manipulation Definition: 1) Continuous visibility of the objects and actions of interest 2) Rapid, reversible, incremental actions whose effect is immediately noticeable 3) Replacement of command language syntax by direct manipulation of object of interest (physical actions, buttons, etc.) Shneiderman ‘82

Direct Manipulation Examples – WYSIWYG editors and word processors – VISICALC - 1 st electronic spreadsheet – CAD – Desktop metaphor – Video games

Example: maps

More Psychological View What is directness? (not always done well) Related to two things: – Distance – Engagement Unobtrusive and responsive Hutchins, Hollan, Norman ‘86 Goals System Execution Evaluation

Example: Homefinder

DM Advantages Easier to learn & remember, particularly for novices Flexible, easily reversible actions helps reduce anxiety in users Provides context & instant visual feedback so user can tell if objectives are being achieved Exploits human use of visual spatial cues Limits types of errors that can be made

DM Problems Screen space intensive (info not all that dense) Need to learn meaning of components of visual representation Visual representation may be misleading Mouse ops may be slower than typing Not self-explanatory (no prompts) Not everything can be represented visually

DM Problems Not good at – Repetition – History keeping (harder) – Certain tasks (Change all italics to bold) – Abstract elements (variables) – Macros harder

General Issues - DM Initial training required Learning time to become proficient Special skills Speed of use Generality/flexibility Power Screen space required Computational resources required Match to the user’s activity

Interaction styles: next time 1. Command language 2. WIMP 3. Direct Manipulation 4. Speech/Natural language 5. Touch and Pen