Design : Agenda Design challenges Idea generation Design principles

Slides:



Advertisements
Similar presentations
Interaksi Manusia Komputer – Marcello Singadji. design rules Designing for maximum usability – the goal of interaction design Principles of usability.
Advertisements

© De Montfort University, Characteristics of Good Dialogues Howell Istance Department of Computer Science De Montfort University.
User Interface Design Notes p7 T120B pavasario sem.
Ch 11 Cognitive Walkthroughs and Heuristic Evaluation Yonglei Tao School of Computing and Info Systems GVSU.
Dialog Styles. The Five Primary Styles of Interaction 4 Menu selection 4 Form fill-in 4 Command language 4 Natural language 4 Direct manipulation.
Human Computer Interface. HCI and Designing the User Interface The user interface is a critical part of an information system -- it is what the users.
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.
Heuristic Evaluation. Sources for today’s lecture: Professor James Landay: stic-evaluation/heuristic-evaluation.ppt.
CS147 - Terry Winograd - 1 Lecture 6 – Usability Terry Winograd CS147 - Introduction to Human-Computer Interaction Design Computer Science Department Stanford.
Feb 3, 2011IAT 3341 IAT 334 Interface Design User Centered Design Metaphor Models Practice ______________________________________________________________________________________.
Today’s class Group Presentation More about principles, guidelines, style guides and standards In-class exercises More about usability Norman’s model of.
Nine principles of design Simple and natural dialog Speak the user’s language Minimize user’s memory load Be consistent Provide feedback Provide clearly.
Help and Documentation CSCI324, IACT403, IACT 931, MCS9324 Human Computer Interfaces.
Principles and Methods
Chapter 7 design rules.
1 User Interface Design CIS 375 Bruce R. Maxim UM-Dearborn.
Design, goal of design, design process in SE context, Process of design – Quality guidelines and attributes Evolution of software design process – Procedural,
1 ISE 412 Human-Computer Interaction Design process Task and User Characteristics Guidelines Evaluation.
Conceptual Models & Interface Metaphors. Objectives By the end of this class, you will be able to… Define conceptual model Identify instances where the.
Design. Hard design - increase control. - Displays are more virtual / artificial. Marketplace pressure: - Adding operations cheaper. Adding controls expensive.
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.
Object-Oriented Software Engineering Practical Software Development using UML and Java Chapter 7: Focusing on Users and Their Tasks.
Designing Interface Components. Components Navigation components - the user uses these components to give instructions. Input – Components that are used.
Fall 2002CS/PSY Design. Fall 2002CS/PSY System-Centered Design Focus is on the technology  What can be built easily using the available tools.
INFO 355Week #71 Systems Analysis II User and system interface design INFO 355 Glenn Booker.
Chapter 7 design rules. Designing for maximum usability – the goal of interaction design Principles of usability –general understanding Standards and.
Evaluating a UI Design Expert inspection methods Cognitive Walkthrough
Chapter 1: What is interaction design?. Bad designs From:
1 chapter 7 design rules. 2 Designing for maximum usability – the goal of interaction design Principles of usability –general understanding Standards.
LECTURE 18 16/11/15. MAKING THE INTERFACE CONSISTENT Consistency is one way to develop and reinforce the users conceptual model of applications and give.
Yonglei Tao School of Computing & Info Systems GVSU Ch 7 Design Guidelines.
User Interface Design Make Your Program Easy to Use and Look Good.
Human-Computer Interaction Design process Task and User Characteristics Guidelines Evaluation ISE
Fall 2002CS/PSY UI Design Principles Categories  Learnability Support for learning for users of all levels  Flexibility Support for multiple ways.
1 Design Principles – Part 2 of 3 Learnability Principles Flexibility Principles.
Chapter 7 design rules. Designing for maximum usability – the goal of interaction design Principles of usability –general understanding Standards and.
CS 501: Software Engineering Fall 1999 Lecture 23 Design for Usability I.
Design rules.
Human Computer Interaction Lecture 21 User Support
Chapter 6 : User interface design
GUI Design and Coding PPT By :Dr. R. Mall.
Chapter 2 Hix & Hartson Guidelines.
Human-Computer Interaction
Chapter 8: Writing Graphical User Interfaces
System Design Ashima Wadhwa.
Java Look-and-Feel Design Guidelines
SIE 515 Design Rules Lecture 5.
UI Design Principles Categories
Usability and user Interfaces
User Interface Design Chapter 8.
Phil Tayco Slide version 1.0 Created Oct 2, 2017
Copyright Catherine M. Burns
HCI – DESIGN RATIONALE 20 November 2018.
Usability Testing: An Overview
Software Engineering D7025E
Usability Techniques Lecture 13.
Introduction UI designer stands for User Interface designer. UI designing is a type of process that is used for making interfaces in the software or the.
One-timer?. A new face of the technical communicator – UX is our strength – we design to write.
Systems Analysis and Design in a Changing World, 6th Edition
Design of Everyday Things
Design dilbert Fall 2002 CS/PSY 6750.
Proper functionality Good human computer interface Easy to maintain
CSE310 Human-Computer Interaction
Chapter 7 design rules.
Chapter 7 design rules.
Chapter 7 design rules.
CHAPTER 2: Guidelines, Principles, and Theories
CMPE 280 Web UI Design and Development April 16 Class Meeting
Chapter 7 design rules.
Presentation transcript:

Design : Agenda Design challenges Idea generation Design principles Fall 2002 CS/PSY 6750

Design dilbert Fall 2002 CS/PSY 6750

System-Centered Design Focus is on the technology What can be built easily using the available tools on this particular platform? What is interesting to me, as the developer, to build? Fall 2002 CS/PSY 6750

User-Centered Design Design is based on user’s Mantra: Know the user! Tasks Abilities Needs Context Mantra: Know the user! Fall 2002 CS/PSY 6750

Guidelines for Design 1. Provide a good conceptual model User has mental model of how things work Build design that allows user to predict effects of actions 2. Make things visible Visible affordances, mappings, constraints Remind person of what can be done and how to do it Fall 2002 CS/PSY 6750

Why is Design Difficult? 1. Increasing complexity/pressure Number of things to control has risen dramatically Display is increasingly symbolic/artificial Feedback is more complex and subtle Errors are increasingly serious/costly Fall 2002 CS/PSY 6750

Why Difficult? 2. Marketplace pressures Time is money Adding functionality (complexity) is now easy and cheap Adding controls/feedback is expensive Design usually requires several iterations before success Fall 2002 CS/PSY 6750

Why Difficult? 3. People often consider cost and appearance over human factors design Style over substance Bad design may not be visible Fall 2002 CS/PSY 6750

Why Difficult? 4. Creativity is challenging Can’t just make a copy Want creativity, but want pragmatism Fall 2002 CS/PSY 6750

Idea Creation Ideas come from Borrow from other fields Imagination Analogy Observation of current practice Observation of current systems Borrow from other fields Animation Theatre Information displays Architecture ... How do we create and develop new interface ideas and designs? Fall 2002 CS/PSY 6750

Interface Metaphors Metaphor - Application of name or descriptive term to another object which is not literally applicable Use: Natural transfer - apply existing knowledge to new, abstract tasks Problem: May introduce incorrect mental model Fall 2002 CS/PSY 6750

Metaphor Creation (1) Prepare What functions are needed What are users’ problems? Fall 2002 CS/PSY 6750

Metaphor Creation (2) Generate Use metaphor that matches users’ conceptual tasks Given choice, choose metaphor closest to way system really works Ensure emotional tone is appropriate to users Fall 2002 CS/PSY 6750

Metaphor Creation (3) Evaluate Evolve Fall 2002 CS/PSY 6750

Idea Creation Other methods for creating and developing interface ideas ? Fall 2002 CS/PSY 6750

Idea Creation Methods 1. Consider new use for object 2. Adapt object to be like something else 3. Modify object for a new purpose Fall 2002 CS/PSY 6750

Idea Creation Methods 4. Magnify - add to object 5. Minimize - subtract from object 6. Substitute something similar Fall 2002 CS/PSY 6750

Idea Creation Methods 7. Rearrange aspects of object 8. Change the point of view 9. Combine data into an ensemble Fall 2002 CS/PSY 6750

Design Guidelines/Principles General guidelines (advice) to help create more usable systems Can be subtle, even contradictory & Fall 2002 CS/PSY 6750

Design Principles 1. Use simple and natural dialog in user’s language Match user’s task in a natural way Avoid jargon, techno-speak Present exactly info that user needs X.25 connection discarded due to network congestion. Local limits now in effect Insufficient funds to withdraw $100 VS. Less is more! Fewer unnecessary windows, prompts, dialogs Fall 2002 CS/PSY 6750

Fun Examples Fall 2002 CS/PSY 6750

Design Principles 2. Strive for consistency Sequences, actions, commands, layout, terminology Makes more predictable OK Cancel Help Done Cancel Apply Fall 2002 CS/PSY 6750

Design Principles 3. Provide informative feedback Continuously inform user about what is occurring Most important on frequent, substantive actions How to deal with delays? Fall 2002 CS/PSY 6750

Design Principles 4. Minimize user’s memory load Recognition is better than recall Describe required input format, include example and default Use small # of generally applicable commands Date _ _ - _ _ _ - _ _ (DD-Mmm-YY, e.g., 02-Aug-93) Fall 2002 CS/PSY 6750

Design Principles 5. Permit easy reversal of actions Undo! Reduces anxiety, encourages experimentation Fall 2002 CS/PSY 6750

Design Principles 6. Provide clearly marked exits Don’t want the user to feel trapped Examples Cancel button on dialogs Interrupt/resume on lengthy operations (modeless) Quit - can exit anytime Reset/defaults - restore on a property sheet Fall 2002 CS/PSY 6750

Design Principles 7. Provide shortcuts Enable frequent users to perform often-used operations quickly Keyboard & mouse Navigation between windows/forms Reuse Provide history system - abbreviations - menu shortcuts - function keys - command completion - double click vs. menu selection Fall 2002 CS/PSY 6750

Design Principles 8. Support internal locus of control Put user in charge, not computer Can be major source of anxiety Enter next command vs. Ready for next command Fall 2002 CS/PSY 6750

Design Principles 9. Handle errors smoothly and positively 10. Provide useful help and documentation (More to come later in course on these two) Fall 2002 CS/PSY 6750

Good & Bad Designs www.baddesigns.com www.iarchitect.com Fall 2002 CS/PSY 6750