Southern Cross University 1 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Investigating Layout ComplexityInvestigating Layout Complexity

Tim ComberDr. John Maltby

Centre of ComputingSouthern Cross University

LISMORE ( Australia)

Southern Cross University 2 CADUI'96 - 5-7 June 1996 - FUNDP Namur

The importance of screen designThe importance of screen design

• Acceptance and performance influenced by presentation

• Successful screen design is essential to most interactive systems

• Most new computer systems use some form of GUI.

• Few empirical studies relating to modern, bit-mapped screens

Southern Cross University 3 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Guidelines say:Guidelines say:• Keep the interface simple and well-organised

– Does this apply to a GUI?

– Are simple interfaces the most usable?

– And, how can the designer know that a simple interface has been achieved?

Southern Cross University 4 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Shannon’s FormulaShannon’s Formula

• K = a positive constant

• n = number of event classes

• pi = probability of occurrence of the ith event class

C K p pn

n

m

n1

2log

Southern Cross University 5 CADUI'96 - 5-7 June 1996 - FUNDP Namur

The communication process:The communication process:

• Consists of n classes of event• An event is the transmission of a specific “unit” of

information.• If letters of the alphabet are the communication

units then:– n = 26

Southern Cross University 6 CADUI'96 - 5-7 June 1996 - FUNDP Namur

EntropyEntropy

• entropy is a measure of the disorder of a system– identical to that of entropy in statistical mechanics

H p p q q ( log log )

Southern Cross University 7 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Entropy in the case of two possibilities Entropy in the case of two possibilities with probabilities, p and (1 - p) with probabilities, p and (1 - p)

0

0.1

0.2

0.3

0.4

0.5

0.6

0.7

0.8

0.9

1

1.1

0.0

0.1

0.2

0.3

0.4

0.5

0.6

0.7

0.8

0.9

p

H B

ITS

Entropy is a maximum if events in all classes occur with equal probability. ie when there is most uncertainty

Entropy is zero when one class of event becomes certain, ie when there is no uncertainty

Southern Cross University 8 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Implications of the theoryImplications of the theory• communication includes

speech music ballet

•Information can be defined as:–a measure of the freedom of choice when selecting a binary event to send down a communication channel.

Southern Cross University 9 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Diagram of a GUI communication Diagram of a GUI communication systemsystem

CPU Monitor Eyes Brain

Noise

Message GUI Image Message

A GUI can be viewed as a communication system between CPU and user

Southern Cross University 10 CADUI'96 - 5-7 June 1996 - FUNDP Namur

InformationInformation

• Information is proportional to log2 of the possible meanings

Southern Cross University 11 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Information and entropyInformation and entropy

• Entropy describes the amount of uncertainty in the progress of a message.

• When the user begins, – any interaction object can be chosen,

– then probability can be used to indicate the next choice

– dependent on the order of prior objects in the sequence.

• In a highly organised transmission the amount of information (entropy) is low and there is little randomness or choice.

Southern Cross University 12 CADUI'96 - 5-7 June 1996 - FUNDP Namur

RedundancyRedundancy

• Redundancy is given by:– R = 1 - H/HMAX

• where– H = entropy

• R is the amount of the message that is determined by the statistical rules of the message language and is not due to free choice.

Southern Cross University 13 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Redundancy and the English languageRedundancy and the English language

• Weaver points out that about 50% of the English language is redundant,

• 1. Omit much words make text shorter.• 2. Thxs, wx cax drxp oxt exerx thxrd xetxer, xnd

xou xtixl maxagx prxttx wexl.• 3. Thng ge a ltte tuger f w alo lav ou th spce.

Southern Cross University 14 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Redundancy and interfacesRedundancy and interfaces

• A command language interface is a low entropy

interface much like the third example for the

English language.

• In contrast, GUI’s have a much higher redundancy.

Southern Cross University 15 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Applied to typography - Applied to typography - BonsiepeBonsiepe

• Entropy is a measure of the disorder of the system.

• System order: – objects classified by common widths and common heights

• distribution order:– objects classified by distance from the top and left of page.

• The proportion of objects in each class determines the complexity of the layout.

Southern Cross University 16 CADUI'96 - 5-7 June 1996 - FUNDP Namur

TechniqueTechnique

• Compared two versions of a printed catalogue.• It was found that the new version was 39% more

ordered than the original version.• Offers a justification for grid based layout.

Southern Cross University 17 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Applied to computer screens - Applied to computer screens - Tullis

• Structured layout (minimising layout complexity):– increases the user’s ability to predict the location of items

– thus improves the viewer’s chance of finding the desired information.

• A useful usability metric?– Did not predict time to find information.

– but, Important predictor of users’ rating of the usability of screens.

Southern Cross University 18 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Aim of the researchAim of the research

• Develop a metric for evaluating object placements in a graphical user interface based on complexity theory

• “Where is the best place to put things”. • Provide immediate feedback on the layout quality

of the GUI.

Southern Cross University 19 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Optimum Complexity

Usability

Complexity

It is hypothesised that there is a trade off between usability (U) and complexity C with a relationship of the form U = f(C) where U is a maximum for some intermediate value of C

Southern Cross University 20 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Initial investigationInitial investigation

• Apply Bonsiepe’s technique to thirteen different Microsoft Windows applications

• Large variation in complexity figures for the thirteen displays

• Possible to apply manually but not efficient or accurate

Southern Cross University 21 CADUI'96 - 5-7 June 1996 - FUNDP Namur

23.68

173.35

285.61

1571.98

Southern Cross University 22 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Screen complexity and user preferenceScreen complexity and user preference

• Bonsiepe and Tullis indicated that less complex is better– User’s should agree

– Subjects were asked to sort the screen prints from best design to worst design, with no ties.

• Results– Subjects had a common interpretation of “goodness” of

design.

– However, the distribution of the results was unexpected.

– A greater preference for the more complex screens.

Southern Cross University 23 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Evaluating usability of screen designsEvaluating usability of screen designs

• Usability consists of:– effectiveness, learnability, flexibility, and attitude

• Visual Basic (VB): – Information about the dimensions and positions of

objects.

– Track the user’s progress with a task, keeping a record of each event and time taken.

• Pilot application, Launcher

Southern Cross University 24 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Southern Cross University 25 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Screen LayoutsScreen Layouts

• Four different screen layouts were designed, each with a different complexity score

Southern Cross University 26 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Screen 1 - Complexity equals 156Screen 1 - Complexity equals 156

Southern Cross University 27 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Screen 2 - Complexity equals 170Screen 2 - Complexity equals 170

Southern Cross University 28 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Screen 3 - Complexity equals 186Screen 3 - Complexity equals 186

Southern Cross University 29 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Screen 4 - Complexity equals 228Screen 4 - Complexity equals 228

Southern Cross University 30 CADUI'96 - 5-7 June 1996 - FUNDP Namur

ProcedureProcedure

• Subjects were requested to complete the same task for each screen.

• Asked to indicate their preferences for the different screens.

• Recorded:– Time it took users to complete each step in a task

– Any errors.

Southern Cross University 31 CADUI'96 - 5-7 June 1996 - FUNDP Namur

SummarySummary

Usability Scr. 1 Scr. 2 Scr. 3 Scr. 4

Complexity 156 170 186 228

Error-free 36% 79% 86% 71%

Time 354 290 276 293

Rating 4 7 16 0

Southern Cross University 32 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Conclusions from pilot Conclusions from pilot

• Differences in usability between screens differing in complexity.

• VB proved useful tool for:– calculating complexity

– collecting data about the user’s interaction

Southern Cross University 33 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Implications for GUI designImplications for GUI design

• There are two groups that require a method of evaluating GUI applications. 1.Designers choosing between competing layouts.

2.Comparing different applications for design quality.

• Give feedback to the designer during design: – layout complexity metric

– Kim’s symmetry and balance

– Sear’s layout appropriateness

• Designers can modify their design “on-the-fly”

Southern Cross University 34 CADUI'96 - 5-7 June 1996 - FUNDP Namur

Extensions to LauncherExtensions to Launcher

• More screens• More tasks• Wider cross-section of users • Extra metrics will also be added

– including Sear’s “layout appropriateness”

– percentage white space

– Kim’s balance