Mental Models

1. Mental Models including Model Human Processor design tool

2. This presentation covers • A description of a mental model and how they can be applied to the design of a user interface. • The importance of designing a system model that matches closely to the user’s mental model. • Model Human Processor design tool.

3. Introduction • In the previous lesson we learnt how different design principles are applied to the design of a GUI. • You could break down these design principles into categories of: • Perception • Attention • Memory • Learning

4. Perception • How does the user perceive the signals from a computer? • Red text or warning signs indicate stop. • Green text or no problems indicate go. • Perception can also change based on sound signals. • Happy DING might mean something saved correctly. • Sharp CLUNK might mean something didn’t save properly.

5. Attention • Designing an interface to hold a user’s attention. • Cluttered = bad! • Important information needs to be clear and obvious so the user doesn’t get fed up looking for it! • Looking at layout and aesthetics.

6. Memory • Thinking about pre-existing knowledge of the user. • Thinking about consistency between system screens to make it easy to use the system. • Less familiar screens should be design to make the transition as easy as possible!

7. Learning • Looking at previous experiences to design an interface that was easy to use. • Going from Windows 3.1 to Windows 7 would be a huge jump. • But Windows Vista to Windows 7 is much less of a jump! • Providing useful help screens is essential too.

8. Windows 3.1 vs Windows 7

9. Windows Vista vs Windows 7

10. Introduction • You can break down the users who use computers into two categories. • Those who: • Have lots to some understanding of the operation of a computer. • Have little to no understanding of the operation of a computer. • Those in the first category are tend to be able to complete tasks at a faster rate compared to those in the second category.

11. Introduction • The way in which we interact with a computer is based on what we know... • Our: • Perception • Attention • Memory • Learning ability

12. Mental Models • The way in we interact with a computer could be defined by our mental model. • A designer will have to design an interface taking into account our mental models. • And it can be quite tricky as everyone has a unique mental model.

13. Mental Models • What is useful is that we all have similarities in our mental models and, as a designer, we can control the development of the mental model. • For instance... • A user wants to save a word processed file. • They learn how to do it in MS Word. • The user starts a new document in MS Excel. • The user saves the file using the same method using what they have learnt in the previous application.

14. Mental Models • By mimicking the methods used across applications. • Consistency is often the key. • It is also important to think about user experiences. For example: • Many people grow up learning about the green cross code. • Green man means walk; Red man means stop. • This could be translated into systems to help users interact with the system. • The use of image and sound are critical.

15. Mental Models • A user’s mental model should allow them to envisage the results of an action. • They will then use this mental model to help them to predict the actions that need to take place to complete another task.

16. Mental Models • An effective user interface takes into consideration: • The fact that all mental models are different. • Mental models are effected by user experience. • The designer must: • Ensure that the interface translates the intention of the user onto the interface. • The action of the computer should match that anticipated by the user. • The actions of the computer could be translated through visual clues or by sound.

17. System Model vs Mental Model • The system model must match as closely as possible to the user’s mental model. • If the system model is too far removed from the user’s mental model then the system will not be used efficiently. • The system model must build upon user experience as much as possible to ensure smooth transitions.

18. System Model vs Mental Model • All users bring misconceptions to all systems. • By designing a system that predicts these misconceptions and addresses them will help boost confidence in the user. • For instance, this means using the same shortcut keys across applications and systems.

19. M and P example • Two men go camping. • One man marks a can of powered milk with M and powered mash potato with P. • The next morning the other man puts cereal in his bowl. He picks up can P and pours it on his cereal and adds water. • He believed P stood for Powdered Milk and M stood for Mash. • Different users have different misconceptions based on previous experiences. • The man who had Mash on his cornflakes went camping last year and labelled cans M for Mash and P for Powered Milk!

20. Model Human Processor (MHP) • A design tool with the aim of portraying a user of a computer system as an actual computer! • A basic example: Eye Skin Visual Short-term memory Touch Short-term memory Visual Processor Touch Processor Cognitive Short-Term Memory Facts Long-Term Memory Cognitive Processor Long-Term Memory Motor Processor Muscles

21. Model Human Processor (MHP) • Information is received through your skin and eyes. • This is the input. Eye Skin Visual Short-term memory Touch Short-term memory Visual Processor Touch Processor Cognitive Short-Term Memory Facts Long-Term Memory Cognitive Processor Long-Term Memory Motor Processor Muscles

22. Model Human Processor (MHP) • Information is passed to working memory by the perceptual processor. Eye Skin Visual Short-term memory Touch Short-term memory Visual Processor Touch Processor Cognitive Short-Term Memory Facts Long-Term Memory Cognitive Processor Long-Term Memory Motor Processor Muscles

23. Model Human Processor (MHP) • The working memory includes two separate storage sections; • One for visual images and one for touch feelings. • The working memory also includes those sections of the long-term memory that are currently of interest to the user. Eye Skin Visual Short-term memory Touch Short-term memory Visual Processor Touch Processor Cognitive Short-Term Memory Facts Long-Term Memory Cognitive Processor Long-Term Memory Motor Processor Muscles

24. Model Human Processor (MHP) • This process can be related to the process of loading data from disk into RAM. Eye Skin Visual Short-term memory Touch Short-term memory Visual Processor Touch Processor Cognitive Short-Term Memory Facts Long-Term Memory Cognitive Processor Long-Term Memory Motor Processor Muscles

25. Model Human Processor (MHP) • The motor processor then draws on the long-term memory and the cognitive processes to complete an action. • For example...if you burn yourself you pull your hand away! You look at the damage and assess any problems. Eye Skin Visual Short-term memory Touch Short-term memory Visual Processor Touch Processor Cognitive Short-Term Memory Facts Long-Term Memory Cognitive Processor Long-Term Memory Motor Processor Muscles

26. Model Human Processor (MHP) • Now apply this to another model. Eye Ear Visual Short-term memory Auditory Short-term memory Visual Processor Auditory Processor Cognitive Short-Term Memory Facts Long-Term Memory Cognitive Processor Long-Term Memory Motor Processor Muscles

27. Model Human Processor (MHP) • You know that right clicking on an image will bring up a menu. • You see the menu and you click on copy. • You click copy and then right click again to paste. • You hear a noise indicating a problem. • You think about the problem and realise that you are going to over-write the old file. Eye Ear Visual Short-term memory Auditory Short-term memory Visual Processor Auditory Processor Cognitive Short-Term Memory Facts Long-Term Memory Cognitive Processor Long-Term Memory Motor Processor Muscles

28. The application of MHP • A model can be applied to the design of a user interface by: • Logically ordering inputs, possibly by those required from the user. • Using an on-screen flashing cursor to show where data is to be input. • Using an audible stimulus (e.g. A beep sound) to indicate when an error has been made by the user.

29. Questions A company wants to introduce a stock ordering system. A user interface will need to be designed: • Describe the user interface too known as Model Human Processor (MHP). • Identify and explain two examples of how MHP could be applied to the interface.

30. Questions A publishing company is updating the accounts system that is currently in use. • Explain how a user’s perception and memory should be considered when the accounts system interface is being designed. • Explain how colour should be used when designing the HCI.