Content, Visual and

Navigation

McCracken & Ayres

Copyright 2004 by Prentice Hall

1. Content Organization
Content organization concerns with the
way information is organized into groups
It is important for the interface designer to
understand how information should be
organized such a way that will ease users
task in finding it

McCracken & Ayres

Copyright 2004 by Prentice Hall

Graphic overview: scheme and

structure
You have a mass of content that you
want your users to be able to find
Fact
19
Fact
15

Fact 8
Fact 1
Fact
11

Fact
17
Fact 4
Fact
16
Fact 7

Fact 5

Fact
13

Fact
12

Fact 3
Copyright 2004 by Prentice Hall

Fact 9

Fact 6

Fact
10

Fact
18
McCracken & Ayres

Fact 2

Fact
14
Fact
20

How to Organize so Users Can Find

Things?
First, group related things, forming the
groups in terms of the way users think.
Fact
Fact
19
15
Fact
13
Fact
Fact 8
14

Fact 4
Fact
12
Fact 3
Fact 5
Fact
17
Fact
Fact 2
10

McCracken & Ayres

Fact 1
Fact
11

Copyright 2004 by Prentice Hall

Fact 9
Fact 6
Fact
20
Fact
16
Fact 7
Fact
18

This is an organizational scheme

Now give names to the groups, or
have the users do that
Group A

Group E

Fact
Fact
19
15
Fact
13
Fact
Fact 8
14

Fact 4
Fact
12
Fact 3

Group B
Fact
17
Fact
Fact 2
10
McCracken & Ayres

Fact 5

Group C
Fact 1
Fact
11

Copyright 2004 by Prentice Hall

Group D
Fact 9
Fact 6
Fact
20
Fact
16
Fact 7
Fact
18

Organizational Schemes
Familiar in everyday life:
Phone book
Appointment book
Shopping mall diagram with store locations

McCracken & Ayres

Copyright 2004 by Prentice Hall

These are exact organizational

schemes
Alphabetical: phone book, for example
Chronological: appointment book, for
example
Geographical: shopping mall diagram, for
example

McCracken & Ayres

Copyright 2004 by Prentice Hall

Not always possible

Where can I find sardines packed in
water, with no salt added?
In the canned fish section?
In the dietetic foods section?

McCracken & Ayres

Copyright 2004 by Prentice Hall

Supermarket is an example of an
ambiguous organizational scheme
Ambiguous often has a negative connotation,
which is not intended here. We use it to
describe organizational situations where there is
more than one reasonable way to group things.
We identify four types of ambiguous
organizational schemes:
Topical
Task-oriented
Audience-specific
Metaphor-driven
hybrid

McCracken & Ayres

Copyright 2004 by Prentice Hall

Topical organizational scheme

Organizes content by subject
Examples:
Library subject index
Encyclopedia
Chapter titles in textbooks
Website home pages (usually combined with
other schemes as well)

McCracken & Ayres

Copyright 2004 by Prentice Hall

10

Task-Oriented Organizational
Scheme
Organizes content by what user wants to
do.

McCracken & Ayres

Desktop software applications such as

word processors and spreadsheets
providevfamiliar examples. Collections of
individual actions are organized under
task-oriented menus such as Edit,Insert,
and Format.
Copyright 2004 by Prentice Hall

11

Task-oriented organizational scheme

Example: Autobytel.com

McCracken & Ayres

Copyright 2004 by Prentice Hall

12

Audience-specific organizational
scheme
Useful when there are two or more
distinct user groups
User may navigate to appropriate
page and bookmark it
Audience-specific schemes can be open or closed. An open scheme will
allow members of one audience to access the content intended for other
audiences. A closed scheme will prevent members from moving between
audience-specific sections. A closed scheme may be appropriate if
subscription fees or security issues are involved.

McCracken & Ayres

Copyright 2004 by Prentice Hall

13

Audience-specific organizational
scheme
Example: Bank of Montreal

Kelomp
ok
audiens
berbeda

McCracken & Ayres

Copyright 2004 by Prentice Hall

14

Metaphor-driven organizational
scheme
Shows group by a visual metaphor.
Not many examples, because it is difficult
to find metaphors that will work with all
users.
Possible example: pet supply store:

McCracken & Ayres

Copyright 2004 by Prentice Hall

15

See the problem?

McCracken & Ayres

Copyright 2004 by Prentice Hall

16

Hybrid organizational scheme

Combines multiple organizational schemes
Quite common, but must be done with
care to avoid confusion
Example: Nordstrom

McCracken & Ayres

Copyright 2004 by Prentice Hall

17

Hybrid organizational scheme

example

McCracken & Ayres

Copyright 2004 by Prentice Hall

18

Database organizational structures

Database organizational structure provides
a bottom-up view, whereas a hierarchy
provides a top-down
Both have their place
In a database structure the user fills in
data, and is then taken directly to the right
page. One click, when it works ideally.

McCracken & Ayres

Copyright 2004 by Prentice Hall

19

Database example: selecting a car

model

McCracken & Ayres

Copyright 2004 by Prentice Hall

20