Chapter 2: Understanding and conceptualizing interaction

1
Chapter 2 Understanding and conceptualizing
interaction
2
Recap

• HCI has moved beyond designing interfaces for
  desktop machines
• Concerned with extending and supporting all
  manner of human activities
• Designing for user experiences, including
• Making work effective, efficient and safer
• Improving and enhancing learning and training
• Providing enjoyable and exciting entertainment
• Enhancing communication and understanding
• Supporting new forms of creativity and expression

3
Understanding the problem space

• What do you want to create?
• What are your assumptions?
• What are your claims?
• Will it achieve what you hope it will? If so,
  how?

4
A framework for analysing the problem space

• Are there problems with an existing product or
  user experience?
• Why do you think there are problems?
• How do you think your proposed design ideas might
  overcome these?
• When designing for a new user experience how will
  the proposed design extend or change current ways
  of doing things?

5
An example

• What do you think were the main assumptions made
  by developers of online photo sharing and
  management applications, like Flickr?

6
Assumptions and claims

• Assumptions
• Able to capitalize on the hugely successful
  phenomenon of blogging
• Just as people like to blog so will they want to
  share with the rest of the world their photo
  collections and get comments back
• People like to share their photos with the rest
  of the world
• A claim
• From Flickrs website (2005) is almost
  certainly the best online photo management and
  sharing application in the world

7
From problem space to design space

• Having a good understanding of the problem space
  can help inform the design space
• e.g., what kind of interface, behavior,
  functionality to provide
• But before deciding upon these it is important to
  develop a conceptual model

8
Conceptual model

• Need to first think about how the system will
  appear to users (i.e. how they will understand
  it)
• A conceptual model is
• a high-level description of how a system is
  organized and operates. (Johnson and Henderson,
  2002, p. 26)

9
What is and why need a conceptual model?

• Not a description of the user interface but a
  structure outlining the concepts and the
  relationships between them
• Why not start with the nuts and bolts of design?
• Architects and interior designers would not think
  about which color curtains to have before
  deciding where the windows will be placed in a
  new building
• Enables designers to straighten out their
  thinking before they start laying out their
  widgets (p. 28)
• Provides a working strategy and a framework of
  general concepts and their interrelations

10
Helps the design team

• Orient themselves towards asking questions about
  how the conceptual model will be understood by
  users
• Not to become narrowly focused early on
• Establish a set of common terms they all
  understand and agree upon
• Reduce the chance of misunderstandings and
  confusion arising later on

11
Main components

• Major metaphors and analogies that are used to
  convey how to understand what a product is for
  and how to use it for an activity.
• Concepts that users are exposed to through the
  product
• The relationships between the concepts
• e.g., one object contains another
• The mappings between the concepts and the user
  experience the product is designed to support

12
A classic conceptual model the spreadsheet

• Analogous to ledger sheet
• Interactive and computational
• Easy to understand
• Greatly extending what accountants and others
  could do

www.bricklin.com/history/refcards.htm
13
Why was it so good?

• It was simple, clear, and obvious to the users
  how to use the application and what it could do
• it is just a tool to allow others to work out
  their ideas and reduce the tedium of repeating
  the same calculations.
• capitalized on users familiarity with ledger
  sheets
• Got the computer to perform a range of different
  calculations and recalculations in response to
  user input

14
Another classic

• 8010 Star office system targeted at workers not
  interested in computing per se
• Spent several person-years at beginning working
  out the conceptual model
• Simplified the electronic world, making it seem
  more familiar, less alien, and easier to learn

Johnson et al (1989)
15
The Star interface
16
Interface metaphors

• Designed to be similar to a physical entity but
  also has own properties
• e.g. desktop metaphor, search engine
• Exploit users familiar knowledge, helping them
  to understand the unfamiliar
• Conjures up the essence of the unfamiliar
  activity, enabling users to leverage of this to
  understand more aspects of the unfamiliar
  functionality
• People find it easier to learn and talk about
  what they are doing at the computer interface in
  terms familiar to them

17
Benefits of interface metaphors

• Makes learning new systems easier
• Helps users understand the underlying conceptual
  model
• Can be innovative and enable the realm of
  computers and their applications to be made more
  accessible to a greater diversity of users

18
Problems with interface metaphors (Nelson, 1990)

• Break conventional and cultural rules
• e.g., recycle bin placed on desktop
• Can constrain designers in the way they
  conceptualize a problem space
• Conflict with design principles
• Forces users to only understand the system in
  terms of the metaphor
• Designers can inadvertently use bad existing
  designs and transfer the bad parts over
• Limits designers imagination in coming up with
  new conceptual models

19
Activity

• A company has been asked to design a
  computer-based system that will encourage
  autistic children to communicate and express
  themselves better.
• What type of interaction would be appropriate to
  use at the interface for this particular user
  group?

20
Interaction types

• Instructing
• issuing commands using keyboard and function keys
  and selecting options via menus
• Conversing
• interacting with the system as if having a
  conversation
• Manipulating
• interacting with objects in a virtual or physical
  space by manipulating them
• Exploring
• moving through a virtual environment or a
  physical space

21
Instructing

• Where users instruct a system by telling it what
  to do
• e.g., tell the time, print a file, find a photo
• Very common interaction type underlying a range
  of devices and systems
• A main benefit of instructing is to support quick
  and efficient interaction
• good for repetitive kinds of actions performed on
  multiple objects

22
Vending machines
Describe the conceptual model underlying the two
vending machines Which is easiest to use?
23
Conversing

• Like having a conversation with another human
• Differs from instructing in that it more like
  two-way communication, with the system acting
  like a partner rather than a machine that obeys
  orders
• Ranges from simple voice recognition menu-driven
  systems to more complex natural language
  dialogues
• Examples include search engines, advice-giving
  systems and help systems

24
Pros and cons of conversational model

• Allows users, especially novices and
  technophobes, to interact with the system in a
  way that is familiar
• makes them feel comfortable, at ease and less
  scared
• Misunderstandings can arise when the system does
  not know how to parse what the user says
• e.g. child types into a search engine, that uses
  natural language the question
• How many legs does a centipede have? and the
  system responds

25
(No Transcript)
26
Manipulating

• Exploits users knowledge of how they move and
  manipulate in the physical world
• Virtual objects can be manipulated by moving,
  selecting, opening, and closing them
• Tagged physical objects (e.g., bricks, blocks)
  that are manipulated in a physical world (e.g.,
  placed on a surface) can result in other physical
  and digital events

27
Manipulatives (PicoCrickets)
28
Direct manipulation

• Shneiderman (1983) coined the term Direct
  Manipulation
• Came from his fascination with computer games at
  the time
• Proposes that digital objects be designed so they
  can be interacted with analogous to how physical
  objects are manipulated
• Assumes that direct manipulation interfaces
  enable users to feel that they are directly
  controlling the digital objects

29
Core principles of DM

• Continuous representation of objects and actions
  of interest
• Physical actions and button pressing instead of
  issuing commands with complex syntax
• Rapid reversible actions with immediate feedback
  on object of interest

30
Why are DM interfaces so enjoyable?

• Novices can learn the basic functionality quickly
• Experienced users can work extremely rapidly to
  carry out a wide range of tasks, even defining
  new functions
• Intermittent users can retain operational
  concepts over time
• Error messages rarely needed
• Users can immediately see if their actions are
  furthering their goals and if not do something
  else
• Users experience less anxiety
• Users gain confidence and mastery and feel in
  control

31
What are the disadvantages with DM?

• Some people take the metaphor of direct
  manipulation too literally
• Not all tasks can be described by objects and not
  all actions can be done directly
• Some tasks are better achieved through delegating
  rather than manipulating
• e.g., spell checking
• Moving a mouse around the screen can be slower
  than pressing function keys to do same actions

32
Exploring

• Involves users moving through virtual or physical
  environments
• Examples include
• 3D desktop virtual worlds where people navigate
  using mouse around different parts to socialize
  (e.g., Second Life)
• CAVEs where users navigate by moving whole body,
  arms, and head
• physical context aware worlds, embedded with
  sensors, that present digital information to
  users at appropriate places and times

33
A virtual world
34
A CAVE
35
Theories, models and frameworks

• Are used to inform and inspire design
• A theory is a well-substantiated explanation of
  some aspect of a phenomenon
• A model is a simplification of some aspect of
  humancomputer interaction intended to make it
  easier for designers to predict and evaluate
  alternative designs
• A framework is a set of interrelated concepts
  and/or a set of specific questions

36
Main differences

• Theories tend to be comprehensive, explaining
  humancomputer interactions
• Models tend to simplify some aspect of
  humancomputer interaction
• Frameworks tend to be prescriptive, providing
  designers with concepts, questions, and
  principles to consider

37
Summary points

• Need to have a good understanding of the problem
  space
• specifying what it is you are doing, why, and how
  it will support users in the way intended
• A conceptual model is a high-level description of
  a product
• what users can do with it and the concepts they
  need to understand how to interact with it
• Decisions about conceptual design should be made
  before commencing any physical design
• Interface metaphors are commonly used as part of
  a conceptual model

38
Summary points

• Interaction types (e.g., conversing, instructing)
  provide a way of thinking about how best to
  support the activities users will be doing when
  using a product or service
• Theories, models, and frameworks provide another
  way of framing and informing design and research