HCI Lect - 11 Interactive System Design Principle

Human-Computer Interaction
Design Rules
Shermeen Adnan
Interactive Systems Design Principles
• Interactive systems design:
• Maximize certain global properties of the interactive system:
• eg. accessibility, usability, acceptability, engagement, etc.
• Now that we know what we should be optimizing…
• …what ‘rules of thumb’ can we use to accomplish this.
• Interactive Systems Design Principles:

• “Helping people access, learn and remember the system…
• …giving them the sense of being in control, knowing what to do and
how to do it…
• …safely and securely…
• …in a way that suits them.”
• Visibility
– Allow people to see what options/functions are available.
– Easier to recognize than to remember.
– Can make things ‘visible’ using sound and touch as well.
• Consistency
– In terms of design features.
– Similar structures should have similar
functions/affordances.
– Tricky: consistent in relation to what else?
• Consistency within system, between systems, and between
system and `the real world’
• Familiarity
– Use language and symbols the user is familiar with.
– If concepts are new, provide a metaphor (eg. Icon
representing document should indicate how close
the document is to completion: visual metaphor?)
• Affordance
– Design things such that it is clear what they are for.
– Appearance of object suggests how it may be used.
– Depends on neighboring structures.
• Navigation
– Allow people to see where to go, and how to get there.
• Control
– Indicate who is in control at all times.
– Enable user to seize control at all times.
– What larger effects will an action have? (eg. When during
an online transaction is your credit card charged?)
• Feedback
– Lots of it, in different forms, as often as possible: ideally,
continuously
• Recovery
– From mistakes, errors and omissions; relates to
control.
• Constraints
– Make dangerous actions impossible; Steer user
away from dangerous paths; Seek confirmation
(Possible conflict with visibility and flexibility;
how?)
• Flexibility
– Allow multiple paths toward the same goal
• Long paths contain multiple, visible, simple, steps
• Short paths contain few, complex steps
• thewikigame.com
• Style
– Systems should be attractive, clean, harmonious…
• Conviviality
– ‘Design for politeness’: Systems should be polite, gentle,
helpful, passive when the user shows aptitude, active when
the user indicates the need for help, etc.
Visibility
Visibility
Visibility
Affordances
• What do these objects have in common?
Affordances
Affordances
Affordances
• Assignment
• Examples of how these principles are instantiated well or poorly in
websites/devices?
Well Poorly
Visibility
Consistency
Familiarity
Affordance
Navigation
Control
Feedback
Recovery
Constraints
Flexibility
Style
Conviviality
Design Rules
• Techniques and methods on their own do not
ensure product quality and success
we need something more …

Guidance
• Knowledge has been distilled from industry best
practices and research
• This knowledge provides guidance
• Types of Guidance
– Principles
– Guidelines
– Rules
– Standards
– Patterns
– Imperatives
Design Principles
• Principle?
– A very broad statement that is usually based on research
about how people learn and work
• Design principles
– Guidelines for design of useful and usable form and behavior
– Generally applicable guidelines that address issues of
behavior, form and content
• Principles minimize work
– Principles means minimization of work on the part of the
user while using product
Design Principles
• Work minimized includes
– Logical work
• Comprehension of text and organizational structure
– Perceptual work
• Decoding visual layouts and semantics of shape, size, color, and
representation
– Mnemonic work
• Recall of passwords, command vectors, names and locations of data
objects, and other relationships between objects
– Physical/motor work
• Number of keystrokes, degree of mouse movement, use of gestures,
switching between input modes, extent of required navigation
Design Principles
• Principles operate at 3 levels of organization:
– Conceptual level
• Help define what a product is and how it fits into the broad context
of use by the primary personas
– Interaction level
• Define how a product should behave in general and in specific
situations
– Interface level
• Help define the look and feel of interfaces
• Most principles are cross-platform, but some platforms
(Web, embedded systems) have special constraints
Design Principles
• They state broad usability goals
• Example
– Be consistent in your choice of words, formats,
graphics, and procedures
Difference between design, usability
principles and heuristics?
• When we design a product with the help of design principle,
the usability of the product increases. That product will have
good usability.
• Design principles state usability goals
• Design principles and usability principles are more or less the
same thing.
• When these principles are used to design a product they are
called design principles.
• If the same principles are used with some additional
principles to assess and evaluate a product then its called
heuristics.
Design Principles
• Norman’s design principles (general in nature can be
applied anywhere)
– Use both knowledge in the world and knowledge in the head.
– Simplify the structure of tasks.
– Make things visible: bridge the gulfs of Execution and Evaluation.
– Get the mappings right.
– Exploit the power of constraints, both natural and artificial.
– Design for error.
– When all else fails, standardize.
Visibility, Affordance, Constraints, Mapping, Consistency,
Feedback
Design Principles
• Design Principles (Nielsen)
– Visibility of system status
– Match between system and real world
– User freedom and control
– Consistency and standards
– Help users recognize, diagnose, and recover from errors
– Error prevention
– Recognition rather than recall
– Flexibility and efficiency of use
– Aesthetic and minimalist design
– Help and documentation
Design Principles
• Design Principles (Shneiderman, 1992)
– Strive for consistency
– Enable frequent users to use shortcuts
– Offer informative feedback
– Design dialogs to yield closure
– Offer error prevention and simple error handling
– Permit easy reversal of actions
– Support internal locus of control
– Reduce short-term memory load
Design Principles
• Common themes amongst these design
principles
– Giving the user control
– Striving for consistency
– Smoothing interaction with feedback
– Supporting the user’s limited memory
Design Principles
• Design principles for documentation (Redish, 1988)
– Ask relevant questions when planning manuals
– Learn about your audiences
– Understand how people use manuals
– Organize so that users can find information quickly
– Put the user in control by showing the structure of the manual
– Use typography to give readers clues to the structure of the manual
– Write so that users can picture themselves in the text
– Write so that you don’t overtax users’ working memory
– Use users’ words
– Be consistent
– Test for usability
– Expect to revise
Design Principles
• Design principles for documentation (Horton, 1990)
– Understand who uses the product and why
– Adapt the dialo to the user
– Make the information accessible
– Apply a consistent organizational strategy
– Make messages helpful
– Prompt for inputs
– Report status clearly
– Explain errors fully
– Fir help smoothly into the users’ workflow
Design Guidelines
• Guideline
– Distilled from principles and are more specific
goals
• One principle can lead to many guidelines
• Guidelines can differ for specific combinations
of users, environments and technologies
Design Principle vs Design Guideline
• Example
– Be consistent in your choice of words, formats,
graphics, and procedures (principle)
– Be consistent in the way you have users leave
every menu (guideline)
• Bye
• Exit
• Quit
• End
Principle  guidelines
• Write so that you don’t overtax users’ working
memory (principle)
– Put the parts of each sentence in logical order
– Cross out unnecessary words
– Untangle convoluted sentences
– Use lists, tables, and step-by-step instructions
– Use parallel sentence structure whenever you can,
especially in headings, lists, and explanations of
options
Design Rules
• Rules
– Low-level guidance that refers to a particular
prescription that must be followed
• Forces everyone working on the interface to be
consistent in their use of ways
• Rules for product design
– E.g., Provide an ‘Escape’ option in a dialog in which
users may want to leave the dialog box without
making any changes or selecting any options.
Design Rules
• Rules for documentation
• Use typography to give readers clues to the
structure of the manual (principle)
– Make the headings stand out from the text
(guideline)
• First headings are used only for chapter titles. They are
in boldface, 24-point, Helvetica, with a 2-point line
(rule), flush left with the beginning of the text line. Each
first-level heading starts with a new page. (rule)
• Second-level heading …..
Design Standards
• Compilation of principles, guidelines and rules
• aka User-Interface Design Guides, User-Interface Design
Standards, Style Guides, Guide
• Published Standards
– Standards available if developing products in one the
Graphical User-Interface (GUI) operating systems
– Standards published by:
• Apple
• Microsoft
• IBM
• Open Software Foundation
Design Patterns
• Exemplary, generalizable solutions to specific classes of
design problems
• Purpose
– Capture useful design decisions and generalize them to
address similar classes of problems in the future
– Represent the capture and formalization of design knowledge
• Benefit
– Reducing design time and effort
– Educating designers new to product
– Educating designers new to field
Types of Design Patterns
• Postural
– Applied at conceptual level and helps determine product
stance
• Structural
– Related to management of information display and access
– E.g., views, panes, element groupings
• Behavioral
– Solve wide-ranging problems related to specific
interactions with individual functional or data objects or
groups of such objects (widget level)
Design Imperatives
• These guide the design process
• aka goals (usability goals / user experience goals)
• They become frame of reference for the whole
design process
• Types
– Ethical [considerate, helpful]
– Purposeful [useful, usable]
– Pragmatic [viable, feasible]
– Elegant [efficient, artful, affective]

HCI Lect - 11 Interactive System Design Principle

Uploaded by

Copyright:

Available Formats

HCI Lect - 11 Interactive System Design Principle

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

HCI Lect - 11 Interactive System Design Principle

Uploaded by

Copyright:

Available Formats

Human-Computer Interaction

• Interactive Systems Design Principles:

we need something more …

You might also like

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.