Everyday machines are remodeled to add
more features.
Designer’s responsibility to present these
features to the user.
An interface
is the way in which
the machine is presented
to the human.
To understand humans, and develop human-
centric designs.
To develop a keen eye to observe faults, and
ideas to fix them.
To identify good designs from bad designs.
Machine: Anything that reduces human
effort.
Interface: The part of the machine that
can be seen, heard, touched by
the user.
Machines have evolved along with the needs of
humans. Their interfaces have evolved over
years of trial-and-error experiments.
Evolution of Axe’s
interfaces from
Stone-Age to
now.
Presentation of data to the user is the interface -
Units of measurement, shape of pointer, color etc.
User can see the consequence of his action
instantly
Earlier providing functionality itself was a
challenge. Today achieving user experience
is.
Size of display is the biggest challenge for a
UI designer of today.
Traditional input / output methods are not
sufficient here
Input is acquired directly from the
environment, and so is the output given.
Virtual world coming into our reality – 3D
holograms, smart glasses, projectors, etc.
Hardware: Decides the display size and
computing powers.
Software: Chosen from a wide range,
depending on the user
requirement, and base
hardware.
Operating Environment:
User Interface:
psycho = mind; pathos = suffering /
disease; logy = study
Psychopathology: The study of mental illness
Psychopathology of everyday things: How the
design of our everyday things can make us
crazy.
PUSH or PULL?
Interesting designs!
But usability?
New TV?
New Remote!
Motto: Design should not be to make humans
adapt to the product. Instead to build
products that can adapt to the humans.
How to achieve it?
◦ Know your user
◦ Understand the needs of your user
◦ Understand the mental model of your user
◦ Design for your user
Feedback – perceive the effect of every action
Constraints – perform only legitimate actions
Affordances – physical appearance explains
the action
Power of observation – struggle and mistakes
made is the gap between mental model and
the product design.
1. Affordances
The visual clues that lead the user to
understand the functionality of the object.
Appearance tells you the function of the lid.
2. Signifiers
A physical form of showing the functionality to
the user, e.g., sound, a printed word, an image.
3. Perceived affordances
What the user understands by the appearance,
not the intended design.
Press this Enter, not that!
4. Mapping
Map actions to consequences
Consequences must be predictable
5. Feedback
A response from the system for every action, an
acknowledgement, or reaction.
Good mapping creates a good feedback system.
6. Conceptual Models
The mental image of the product in the user.
“I think the system does this” is different from
what the system actually does.
Design model is the mental image of the
developer, not the user.
Smaller the gap in mental model and design
model, better is the user experience.
Executive: How may I help you?
Customer: The coffee cup holder of my PC
broke this morning, and I’m still in warranty.
Executive: I’m sorry I do not understand. Was
this cup holder given to you as a compliment
with our computer?
Customer: No. It is inside your computer. I
press this button, and it pops out.
Executive: But we do not have any computers
that come with cup holders. Is there anything
written on this button?
Customer: Yes. HD DVD
The affordances induce a thought of action.
Signifiers affirm that thought.
Mapping his action to a consequence
provides a feedback.
Good feedback encourages learning.
Repeated learning creates a mental model
about the system for the user.
How do people do things?
◦ Self blame: “I don’t know to use this thing”
◦ Seek easy help: ask friends “do you to know use
this?”
◦ Seek official help: google, user manual, customer
care
◦ Compare: “wasn’t this easy on my old device!”
◦ Criticize: After 10 other people have given a bad
review, say “such a pathetic product”.
1. Forming the goal
Execution
1. Forming the intention (plan)
2. Specifying an action (specify)
3. Executing the action (perform)
Evaluation
1. Perceiving the state of the world (perceive)
2. Interpreting the state of the world (reflect)
3. Evaluating the outcome (compare)
1. I want to kill my boredom (goal)
2. Movie seems to be a good idea (plan)
3. Check for the nearest cinema and show time
(specify)
4. Purchase a ticket and go sit in the movie hall.
(perform)
5. You watch the audio visual effects of the movie
(perceive)
6. You interpret the effects to your understanding
(reflect)
7. After the movie, you say to yourself “that was a
good time pass” (compare)
1. This nail has to hold these two blocks
together (goal)
2. This location seems perfect (plan)
3. Hold the nail at that point (specify)
4. Start hammering it (perform)
5. I can see the hammer striking the nail, and
hear the sound (perceive)
6. This nail seems to be going in straight
(reflect)
7. At the end, I move the blocks to check if the
nail has fastened them together (compare)
The gap between what we wanted to do, and
what we have done.
Gulf of execution: The distance between the
options available, and the user’s goal is the
gulf of execution.
Gulf of evaluation: The amount of effort a
person has to put to interpret the options
available on the system and determine if they
will match his intentions
1. Visceral level
◦ Most immediate level of processing
◦ Look and feel of the product
◦ Aesthetically pleasing appearance – good, else
bad product.
◦ Accept or reject a product, biased by its
appearance.
2. Behavioral level
◦ Emotional brain is in control
◦ Annoyed or frustrated with complex systems
3. Reflective level
◦ The last level of processing
◦ Analysis or reflection of all our experiences
◦ Share experiences from past, develop knowledge
(and prejudices)
◦ Long term memory
How do I work Goal What
this? happened?
Plan Reflective Compare
Specify Behavioral Reflect
Perform Visceral Perceive
What can I Is this what I
do? Product want?
Write down the seven stages of action, along
with the level of processing at each stage for:
1. You have a headache, so you made tea and
drank.
2. A light bulb is faulty, so you changed it with
a new one.
3. You want to be rich, so you changed your
job.
4. You feel hot, so you switched on the fan.