Week 11

1
Week 11

• Navigation
• Heuristic evaluation

2
Objectives

• Examine the elements of navigation
• Explore various types of navigational systems,
  including menus, tabs, site maps, categories, and
  search
• Compare good and bad menu and tab designs
• Examine some simple rules

3
Metaphors for navigation

• a citys street system
• turning pages of a book
• instantly teletransporting somewhere
• switching channels on a TV set
• dropping breadcrumbs like Hansel and Gretal
• selecting items from a menu in a restaurant
• travelling in a time machine

4
The elements of navigation

• In software, button labels, links, and other
  interface elements are the signs that help us
  find our destination
• Too many signs can be as confusing as no signs at
  all (remember Grice and Norman)

5
(No Transcript)
6
The aim of the designer

• Allow users to access any part of the software
  from any point with a minimum of signs or
  directions and in the fewest number of clicks or
  keystrokes as possible (efficiently)
• But remember effectively and satisfaction

7
The essentials of navigation

• When designing, remember that users need
• signs that identify where they are
• signs that tell them what is available
• controls that initiate actions
• Beware! The first of these is often forgotten

8
Signs that identify where we are

• Signs help orient users, confirming that they
  have reached the proper destination or made the
  intended selection (remember Norman)
• Examples of signs that help
• screen titles
• colouring/highlighting of menu item we are on
• breadcrumbs

9
(No Transcript)
10
Signs that tell us what is available

• Examples
• pushbutton labels
• the text of hyperlinks
• other labels, such as tooltips

11
Controls that initiate actions

• Examples
• pushbuttons
• links
• list boxes
• drop down menus

12
Two primary methods of organisation

• Categorisation or Search
• Research by a group called User Interface
  Engineering showed
• in a study of online shoppers, most preferred to
  search by category
• some ignored the search function entirely
• some used the search function only as a last
  resort

13
Categorisastion

• Categories must be well thought-out, considering
  both the items and the audience
• When a user selects a major category, the
  subcategories for that category should be
  displayed
• Consistency will allow users to instantly select
  a different major category or subcategory without
  having to search for the appropriate menu

14
Search

• Examples
• text boxes (allowing simple search)
• text boxes (allowing complex search)
• boxes allowing selection of features

15
Helping the user with a complex search
16
(No Transcript)
17
Positioning of navigational elements

• Position the menus consistently on each page of
  the site
• Left or right side menus?
• The left side is almost a defacto standard now
• Thus some people may tune out the right side as
  an ad
• But
• a recent study suggested that locating menus
  vertically along the right side was more usable
  than on the left
• it depends on the language

18

• http//www.cit.gu.edu.au/mf/arabia.ppt
• http//www.bentelhalal.com

19
Using tabs

• Use tabs to organise related items at the same
  peer level
• Apply the tab metaphor thoroughly and
  consistently
• Confine tabs to one row only

20
Compare this
21
with this
22
but
23
Image maps

• A graphic that has a number of active areas that
  the user can click individually
• Each of these links can be programmed to link to
  a separate page, display information, or play an
  audio or video file or animation
• The cursor should change when it is rolled over
  the map

24
More creative navigation

• Navigation systems can creatively match the style
  of the site or software
• For some sites, fun is added by the sense of
  discovery you get when you click on any item
  within the system
• Design firms take the risks with navigation
  design that some standard sites cannot
• Dont let your creative tendencies overcome your
  common sense. As always, let users try your
  design at an early stage, and observe their
  reactions

25
(No Transcript)
26
A few simple rules

• Make it easy for users to figure out where they
  are
• Make it clear what the options are and how to
  select them
• Deliver the content you promise when the user
  makes a selection
• Always provide an easy means for users to change
  their mind
• Try to anticipate and follow your audiences
  mental model
• Test the navigation on real users

27
Todays lab

• Heuristic evalulation