COMPSCI 345 S1 C and SoftEng 350 S1 C Interaction Styles Lecture 4 Chapter 2.3 (Heim)

Slides:



Advertisements
Similar presentations
Chapter 11 Designing the User Interface
Advertisements

1 CS 501 Spring 2002 CS 501: Software Engineering Lecture 11 Designing for Usability I.
User Interface Design Yonsei University 2 nd Semester, 2013 Sanghyun Park.
MET CS 405/605 Human Computer Interface Design. Week 5 – Design  Interaction Style ~  Command Line  Menu Selection  Form Fill  Direct Manipulation.
Ch 11 Cognitive Walkthroughs and Heuristic Evaluation Yonglei Tao School of Computing and Info Systems GVSU.
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.
7M701 1 User Interface Design Sommerville, Ian (2001) Software Engineering, 6 th edition: Chapter 15
Lecture 7 Date: 23rd February
1 SWE Introduction to Software Engineering Lecture 26 – User Interface Design (Chapter 16)
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.
What is usability? Usability (1): effective, efficient and satisfactory Usability (2): Ease of learning (faster the second time and so on) Recall (remember.
Ch 7 & 8 Interaction Styles page 1 CS 368 Designing the Interaction Interaction Design The look and feel (appearance and behavior) of interaction objects.
©Ian Sommerville 2000 Software Engineering, 6th edition. Chapter 15Slide 1 User interface design l Designing effective interfaces for software systems.
User interface design Designing effective interfaces for software systems Objectives To suggest some general design principles for user interface design.
Overview of Long-Term Memory laura leventhal. Reference Chapter 14 Chapter 14.
1 User Interface Design CIS 375 Bruce R. Maxim UM-Dearborn.
User interface design. Recap User Interface GUI Characteristics (Windows, Icons, Menus, Pointing, Graphics) User Centered Design User Interface Design.
CSC450 Software Engineering
Design, goal of design, design process in SE context, Process of design – Quality guidelines and attributes Evolution of software design process – Procedural,
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.
1 ISE 412 Human-Computer Interaction Design process Task and User Characteristics Guidelines Evaluation.
Ch 26 & 27 User Interfaces.
Chapter 11: Interaction Styles. Interaction Styles Introduction: Interaction styles are primarily different ways in which a user and computer system can.
Ch 6 - Menu-Based and Form Fill-In Interactions Yonglei Tao School of Computing & Info Systems GVSU.
1 Human-Computer Interaction  Design process  Task and User Characteristics  Guidelines  Evaluation.
11.10 Human Computer Interface www. ICT-Teacher.com.
User interface design. Recap OOD is an approach to design so that design components have their own private state and operations Objects should have constructor.
CSC 480 Software Engineering Lecture 19 Nov 11, 2002.
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.
AS Level ICT Selection and use of appropriate software: Interfaces.
USER INTERFACE.
SBD: Interaction Design Chris North cs3724: HCI. Problem scenarios summative evaluation Information scenarios claims about current practice analysis of.
Design Rules-Part B Standards and Guidelines
CompSci 345 Interaction 1 The Interaction Interaction models Ergonomics Interaction styles Dix chapter 3.
Paradigms Material from Authors of Human Computer Interaction Alan Dix, et al.
AVI/Psych 358/IE 340: Human Factors Interfaces and Interaction September 22, 2008.
Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley The Resonant Interface HCI Foundations for Interaction Design First Edition.
Software Architecture
INTERACTION STYLES (continued) INTERACTION DESIGN PROCESS Textbook: S. Heim, The Resonant Interface: HCI Foundations for Interaction Design [Chapter 2]
C OMPUTING E SSENTIALS Timothy J. O’Leary Linda I. O’Leary Presentations by: Fred Bounds.
INTERACTION STYLES References S. Heim, The Resonant Interface HCI Foundations for Interaction Design [Chapter 2] Addison-Wesley, 2007 J. Preece, Y. Rogers,
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.
Different Types of HCI CLI Menu Driven GUI NLI
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.
Ch16: User Interface Design Users often judge a system by its interface rather than its functionality Poorly designed interfaces can cause users to make.
Importance of user interface design – Useful, useable, used Three golden rules – Place the user in control – Reduce the user’s memory load – Make the.
Anti-mac Interface Dona Gentner Jakob Nielsen [Sun Microsystems]
Human Computer Interface INT211
Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley The Resonant Interface HCI Foundations for Interaction Design First Edition.
Operating System Concepts Three User Interfaces Command-line Job-Control Language (JCL) Graphical User Interface (GUI)
Human-Computer Interaction Design process Task and User Characteristics Guidelines Evaluation ISE
Software Interfaces. Learning Objectives Describe the characteristics of different types of user interfaces. Discuss the types of user interfaces which.
Chapter 2: Advanced programming concepts Part 3: The user interface Lecture 5 1.
SBD: Interaction Design Chris North CS 3724: HCI.
Interaction Frameworks COMPSCI 345 S1 C and SoftEng 350 S1 C Lecture 3 Chapter (Heim)
Conceptual Model Design Informing the user what to do Lecture 10a Gabriel Spitz 1.
Interaction Styles Common interaction styles command line interface menus natural language question/answer and query dialogue form-fills.
6. (supplemental) User Interface Design. User Interface Design System users often judge a system by its interface rather than its functionality A poorly.
Chapter 6 : User interface design
11.10 Human Computer Interface
Software engineering USER INTERFACE DESIGN.
Chapter 11 Interaction styles
What is Interaction? Communication User  System
Presentation transcript:

COMPSCI 345 S1 C and SoftEng 350 S1 C Interaction Styles Lecture 4 Chapter 2.3 (Heim)

Interaction Styles Command Line Menu-Based Interface Form Fill-In Question and Answer Direct Manipulation Metaphors Web Navigation Three-Dimensional Environments Zoomable Interface Natural Language 2 © Heim 2008

Command Line Interfaces Command-line interfaces are fast and powerful. Many commands are abbreviated quick and efficient Commands can be applied to many objects simultaneously fast input Some commands have multiple parameters that can be set and altered precise and flexible 3 © Heim 2008

Command Line Interfaces Command Line and the EEAC Intention formation, specification of the action, and the execution stages are complex Requires a rather accurate mental model of the computer’s internal processing Command Line and the Interaction Framework Translating the user’s task language into the input language requires knowledge of the core language The output language can be confusing for inexperienced users - there is very little feedback Articulatory distance is large because we are presented with only the command prompt - no indication of functionality 4 © Heim 2008

New Command Line Interfaces Enso Launcher 5 Aza Raskin, Toward a model of innovation, interactions Volume 15, Issue 1 (2008) Pages ation.cfm?id= &coll=ACM&dl =ACM&CFID= &CFTOKEN= http://portal.acm.org.ezproxy.auckland.ac.nz/cit ation.cfm?id= &coll=ACM&dl =ACM&CFID= &CFTOKEN= © B. Plimmer, 2008

Menu-Based Interface Menu-driven interfaces present users with sequential hierarchal menus that offer lists of functions. Textual: key-in number of option Graphical: use arrow keys or pointing device Types: Single/Sequential/Hierarchal/Networks Menus are based on recognition as opposed to recall 6 © Heim 2008

Menu-Based Interface Menu-based interfaces and the EEAC Menu constraints can help the user to form the proper intentions and specify the proper action sequence Provide a context to evaluate the output language Articulatory Distance Menu options create small articulatory distance Mental Models Menu construction has a direct impact on user’s mental model Affordances Menu elements present affordances 7 © Heim 2008

Form Fill-In Primarily for data entry/retrieval Presents screens of information Like a paper form Always inform the user about the length of paged forms and where they are within the structure Form elements must be unambiguously labeled to increase data integrity Requires obvious correction facilities Excellent reference – Caroline Jarrett © Heim 2008 / © 2004 Dix et al.

Question and Answer / Wizards They are restricting for expert users They are easy for novice users However, they may not know the required information Users must be able to cancel a menu without affecting the state of the computer E.g. Microsoft Add Network Place Wizard 9 (a) Add Network Place wizard. (b) Select a service provider. (c) Address of the network place. © Heim 2008

Direct Manipulation 1982 – Shneiderman describes appeal of graphically-based interaction Visibility of objects Incremental action and rapid feedback Reversibility encourages exploration Syntactic correctness of all actions Replace language with action Three phases in Direct Manipulation - Cooper, Reimann (2003) Free Phase—How the screen looks before any user actions Captive Phase—How the screen looks during a user action (click, click-drag, etc.) Termination Phase—How the screen looks after a user action 10 © Heim 2008

Direct Manipulation Direct Manipulation and the EEAC The range of possible intentions is consistently wide Users usually have multiple options for specifying action sequences Can be overwhelming of novice users Provide multiple ways of executing action sequences 11 © Heim 2008

Metaphors GUIs use visual relationships to real-world objects (metaphors) Metaphors can help people relate to complex concepts and procedures by drawing on real-world knowledge Real-world affordances can be reflected What metaphors are used by contemporary GUIs? 12 © Heim 2008

Metaphors 13 A metaphor’s function must be consistent with real-world expectations Don’t force a metaphor! Metaphors that do not behave the way people expect will cause confusion and frustration E.g. Macintosh trashcan © Heim 2008

Web Navigation Two basic interaction styles Link-based navigation Sensitive to articulatory distance Ambiguous link labels increase the gulf of evaluation Search Sensitive to semantic distance Inadequate search engine algorithms increase the gulf of execution Slight advantage in development of mental models 14 © Heim 2008

3D Environments 3D interaction is natural in the real-world 3D environments are common in digital games Rich graphical 3D environments are processor intensive Three-dimensional navigation can quickly become difficult and confusing 15 © Heim 2008

3D Environments Web-based 3D Use vector-based graphics to decrease file size Virtual Reality Modeling Language (VRML) X3-D is XML based - Web3D.orgWeb3D.org Offers greater flexibility and control Desktop 3D Current GUIs are predominantly 2D 3D environments presented on 2D screens are difficult to navigate 16 © Heim 2008

Zoomable Interface Zoomable interfaces allow us to use our sense of relative positioning Demo: Seadragon 17 © Heim 2008 Jeff Raskin’s ZoomWorld

Natural Language Natural Language Interaction (NLI) - Interacting with computers using everyday language Obstacles Language is ambiguous Meaning depends on context “Search results” “She said she did not know” Dependant on visual cues 18 © Heim 2008

Natural Language Applications for NLI Speech Input Hands-free operation Poor Lighting Situations Mobile Applications In the home Speech Output On-board navigational systems 19 © Heim 2008

Summary We have looked at many interaction styles today Can use our knowledge of interaction frameworks & styles to inform design Next lecture: Interaction Design Process (Heim Ch. 3) 20

Questions List 5 advantages and disadvantages of the traditional command line interface How have new command line interfaces improved on some of the issues you have identified? What is the difference between recognition and recall? 21