CSc 238
Human Computer Interface Design
ABOUT FACE
The Essentials of Interaction Design
Cooper, Reimann, Cronin, and Noessel
Questions
If “achieving the user’s goals” drives the design process, won’t the user be satisfied and happy with the product?
If the users are happy, won’t they pay money for the product and spread the word to others?
If you make the user happy, won’t your products be a success?
What happened?
“The absence of design”
Cooper - Introduction
Products that exhibit complex behavior
“Techie” ovens and complex behavior
Buttons for non-cooking related things
“Start, Cancel, Program… Bake, Broil”
Press any button… what happens depends on the state of the oven and the buttons already pushed
Interaction Design – designing the behavior of complex systems.
… design affects behavior (in fact, it defines the behavior)
Design ( Victor Papanek )
The conscious and intuitive effort to improve meaningful order…
Human-oriented design activities:
• Understanding the desires, needs, motivations, and contexts of people using products
• Understanding Business, technical, and domain opportunities, requirements, and constraints
• Using this knowledge as a foundation for plans to create products whose form, content, and behavior are useful, usable, and desirable, as well as
economically viable and technically feasible
Consequences of Poor Product Behavior
Digital products
• Are rude
• Require people to think like computers
• Have sloppy habits
• Require humans to do the heavy lifting
Brief History
• 1970s and 1980s: Xerox PARC
• “Consumers… want good technology”
That is, Technology that has been designed to
provide a compelling and effective user experience.
• Not just interface design… and the arrangement of widgets on the screen.
• Influencing people’s experiences by designing the mechanisms for interacting with a product
(IxDA: Interaction Design Association – www.ixda.org)
User Experience (UX) Design
• Interaction Design focus
– Designing to effect the experience of users – Relating behavior to form and content
• Information architecture focus
– Structure of content
– The way content is provided to users
• Industrial Design & Graphic Design focus
– Form of products and services
– Ensuring that form supports use (requiring attention to behavior and content)
Behavior
Interaction designers
Content
Information architects Copywriters
Animators Sound designers
Form
Industrial designers Graphic designers
Interaction Design and the Product Team
Division of responsibilities:
• Design team
Users’ satisfaction
• Engineering team
Implementation and fabrication
• Marketing team
Convincing customers to purchase product
• Management
Profitability of the product, effecting what others work on
for Interaction Design
• Principles
Ideas about the practice of design
Rules & hints on use of user interface and interaction design idioms
• Patterns
Common ways to address user req’ts & design concerns
• Processes
How to understand & design user req’ts How to apply design principles & patterns
“Goal”
• “Understand how users comprehend and
interact with your digital product, and how to use this knowledge to drive your design”
• No such thing as an objectively good user interface … it depends
Who is the user
What is the user doing
What are the user’s motivations
• One size does not “fit all”
You want good design?
• Understand the people who will interact with your product
• Understand there are no fixed guides to style or interface standards!
Four main steps to designing interactive systems:
1. Researching the domain
2. Understanding users & their req’ts 3. Defining the framework of a solution 4. Filling in the design details
Part I Understanding Goal-Directed Design
CHAPTERS:
1. Goal-Directed Design
2. Implementation Models & Mental Models 3. Beginners, Experts, and Intermediates
4. Understanding Users: Qualitative Research 5. Modeling Users: Personas and Goals
6. The Foundations of Design: Scenarios & Req’ts 7. From Req’ts to Design: The Framework &
Refinement
CSc 238
Human Computer Interface Design
A Design Process for Digital Products
Cooper – Chapter 1
Need - Better Design Methods
• Technologically focused solutions… difficult to use and control.
• Unsatisfied users… products are difficult to use and control.
Design
(viewed as a conscious & intuitive effort to impose meaningful order)
• Understanding users’ desires, needs, motivations, & context.
• Understanding business, technical, and domain opportunities, req’ts, and constraints.
• Using this knowledge to create products whose form, content &
behavior are useful, usable, and desirable, as well as economically viable & technically feasible.
Developer and Marketers
What marketers bring:
• Understanding & quantifying of market opportunities.
• Lists of req’ts based on:
“Chasing the competition”
Managing IT resources with “to do” lists
Making guesses based on market surveys – what people say they will buy.
• However… we know few users can clearly articulate their needs!
• Adding “easy to use” to the list of req’ts doesn’t help.
What we get…
• Products that irritate, reduce productivity, and do not meet user needs.
• Interactions patched on at the end
“lipstick on the pig”
• Digital products are rude!
Where did you hide that file?
Are you sure?
Did you really want to delete that file or did you have some other reason for pressing the Delete key?
Figure 1-2
“Thanks for sharing.
Why didn’t the program notify the library?
What did it want to notify the library about?
Why is it telling us?
And what are we OK-ing?
It is not OK that the program failed!”
“People” – listen up!
Just think as if you are the computer!
MS Word –
User wants to rename a document they are editing:
Close the document, then rename it (or)
Use “Save AS…” with new name and then delete the file with the old name
Save it!
You save a document & then print & then close But… you are asked if you want to “Save it”
Excel has a different approach!
Work interrupted
• Software requires you to “stop” what you are doing.
• How much work are you forced to do in order to manage the operation of software?
What about you?
• Think… discuss and write down some
examples…
Why products are so bad?
1. Misplaced priorities
Focus on functionality, not how it is to be provided
User’s goals are not “front and center” to the design (see Figure 1-2)
2. Ignorance about users
What will make users happy?
How will users use the product?
What will they be using the product to do?
Why choose our product?
2. Conflicting interests
Tradeoff between ease of coding & ease of use
Programmers cannot advocate for the user, the business, and the technology - simultaneously
3. The lack of a process
A repeatable, predictable & analytic process
Transforms understanding of users into products that meet their needs & excite their imaginations
Especially when buyers are not users
Evolution of the Software Development Process
(Figure 1-2)
Developers
Build / Test Ship
Managers Developers
Initiate Build / Test Ship
Managers Developers QA Designers
Initiate Build Test "look & feel" Ship
Mandate Specs Code Product
Managers Designers Developers QA
Initiate Design Build Test Ship
Users Feasibility,
Feedback
Bug
Report User Input
What about Agile?
The “mantra” is to ensure that the customer is an integral part of the team and the development
process.
Intent: Shared design responsibility for solving human interface design problems.
Domain knowledge they have!
Accomplishing their work with an interaction, so it works for them!
Solving the design problem is problematic.
Analogy
Patient goes to the doctor – has horrendous stomach ache.
“It really hurts. I think it’s my appendix. You have to take it out as soon as possible.”
The patient is good at explaining symptoms.
The patient has no skills to make the correct diagnosis.
Now enter the computer
• Allows for limitless behavior
• Alters the nature of the products it touches
• User focus is on the screen, keyboard and mouse… it is this interactive behavior that is important!
• Design requires understanding the user’s relationship with product – before purchase
• How will the user use the product, in what ways, and to what ends?
Evolution of Design
Product development concerns:
1. Desirability 2. Viability
3. Capability
All three must be addressed…
… to achieve user goals via appropriately
designed behaviors
Building successful digital products.
User model
motivations
behaviors
attitudes & aptitudes
Business model
funding model
income/expense projections, etc
Technology model
core technologies
technology components
build vs. buy
Product design
design schedule
form and behavior spec.
Business plan
marketing plan
launch plan
distribution plan
Technology plan
engineering schedule
engineering spec Successful product
is desirable and viable and
buildable Desirability
What do people need?
Viability
What will sustain a business?
Capability What can we
build?
Designers Management Technologies
User effectiveness &
Customer adoption
Sustainable Business
Product Delivery
Overall Product Success
Companies that have struggled to find the balance
Apple
… emphasized desirability but has made many business
blunders. Nevertheless, it is sustained by the loyalty created by its attention to user appearance
Microsoft
… is one of the best run businesses ever, but it has not been able to create highly desirable products. This provides an opening for competition
Novell (now part of )
… emphasized technology and gave little attention to desirability. This made it vulnerable to competition
User’s Goals?
• Are goals the tasks users do?
• Are they the same for all users?
Authors’ example:
Accounting clerk
Processing invoices?
Employer’s goal
Employee goals… but maybe Appearing competent
Keeping engaged in work while doing routine and repetitive tasks
Business Goals – the driver?
• Not necessarily aligned with user’s goals
• Satisfy user’s goals and the Business Goals have a better chance of being achieved
Reminder:
What commercial software does?
Makes users feel stupid
Causes users to make big mistakes
Requires too much effort to operate effectively
Does not provide and engaging or enjoyable experience
The Message
• Goals are not the same as tasks or activities!
• Goals motivate people to perform activities.
• Understand the goals, you understand user expectations & aspirations.
• You need to understand the meaning of the activities to the user.
• Task and activity analysis is needed for
detail… after user goals are understood.
Goal versus tasks and activities?
• Goals change slowly… tied to motivation
• Change in activities & tasks … tied to current technology
• Concentrate only on activities & tasks…
May leave you with a design embedded in the existing technology May meet corporate goals but not the users’
• User goals allow you to use the technology to eliminate irrelevant tasks and transform the users’ work
environment.
Designing to meet goals
Context is important
Good design makes users more effective
Does not make users look or feel stupid
Improves business throughput & ease of use
“Software that enables users to perform their tasks without addressing their goals rarely helps them be truly effective.”
“good design makes users more effective”
Computer Literacy
“Some have it… some don’t
… but it is needed in an information economy”
Really?
“It’s a euphemism for forcing human beings to stretch their thinking to understand the inner workings of application logic…
… rather than having software-enabled products stretch to meet people’s usual ways of thinking.”
Striving toward perfection…
Software has a behavioral face it shows to the world…
that is created by the developer or designer.
What the user sees is the representation of the computer’s executed code.
(the developers code in implementation model)
How the computer “gets the job done” is hidden from the user. (the user interacts with the represented model)
Implementation Mental Model
Model (reflects user's vision)
(reflects the technology)
worse better
Represented Models
DESIGN User interfaces should be based on user
PRINCIPLE mental models rather than implentation models
A Goal-Directed Design Process
• Identifies user req’ts
• Defines a plan for behavior and appearance of products
• Design provides for Product Definition:
Goals of users
Needs of business
Constraints of technology
Problematic Design Process
Research
Performed by market analysts and ethnographers
Design of Form
Performed by graphic / GUI and industrial designers
?
Traditionally, research and design have been separated, with
each activity handled by specialists. Research has, until recently, referred primarily to market research, and design is too often
limited to visual design or skin-deep industrial design. More recently, user research has expanded to include qualitative, ethnographic data. Yet, without including designers in the research process, the connection between research data and design solutions remains tenuous at best.
The Gap
Figure 1-6
What about empathy?
“Direct and extensive exposure to users (that proper user-research entails) immerses
designers in the users’ world, and gets them thinking about users long before they propose solutions.”
“One of the most dangerous practices in product development is isolating designers from the
users because doing so eliminates empathic
knowledge.”
The Goal Directed Design Process Six Phases
Three primary activities close the gap.
A process of modeling that synthesizes research results into design tools, a process of synthesizing and defining requirements from these models, and a process of translating the knowledge captured in the models and requirements into a design framework that
reflects the goals and needs of users, while also addressing business and technical imperatives.
Figure 1-7
Research Modelling Requirements Framework Refinement Support
users and of users and definition of user, definition of of behaviors, development the domain use context business, and design structure form, and needs
technical needs and flow content
Ch.2 Ch.3 Ch.4 Ch.5 Ch.5
Research
• You need to understand the behavior patterns of potential and/or actual users of the product.
• Research informs the creation of personas in the Modeling phase.
• Stakeholder interviews, literature reviews, and
product audits…
Modeling
• Domain models
Information flow and workflow diagrams
• Personas
Detailed, composite user archetypes representing grouping of behaviors, attitudes, goals, and
motivations observed and identified during research
More coming in Chapter 3
Requirements Definition
• Scenario-based – a day-in-the life
• Focus on meeting goals and needs of specific user personas
… not on user’s codable tasks
• Understanding which tasks are truly important and why.
• A balance of user, business, and technical
req’ts.
Framework
• The overall product concept… defining
product’s behavior and visual design, (and physical form, if that fits).
• Uses:
Interaction design principles Interaction design patterns
• Interaction framework definition
Principles help identify design elements
Principles and patterns guide the development of design sketches and behavior descriptions
Refinement
• Focus on detail and implementation
• Focus on task coherence
• Use walkthroughs and validation scenarios
Storyboarding paths through the interface in high detail
• Form and behavior specification is produced
Development Support
• “Help” resources needed to answer developers’
questions… real-time as they occur.
• The developers should not be left alone to…
Prioritize the work
Make trade-offs to meet deadlines
Adjust design requiring scaled-down design solutions
The detailed look at Goal-Directed Design
ACTIVITY CONCERNS COLLABORATION DELIVERABLES Research Scope
Define project goals & schedule Audit: Review existing work & product
Stakeholder Interviews: Understand product vision & constraints
User interviews & observations:
Understand user needs and behavior
Objectives, timelines, financial constraints, process, milestones
Business & marketing plans, branding strategy, market research, product portfolio plans, competitors, relevant technologies
Product vision, risks, constraints, opportunities, logistics, users
Users, potential users, behaviors, attitudes, aptitudes, motivation, environment, tools, challenges
Meetings
Capabilities & Scoping
Interviews
Stakeholders & users
Check-in Preliminary Research findings
Document Statement of work
Modeling Personas: User & customer archetypes
Other Models: Represent domain factors beyond individual users & customers
Patterns in user & customer behaviors, attitudes, aptitudes, goals, environments, tools, challenges
Workflows among multiple people, environments, artifacts
Check-in Personas
Req’ts Definition
Context Scenarios: Tell stories about ideal user experiences
Req’ts: Describe necessary capabilities of the product
How the product fits into the persona’s life &
environment, and how it helps them achieve their goals
Functional & data needs, user mental models, design imperatives, product vision, business req’ts, technology
Check-in
Scenarios & Req’ts
Presentation User & domain Analysis
Document Uses & Domain Analysis Design
Framework
Elements: Define manifestations of information & functionality
Framework: Design overall structure of user experience
Key path & Validation Scenarios: Describe how the persons interact with the product
Information, functions, mechanisms, actions, domain object models
Object relationships, conceptual groupings, navigation sequencing, principles & patterns, flow, sketches, storyboards
How the design fits into an ideal sequence of user behaviors, & accommodates a variety of likely conditions
Check-in
Design Framework
Presentation Design Vision Design
Refinement
Detailed Design: Refine & specify details Appearance, idioms, interface widgets, behavior, information, visualization, brand, experience, language, storyboards
Check-ins Design Refinement
Document Form & Behavior Specification Design
Support
Design modification: Accommodate new constraints & timeline
Maintaining conceptual integrity of the design under changing technology constraints
Collaborative Design
Revision Form and Behavior Spec.
Goals, not features
• Developers build software function by function.
• A list of features is one way to explain the product’s value to customers.
• But what do you know about how effective and happy users will be using the software?
• What’s your job?
Orchestrating technological capability to serve human needs and goals.
“Too often the features … are a patchwork of nifty technological innovations structured around marketing req’ts or the
organization of the development team…”
Where do we attend to the overall user experience?
The important questions!
• Who are the users?
• What are my users trying to accomplish?
• How do my users think about what they’re trying to accomplish?
• What kind of experiences do my users find appealing and rewarding?
• How should my product behave?
• What form should my product take?
• How will users interact with my product?
• How can my product's functions be most effectively organized?
• How will my product introduce itself to first-time users?
.. more questions
• How can my product put an understandable,
appealing, and controllable face on technology?
• how can my product deal with problems that users encounter?
• How will my product help infrequent and
inexperienced users understand how to accomplish their goals?
• How can my product provided sufficient depth and power for expert users?
“The remainder of this book is dedicated to answering these questions.”
