1. Human Computer Interaction
Unit Week 3
Human Computer Interaction

2. Principles of HCI Design Perception
Last week
Impact of HCI on:
Culture & The Economy
This Week
Principles of HCI Design
Perception
How does this relate to last week?

3. Appetiser Get your brain working James May Though Control Appetiser:
5-7 mins

4. LO1 Investigate how HCI has developed and its impact on society, the economy & culture

5. Assignment 1 Purpose of this assignment
On completion of this assignment, you will have shown that you can explain the impact of HCI on society, the economy and culture
Evaluate what impact 2 future developments may have on society, the economy and/or culture. They can be in development now or an idea.
Learning:
Week 1 – Society – slides + ATM / car parking research
Week 2 – Culture & Economy – research + MacBook wheel evaluation

6. Activity Future developments Watch BBC Click 4th October 2014
What is the HCI device being developed? (what is it’s purpose, what does it do?)
How does the user interact with it – what is the interface between man and machine?
What are the benefits? Why is it being developed?

7. Outcome 2-Next

8. LO 2 Understand the fundamental principles of interface design
Today’s LOs

9. How does colour effect a users perception?
Activity
Using colour when designing interfaces
Read the theory sections 1-6 on the following link then answer the questions on the task sheet.
ict.com/as_a2_ict_new/ocr/A2_G063/332_designing_systems/desig n_hci/miniweb/index.htm

10. Learning Outcome
Understand the fundamental principles in designing user interfaces.

11. • What do you think this could mean?
Last lesson you looked at the importance of perception and in particular colour selection, luminance, pop outs.
 • We now look at Pattern.
 • What do you think this could mean?
Does pattern refer to pictures on the GUI or its layout?
To a designer it might mean
a template.
A user interface,
using a specific pattern helps to enrich the user experience.
You might think that pattern refers to pictures
on the GUI or its layout.
But to a designer it might mean a template.
A user interface,
using a specific pattern helps to enrich the user
experience.

12. Capabilities of Human Beings - Perception
Cognitive psychology tells us a great deal about how we interpret information from our senses
We use five principles to organise what we see into a meaningful whole:
Gestalt Psychology –
Proximity
Similarity
Symmetry
Continuity
Closure
Activity: Click on the link and investigate. Be prepared to tell the rest of the class what you have found out
Gestalt’s theory ???

13. Capabilities of Human Beings - Perception
Cognitive psychology tells us a great deal about how we interpret information from our senses
We use five principles to organise what we see into a meaningful whole:
Gestalt Psychology –
Proximity
Similarity
Symmetry
Continuity
Closure

14. Law of Proximity
The brain more readily associates objects that are close to each other than those that are farther apart. Two friends standing next to each other will be viewed as more closely related than someone else twenty yards away.
Elements grouped close together will be perceived as belonging to the same group.

16. Law of Similarity
The principle of similarity states that things which share visual characteristics such as shape, size, color, texture, value or orientation will be seen as belonging together.
The two filled lines gives the impression of two horizontal lines, even though all the circles are equidistant from each other
the larger circles appear to belong together because of the similarity in size.

17. Law of Symmetry
The principle of symmetry describes the instance where the whole of a figure is perceived rather than the individual parts which make up the figure. 
What do you see?
Two overlapping diamonds, or three objects, a small diamond and two irregular objects above and below it?
If you are perceiving according to the principle of symmetry, you will probably see two diamonds overlapping.

18. Law of Continuation (Closure)
The brain does not prefer sudden or unusual changes in the movement of a line. The line can be a continuous line in the traditional sense, or can be a series of objects placed together to form a line. Objects not in that line will be mentally separated.

21. In 1915, Danish Gestalt psychologist Edgar Rubin experimented with reversible figure-ground patterns (known in painting and photography as positive and negative space). He designed this image to show that the object could be interpreted as either two faces or a vase. However, the brain cannot see both images at once—you must make a conscious decision whether to see a face or a vase in the drawing.

22. We tend to perceive some visual elements as the figure with a definite shape and border while other elements appear as the ground, further away and behind the main focus of the image.

23. This question is directly related to the important need of the brain to label objects as near or far in order to judge their relative importance (or danger). Rubin also outlined the principle of camouflage in which there is little or no separation between the foreground and background.

24. Surroundedness also is also related to figure-ground.

25. Design implications from Gestalt Psychology
Proximity – group related items close together and separate unrelated ones
Alignment – place related items along an imaginary line. Align items of equal importance and indent subordinate ones
Consistency – make related items look the same
Contrast – make unrelated items look different

26. Activity Gestalt’s Theory
Define Gestalt’s theory in your own words in a sentence or two
Find an example of each pattern type found within Microsoft Office – (tool bars, menus, dialogue boxes etc.) Take a screen shot and write a one line explanation of what makes it a good example.
Activity

27. Using Excel to create UIs
Use Excel functions:
Combo Box, VLOOKUP, INDEX
Use the developer function in Excel to create a Form to book a course
Activity