Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
How to Design the Fun Out of
Things
Brock R. Dubbels PhD
McMaster University
REACH ME
dubbels@mcmaster.ca
www.vgalt.com
Twit: brockdubbels
USER EXPERIENCE
It’s a thing
• The lack of attention to user inputs is one of
the most important reasons why many
software projects were unsuccessful.
...
• In a survey of 215 managers, data suggests
that the percentage of software projects that
exceed their budgets is higher ...
• The average software development project is
187% over budget and 222% behind schedule
and implements only 61% of the spe...
• Badly designed software is costing businesses
millions of dollars annually because
– it’s difficult to use,
– requires e...
• “25% of software development efforts fail
outright. Another 60% produce a sub-standard
product. In what other industry w...
INTERFACE FAILURE?
What is the real cost of
The USS Vincennes
Case 1
Evil tip: make sure to create multiple controls for simple controls
The Challenger
Some of our most complex ships can now be run by very few people
The Dancing Bear
Door of opportunity
WHAT CAN WE DO?
Understand the experience of the user.
You are not your user
OBJECTIVE
This talk will provide process and method, along
with simple, accessible ideas to create a UX
Mindset to guide a...
The Wheel of Evil
• Characterizes course of
evolution of an interaction
design
• Template a skeleton of
development activi...
Create Interaction
Design concepts
Realize design
alternatives
Verify and refine
Interaction design
Understand user
work a...
CONTEXTUAL INQUIRY
Customers, clients,
users
Raw work activity data
(transcripts / notes in user
voice)
Knowledge
in the w...
The Portolan Map
As a methodological approach, cognitive ethnography assumes that
cognition is distributed through rules, ...
What we usually get What we really need
SIMULATION
What if the activity has not been softwared?
Imitation
• Learners observe and copy
each step of a behavior and
imitate.
– Recipe /protocol is
standardized and repeated...
Model for play
Dubbels (2015)
Evil Tower
• How to do contextual analysis
• Identify work roles, user classes
• Build initial flow model
• Synthesize wor...
29
Work Activity Note:
A single data point
Concept, topic, or issue
from raw data
Simple, declarative
succinct—
user’s per...
Sketch initial flow model
• Add arcs indicating flow
– Label with what flows (e.g., order information)
– Include flow outs...
31
Models:
• Flow Model
– Communication and coordination necessary to perform task
• Social / Cultural Model
– Constraints...
Flow Model
Social Model
Physical model
WAADtastic
36
Flow Model
• Communication and coordination necessary to perform tasks
– Work flow
– Who talks to whom? Who gives what ...
37
Flow Model structure
• Circles = people or groups by role
– Maybe add icons
• Boxes = things (artifacts), places, files...
38
Flow Model components
• General
– How do job responsibilities get assigned to people?
– How do they get help?
– How do ...
39
Flow
Model
Example
(CDW)
Flow Model Example (SSC)
• By Hartson & Pyla
from textbook
40
41
Social Model
• Beyer & Holtzblatt call this “Cultural Model”
• Culture of organization, family, community defines expec...
42
Social Model Structure
• Ovals for “Influencers”: individuals or groups, internal or external
• Overlap of ovals shows ...
43
Social Model Contents
• What to put into cultural model for appliances:
– Context of use: when used, other people aroun...
Social Model Example (CDW)
44
- Want to get right unit (0:28)
- Reliability is important
(0:42)
- Good prices are importan...
Social Model Example (SSC)
• From Hartson-Pyla textbook
45
46
Artifact Model
• Artifacts: What people create, modify and use as part of tasks
• Reveal traces of people’s work practi...
47
Artifact Model
Examples (CCW)
Inconsistent
placement of
“Add to Cart”
buttons
(1:52, 6:23)
Confusing label
(07:22)
Sear...
48
Physical Model
• Way the physical environment affects tasks
– E.g, placement of items on a desk
– Proximity of printers...
49
Components of Physical Model
• Places in which work occurs
• Physical structures which limit or define the space
• Usag...
50
Physical
Model,
example
51
Beyer&Holtzblatt’s Sequence Model
• Similar to Hartson&Pyla’s “Step-by-Step Task Interaction Model”
• Steps taken to co...
52
Sequence Model Components
• Can choose level of detail depending on focus (what investigating)
– E.g., for writing a le...
53
Sequence
Model
example
Hartson&Pyla’s
Task Structure Models
• Their replacement for Sequence Model
• Tasks that need to be supported by the syste...
Hartson&Pyla’s
Hierarchical Task Inventory
• Hierarchical Task Inventory (HTI) shows tasks and subtasks
– Doing a subtask ...
56
Creating Models
• Create models generalizing over all
interviewees
– “Consolidated” models
– Key Idea: Induce generaliz...
57
What To Do With Models
• User data drives innovation
– Solve problems (breakdowns) identified in models
– Grounded brai...
• Contextual inquiry and analysis do not produce direct requirements
• Requirements are first span of bridge between analy...
Contact me:
dubbels@mcmaster.ca
www.vgAlt.com
Twit: brockdubbels
How to Design the Fun Out of Things with UX -- Minnebar10 2015
How to Design the Fun Out of Things with UX -- Minnebar10 2015
How to Design the Fun Out of Things with UX -- Minnebar10 2015
Upcoming SlideShare
Loading in …5
×

How to Design the Fun Out of Things with UX -- Minnebar10 2015

805 views

Published on

There is nothing more wondrous in software than a dancing bear. Well, maybe an evil dancing bear. In this workshop, learn to express your schadenfreude through the design of software. Learn the glorious irony in the creation of pain stations: a paradise lost complete with repetitive treadmills of grinding.
Alternatively, if you enjoy babygoats on trampolines and other "happy things, this session will provide a model for learn to design invoke play, and sustain it through interaction and feedback, and if you are evil, then take it away. We learn three aspects of discount design methods as simplified user testing, narrowed prototypes, and heuristic flow models for delivering software for impact and persuasion.
Create live action simulation, with insights on the difference between imitation and emulation, and when they are most useful. Use ethnographic methods for conducting contextual analysis, learn about data-informed models; create documentation like procedural workflows and hierarchical flow charts for the creation of your very own WAAD (work activity affinity diagram) fro creating needs, requirements and design

Published in: Design
  • Be the first to comment

  • Be the first to like this

How to Design the Fun Out of Things with UX -- Minnebar10 2015

  1. 1. How to Design the Fun Out of Things Brock R. Dubbels PhD McMaster University
  2. 2. REACH ME dubbels@mcmaster.ca www.vgalt.com Twit: brockdubbels
  3. 3. USER EXPERIENCE It’s a thing
  4. 4. • The lack of attention to user inputs is one of the most important reasons why many software projects were unsuccessful. • This translated to costing corporations $80 billion a year. – (Cobb, 1995; The Standish Group, 1994, 2001)
  5. 5. • In a survey of 215 managers, data suggests that the percentage of software projects that exceed their budgets is higher than 60% – (Lederer & Prasad, 1992).
  6. 6. • The average software development project is 187% over budget and 222% behind schedule and implements only 61% of the specified features. – May (1998)
  7. 7. • Badly designed software is costing businesses millions of dollars annually because – it’s difficult to use, – requires extensive training and support, – and is so frustrating that many end users underutilize applications. • Usability issues can add as much as 50% to the total cost of software ownership. – (Thibodeau, 2005)
  8. 8. • “25% of software development efforts fail outright. Another 60% produce a sub-standard product. In what other industry would we tolerate such inefficiency?” – Kwong, Healton, and Lancaster (1998)
  9. 9. INTERFACE FAILURE? What is the real cost of
  10. 10. The USS Vincennes Case 1
  11. 11. Evil tip: make sure to create multiple controls for simple controls
  12. 12. The Challenger Some of our most complex ships can now be run by very few people
  13. 13. The Dancing Bear
  14. 14. Door of opportunity
  15. 15. WHAT CAN WE DO? Understand the experience of the user. You are not your user
  16. 16. OBJECTIVE This talk will provide process and method, along with simple, accessible ideas to create a UX Mindset to guide and maintain services and development. • Contextual Inquiry • Procedural workflow • Hierarchical flow charts • Work Activity Affinity Diagram • Needs Requirements . . . . . . . And yes, maybe there will be some baby goats on trampolines.
  17. 17. The Wheel of Evil • Characterizes course of evolution of an interaction design • Template a skeleton of development activities that must be instantiated within each project • Based on project resources, goals Create Interaction Design concepts Realize design alternatives Verify and refine Interaction design Understand user work and needs Design Prototype Evaluate Analyze
  18. 18. Create Interaction Design concepts Realize design alternatives Verify and refine Interaction design Understand user work and needs Design Prototype Evaluate Analyze Design-informing models User needs & Requirements Contextual Analysis Contextual Inquiry Evil tip: start programing before you have complete needs/ requirements analysis
  19. 19. CONTEXTUAL INQUIRY Customers, clients, users Raw work activity data (transcripts / notes in user voice) Knowledge in the world Knowledge in the head Observation Interviewing
  20. 20. The Portolan Map As a methodological approach, cognitive ethnography assumes that cognition is distributed through rules, roles, language, relationships, and coordinated activities and can be embodied in artifacts, groups, and objects. • Dubbels (2008)
  21. 21. What we usually get What we really need
  22. 22. SIMULATION What if the activity has not been softwared?
  23. 23. Imitation • Learners observe and copy each step of a behavior and imitate. – Recipe /protocol is standardized and repeated – Minimal costs and many benefits – Diegetic Emulation • Learners observe behaviors and strategies performed by others, but then recombine elements of these behaviors into novel variations – New insight and innovation are produced – Minimal costs and many benefits – Mimetic Simulation Dubbels (2015)
  24. 24. Model for play Dubbels (2015)
  25. 25. Evil Tower • How to do contextual analysis • Identify work roles, user classes • Build initial flow model • Synthesize work activity notes • Consolidate data • Build work activity affinity diagram (WAAD) from work activity notes • Communicate results to team via walkthroughs
  26. 26. 29 Work Activity Note: A single data point Concept, topic, or issue from raw data Simple, declarative succinct— user’s perspective User researchers: review & discuss raw work activity data Insights into work domain Key work roles Flow model Design ideas Activity notes (user’s voice) Notes about missing data Break into small groups to brainstorm/analyze work activity notes Updated flow model More work activity notes Other artifacts updated Metaphors: domain vocabulary and shared conventions Goals, intentions, activities, tasks, actions Group: share, review, discuss, summarize Domain artifacts Design insights Missing data or gaps Work Activity Affinity Diagram (WAAD) : hierarchical technique for organizing and grouping issues and insights Simple, declarative succinct— user’s perspective
  27. 27. Sketch initial flow model • Add arcs indicating flow – Label with what flows (e.g., order information) – Include flow outside system and label with flow channel (e.g., phone, email)
  28. 28. 31 Models: • Flow Model – Communication and coordination necessary to perform task • Social / Cultural Model – Constraints on work due to policy, culture, or values • Artifact Model – Physical things used and created • Physical Model – Layout of work environment as it affects the work. • Sequence / Task Model – Detailed work steps – Sequence in Beyer & Holtzblatt, but not in Hartson & Pyla – They use “Task Models” instead
  29. 29. Flow Model
  30. 30. Social Model
  31. 31. Physical model
  32. 32. WAADtastic
  33. 33. 36 Flow Model • Communication and coordination necessary to perform tasks – Work flow – Who talks to whom? Who gives what to whom? • Key roles of individuals or groups • Key responsibilities of that person with respect to the tasks • Flow of communication and artifacts, shown as arrows • Artifacts passed around • Actions along the way • Places that things or people go • Breakdowns
  34. 34. 37 Flow Model structure • Circles = people or groups by role – Maybe add icons • Boxes = things (artifacts), places, files, etc. • Arrows = flow • Red lightening bolts = breakdowns • Times refer to time codes in video – Could also refer to lines of a transcript – For homework, approximate times are OK – “(A)” = Assumption = interpretation • Note: not for team-member's opinions about the UI • Instead (A) is for assumptions about what user did
  35. 35. 38 Flow Model components • General – How do job responsibilities get assigned to people? – How do they get help? – How do new tasks get assigned, and how are they carried out? – Coordination: where did each artifact come from and where does it go? • Problems with coordination: forgetting, timing, steps – Creates the “bird’s eye view” of organizational structure • Web – NOT flow chart of pages visited – How information and command flow among the site(s)
  36. 36. 39 Flow Model Example (CDW)
  37. 37. Flow Model Example (SSC) • By Hartson & Pyla from textbook 40
  38. 38. 41 Social Model • Beyer & Holtzblatt call this “Cultural Model” • Culture of organization, family, community defines expectations, desires, policies, values and approach • “Culture is as invisible as water to a fish” – Pervasive, inescapable; yet invisible and intangible • Types of influences: – Formal and informal policies – Power of individuals and groups over each other – Values of company or team – Work domain constraints – Group’s sense of identity – People’s emotions about what they do – The style, values and preferences of individuals or teams • More examples of what goes on Cultural diagram: – When acceptable to use a recording device – What friends might think
  39. 39. 42 Social Model Structure • Ovals for “Influencers”: individuals or groups, internal or external • Overlap of ovals shows groups and sub-groups – Can be pervasive (big oval) – Not organization chart – only groups relevant to influences • Thought bubbles for feelings/concerns that they actually expressed • Arrows for direction of influence – Labels for samples of dialog showing type of influence and attitudes • Worded as commands – Also show “pushback” – influence in other direction • Breakdowns – In relationships among people – No need to repeat previously shown problems • NOTE: Not allowed to make stuff up! – Just what you actually have data to support!
  40. 40. 43 Social Model Contents • What to put into cultural model for appliances: – Context of use: when used, other people around, whether OK to record other people, what it looks like – Feelings: proud to own it, embarrassed – Influences: why buy one vs. another, qualities desired • But need data to support all claims – From initial interview questions or other evidence • Can’t just make stuff up!
  41. 41. Social Model Example (CDW) 44 - Want to get right unit (0:28) - Reliability is important (0:42) - Good prices are important (0:46) User Secretary CDW/CDWG Students Computing Facilities Handle my small purchases (0:25) Orders wrong item (A) I will make my own purchases when I want a specific item (0:28) Handle my large purchases (0:20) Takes too long to make a purchase (A) Buy us the equipment we need (0:09) Provide me with reliable service and good prices (0:43)
  42. 42. Social Model Example (SSC) • From Hartson-Pyla textbook 45
  43. 43. 46 Artifact Model • Artifacts: What people create, modify and use as part of tasks • Reveal traces of people’s work practices • Examples: – Handwritten notes and signatures on hardcopy project plans -> information flow and approval – Fancy formatting on spreadsheet -> looks are important – Screen shots showing problematic features • Model = drawing, photograph or copy of real artifact • Annotate with observations
  44. 44. 47 Artifact Model Examples (CCW) Inconsistent placement of “Add to Cart” buttons (1:52, 6:23) Confusing label (07:22) Search results are too long, and categories labels should start with differentiating word (1:46)
  45. 45. 48 Physical Model • Way the physical environment affects tasks – E.g, placement of items on a desk – Proximity of printers – Can’t hold a device with a keyboard while standing up • In presentation example, where people are and layout of environment • Note: Physical model not always relevant or needed – Seems less important for web, unless mobile • Not required for homework 1, but please do one if environment affects your system
  46. 46. 49 Components of Physical Model • Places in which work occurs • Physical structures which limit or define the space • Usage and movement within the space • Hardware and other Artifacts used • Layout of tools and artifacts • Positions of people within environment • Breakdowns due to physical environment
  47. 47. 50 Physical Model, example
  48. 48. 51 Beyer&Holtzblatt’s Sequence Model • Similar to Hartson&Pyla’s “Step-by-Step Task Interaction Model” • Steps taken to complete a task • Triggers that cause the step to happen – E.g., at a particular time; when something else happens • Intent is key to understanding the steps – Also called the goal – Why each step is performed, and why in that order • Arrows to show order of the steps – Can have loops • Breakdowns in communication or coordination • (Note: this model not in homeworks or exam)
  49. 49. 52 Sequence Model Components • Can choose level of detail depending on focus (what investigating) – E.g., for writing a letter: • High-level (functional level): Find most recent letter written to same person, open it, delete date, replace with new date, delete contents, type new contents, … • Low level (user interface level): Switch windows explorer to details view, Sort files by date, double-click on top item, check “To:” to see if correct person, click and drag across date field, … • Notice hesitations and errors – Interrupt and ask why or what expected
  50. 50. 53 Sequence Model example
  51. 51. Hartson&Pyla’s Task Structure Models • Their replacement for Sequence Model • Tasks that need to be supported by the system • You need to decide the important tasks in order to: – Optimize interface & design – what is important? – Design user study tasks – what will participants do? • Understanding tasks can help with better designs because organize UI by task, not by function – What to do, not how – Information needs – what need to know to do task • Unlike sequence models, task models try to capture all requirements, not just the ones in the data 54
  52. 52. Hartson&Pyla’s Hierarchical Task Inventory • Hierarchical Task Inventory (HTI) shows tasks and subtasks – Doing a subtask is part of doing the parent task 55
  53. 53. 56 Creating Models • Create models generalizing over all interviewees – “Consolidated” models – Key Idea: Induce generalizations from concrete data • Don’t rely on intuition alone • Don’t deduce from logical abstractions • Example: – Logic says system manager will diagnose the reason behind a system failure. Actual practice: System manager tries standard fixes first (like reboot) & diagnoses only if necessary • Main goal: Deduce the intent
  54. 54. 57 What To Do With Models • User data drives innovation – Solve problems (breakdowns) identified in models – Grounded brainstorming • Flow model – Eliminate flows, roles, redundant data entry • Social / Cultural model – Increase communication, reinforce positive values • Artifact model: – Guide requirements, metaphors, remove screen problems • Physical model: – Depend only on what is available, reduce motion, improve flow of artifacts • Sequence model: – Eliminate, automate steps
  55. 55. • Contextual inquiry and analysis do not produce direct requirements • Requirements are first span of bridge between analysis and design 58 BRIDGE OVER THE RIVER OF WOE Contextual inquiry & analysis Design R The River of Woe, without a paddle The road from analysis The road to synthesis Requirements extraction R Design-informing model extraction
  56. 56. Contact me: dubbels@mcmaster.ca www.vgAlt.com Twit: brockdubbels

×