User Interface Design & Implementation. Prof. Dr.-Ing. Abdulmotaleb El Saddik University of Ottawa (SITE 5-037) (613) x 6277
|
|
- Thomas Esmond Dickerson
- 5 years ago
- Views:
Transcription
1 SEG 3210 User Interface Design & Implementation Prof. Dr.-Ing. Abdulmotaleb El Saddik University of Ottawa (SITE 5-037) (613) x 6277 site.uottawa.ca mcrlab.uottawa.ca
2 Unit A: Introduction to HCI 1. Why study user interface design? 2. History 3. Goals of HCI 4. Five key ideas in HCI 5. Optical Illusions 6. Understanding users 7. User productivity and usability 8. Disciplines contributing to HCI 9. HCI engineering as a branch of software engineering 10. User interface malfunctions 11. Case studies in user interface malfunction 12. Key points to review
3 Definition The study of people and computing and the way they influence each other A set of processes, dialogues, and actions through which a human user employs and interacts with a computer A discipline concerned with the design, evaluation and implementation of interactive computing systems for human use with the study of major phenomena surrounding them
4 1. Why Study User Interface Design? 75% or more of development effort can go into the user interface 40% to 70% is typical User interface specialists are needed Everybody needs to know the basics User interface software is becoming more complex Complexity increase is faster than other aspects of systems Graphical user interfaces have provided the biggest jump in complexity Applications tend to grow to fill available computing resources There are direct financial benefits from improved user interfaces
5 Financial benefits & Costs of improved user interfaces Increased user productivity Direct financial savings Increased revenues from sales The system is more attractive and customer satisfaction is higher Decreased training and support costs The system is more intuitive Decreased maintenance cost The system does what user wants Much maintenance involves fixing UI problems Pay a little during development, or pay a lot after application/product release! But Staff must be trained in user interface analysis and design Users must participate UI design tools are needed. The benefits almost always outweigh the costs
6 2. History Early days of computing: Computers cost more than people Computers had little functionality The UI was unimportant Early 1970s Field of Man Machine Interface (MMI) born. Term changed gradually to User Interface (UI) Ideas for first Graphical User Interface (GUI) Dynabook at Xerox Late 1970s and 1980s Products were called user friendly No science in this: Just a market buzzword First real GUI s developed Xerox Star --> Smalltalk and Macintosh
7 2. History (Cont d) 1980s Term Human-Computer Interaction (HCI or CHI) came into use wider scope than UI (help, work practices etc.) MS-Windows, X-Windows follow the Mac Intense research into HCI 1990s and early 2000s Virtual reality, speech and handwriting I/O, Soundblaster Good BUT also Bad UI s continue to be developed!!!
8 3. Goals of HCI Improve productivity and reduce costs through: Safety: Does the system prevent danger? Functionality: How many things can the system do? Efficiency: How few resources does it take to get a task done? Usability : How easy to learn and use is the system? BUT High functionality (many ways of doing the same thing) can actually reduce usability By causing confusion
9 4. Five Key Ideas in HCI Visibility The UI should help the user always understand... The current state of the system What operations can be done E.g. When you position the cursor over a point on the screen, it should be clear what would happen if you clicked the mouse Many design guidelines in unit E will help improve visibility Feedback When anything changes it should be made visible When you delete a file, the system should not just say ready Goal A state the user wants to reach to be talking with somebody on the phone to have saved a file
10 4. Five Key Ideas in HCI (Cont d) Affordance The set of operations and procedures that can be done to an object Perceived affordance is what typical users think can be done to an object Should a door be pulled or pushed? What does this icon mean? To improve visibility/feedback we need to: Choose objects with good perceived affordance Design the UI to generate better perceived affordance Task An action the user wants to do to call somebody to save the file Goals beget tasks, tasks beget goals. Unit C focuses on task analysis and gives good conceptual models which will help us achieve this
11 5. Optical Illusions
12 5. Optical Illusions (Cont d) The quick brown fox jumps over the the lazy dog.
13 5. Optical Illusions (Cont d) Now read through the following sentence counting aloud the "F"s as you find them ( etc). Count them ONLY ONCE: Do not go back and count them again!!!. OK - GO! FINISHED FILES ARE THE RESULT OF YEARS OF SCIENTIFIC STUDY COMBINED WITH THE EXPERIENCE OF YEARS.
14 6. Understanding Users Dual Processor" Theory: Every interactive system is a distributed system running on two processors: Human User user interface Computer System User interface design specifies/constrains both: User behaviour System behaviour We must understand the nature of the human processors Each kind should be considered when designing the UI
15 6. Understanding Users (Cont d) Users can be categorized: By class Determined by the pattern of use: e.g., manager, salesperson, shipper, client By personality type Shy or reticent Inarticulate Disinterested or defensive Intimidated Involved designer! By ability Physical disability --> innovative I/O may be needed Colourblind --> don t use colours as the only means of conveying information Dyslexia or other cognitive glitches --> watch out for left vs. right! Illiteracy --> icons may be needed Computer illiteracy Ignorance of domain / learner
16 7. User Productivity & Usability User productivity = Functionality (what the computer can do) * Usability (what people can do with the computer) If either of these is zero, the system is useless Factors Influencing User Productivity Kind and number of tasks Characteristics of users (ability, experience etc.) Work environment (distractions etc.) Training and documentation Functionality and usability of available software and hardware
17 A Model of Usability Factors enjoyability satisfaction acceptability usability primary functionality ergonomics efficiency of use learnability extensibility/customization ease of use familiarity error handling fit to task cognitive load fit to user
18 Critical Usability Factors High staff turnover Discretionary use Learnability critical Fit to task critical Prolonged or frequent use Efficiency critical Creative use High functionality Ease of extension and customization critical Higher usability needed Infrequent discretionary use of highly functional system with staff turnover A problem!
19 8. Disciplines Contributing to HCI Cognitive psychology Capabilities and limitations of human senses and thought processes Ergonomics Hardware and software efficiency of use and safety Linguistics Syntax and semantics of commands Speech I/O Artificial intelligence Speech I/O Intelligent guessing what the user wants to do Knowledge representations of users and tasks Sociology and social psychology Assisting people to work in groups with software Ensuring software works in different cultures Engineering and industrial design Disciplined measurement-based approaches Esthetics Storyboarding etc.
20 Human Cognitive system Perception and representation Some displays can be hard to interpret Blue foreground Optical illusions Contrast in colour but not brightness Too many colours There are two ways to use graphics: For modeling direct images of concepts For coding representing underlying ideas, e.g., displaying quantitative data
21 Human Cognitive system (Cont d) Attention limitations People can be readily distracted Provide cues about what to focus on People get lost in complexity Structure information so it is easy to browse through not too many items not too few items grouped logically People multitask Make the state clear so users can jump backwards and forwards Some mental processes are automatic, or become so (contrasted with controlled processes) These processes are very hard to unlearn
22 Human Cognitive system (Cont d) Memory limitations Short term memory can contain 7±2 chunks Avoid situations where users have to remember more than this Logically group things so users can chunk them The more meaningful, the more easily remembered (familiarity, imagery and consistency contribute to meaningfulness) Use effective names and icons (even) animated ones Combine icons with words Icons can be analogies, examples or abstract, but not arbitrary Watch out for cultural differences (e.g. washroom symbols) People can more easily recognize than recall Use menus, icons, quick lookup
23 9. HCI Eng. as a Branch of SW Eng. (Unit C&D) A conceptual model of the user interface development process: Star model Evaluation is the central process UI is repeatedly revised when problems are found Implementation Task analysis/ functional analysis Detailed design Evaluation Requirements specification Prototyping Conceptual design
24 A five level conceptual model of the UI At each level: Design must be done Problems can occur 1. Task Level What is to be done by the user 2. Conceptual Level User s intended mental model of the system 3. Interaction Style Level Command-driven, menu-driven, direct manipulation, hypermedia Design elements that are repeated throughout the system 4. Interaction Element Level Specific windows, dialogs, commands, menus 5. Physical Element Level Bitmaps, characters, data structures, callbacks
25 Evolution from plain SW- to usability Eng. Normal software development (involving the UI) Focuses on physical and interaction elements Waterfall model dominates (sequential), Spiral model Evaluation by functional spec reviews and testing User interface development Focuses on users and tasks Star model dominates (iterative) Evaluation by continuous user involvement Driven by heuristics and guidelines Integrates psychology etc. Influence on functionality Usability engineering Driven by engineering objectives Integrates rigorous engineering discipline Drives functionality
26 A conceptual model of user interface system architecture User interface layer API (low-level commands) Functional layer(s) (focus of task analysis and conceptual modelling) (focus of functional analysis) Why layers? Simplifies software development and maintenance Both layers: Are developed in parallel Influence each other Included in complete system specifications Evaluated together Evolution of layers: Functional layer should need to change less often during iterative tuning of the interface Both layers may need to change when business functions change but hopefully interaction styles should remain similar
27 Characteristics of Products and Applications Each kind of application puts different demands on the UI designer Application for internal use vs. product for sale Generic utility vs. task-specific tool Walk-up-and-use vs. skilled usage Some design challenges: Customizing a generic utility product so that it becomes a taskspecific tool for internal use and vice versa Converting an application requiring skilled usage to make it a walkup-and-use application
28 10. User Interface Malfunctions Key idea: There are no good user interfaces... just user interfaces that fit A truly bad user interface never fits But among the good ones, some will suit one task/user; some with suit another To maximize fitness, we must minimize the occurrence of malfunctions in the context of the expected use of the system
29 Definitions of malfunction A mismatch between what the user wants, needs or expects and what the system provides A breakdown in usability An obstacle to performing a desired task You should know that: Occasional malfunctions are normal Systematic or frequent malfunctions need to be fixed
30 Related ideas to malfunction Error: Identifiable mistake on the part of the designer Defect: A deviation from what the user needs A malfunction is a usability defect A defect in the smooth functioning of the user/computer system! Users may not be aware of many malfunctions the malfunctions may only be located through careful analysis they may be subtle More discussion of malfunctions in unit B
31 11. Case Studies in UI malfunctions Aircraft disasters China Airlines pilot loses control: Human was expected to act as a monitor, but humans are bad monitors (get bored) Humans need to control things and get feedback US Vincennes downs Iranian jet; 290 lives lost Critical information about the plane was on different displays When gathering relevant facts from different places, a wrong match was made
32 12. Key Points to Review Goals of HCI: Improve safety functionality efficiency usability Visibility and feedback Affordance and perceived affordance Goal = state; task = action Human/computer as system running on 2 processors Types, classes and abilities of users Productivity = functionality * usability Usability factors e.g. learnability, fit, acceptability Contributing disciplines e.g. linguistics, Artificial Intelligence
33 12. Key Points to Review Human cognitive system - Limitations on: perception attention memory Task analysis vs. functional analysis Star model with evaluation at centre UI levels task conceptual model interaction style interaction element physical element Usability engineering Layered approach with an API Malfunction as a kind of defect (of usability)
Human-Computer Interaction: An Overview. CS2190 Spring 2010
Human-Computer Interaction: An Overview CS2190 Spring 2010 There must be a problem because What is HCI? Human-Computer interface Where people meet or come together with machines or computer-based systems
More informationUser Interface Design & Implementation
SEG 3210 User Interface Design & Implementation Prof. Dr.-Ing. Abdulmotaleb El Saddik University of Ottawa (SITE 5-037) (613) 562-5800 x 6277 elsaddik @ site.uottawa.ca abed @ mcrlab.uottawa.ca http:///
More informationAn Introduction to Human Computer Interaction
The contents of this Supporting Material document have been prepared from the Eight units of study texts for the course M150: Date, Computing and Information, produced by The Open University, UK. Copyright
More informationWhat is interaction design? What is Interaction Design? Example of bad and good design. Goals of interaction design
What is interaction design? What is Interaction Design? Designing interactive products to support people in their everyday and working lives Sharp, Rogers and Preece (2002) The design of spaces for human
More informationInteraction Design. Ruben Kruiper
Interaction Design Ruben Kruiper What do you know? What do you think Interaction Design stands for? 2 What do you expect? Interaction Design will be: Awesome Okay Boring Myself I m not a big fan... This
More information2/18/2009. Introducing Interactive Systems Design and Evaluation: Usability and Users First. Outlines. What is an interactive system
Introducing Interactive Systems Design and Evaluation: Usability and Users First Ahmed Seffah Human-Centered Software Engineering Group Department of Computer Science and Software Engineering Concordia
More informationOverview of Today s Lecture. Analytical Evaluation / Usability Testing. ex: find a book at Amazon.ca via search
Overview of Today s Lecture Analytical Evaluation / Usability Testing November 17, 2017 Analytical Evaluation Inspections Recapping cognitive walkthrough Heuristic evaluation Performance modelling 1 2
More informationHUMAN COMPUTER INTERACTION
HUMAN COMPUTER INTERACTION 3. USABILITY AND CONCEPTUAL MODEL I-Chen Lin, National Chiao Tung University, Taiwan "One most unfortunate product is the type of engineer who does not realize that in order
More informationInput: Interaction Techniques
Input: Interaction Techniques Administration Questions about homework? 2 Interaction techniques A method for carrying out a specific interactive task Example: enter a number in a range could use (simulated)
More informationHCI and Design SPRING 2016
HCI and Design SPRING 2016 Topics for today Heuristic Evaluation 10 usability heuristics How to do heuristic evaluation Project planning and proposals Usability Testing Formal usability testing in a lab
More informationM150 -B / Unit 12. By Wawi. A good user interface design enables the user to effectively interact with the system and perform his tasks.
A good user interface design enables the user to effectively interact with the system and perform his tasks. (True) HCI: (Human-Computer Interaction) is the study of how humans interact with computers
More informationLecture 10 Usability
Lecture 10 Usability Mark Woehrer CS 3053 - Human-Computer Interaction Computer Science Department Oklahoma University Spring 2007 [Taken from Stanford CS147 with permission] Learning Goals Understand
More informationUsability & User Centered Design. SWE 432, Fall 2018 Design and Implementation of Software for the Web
Usability & User Centered Design SWE 432, Fall 2018 Design and Implementation of Software for the Web Review: Mental models Only single temperature sensor. Controls not independent, need to adjust both.
More informationInterfaces Homme-Machine
Interfaces Homme-Machine APP3IR Axel Carlier 29/09/2017 1 2 Some vocabulary GUI, CHI,, UI, etc. 3 Some vocabulary Computer-Human Interaction Interaction HommeMachine User Interface Interface Utilisateur
More informationThis tutorial has been intended for the users willing to take the human computer interactions as a next level of study in their career.
About the Tutorial This tutorial provides the basic knowledge on human computer interface and designing. It also throws a light on the current tools and practices and the future aspects of HCI designing.
More informationHUMAN- COMPUTER INTERFACE DESIGN. What is a model? Why modelling? 24/10/2008. Human-Computer Interface Design. M C ESCHER - Relativity
24/10/2008 HUMAN- COMPUTER INTERFACE DESIGN M C ESCHER - Relativity Makes sense locally Course EE212 in several different localities Part 1, Section 4 Makes no sense globally GUI dialogues properties,
More informationCS Human Computer Interaction
Part A 1. Define HCI CS6008 - Human Computer Interaction UNIT-I Question Bank FOUNDATIONS OF HCI 2. What are the basic requirements of an Successful Interactive System? 3. What is STM & LTM? 4. List out
More informationcs465 principles of user interface design, implementation and evaluation
cs465 principles of user interface design, implementation and evaluation Karrie G. Karahalios 24. September 2008 1. Heuristic Evaluation 2. Cognitive Walkthrough 3. Discuss Homework 3 4. Discuss Projects
More informationDesign Rules. increasing generality. increasing authority. Guide lines. Standards. increasing authority. increasing generality
increasing generality increasing generality Design Rules 0 Design rules 0 suggest how to increase usability 0 Principles 0 abstract design rules 0 an interface should be easy to navigate 0 Guidelines 0
More informationObjectives. Object-Oriented Analysis and Design with the Unified Process 2
Objectives Understand the differences between user interfaces and system interfaces Explain why the user interface is the system to the users Discuss the importance of the three principles of user-centered
More informationWhat is interaction design?
Chapter 1 What is interaction design? 1 2 Good/Bad Designs Elevator controls and labels on the bottom row all look the same, so it is easy to push a label by mistake instead of a control button People
More informationUsability. HCI - Human Computer Interaction
Usability HCI - Human Computer Interaction Computer systems optimization for easy access and communication Definition design Basic principles Testing assessment implementation Quality Utility funcionality
More informationWhat is interaction design?
Chapter 2 What is interaction design? 1 Bad designs Elevator controls and labels on the bottom row all look the same, so it is easy to push a label by mistake instead of a control button People do not
More informationWhat is interaction design?
Chapter 1 What is interaction design? 1 Bad designs Elevator controls and labels on the bottom row all look the same, so it is easy to push a label by mistake instead of a control button People do not
More informationUsable Privacy and Security Introduction to HCI Methods January 19, 2006 Jason Hong Notes By: Kami Vaniea
Usable Privacy and Security Introduction to HCI Methods January 19, 2006 Jason Hong Notes By: Kami Vaniea Due Today: List of preferred lectures to present Due Next Week: IRB training completion certificate
More informationWhat I learned from Assignment 0. This is the first HCI course for most of you. You need practice with core HCI and Design concepts.
HCI and Design Today s Reading What I learned from Assignment 0 This is the first HCI course for most of you. You need practice with core HCI and Design concepts. Today: Understanding Users Why do we need
More informationINTRODUCTION. 2. User-centred interface design.
INTRODUCTION 2. User-centred interface design User-Centred Design ISO 9241-210 : Human-centred design for interactive systems Meets requirements Plan the user centred process 4. Evaluation against requirements
More informationInput part 3: Interaction Techniques
Input part 3: Interaction Techniques Interaction techniques A method for carrying out a specific interactive task Example: enter a number in a range could use (simulated) slider (simulated) knob type in
More informationCS408 Human Computer Interaction Solved Objective Midterm Papers For Preparation of Midterm Exam
CS408 Human Computer Interaction Solved Objective Midterm Papers For Preparation of Midterm Exam What will be the gulf of execution if the user is able to formulate and perform the actions easily; Smaller
More informationAssignment 5 is posted! Heuristic evaluation and AB testing. Heuristic Evaluation. Thursday: AB Testing
HCI and Design Topics for today Assignment 5 is posted! Heuristic evaluation and AB testing Today: Heuristic Evaluation Thursday: AB Testing Formal Usability Testing Formal usability testing in a lab:
More informationChapter 10 Interactive Systems And Usability Organizational Requirements Engineering
Chapter 10 Interactive Systems And Usability Organizational Requirements Engineering Prof. Dr. Armin B. Cremers Sascha Alda Overview Introduction: What is usability? Why is usability an important non-functional
More informationUsability of interactive systems: Current practices and challenges of its measurement
Usability of interactive systems: Current practices and challenges of its measurement Δρ. Παναγιώτης Ζαχαριάς Τμήμα Πληροφορικής Πανεπιστήμιο Κύπρου 23/2/2010 Concepts and Definitions Usability engineering
More informationEVALUATION OF PROTOTYPES USABILITY TESTING
EVALUATION OF PROTOTYPES USABILITY TESTING CPSC 544 FUNDAMENTALS IN DESIGNING INTERACTIVE COMPUTATION TECHNOLOGY FOR PEOPLE (HUMAN COMPUTER INTERACTION) WEEK 9 CLASS 17 Joanna McGrenere and Leila Aflatoony
More informationCourse Outline. Department of Computing Science Faculty of Science. COMP 3450 Human Computer Interaction Design (3,1,0) Fall 2015
Course Outline Department of Computing Science Faculty of Science COMP 3450 Human Computer Interaction Design (3,1,0) Fall 2015 Instructor: Office: Phone/Voice Mail: E-Mail: Course Description Students
More informationSoftware Quality. Martin Glinz. Thomas Fritz. Lecture 7 UI Design, Usability & Testing. Many thanks to Meghan Allen and Daniel Greenblatt.
Institut für Informatik Software Quality Lecture 7 UI Design, Usability & Testing Thomas Fritz Martin Glinz Many thanks to Meghan Allen and Daniel Greenblatt. Overview Introduction to UI design User-centered
More informationBased on the slides available at book.com. Graphical Design
Graphical Design Graphic Design & User Interfaces Information oriented, systematic graphic design is the use of typography, symbols, color and other static and dynamic graphics to convey facts, concepts
More informationThe Interaction. Dr. Karim Bouzoubaa
The Interaction Dr. Karim Bouzoubaa UI Hall of Fame or Shame? The buttons are limited to text labels: à pi instead of (scientific mode) à sqrt rather than à * instead of X Why only one line of display?
More informationMensch-Maschine-Interaktion 1. Chapter 2 (May 12th, 2011, 9am-12pm): Basic HCI principles 1
Mensch-Maschine-Interaktion 1 Chapter 2 (May 12th, 2011, 9am-12pm): Basic HCI principles 1 1 Overview Introduction Basic HCI Principles (1) Basic HCI Principles (2) User Research & Requirements Designing
More informationInteraction Design DECO1200
Interaction Design DECO1200 Rob Saunders web: http://www.arch.usyd.edu.au/~rob e-mail: rob@arch.usyd.edu.au office: Room 274, Wilkinson Building Administration Lectures Thu 1000 1100 ALT 2 Thu 1400 1500
More informationUser Interface Design. Interface Design 4. User Interface Design. User Interface Design. User Interface Design. User Interface Design
Specification of a conversation between the user and the computer. Generally results in either input, output or both. An important part of systems and software development. An intuitive and easy to use
More informationHeuristic evaluation is a usability inspection technique developed by Jakob Nielsen. The original set of heuristics was derived empirically from an
Heuristic evaluation is a usability inspection technique developed by Jakob Nielsen. The original set of heuristics was derived empirically from an analysis of 249 usability problems (Nielsen, 1994). -Preece
More informationLooking Back: Fitts Law
Looking Back: Fitts Law Predicts movement time for rapid, aimed pointing tasks One of the few stable observations in HCI Index of Difficulty: How to get a and b for a specific device / interaction technique
More informationSri Vidya College of Engineering & Technology Question bank (unit 2) UNIT 2 TWO MARKS
UNIT 2 TWO MARKS 1. What is design? Achieving goals within constraints. The design helps to focus on certain things like goals, constraints and tradeoffs Goals purpose (who is it for, why do they want
More informationHCI in the software process
chapter 6 HCI in the software process HCI in the software process Software engineering and the process for interactive systems Usability engineering Iterative and prototyping Design rationale the software
More informationHCI in the software. chapter 6. HCI in the software process. The waterfall model. the software lifecycle
HCI in the software process chapter 6 HCI in the software process Software engineering and the process for interactive systems Usability engineering Iterative and prototyping Design rationale the software
More informationInteraction Design. Heuristic Evaluation & Cognitive Walkthrough
Interaction Design Heuristic Evaluation & Cognitive Walkthrough Interaction Design Iterative user centered design and development Requirements gathering Quick design Build prototype Evaluate and refine
More information315324: Interface Designs. Krisana Chinnasarn,, Ph.D. June 2005.
315324: Interface Designs Krisana Chinnasarn,, Ph.D. June 2005. Outline HCI Introduction Course Overview Course Management 6/16/2005 2 Human-Computer Interaction Human Program end-user Other people in
More informationHuman Computer Interaction Lecture 06 [ HCI in Software Process ] HCI in the software process
Human Computer Interaction Lecture 06 [ HCI in Software Process ] Imran Ihsan Assistant Professor www.imranihsan.com aucs.imranihsan.com HCI06 - HCI in Software Process 1 HCI in the software process Software
More informationAnalytical Evaluation
Analytical Evaluation November 7, 2016 1 Questions? 2 Overview of Today s Lecture Analytical Evaluation Inspections Performance modelling 3 Analytical Evaluations Evaluations without involving users 4
More informationHuman-Computer Interaction IS4300
Human-Computer Interaction IS4300 1 Quiz 3 1 I5 due next class Your mission in this exercise is to implement a very simple Java painting applet. The applet must support the following functions: Draw curves,
More informationPreventing Errors Help and Documentation
Preventing Errors Help and Documentation An ounce of prevention... It s in the manual.. This material has been developed by Georgia Tech HCI faculty, and continues to evolve. Contributors include Gregory
More informationProgrammiersprache C++ Winter 2005 Operator overloading (48)
Evaluation Methods Different methods When the evaluation is done How the evaluation is done By whom the evaluation is done Programmiersprache C++ Winter 2005 Operator overloading (48) When the evaluation
More informationCurtin University School of Design. Internet Usability Design 391. Chapter 1 Introduction to Usability Design. By Joel Day
Curtin University School of Design Internet Usability Design 391 Chapter 1 Introduction to Usability Design By Joel Day Internet Usability Design 391 Chapter 1: Usability Introduction Page 2 of 6 What
More informationA short introduction to. designing user-friendly interfaces
A short introduction to designing user-friendly interfaces Usability is often ignored until it becomes a problem Introduction This booklet is about Usability and User Experience design. It is aimed at
More informationInteraction design. The process of interaction design. Requirements. Data gathering. Interpretation and data analysis. Conceptual design.
Interaction design The process of interaction design Requirements Data gathering Interpretation and data analysis Conceptual design Prototyping Physical design Conceptual design Introduction It aims to
More informationInterfaces. The only means of interaction
Interfaces The only means of interaction Two components - Action language - Presentation language These are not interfaces, but components of each interface Types of interfaces - Natural language - Question
More informationWhat is interaction design?
Lecture 1 What is interaction design? Mohammad Smadi 1 Bad designs Elevator controls and labels on the bottom row all look the same, so it is easy to push a label by mistake instead of a control button
More informationUsability. CSE 331 Spring Slides originally from Robert Miller
Usability CSE 331 Spring 2010 Slides originally from Robert Miller 1 User Interface Hall of Shame Source: Interface Hall of Shame 2 User Interface Hall of Shame Source: Interface Hall of Shame 3 Redesigning
More informationMensch-Maschine-Interaktion 1. Chapter 7 (July 15, 2010, 9am-12pm): Implementing Interactive Systems
Mensch-Maschine-Interaktion 1 Chapter 7 (July 15, 2010, 9am-12pm): Implementing Interactive Systems 1 Implementing Interactive Systems Designing Look-And-Feel Constraints Mapping Implementation Technologies
More informationAnnouncements. Usability. Based on material by Michael Ernst, University of Washington. Outline. User Interface Hall of Shame
Announcements Usability Based on material by Michael Ernst, University of Washington Optional cumulative quiz will be given online in Submitty on May 2. Replaces your lowest Quiz 1 10. More details on
More informationToday: CMPUT 301: Lecture 14 The Interaction
Today: CMPUT 301: Lecture 14 The Interaction Lecturer: Martin Jagersand Department of Computing Science University of Alberta Notes based on previous courses by Ken Wong, Eleni Stroulia Zach Dodds, Martin
More informationHuman-Computer Interaction
Human-Computer Interaction The Trouble With Computers (and other computer-based devices) 2 The Trouble With Computers (and other computer-based devices) Confusion Panic Boredom Frustration Inefficient
More informationAdapted from: The Human Factor: Designing Computer Systems for People, Rubinstein & Hersh (1984) Designers make myths. Users make conceptual models.
User Interface Guidelines UI Guidelines 1 Adapted from: The Human Factor: Designing Computer Systems for People, Rubinstein & Hersh (1984) Know your users - they are not you Designers make myths. Users
More informationResearch on Interactive Information Visualization Design in Web Pages. Ya-qi JIANG *
2016 International Conference on Computational Modeling, Simulation and Applied Mathematics (CMSAM 2016) ISBN: 978-1-60595-385-4 Research on Interactive Information Visualization Design in Web Pages Ya-qi
More informationCogSysIII Lecture 9: User Modeling with GOMS
CogSysIII Lecture 9: User Modeling with GOMS Human Computer Interaction Ute Schmid Applied Computer Science, University of Bamberg last change June 26, 2007 CogSysIII Lecture 9: User Modeling with GOMS
More informationHeuristic Evaluation. Heuristic evaluation evaluates the interface to identify usability problems against recognized usability design heuristics.
Heuristic Evaluation Heuristic evaluation evaluates the interface to identify usability problems against recognized usability design heuristics. Usability heuristics are best practices developed and identified
More informationGUI Design Principles
GUI Design Principles User Interfaces Are Hard to Design You are not the user Most software engineering is about communicating with other programmers UI is about communicating with users The user is always
More informationUSER INTERFACE DESIGN
USER INTERFACE DESIGN Today Before we talk about how to code interfaces in Java, some concepts. Norman: The Design of Everyday Things; General design principles; Activity theory; Gulf of execution; gulf
More informationThe Interaction. Using Norman s model. Donald Norman s model of interaction. Human error - slips and mistakes. Seven stages
The Interaction Interaction models Ergonomics Interaction styles Donald Norman s model of interaction Seven stages execution user establishes the goal formulates intention specifies actions at interface
More informationCognitive Disability and Technology: Universal Design Considerations
Cognitive Disability and Technology: Universal Design Considerations Clayton Lewis Coleman Institute for Cognitive Disabilities RERC-ACT clayton.lewis@colorado.edu Prepared for AUCD Training Symposium,
More informationHCI Design Process: An Overview. What is HCI Design Process? Practical Issues in HCI Design Process Examples of Lifecycle Models
HCI Design Process: An Overview What is HCI Design Process? Practical Issues in HCI Design Process Examples of Lifecycle Models H. C. So Page 1 Semester B 2017-2018 HCI Design Process What is HCI Design?
More informationDesign Heuristics and Evaluation
Design Heuristics and Evaluation Rapid Evaluation Selected material from The UX Book, Hartson & Pyla Heuristic Evaluation Another method for finding usability problems in a UI design Validation during
More informationHuman-Computer Interaction IS4300
Human-Computer Interaction IS4300 1 Designing for the Web Stone Ch 17 + J. Lazar et al, HCI Handbook 1 Today Stone Chapter J. Lazar et al, HCI Handbook Testing tools & surveys Nielsen s Top 10 Mistakes
More informationHuman Computer Interaction Lecture 14. HCI in Software Process. HCI in the software process
Human Computer Interaction Lecture 14 HCI in Software Process HCI in the software process Software engineering and the design process for interactive systems Usability engineering Iterative design and
More information6 Designing Interactive Systems
6 Designing Interactive Systems 6.1 Design vs. Requirements 6.2 Paradigms, Styles and Principles of Interaction 6.3 How to Create a Conceptual Model 6.4 Activity-Based Design of Interactive Systems 6.5
More information0BHuman Computer Interaction: An Overview
0BHuman Computer Interaction: An Overview What is Human Computer Interaction (HCI)? Importance of HCI Good and Poor Design Examples What and Who are involved in HCI design? General Principles of HCI Design
More informationStep-by-Step Localization Eva Müller
Step-by-Step Localization Eva Müller Questions, answers and procedures for a successful localization process Steps in localization projects range from what is to be localized, who performs the localization
More information6 Designing Interactive Systems
6 Designing Interactive Systems 6.1 Design vs. Requirements 6.2 Paradigms, Styles and Principles of Interaction 6.3 How to Create a Conceptual Model 6.4 Activity-Based Design of Interactive Systems 6.5
More informationNektarios Kostaras, Mixalis Xenos. Hellenic Open University, School of Sciences & Technology, Patras, Greece
Kostaras N., Xenos M., Assessing Educational Web-site Usability using Heuristic Evaluation Rules, 11th Panhellenic Conference on Informatics with international participation, Vol. B, pp. 543-550, 18-20
More informationCPS122 Lecture: The User Interface
Objectives: CPS122 Lecture: The User Interface 1. To introduce the broad field of user interface design 2. To introduce the concept of User Centered Design 3. To introduce a process for user interface
More informationInteraction Design Guidelines and Rules
Interaction Design Guidelines and Rules Department of Information Technology Uppsala university Design Design is the planning (process, decisions) that lays the basis for the making of every object or
More informationCS211 Lecture: The User Interface
CS211 Lecture: The User Interface Last revised November 19, 2008 Objectives: 1. To introduce the broad field of user interface design 2. To introduce the concept of User Centered Design 3. To introduce
More informationSite Design. SWE 432, Fall 2017 Design and Implementation of Software for the Web
Site Design SWE 432, Fall 2017 Design and Implementation of Software for the Web Today How do you help users understand if it is possible to do what they d like to do? How do you help users find what they
More informationCS5340 Human-Computer Interaction.! February 21, 2013!!
CS5340 Human-Computer Interaction February 21, 2013 www.hcibook.com/e3 Today s Class T4 & T5 Design practicalities Evaluation techniques Paper Presentations T4 & T5 Due 6pm Feb 28 T4: Concept Selection
More informationIPM 15/16 T2.1 Prototyping
IPM 15/16 T2.1 Prototyping Miguel Tavares Coimbra Acknowledgements: Most of this course is based on the excellent course offered by Prof. Kellogg Booth at the British Columbia University, Vancouver, Canada.
More informationImproving user interfaces through a methodological heuristics evaluation framework and retrospective think aloud with eye tracking
Improving user interfaces through a methodological heuristics evaluation framework and retrospective think aloud with eye tracking Progress Report Supervisors: Dr. Tom Gedeon Mr. Christopher Chow Principal
More informationUser interface design. Ian Sommerville 2004 Software Engineering, 7th edition. Chapter 16 Slide 1
User interface design Ian Sommerville 2004 Software Engineering, 7th edition. Chapter 16 Slide 1 The user interface Should be designed to match: Skills, experience and expectations of its anticipated users.
More information7.0 INTERACTION DESIGN USER INTERFACE
7.0 INTERACTION DESIGN USER INTERFACE PRINCIPLES OF INTERACTION DESIGN SUMMER 2014 DESIGNISM #18 A PICTURE IS WORTH A THOUSAND WORDS. AN INTERFACE IS WORTH A THOUSAND PICTURES. BEN SHNEIDERMAN USER INTERFACE
More informationIPM 10/11 T1.6 Discount Evaluation Methods
IPM 10/11 T1.6 Discount Evaluation Methods Licenciatura em Ciência de Computadores Miguel Tavares Coimbra Acknowledgements: Most of this course is based on the excellent course offered by Prof. Kellogg
More informationMIT GSL week 4 Wednesday. User Interfaces II
MIT GSL 2018 week 4 Wednesday User Interfaces II User Centered Design Prototyping! Producing cheaper, less accurate renditions of your target interface! Essential in spiral design process, useful in later
More informationProcess of Interaction Design and Design Languages
Process of Interaction Design and Design Languages Process of Interaction Design This week, we will explore how we can design and build interactive products What is different in interaction design compared
More informationFoundation Level Syllabus Usability Tester Sample Exam
Foundation Level Syllabus Usability Tester Sample Exam Version 2017 Provided by German Testing Board Copyright Notice This document may be copied in its entirety, or extracts made, if the source is acknowledged.
More informationUser-Centered Design. SWE 432, Fall 2017 Design and Implementation of Software for the Web
User-Centered Design SWE 432, Fall 2017 Design and Implementation of Software for the Web In class exercise As you come in and take a seat Write down at least 3 characteristics that makes something usable
More informationHuman-Computer Interaction IS 4300
Human-Computer Interaction IS 4300 Prof. Timothy Bickmore Overview for Today Brief review. Affordances & Cognitive Models. Norman's Interaction Model Heuristic Evaluation. Cognitive Walk-through Evaluation
More informationConcepts of Usability. Usability Testing. Usability concept ISO/IS What is context? What is context? What is usability? How to measure it?
Concepts of Usability Usability Testing What is usability? How to measure it? Fang Chen ISO/IS 9241 Usability concept The extent to which a product can be used by specified users to achieve specified goals
More informationSeng310 Lecture 8. Prototyping
Seng310 Lecture 8. Prototyping Course announcements Deadlines Individual assignment (extended) deadline: today (June 7) 8:00 am by email User testing summary for paper prototype testing- Thursday June
More informationSystems Analysis and Design in a Changing World, Fourth Edition
Systems Analysis and Design in a Changing World, Fourth Edition Learning Objectives Describe the difference between user interfaces and system interfaces Explain why the user interface is the system to
More informationIntroduction to Interactive Systems. Overview. What Is an Interactive System? SMD158 Interactive Systems Spring 2005
INSTITUTIONEN FÖR SYSTEMTEKNIK LULEÅ TEKNISKA UNIVERSITET Introduction to Interactive Systems SMD158 Interactive Systems Spring 2005 Jan-14-05 1997-2005 by David A. Carr 1 L Overview What is an interactive
More informationUSER INTERFACE DESIGN + PROTOTYPING + EVALUATION. Heuristic Evaluation. Prof. James A. Landay University of Washington CSE 440
USER INTERFACE DESIGN + PROTOTYPING + EVALUATION Heuristic Evaluation Prof. James A. Landay University of Washington CSE 440 February 19, 2013 Hall of Fame or Shame? Pocket By Read It Later Jan. 14-18,
More informationCSE 440: Introduction to HCI User Interface Design, Prototyping, and Evaluation
CSE 440: Introduction to HCI User Interface Design, Prototyping, and Evaluation Lecture 11: Inspection Tuesday / Thursday 12:00 to 1:20 James Fogarty Kailey Chan Dhruv Jain Nigini Oliveira Chris Seeds
More information