Design process design rules

51
Design Process: Design Rules Preeti Mishra Course Instructor

Transcript of Design process design rules

Page 1: Design process  design rules

Design Process: Design Rules

Preeti Mishra

Course Instructor

Page 2: Design process  design rules

Design Goal

“Every designer wants to build a high quality interactive system that is admired by colleagues, celebrated by users, circulated widely, and imitated frequently.”

-Shneiderman,

Page 3: Design process  design rules

Factors that affect User Experience

Page 4: Design process  design rules

Details

Useful: Your content should be original and fulfill a need Usable: Site must be easy to use Desirable: Image, identity, brand, and other design

elements are used to evoke emotion and appreciation Findable: Content needs to be navigable and locatable

onsite and offsite Accessible: Content needs to be accessible to people

with disabilities Credible: Users must trust and believe what you tell them

Page 5: Design process  design rules

Principles to Support Usability

Page 6: Design process  design rules

Define Usability

Usability is a quality attribute that assesses how easy user interfaces are to use. The word "usability" also refers to methods for improving ease-of-use during the design process.

Page 7: Design process  design rules

Principles to Support Usability

Learnability Flexibility() Robustness()

Page 8: Design process  design rules

Learnability(The ease with which new users can begin effective interaction and achieve maximal performance. )

Page 9: Design process  design rules

Principles affecting Learnability

Predictability Synthesizability Familiarity Generalizability Consistency

Page 10: Design process  design rules

Predictability

determining effect of future actions based on past interaction history, operation visibility

Page 11: Design process  design rules

Synthesizability

Synthesizability: support for the user to assess the effect of past operations on the current state (can I ‘tell’ why I am here based on what I have gone through in the past?).

Page 12: Design process  design rules

Familiarity

Familiarity: the extent to which a user's knowledge and experience in other real-world or computer-based domains can be applied when interacting with a new system.

Page 13: Design process  design rules

Generalizability

support for the user to extend knowledge of specific interaction within and across applications to other similar situations.

Page 14: Design process  design rules

Consistency

likeness in input-output behaviour arising from similar situations or similar task objectives.

Page 15: Design process  design rules

Flexibility

The multiplicity of ways the user and system exchange information.

Page 16: Design process  design rules

Principles affecting Flexibility

Dialog Initiative Multi-Threading Task Migratability Substiutivity Customizability

Page 17: Design process  design rules

Dialogue initiative

user freedom from artificial constraints on the input dialog imposed by the system; user vs system - who has the initiative in the dialog?

Page 18: Design process  design rules

Multithreading

the ability of the system to support user interaction for more than one task at a time.

Page 19: Design process  design rules

Task Migratability

the ability to transfer control for execution of tasks between the system and the user (consider e.g., spell-checking task).

Page 20: Design process  design rules

Substitutivity

:the extent to which an application allows equivalent input and output values to be substituted for each other (values in input eg fractions/decimals, values in output eg both digital and analog, output/input eg output can be reused as input).

Page 21: Design process  design rules

Customizability

the ability of the user or the system to modify the user interface. (adaptability vs adaptivity) ?-initiated modification.

Page 22: Design process  design rules

Robustness

The level of support provided to the user in determining successful achievement and assessment of goal-directed behaviour.

Page 23: Design process  design rules

Principles affecting Robustness

Observability Recoverability Responsiveness Task Conformance

Page 24: Design process  design rules

Observability

the extent to which the user can evaluate the internal state of the system from the representation on the user interface.

Page 25: Design process  design rules

Recoverability:

the extent to which the user can reach the intended goal after recognizing an error in the previous interaction.

Page 26: Design process  design rules

Responsiveness

a measure of the rate of communication between the user and the system.

Page 27: Design process  design rules

Task conformance

the extent to which the system services support all the tasks the user would wish to perform and in the way the user would wish to perform.

Page 28: Design process  design rules

Heuristics to Measure Usability

They are called "heuristics" because they are broad rules of thumb and not specific usability guidelines.

Page 29: Design process  design rules

We can consider TWO sets here (Already Studied)

Shneiderman’s Eight Golden Rules of Interface Design

Norman’s Seven Principles for Transforming Task into Simple Ones

Page 30: Design process  design rules

Ben Shneiderman's 8 Golden Rules

1. Strive for consistency: layout, terminology, command usage, etc. 2. Cater for universal usability: recognize the requirements of diverse users and

technology. For instance add features for novices eg explanations, support expert users eg shortcuts.

3. Offer informative feedback: for every user action, offer relevant feedback and information, keep the user appropriately informed, human-computer interaction.

4. Design dialogs to yield closure: help the user know when they have completed a task.

5. Offer error prevention and simple error handling: prevention and (clear and informative guidance to) recovery; error management.

6. Permit easy reversal of actions: to relieve anxiety and encourage exploration, because the user knows s/he can always go back to previous states.

7. Support internal locus of control: make the user feel that s/he is in control of the system, which reponds to his/her instructions/commands. 8. Reduce short-term memory load: make menus and UI elements/items visible, easily available/retrievable, ...

Page 31: Design process  design rules

[Donald] Norman's 7 Principles

1. Use both knowledge in the world and knowledge in the head. 2. Simplify the structure of tasks. 3. Make things visible: bridge the gulfs of Execution and Evaluation. 4. Get the mappings right. 5. Exploit the power of constraints, both natural and artificial. 6. Design for error. 7. When all else fails, standardize.

Page 32: Design process  design rules

Some more …Heuristics to measure Usability

1. Visibility of system status

2. Match between system and the real world

3. User control and freedom

4. Consistency and standards

5. Error prevention

6. Recognition rather than recall

7. Flexibility and efficiency of use

8. Aesthetic and minimalist design

9. Help users recognize, diagnose, and recover from errors

10. Help and documentation

Page 33: Design process  design rules

Some more …Heuristics to measure Usability

Visibility of system status The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.  

Match between system and the real world The system should speak the users' language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order.  

User control and freedom Users often choose system functions by mistake and will need a clearly marked "emergency exit" to leave the unwanted state without having to go through an extended dialogue. Support undo and redo.  

Page 34: Design process  design rules

10 important Heuristics to measure Usability

  Consistency and standards Users should not have to wonder whether different words, situations, or actions mean the same thing. Follow platform conventions.  

Error prevention Even better than good error messages is a careful design which prevents a problem from occurring in the first place. Either eliminate error-prone conditions or check for them and present users with a confirmation option before they commit to the action.  

Recognition rather than recall Minimize the user's memory load by making objects, actions, and options visible. The user should not have to remember information from one part of the dialogue to another. Instructions for use of the system should be visible or easily retrievable whenever appropriate.

Page 35: Design process  design rules

Some more …Heuristics to measure Usability

  Flexibility and efficiency of use Accelerators -- unseen by the novice user -- may often speed up the interaction for the expert user such that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions.  

Aesthetic and minimalist design Dialogues should not contain information which is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility.  

Page 36: Design process  design rules

Some more …Heuristics to measure Usability

  Help users recognize, diagnose, and recover from errors Error messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution.  

Help and documentation Even though it is better if the system can be used without documentation, it may be necessary to provide help and documentation. Any such information should be easy to search, focused on the user's task, list concrete steps to be carried out, and not be too large.

Page 37: Design process  design rules

Guidelines for Usability

Page 38: Design process  design rules

How to Improve Usability

There are many methods for studying usability, but the most basic and useful is user testing, which has 3 components: Get hold of some representative users, such as customers for

an e-commerce site or employees for an intranet (in the latter case, they should work outside your department).

Ask the users to perform representative tasks with the design. Observe what the users do, where they succeed, and where they

have difficulties with the user interface. And let the users do the talking.

Page 39: Design process  design rules

Points to remember while going for Usability

It's important to test users individually and let them solve any problems on their own. If you help them or direct their attention to any particular part of the screen, you have contaminated the test results.

To identify a design's most important usability problems by: testing 5 users is typically enough. Rather than run a big, expensive study, it's a better use of

resources to run many small tests and revise the design between each one so you can fix the usability flaws as you identify them.

User testing is different from focus groups, which are a poor way of evaluating design usability.

Iterative Design

Page 40: Design process  design rules
Page 41: Design process  design rules

When to work on Usability

Before starting the new design, test the old design to identify the good parts that you should keep or emphasize, and the bad parts that give users trouble.

Unless you're working on an intranet, test your competitors' designs to get cheap data on a range of alternative interfaces that have similar features to your own.

Conduct a field study to see how users behave in their natural habitat.

Page 42: Design process  design rules

When to work on Usability Make paper prototypes of one or more new design ideas

and test them. The less time you invest in these design ideas the better, because you'll need to change them all based on the test results.

Refine the design ideas that test best through multiple iterations, gradually moving from low-fidelity prototyping to high-fidelity representations that run on the computer. Test each iteration.

Inspect the design relative to established usability guidelines whether from your own earlier studies or published research.

Once you decide on and implement the final design, test it again. Subtle usability problems always creep in during implementation.

Page 43: Design process  design rules

Need of guidelines

As the theories underlying HCI design are difficult to produce specific standard so most of the design rules are based on general guidelines

Well-known guidelines include the Apple Human

Interface Guidelines, Java Look and Feel Design Guidelines, and Java Look and Feel Graphics Repository

Page 44: Design process  design rules

Guidelines: Organization

High-level goals for data display organization (Smith and Mosier 1986)

1. Consistency of data display

2. Efficient information assimilation by the user

3. Minimal memory load on the user

4. Compatibility of data display with data entry

5. Flexibility for user control of data display

Page 45: Design process  design rules

Guidelines Navigation

National Cancer Institute has published a 388-guideline

set for Web pages: • “Standardize task sequences” • “Ensure that embedded links are descriptive” • “Use unique and descriptive headings” • “Use check boxes for binary choices” • “Develop pages that will print properly” • “Use thumbnail images to preview larger

images”

Page 46: Design process  design rules

Guidelines for Accessibility

World Wide Web Consortium (W3C), adapted from US Rehabilitation Act Amendments of 1998 “Provide a text equivalent for every non-text

element” “For any time-based multimedia presentation,

synchronize equivalent [non-multimedia] alternatives” “Ensure that all information conveyed with color is

also available without color” “Provide a title for every Web frame”

Page 47: Design process  design rules

Display Guidelines may be Application- or Domain-Specific …but in the end they share common themes — case in point, a Lockheed set for electric-power control rooms

Page 48: Design process  design rules

Display Guidelines

Be consistent in labeling and graphic conventions

• Standardize abbreviations

• Use consistent formatting in all displays

• Present data only if they assist the operator

• Avoid alphanumeric data when possible

• Present alphanumeric data only when necessary

• Use and maintain high-resolution monitors

• Design in monochrome first, then add color only where needed

• Involve users when developing new displays and procedures

Page 49: Design process  design rules

Guidelines: Notification

Wickens and Hollands have proposed techniques for making information stand out (2000): intensity inverse video marking blinking size color fonts audio Caveat Notificator!

Page 50: Design process  design rules

Cautions Notificator!

Notification is an area where tradeoffs may occur:

attention-grabbing techniques may “dull” the user’s awareness…or, at the very least, irritate or annoy the user

Similar formatting implies relationships among

similarly formatted items Sound saves display real estate, and is

processed differently by the brain — but, like visual attention grabbers, must not be overdone

Page 51: Design process  design rules

Guidelines: Input/Data Entry

Proper data entry is crucial in some areas — many times, bad data entry results in serious consequences Enter Smith and Mosier again, with these goals:

1. Consistency in data-entry transactions

2. Minimal input actions by user

3. Minimal memory load on users

4. Compatibility between data entry and display

5. Flexibility for user control of data entry User control vs. consistency — a frequent tradeoff