NIKE78 - Nick Marsh | ‘NIKE Wiis’ from NIKE78 on Vimeo.

Uuum, I’m not sure about this. It looks like he’s having trouble standing up or something.

Design pattern template in rtf format.

A template for documenting design patterns for this week’s HCI task is now available on the HCI course page. To use the template, download the document and edit it to replace all the red text with your own. Change the images also.

The template is based on the format of those in the Yahoo! design pattern library. You can visit there to see some concrete examples of the kind of information that should be in a pattern description as well as for inspiration on the kinds of things that patterns can be about.

Image Credit: manifestcreative

It has taken me a while, but I have finally finished putting up a summary of the lecture on Situated Actions from week 8.

A summary for this week’s lecture will be coming soon (I promise).

This week’s lecture for HCI was about the theory of Distributed Cognition. I have made a separated web-page with the summary for this class.

In this week’s class we covered the topic of Affordances. This idea originates from the field of Ecological Psychology and the work of J.J. Gibson. It is best known in HCI circles through Norman’s book ‘The Design of Everyday Things.’ According to Gibson, affordances are:

“The affordances of the environment are what it offers the animal, what it provides or furnishes, either for good or ill” (Gibson, p.127)

An important aspect of the idea is that an affordance describes a potential for action in the environment in relation to a person or animal. This has proven to be a very popular concept in design, perhaps because it deals with everyday aspects of perception and interaction and relates the usability of products to their physical form (in relation to a user) in a fairly straight-forward way.

We discussed in detail the work of Djajadiningrat, who has worked with Gibson’s theories of Ecological Psychology in the field of Industrial Design. In particular, he has developed the notions of ‘Feed-forward’ (that a product should inform the user about the purpose of an action) and “Inherent Feedback” (that a user should experience feedback as a natural consequence of their actions).

Critical Questions

• The notion of affordances has been used in subtly different ways by different authors.
• Confusion betwen ‘Affordance’, ‘Convention’, and ‘Constraint’.
• We cannot really talk about screen-based buttons affording clicking

Practical Task

• Find a product with some interesting affordances for you.
• Make an analysis of the different actions that it affords for you. Are these in line with the functions that it performs?
• Bring it to class (so don’t choose a shopping trolley).

Readings

• Norman, D., 1999. Affordances, Conventions and Design. Interactions, 6(3), 38-43.
• Djajadiningrat, T., Overbeeke, K. & Wensveen, S., 2002. But how, Donald, tell us how?: on the creation of meaning in interaction design through feedforward and inherent feedback. In Proceedings of the conference on Designing interactive systems. ACM Press, pp. 285-291.

Date: Week 8, 18th February

Topics covered: Aspects of Cognition. Mental Models.

In this week’s class I gave an overview of some aspects of cognition along with a discussion of the relevance they might have for design. I also briefly presented Card’s Information Processing model and also the notion of mental models as both an idea of one way that people make sense of their interactions with the world and as a useful orientation for designers of interactive systems.

The aspects of cognition that we discussed in the class were:

• Attention
• Perception and recognition
• Memory
• Learning
• Reading, speaking and listening
• Problem solving, planning, reasoning and decision making

See the reading, Ch 3 of ‘Interaction Design’ for a detailed discussion of these aspects.

The notion of ‘Mental Models’ has been a long standing and quite influential idea in Human Computer Interaction. The basic idea is that people have internal mental representation of the way a system works and they use these representations as models to help them when they use a system. One possible application of this idea for designers is that by designing our systems so that the working of the system is clear in the interface, it is easier for users to form a useful mental model of the product.

Critical Questions

The idea of Mental Models is often appealing to designers because it seems to make sense and offer practical and useful insights into the way users interact with products. However, there are some critical questions you should consider also.

• Do people really have Mental Models? What separates a Mental Model from everyday knowledge?
• Focusing on mental representations can divert attention from the many other resources people use to help them when using interactive products. What about other people, or physical resources?
• How much does this actually help designers? Does it simply substitute the problem of choosing the correct mental model for the problem of designing?

Slides: available

Practical Task:

• In groups of 3 - 5.
• See if you can find evidence for Mental Models in the way people use interactive products.
• Ask a person to show you how they use a product. Ask them to explain what they are doing as they use it. Try stopping them from time to time and asking what the think the product will do (and why) before they make an action. Then when they take the action, ask them if the response of the product matched their expectation.
• Prepare an A3 poster presenting your findings for submission at next week’s class.

Readings:

• Norman, D., 1999. Affordances, Conventions and Design. Interactions, 6(3), 38-43.
• Djajadiningrat, T., Overbeeke, K. & Wensveen, S., 2002. But how, Donald, tell us how?: on the creation of meaning in interaction design through feedforward and inherent feedback. In Proceedings of the conference on Designing interactive systems. ACM Press, pp. 285-291.

Typing at a manual typewriter

This week’s lecture was about some models of human motor behavior (slides available). Several models were presented in the class, but we focussed on two; Fitts’s law and Guiard’s model of bimanual skill. The goal of the lecture was that students would be able to tell the difference between descriptive and predictive models and be aware of some of the design implications of the models presented in the class.

Predictive models are models that allow one to predict a person’s performance at a task. They have the advantage that you don’t need to go through the trouble of building a test and recording performance empirically. Descriptive models help to explain the way people perform at a task. Descriptive models are useful for giving a  framework and vocabulary for understanding and talking about a problem.

Fitts’s Law

There is a relationship between the distance to a target (e.g. a button), it’s size and the time it takes to click on (acquire) it. Larger closer buttons take less time to acquire than further, distant ones. Fitts’s law is a predictive model which expresses this relationship in a mathematical equation:

T = a + b log₂(D/W + 1)

Where T is time, a and b are experimentally determined constants, D is distance to the target and W is the width of the target. This relationship is actually a very good predictor of the time it takes to click on a target. For this week’s class, I developed a web-page where you can test this relationship out for yourself. The results from the first week seem to be in line with what one would expect from the law.

Fitts’s law has some surprising implications for interface design. It explains why the corners and edges of the screen are very quick to acquire, even though they may be further away from other targets. The reason for this is that when using a mouse a user can keep scrolling past the edge of the screen and the mouse will stay at the edge fo the screen. This means that there is effectively a very big button outside each of the four corners and four edges of the screen.

See this quiz from Bruce Tognazzini for some tricky questions related to Fitts’s law.

Guiard’s model of bimanual skill

Guiard’s model of bimanual skill is a descriptive model of the way people divide certain kinds of tasks between their preferred and non-preferred hands. The model describes how people tend to use their non-preferred hands for the larger framing movements of a task and their preferred hands for the finer detailed movements. For example, when writing the non-preferred hand might steady and position the sheet of paper as the preferred hand writes.

See my summary of Guiard’s paper for a fuller description.

Practical Task:

• In groups of three:

• Find a situation that you could apply one of the models that we covered in this week’s class.

• Prepare a short presentation for next week’s class (max 5 mins).

Readings

The readings for next week’s class are:

• Preece, J., Sharp, H. & Rogers, Y., 2002. “Interaction design : beyond human-computer interaction”, New York: J. Wiley & Sons. Chapter 3
• Payne, S., 2003 “User’s Mental Models: The Very Ideas” in Carroll, J (ed) “HCI Models, Theories, and Frameworks” London, Morgan Kaufman.
  

Two compelling interaction concepts

Krzysztof sent along links to two compelling interaction concepts that demonstrate alternative ways of interacting with computers than what most of us are using now. In the picture on the left is the ‘bumptop desktop’ by Anand Agarawala. This takes the typical desktop metaphor for organizing and interacting with files and stretches it to include physics, 3D rendering, and gestural interactions. The picture on the right shows the multitouch display developed by Jeff Han. This provides an intiutive method for interacting in a very direct way with the information presented on the screen.

Links to videos of the presentations:

• Bumptop desktop
• Multitouch display

Thanks for the links Krzysztof!

Blackboard: HCI concerns (top), usability problems (bottom)

Welcome to students attending my 2009 spring course on Human-Computer Interaction (HCI). I will use this blog to post summaries of my lectures and other resources related to the course. Please feel free to post comments or questions using the links below. You can find me in person in the user centred design group on the fourth floor of Alsion.

The purpose of the HCI course is to give you a broad overview of some theories in the field of Human Computer Interaction. It is intended that by the end of the course, you will be better equipped to draw on theoretical knowledge as well as have developed practical skills to apply theory. See the course web page for more details, including a lecture plan, suggested readings and links to lecture slides.

This Week’s Lecture

(slides available)

The purpose of this week’s lecture was to give you an introduction to HCI, to explain some of the areas that HCI is concerned with and to give an understanding of why HCI is an important field to study.

We started by covering some of the practical details about the course, such as the format for lectures, the number of ECTS for the course and the format of the exam. Check the course web page if you need to refer to these.

The goal of the lecture, was this:

• You should be able to explain to your Grandfather what this HCI subject you are taking is, and why it’s worth taking.

HCI is an acronym which stands for Human-Computer Interaction. Referring to a picture of a young child using a computer, and an elderly man using a digital camera, we talked about the range of different people (humans), devices (computers) and interactions that this might entail. Whereas the first image that the word ‘computer’ calls to mind might be a desktop PC, many different kinds of devices these days include some kind of interactive computational component. Similarly, the people who use computers goes beyond office workers sitting at desks. We also need to consider the young, the old, groups of people, people on the move and so on. The range of fields that HCI touches upon has grown steadily throughout its history and continues to grow today.

A more general definition of HCI is given by Carroll (2003):

“HCI is concerned with understanding how people make use of devices and systems that incorporate or embed computation, and how such devices and systems can be more useful and more usable” (p.1)

We then talked about why HCI is a worthwhile field to study. I gave three examples.

The first was just a funny video from the internet of a man getting very angry at his computer. Actually, it turns out that this scene was staged, but we can all identify with the feeling of being completely infuriated by a computer. We should ask ourselves - “why do computers make us feel like this, what could be done to make them better?”

The next example was more serious. It was from the case of the Therac 25 accidents, in which six patients were given massive doses of radiation (up to 100 times what they should have been), three of whom died as a direct result. There were many contributing factors to these accidents, including mechanical design faults and software errors and also (relevant to us) interface design faults and a failure to take into consideration the change in performance of operators as they moved from novice to skilled use (Leveson & Turner, 1993). Consider the many safety-critical areas where people rely on computer interfaces to make decisions and take actions that could impact on the safety and well-being of others.

Therac 25 Radiation Therapy Machine

The final example was more positive. This was about the design of the original Palm Pilot, which was a case where attention to the design and usability of a device resulted in a very successful product, in a product category that had until then not seen much success. The reference for this story that I mentioned in class was chapter 4 of Bergman (2000) - see the reference below. The point here is that having a good understanding of HCI can also help to make products that are successful in the market.

Original Palm Pilot

After these examples, we had a class discussion where students shared their experiences with interfaces that are difficult or frustrating to use - or enjoyable to use. We discussed the factors which might be relevant to consider in discussing why these examples were more or less usable. We talked in particular about notions of:

• intuitiveness as a goal for interface design.
• consistency as a desirable quality in interfaces.
• conventions.
• differences between users.
• problems arising from interactions with systems of devices, rather than single devices.

We finished the class with a presentation of  six usability goals. These are taken from one of the readings for this week’s class, (Preece, Sharp & Rogers 2002) so you can read more about them there:

• Effective to use (effectiveness)
• Efficient to use (efficiency)
• Safe to use (safety)
• Have good utility (utility)
• Easy to learn (learnability)
• Easy to remember how to use (memorability)

Practical Task: ‘Usability Bug Hunt’

• Keep an eye out during the week for any ‘usability bugs’ you can find. That is, products that don’t work the way you expect them to, websites that are difficult to navigate, software that you can’t figure out.
• Document as much as you can about the ‘bug’. What was the situation when it occurred? What did you try to remedy it? Is it something that happens all the time, or something unexpected? If possible, bring the product with you to class. If it is too big, bring a photo.
• We will discuss everyone’s bugs in next week’s class.

Readings

• Preece, J., Sharp, H. & Rogers, Y., 2002. “Interaction design : beyond human-computer interaction”, New York: J. Wiley & Sons. Chapter 1
• MacKenzie, S., 2003 “Motor Behaviour Models for Human-Computer Interaction” in Carroll, J (ed) “HCI Models, Theories, and Frameworks” London, Morgan Kaufman.

References

• Bergman, E., 2000. Information Appliances and Beyond 1st ed., Morgan Kaufmann.
• Carroll, J.M., 2003. HCI Models, Theories, and Frameworks: Toward a Multidisciplinary Science 1st ed., Morgan Kaufmann.

• Leveson, N. & Turner, C., 1993. An investigation of the Therac-25 accidents. Computer, 26(7), 18-41. 
  

Here’s a short animated video that tells about the history of the internet (in 8 minutes). HCI students might find it interesting in relation to this week’s lecture and our discussion of the widening concerns of HCI as a field.

Thanks to Lars for the link