Usability principles 2

1. Affordance

2. Navigation

3. Usability inspection

Wednesday, October 16, 13

1. Affordance

2. Navigation

3. Usability inspectionWednesday, October 16, 13

1. Affordance

2. Navigation



1. Affordance

2. Navigation


Main principles you remember?

Important concepts: ‣Information scent‣Information architecture‣Mental models


1. Affordance

2. Navigation


Information foraging theory

Assumptions about people:

Maximize benefitsMinimize costsMinimal effort(conserve energy aka lazy)

Information scentWednesday, October 16, 13

1. Affordance

2. Navigation


Information*goal*

Information*scent*

Associations*

How$can$you$improve$

information$scent?$

Information scent


1. Affordance

2. Navigation


Information architecture


1. Affordance

2. Navigation


Mental models

http://support.tivo.com//


1. Affordance

2. Navigation


Mental models


1. Affordance

2. Navigation


Mental models

http://support.tivo.com//


1. Affordance

2. Navigation


Mental models

similar'to'• User’s'mental'model'

different'than'

• Designer’s'represented'model'(system'image)'

invisible'

•  System'(implementation)'model'


1. Affordance

2. Navigation


Information architecture‣How do you create an

information architecture that makes sense for the users’ mental model?‣How can you find out the users’

mental model?


1. Affordance

2. Navigation


Information architecture

Card Sorting


1. Affordance

2. Navigation



1. Affordance

2. Navigation


Heuristic evaluation

Interface grammar?

‣Apply principles‣Find issues


GUI elementsmenus

controls =Language of the interface

Do you speak interface?


Controls


Grammar & Interface Design

Verb

Action

Noun

Object


SelectionImperative

4 Types of Controls

Entry Display


Imperative

Button

Butcon (button/icon)

Hyperlinks


Do#it!# Do#it!# Do#it!#A B C

Do it!D


Do#it!# Do#it!# Do#it!#A B C

Do it!D

Button design & behavior

- button look- mouseover behaviors


Selection

Check box

Toggle button/butcon

Flip-flop

Radio

Combutcon

Lists•drop-down•select multiple items

!

!Wednesday, October 16, 13

☑vs.


flip-flop buttons :(

vs.


Selection Imperativethen:

1 2

or

Selection Imperative+

simultaneous


Selection Imperativethen:

Highlight likely option

:(

:)


ImperativeSelection +


Selection

Check box

Toggle button/butcon

Flip-flop

Radio

Combutcon

Lists•drop-down•select multiple items

!

!Wednesday, October 16, 13

Entry

Bounded

Spinners

Dials & sliders

Unbounded - validation?

!

!


bounded entry


Display

Scrollbars• thumb

Splitters


OS X Lion

scrollbar design


iPhone: to scrollbar or NOT?


EXCISE


vs.

needs goalsimplementation

modelmental model


ultimate EXCISE:

Making users change their mental models to fit the implementation model.


1. Don’t weld on training wheels

2. “pure” excise - let the machine decide

3. visual excise - ornamentation

4. Don’t stop the proceedings with idiocy

5. Don’t make users ask permission

6. Allow input whenever you have output

7. Don’t force users to go to another window to perform a function that affects the current window

8. Don’t force users to remember where they put things

9. Don’t force users to move & resize windows

10.Don’t force users to reenter personal settings

11.Navigation is excise. Make it easier - how?

a. Reduce number of places to go

b.Provide signposts, overviews, mapping of controls to functions

c. Match user needs

d.Avoid hierarchies


1. Affordance

2. Navigation



1. Affordance

2. Navigation


Heuristic evaluation

‣Apply principles‣Find issues


Usability principles 2

Technology

Transcript of Usability principles 2