Module-2.

1
Module-2 Syllabus
• Interactive Design basics – process – scenarios – navigation – screen
design – Iteration and prototyping.
• HCI in software process – software life cycle – usability engineering –
Prototyping in practice – design rationale.
• Design rules – principles, standards, guidelines, rules.
• Evaluation Techniques
• Universal Design
Interactive Design Index
• Introduction
• What is design?
Golden rule of design
To err is human
Central message the user
• Process of Design
• User Focus
• Scenarios
Interactive Design Introduction &
Objective
• HCI involves theoretical study and design of systems and interpret the
way people interact with technology
• Interaction design: how an object influences whole pattern of
interaction
• To understand and choose how interaction design is going to affect
the way people work [Easy or difficult]
• Designing interventions: Outcome of interaction design is that we
intervene to change the situation for improvement
Interactive Design basics
• What is design?
• “Achieving goals within constraints or conditions”
• Goals
• Constraints
• Tradeoffs
Interactive Design basics
• What is design?
• “Achieving goals within constraints or conditions”
• Goals:
• #What is the purpose of the design we are intending
to produce? Example: Pedometer app-should
contain GPS location tracking?
• Is social Networking important in this context?
• Is the resource(eg. Smart phone has limited battery
capacity then using GPS may drain out the battery)
Interactive Design basics
• What is design?
• “Achieving goals within constraints or conditions”
• Goals:
• #Who are the target users? If they are going to form
a social network with the app
• #On which purpose they will be using it? Actual
measurement (then precision is important) or demo
• Constraints:
• Tradeoffs:
Interactive Design basics
• What is design?
• “Achieving goals within constraints or conditions”
• Goals:
• Constraints:
• Materials used : open source or commercial
• Cost of development (free or licensed),
• Standards maintained, copyright adopted
• Health and safety issues
• Time or deadline to meet to develop the system
• Tradeoffs:
Interactive Design basics
• What is design?
• Tradeoffs: Some goals can be relaxed
• To obtain stable image while in motion use of
headsets have been adopted in VR.

• Tradeoff: a) Headset is not sharable and b) may

impose danger if we use the headset set while
crossing the road
Interactive Design basics
• What is design?
• Tradeoffs: Some goals can be relaxed

• Takeaway point: To accept the contradictions and

choose the appropriate tradeoff which would satisfy
multiple constraints
Interactive Design basics
Social
Golden rule of design
Designs may be different based on
Psychological
application need but they should follow
some standard or rule
Human Error
To follow a design based on interaction
we should study fundamental materials of
human and computer
 Social

Interactive Design basics Psychological

Golden rule of design Human Error

• Design rule for human and computer

interaction:
• To understand Computer
• limitations, capacities, tools, platforms Capacilties
• To understand Human
Limitation
• psychological, social aspects, human error

Tools
Interactive Design
To err is human
Human error /Operator error in operating technical instruments
Sometimes it is caused by misinterpretation/mishandling of the
human interface design
Example: Caregiver takes the blood pressure measurement not in
proper sitting condition. Or takes BP after heavy meals
Interactive Design
To err is human
Need to understand where the human can make error and make
the interface accordingly so that they can work easily even under
stress
Make it easy to work
Proper training, documentation and manuals are needed
Central message the user
Interactive Design
To err is human
Central message the user
• To build the system we need to understand the user
requirements, priorities, capabilities, limitations

• Need to make the system user centric and not designer centric
Interactive Design Requirement
Specification

Process of Design:
Analysis
1. Requirement Prototype
2. Analysis
3. Design
4. Iteration and Prototyping
5. Implementation and Design
Deployment
Implementation
& Deployment
Interactive Design Requirement
Specification

Process of Design:
Analysis
1. Requirement- What is needed? Prototype
• What is currently present- In
what system the user in working
with?
• Find the gap Design

Implementation
& Deployment
Interactive Design Requirement
Specification

Process of Design:
Analysis
1. Requirement- What is needed? Prototype
• Needs ethnography or
“documenting or portraying the
everyday experiences of
individuals by observing and
interviewing them.” Design

Implementation
& Deployment
Interactive Design Requirement
Specification

Process of Design:
Analysis
1. Requirement- What is needed? Prototype
• Tools: Interviewing, Videotaping
people, direct observation or
looking at the documents they
are working with
Design

Implementation
& Deployment
Interactive Design Requirement
Specification

Process of Design:
Analysis
2. Analysis Prototype

To represent the situation and also

to meet required goal
Results of observation and Design
interviewing- we find out the key
points from these
Implementation
& Deployment
Interactive Design Requirement
Specification

Process of Design:
Analysis
3. Design Prototype
We use rules, guidelines and
design principles

Different kinds of users to be Design

considered
Implementation
& Deployment
Interactive Design Requirement
Specification

Process of Design:
3. Design Analysis
Prototype
Use of notation and methods to
record design choices and existing
situations
We may follow simple rule and
notation during design of Design
navigation
Cognitive models, organizational
issues and communication are used Implementation
& Deployment
as inputs
Interactive Design Requirement
Specification

Process of Design:
Analysis
4. Iteration and Prototyping Prototype
Prototype development and
testing the same to get
feedback how the system is
working
To get improvements and Design
debug errors
Implementation
& Deployment
Interactive Design 1.Requirement
Specification

Process of Design:
4.Prototyp 2.Analysis
5. Implementation and Deployment
Coding, documentation and e
manuals before going to main
system
Length of design period(deadline)
and the quality of design 3.Design
40% time spent in Designing and
60% time in testing 5.Implementation
& Deployment
Interactive Design
User Focus
• Need to include collaborative approach of application use.
• Applications are no more for single user use only.
• Focus is given so that multiple users can collaborate
• That means a number of people are affected directly or indirectly by a
system
• They are called stakeholders
 Interactive Design

User Focus
i. What kind of users? Age, are they of same age group or different?
ii. Interests and Dislikes: They may have different interests and
capabilities, skills and emotional responses
iii. Participatory Design: Users participate in the design process which
makes the design effective and praiseworthy
iv. Open end discussion and communication: Need to understand their
priorities.
Interactive Design
User Focus
i. Watch or ethnography: Watching people and learning
their skill and knowledge. Observe their activities to
gather information
ii. Use of cultural probes: small items packed and send
to people. It is used to get information of environment
as seen by the user of the probe.
iii. Data is gathered as the items are used by the people
and returned.
iv. Based on these information we make certain changes
in the interface design
Interactive Design
User Focus
i. Persona: Use of imaginary user who represents the common user-
group.
ii. Persona is created from actual users, observations. After proposing a
solution, team may ask ‘How persona X may react to this solution?’

?
Scenarios
 Interactive Design
Scenarios
• Consists of stories used for design
• Consists of information about interaction
• Simplest design - most flexible and powerful
Interactive Design
Scenarios
• Design of automatic homework remainder App!
• Details of information are put in sketches or simulated screen shots called
storyboards. Graphic representation or visual guide for what happens in
next interaction
• Scenarios are like scripts that find pattern of use.
• Suggests next instruction or goal to take up, to make improvement in
design : Include a voice reminder of Mom
Interactive Design
Scenarios
• Scenarios enforces to think about the design in detail and notice
potential problems before they happen
• Required a detailed description of the situation to get more
information
Interactive Design
Scenarios can be used additionally to
i. Communicate with others: users or designers using examples to get
a clear view
ii. Validate other models: Compare with other models and validate
iii. Express dynamics: Scenarios provide linear one way interaction
details stating the dynamics- what’s happens next after this event.
Interactive Design
Scenarios can be used additionally to
i. Time is linear: Use of simple linear time based scenarios are
effective in producing designs
Interactive Design
Scenarios can be used additionally to
i. Alternatives: Real interactions provide alternative choices taken by
people and system.
ii. Simple (where details cut short) scenario don’t provide the same.
Interactive Design
Scenarios
i. Scenarios are used as resource
ii. Used in design process
iii. Help us to see what is required
iv. Suggests how users will deal with the potential design
v. Checking that proposed implementations will work, and generating
test cases for final evaluation