implementation models and mental models - uni …cculy/courses/s2012/visdesigneval/... ·...

44
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

Upload: dokien

Post on 02-Jul-2018

220 views

Category:

Documents


0 download

TRANSCRIPT

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

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

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

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

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.

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

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.

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

ATM Example

Implementation

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

Mental Concept

Projector Example

Projector Example

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.

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

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.

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

Relations between 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

Photoshop example

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

Network drive example

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.

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.

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.

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.

Windows solution

Mac solution

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.

Other solutions – iOS model

Other solutions

Android Windows Phone

Other solutions – Windows 8

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.

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

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.

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.

Calendar example

Calendar example

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.

Adaptation example

Adaptation example

Adaptation example

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

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.

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.

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.

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.