Top Banner
Implementation Models and Mental Models Chapter 2 from “About Face 3: The Essentials of Interaction Design” by Alan Cooper, Robert Reimann, David Cronin 2007 Daniil Sorokin [email protected] Universit¨ at T¨ ubingen June 20, 25 2012 Design and Evaluation of Linguistic Visualizations SS 2012 Chris Culy
44

Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Jul 02, 2018

Download

Documents

dokien
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Implementation Models and Mental ModelsChapter 2 from “About Face 3: The Essentials of Interaction Design”

by Alan Cooper, Robert Reimann, David Cronin 2007

Daniil [email protected]

Universitat Tubingen

June 20, 25 2012

Design and Evaluation of Linguistic Visualizations SS 2012 Chris Culy

Page 2: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Outline

1 Implementation Models

2 Mental Models

3 Examples of Implementation and Mental Models

4 Represented Models

5 How these models are related

6 Software

7 Representation for new Technologies

Page 3: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Outline

1 Implementation Models

2 Mental Models

3 Examples of Implementation and Mental Models

4 Represented Models

5 How these models are related

6 Software

7 Representation for new Technologies

Page 4: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

1 Implementation Models

2 Mental Models

3 Examples of Implementation and Mental ModelsATMProjector

4 Represented Models

5 How these models are related

6 SoftwareExamples

PhotoshopNetwork driveDropbox

Software design problemFile SystemMathematical thinking

7 Representation for new TechnologiesCalendarAdaptation

8 Summary

Page 5: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Implementation Models

Implementation Model (or System Model) is a representation ofhow a machine or a program actually works.It can be a scheme, description, pseudocode, etc.

Page 6: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

1 Implementation Models

2 Mental Models

3 Examples of Implementation and Mental ModelsATMProjector

4 Represented Models

5 How these models are related

6 SoftwareExamples

PhotoshopNetwork driveDropbox

Software design problemFile SystemMathematical thinking

7 Representation for new TechnologiesCalendarAdaptation

8 Summary

Page 7: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Mental Models

Mental Model (or Conceptual Model) is our explanation of howthings work.Mental Models can be the same as the Implementation Model, if itis easier for us to imagine all the actions the way they actuallyperformed.

It is not always possible and needed.Mental Model is an explanation which is sufficient for us tocomfortably use a tool.

People don’t need accurate model to understand things! However itis sometime easier to understand how plan flies rather than imagesome magic. Another example would be knife when it is essentialto understand how it works to use it.

Page 8: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

1 Implementation Models

2 Mental Models

3 Examples of Implementation and Mental ModelsATMProjector

4 Represented Models

5 How these models are related

6 SoftwareExamples

PhotoshopNetwork driveDropbox

Software design problemFile SystemMathematical thinking

7 Representation for new TechnologiesCalendarAdaptation

8 Summary

Page 9: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

ATM Example

Implementation

Well it is not actually animplementation, but it tries toresemble it.

Mental Concept

Page 10: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Projector Example

Page 11: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Projector Example

Page 12: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Note

It is also mentioned that the distance between the ImplementationModel and the Mental Model is bigger when the things are morecomplicated and it is impossible to understand how they function.

It is the case of software.

So it is unclear what our Mental Models are based on.

It is the task that hasn’t changed in case of projector, and so withsoftware it is the task what is important. Mental model is not onlyabout how program works, but also about what we understand thetasks.

Page 13: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

1 Implementation Models

2 Mental Models

3 Examples of Implementation and Mental ModelsATMProjector

4 Represented Models

5 How these models are related

6 SoftwareExamples

PhotoshopNetwork driveDropbox

Software design problemFile SystemMathematical thinking

7 Representation for new TechnologiesCalendarAdaptation

8 Summary

Page 14: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Represented Models

Represented Model (also Designer’s Model) – the way thedesigner chooses to represent a program’s functioning to the user.The term appears only in software because the implementation isusually extremely complicated and because we are able to createthe model that doesn’t necessary reflects the way the programworks.

This concept of the represented model has no widespreadcounterpart in the mechanical world.Represented Model is also something that the user need tounderstand an it somehow plays the role of the ImplementationModel as it was in the case of machines. However in this case theRepresented Model can be anything we want and it should becomfortable for the user.

Page 15: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

1 Implementation Models

2 Mental Models

3 Examples of Implementation and Mental ModelsATMProjector

4 Represented Models

5 How these models are related

6 SoftwareExamples

PhotoshopNetwork driveDropbox

Software design problemFile SystemMathematical thinking

7 Representation for new TechnologiesCalendarAdaptation

8 Summary

Page 16: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Relations between Models

Page 17: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

1 Implementation Models

2 Mental Models

3 Examples of Implementation and Mental ModelsATMProjector

4 Represented Models

5 How these models are related

6 SoftwareExamples

PhotoshopNetwork driveDropbox

Software design problemFile SystemMathematical thinking

7 Representation for new TechnologiesCalendarAdaptation

8 Summary

Page 18: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Photoshop example

Implementation Model – numeric color date.Mental Model – the look of the image.

Page 19: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Network drive example

Page 20: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Dropbox example

Dropbox is something more than a network drive or a folder. Itservice which uses the standard Represented Model of a folder onuser’s computer. Although it performs also synchronization andversion control.Dropbox fits into other Represented Models too.

Page 21: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Problem

Most Software conforms to Implementation Models.Because it is easier to design such a software. And because a lot ofsoftware is designed by engineers.

Naturally it is easier for them to use a Represented Model whichreflects the Implementation Model. It also means you don’t needto solve a problem of presenting difficult concepts to a user. TVset fro example.

Page 22: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Conforming to Implementation Model example

Recall the network drive example.

Drag and Drop usually moves a file from one location to another.Although if a user performs Drag and Drop between two differentdrives the file will be copied rather than moved.It follows directly from the Implementation Model of the filesystem.Such a behaviour can cause a cognitive dissonance.

Page 23: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

File System example

It turns out that the file system of modern operating systems itselfis also the Represented Model. And not very good one, because ittries to represent the Implementation Model.

One of the issues:Programs are stored together with files.

It was difficult to explain why a user can store a program and a filein the same folder. File and program have no difference for aprogrammer or computer (both are some date). But for a userprograms are executable and can perform some actions on files.This issue was addressed both by Mac and Windows. Theysuggested to separate programs and files.

Page 24: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Windows solution

Page 25: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Mac solution

Page 26: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Other solutions – iOS modeliOS functions without showing the file system to a user.

There are some modern examples of how a computer system canfunction without the File System metaphor.

Page 27: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Other solutions – iOS model

Page 28: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Other solutions

Android Windows Phone

Page 29: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Other solutions – Windows 8

Page 30: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Mathematical thinking

Mathematical thinking leads to implementation model interfaces.

Boolean logic:The operations AND and OR are usually interpreted as opposite.

Example:Find employees in Arizona AND TexasFind employees in Arizona OR Texas

They try to state that the fact the engineers are mathematicianslead them to implementation model interfaces. And they think interms of Math. But it is questionable if we don’t think in terms ofMath. The example is ok, but it can be included into the generalConforming to Implementation Model problem.

Page 31: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

1 Implementation Models

2 Mental Models

3 Examples of Implementation and Mental ModelsATMProjector

4 Represented Models

5 How these models are related

6 SoftwareExamples

PhotoshopNetwork driveDropbox

Software design problemFile SystemMathematical thinking

7 Representation for new TechnologiesCalendarAdaptation

8 Summary

Page 32: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

New TechnologiesWe tend to use old representations in new environments.

Sometimes representations from the Mechanical-Age limit newInformation- Age representations.

They say that the language of old things holds us form inventingnew things, but it wasn’t a problem in the 20th century. Tip:Don’t replicate Mechanical-Age artefacts in user interfaces withoutInformation-Age enhancements. We are now Mechanical-Ageversus Information-Age Represented Models.They claim that it is because of old representation that we didn’tsee the whole potential of new things (emails, mobile phones).We need to improve old things with new capabilities: phone-book.

Page 33: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

New TechnologiesWe tend to use old representations in new environments.

Sometimes representations from the Mechanical-Age limit newInformation- Age representations.

They say that the language of old things holds us form inventingnew things, but it wasn’t a problem in the 20th century. Tip:Don’t replicate Mechanical-Age artefacts in user interfaces withoutInformation-Age enhancements. We are now Mechanical-Ageversus Information-Age Represented Models.They claim that it is because of old representation that we didn’tsee the whole potential of new things (emails, mobile phones).We need to improve old things with new capabilities: phone-book.

Page 34: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Calendar example

Page 35: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Calendar example

Page 36: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Note

People don’t find it difficult to adapt to newer, more usefulrepresentations of familiar systems.

However it is so only if they are motivated to do it and it is notwhat has happened to calendars.

Page 37: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Adaptation example

Page 38: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Adaptation example

Page 39: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Adaptation example

Page 40: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

1 Implementation Models

2 Mental Models

3 Examples of Implementation and Mental ModelsATMProjector

4 Represented Models

5 How these models are related

6 SoftwareExamples

PhotoshopNetwork driveDropbox

Software design problemFile SystemMathematical thinking

7 Representation for new TechnologiesCalendarAdaptation

8 Summary

Page 41: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Summary

• Implementation Models and Mental Models

• Designers create Represented Models

• Old representations versus new Representations.

• Represented Models (Computers) allow us to put simple faceon complicated things.

Page 42: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Summary

• Implementation Models and Mental Models

• Designers create Represented Models

• Old representations versus new Representations.

• Represented Models (Computers) allow us to put simple faceon complicated things.

Page 43: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Summary

• Implementation Models and Mental Models

• Designers create Represented Models

• Old representations versus new Representations.

• Represented Models (Computers) allow us to put simple faceon complicated things.

Page 44: Implementation Models and Mental Models - uni …cculy/courses/S2012/visDesignEval/... · Implementation Models and Mental Models ... 3 Examples of Implementation and Mental Models

Summary

• Implementation Models and Mental Models

• Designers create Represented Models

• Old representations versus new Representations.

• Represented Models (Computers) allow us to put simple faceon complicated things.