23-04-2012, 02:59 PM
Human Computer Interface HCI
hci.pdf (Size: 7.59 MB / Downloads: 262)
Zeiss Slide Projector
• Only one button to control the slide advance, see Figure 2.3.
• During lectures, sometimes the slides go forwards, sometimes they go backwards . . .
• If you can find an instruction manual:
Short press = forward, long press = backward.
• What an elegant design, two functions with just one button!
• But how should first-time users know what to do?
The Louis-Laird Amphitheatre in the Sorbonne
• Magnificent murals on the ceiling.
– But only the right way up for the lecturer.
• Electric projection screen.
– Has to be lowered from a back room up a short flight of stairs, out of sight.
Clunky Connector
• The audiovisual control trolley (see Figure 2.5) at the front of lecture theatre HS EDV also caused
me a major problem.
• Intending to hook up my laptop to the ceiling mounted projector, I unwittingly unscrewed the
monitor cable connector from the outside of the trolley.
• This resulted in a dull clunking sound from inside the trolley.
• Unfortunately, the internal connector had only been secured by virtue of its being attached to the
external connector!
Where is the Toilet Paper?
• Fancy hotel, nice bathrooms, see Figure 2.7.
• Having sat down and done the business, where the heck is the toilet paper?
• Ah, there it is! Well-hidden, see Figure 2.8.
Shower Control
• Shower control: water either goes into the bath out of the faucet or comes out of the shower. See
• Sticker with instructions on the faucet.
• How do you make the water come out of the shower instead of the faucet?
• You have to reach under the faucet and pull the knob down!
The Icon Design Lifecycle
Usability engineering lifecycle for icons:
Design, test, redesign.
Icon Design Iterations
• Start with simple black and white, hand-drawn sketches on paper (silhouette conveys the most
information).
• Test and redesign until the basic symbols work.
• Add greys and perhaps colour. Design on computer. Print out colour versions of the designs, at
the approximate real size.
• Test and redesign until the icons work.
Icon Intuitiveness Testing
Test the intuitiveness of (a set of) icons by running a simple thinking aloud usability test:
• Mount each icon design on a piece of card.
• Either tape up an area of the table with masking tape, into which the icons are placed,
This is so the video camera remains focussed and test users are less
tempted to pick up the icon cards.
Better still, use a stand to present icon designs at approximately the correct viewing angle and
distance.
hci.pdf (Size: 7.59 MB / Downloads: 262)
Zeiss Slide Projector
• Only one button to control the slide advance, see Figure 2.3.
• During lectures, sometimes the slides go forwards, sometimes they go backwards . . .
• If you can find an instruction manual:
Short press = forward, long press = backward.
• What an elegant design, two functions with just one button!
• But how should first-time users know what to do?
The Louis-Laird Amphitheatre in the Sorbonne
• Magnificent murals on the ceiling.
– But only the right way up for the lecturer.
• Electric projection screen.
– Has to be lowered from a back room up a short flight of stairs, out of sight.
Clunky Connector
• The audiovisual control trolley (see Figure 2.5) at the front of lecture theatre HS EDV also caused
me a major problem.
• Intending to hook up my laptop to the ceiling mounted projector, I unwittingly unscrewed the
monitor cable connector from the outside of the trolley.
• This resulted in a dull clunking sound from inside the trolley.
• Unfortunately, the internal connector had only been secured by virtue of its being attached to the
external connector!
Where is the Toilet Paper?
• Fancy hotel, nice bathrooms, see Figure 2.7.
• Having sat down and done the business, where the heck is the toilet paper?
• Ah, there it is! Well-hidden, see Figure 2.8.
Shower Control
• Shower control: water either goes into the bath out of the faucet or comes out of the shower. See
• Sticker with instructions on the faucet.
• How do you make the water come out of the shower instead of the faucet?
• You have to reach under the faucet and pull the knob down!
The Icon Design Lifecycle
Usability engineering lifecycle for icons:
Design, test, redesign.
Icon Design Iterations
• Start with simple black and white, hand-drawn sketches on paper (silhouette conveys the most
information).
• Test and redesign until the basic symbols work.
• Add greys and perhaps colour. Design on computer. Print out colour versions of the designs, at
the approximate real size.
• Test and redesign until the icons work.
Icon Intuitiveness Testing
Test the intuitiveness of (a set of) icons by running a simple thinking aloud usability test:
• Mount each icon design on a piece of card.
• Either tape up an area of the table with masking tape, into which the icons are placed,
This is so the video camera remains focussed and test users are less
tempted to pick up the icon cards.
Better still, use a stand to present icon designs at approximately the correct viewing angle and
distance.