Esta presentación del curso de Interacción Persona-Ordenador incide en la necesidad de conocer los principales aspectos que nos caracterizan como personas para ser capaces de diseñar interfaces de usuario con altas probabilidade de aumentar la experiencia de los usuarios que las utilicen.
Micro-Scholarship, What it is, How can it help me.pdf
2. El Factor Humano
1. EL FACTOR HUMANO
Grau en Enginyeria Informàtica
Interacció Persona-Ordinador
Toni Granollers
El Curso de Interacción Persona-Ordenador ha sido realizado
por Toni Granollers bajo la licencia Creative Commons
Reconocimiento-NoComercial 4.0 Internacional License.
2. Presentación
• En el pasado los diseñadores de sistemas no daban
ninguna importancia al elemento humano
• Sabemos por experiencia que el uso de sistemas son
muchas veces difíciles, complicados y frustrantes
• Es importante conocer los aspectos humanos
de la interacción para mejorarla
El Factor Humano - GEInformàtica, IPO 2 / 110
3. Objetivos
• Conocer los tipos de percepciones más relevantes desde el
punto de vista interactivo que tiene la persona
• Conocer como se ha realizado el proceso de comprensión y
los modelos de memoria
• Comprender que el modelo de memoria condiciona el
diseño de la interfaz
• Ver la importancia que tiene la limitación de la memoria de
trabajo
El Factor Humano - GEInformàtica, IPO 3 / 110
4. The Psychologist’s View of UX Design
1. People Don't Want to Work or Think More Than They
Have To
2. People Have Limitations
3. People Make Mistakes
4. Human Memory Is Complicated
5. People are Social
6. Attention (is a key to designing an engaging UI)
7. People Crave Information
8. Unconscious Processing
9. People Create Mental Models
10. Visual System
http://uxmag.com/articles/the-
psychologists-view-of-ux-
design?goback=%2Egde_72842_member_
213335291
El Factor Humano - GEInformàtica, IPO 4 / 110
7. Un modelo simple del procesamiento de
información
INPUT
percepciones
OUTPUT
Motor/comportamiento
El Factor Humano - GEInformàtica, IPO 7 / 110
8. Psicología cognitiva
• Disciplina científica que estudia el sistema de
procesamiento de la información en la mente humana
• Cognición: Adquisición, mantenimiento y uso del conocimiento
repetición
El Factor Humano - GEInformàtica, IPO 8 / 110
12. Modelo procesamiento humano
• A muy alto nivel, podemos describir una persona como un
procesador de información del cual se distinguen:
• Dos partes:
1. El conjunto de memorias y procesadores
2. El conjunto de principios de operación
• Tres subsistemas con mutua interacción:
1. El sistema perceptivo, tiene sensores y memorias buffer; transforma las entradas
en códigos simbólicos que son almacenados
2. El sistema cognitivo, que recibe los códigos simbólicos del sistema perceptivo,
situándolos en la memoria de trabajo, y utiliza esta, y la memoria a largo plazo para
tomar decisiones
3. El sistema motor, que ejecuta las respuestas
• Disponemos de
• un procesador perceptivo,
• un procesador cognitivo, y
• un procesador motor
• Las memorias se describen a partir de
• la capacidad de almacenamiento
• el tiempo de decaída (de un concepto almacenado)
• el tipo principal de código (visual, físico, ...)
Que según las tareas trabajan
secuencialmente, o en paralelo
El Factor Humano - GEInformàtica, IPO 12 / 110
14. Sistemas sensoriales
• En la transmisión de información del ordenador a la
persona hemos de considerar los sistemas
sensoriales humanos
Entrada
• Percepción a través de los
sentidos
• Vista
• Oído
• Tacto
• Gusto
• Olfato
Salida
• Acciones a través de los
actuadores (efectores)
• Extremidades
• Miembros
• Dedos
• Ojos
• Cabeza
• Sistema vocal
El Factor Humano - GEInformàtica, IPO 14 / 110
15. Sensación: Los canales de entrada
• El conocimiento del mundo lo construimos con la vista, oído, tacto,
dolor, sensación de movimientos corporales
• La percepción comienza en las células receptoras que son
sensibles a uno u otro tipo de estímulos
• Las vías sensoriales conectan al receptor periférico con las
estructuras centrales del procesamiento
• El cerebro no registra el mundo externo simplemente como una
fotografía tridimensional sino que construye una representación
interna después de analizar sus componentes
El Factor Humano - GEInformàtica, IPO 15 / 110
16. Los canales de entrada. Sistema visual
• Ver es obtener información a partir de la energía
electromagnética que llega a los ojos
• De la estructura espacial del mundo que nos rodea y los distintos
aspectos que pueden distinguirse en él
• La luz es la porción del espectro electromagnético que
puede ser detectado por el sistema visual humano
El Factor Humano - GEInformàtica, IPO 16 / 110
17. El sistema visual y la IPO
• Sensación
• Es la captación del estímulo físico y su transformación en
impulso nervioso
• Percepción
• Asignación de significado al estímulo que ha entrado en nuestro
sistema cognitivo
• En el nivel sensorio visual hablaremos de color e
iluminación
• Las personas trabajamos en un ambiente luminoso que
influye en como se ve la información presentada en la
interfaz
El Factor Humano - GEInformàtica, IPO 17 / 110
18. El sistema visual
• Our visual system is much more sensitive to
differences in color and brightness (to contrasting edges)
than to absolute brightness levels
They are the same exact shade of red but the
different backgrounds make the one on the
left appear darker to our contrast-sensitive
visual system.
El Factor Humano - GEInformàtica, IPO 18 / 110
19. El sistema visual. Limitations
• Three presentation factors affect our ability to distinguish
colors from each other:
• Paleness: The paler (less
saturated) two colors are, the
harder it is to tell them apart.
• Color patch size: The smaller or
thinner objects are, the harder it is
to distinguish their colors.
• Text is often thin, so the exact color
of text is often hard to determine.
• Separation: The more separated
color patches are, the more
difficult it is to distinguish their
colors, especially if the separation
is great enough to require eye
motion between patches.
El Factor Humano - GEInformàtica, IPO 19 / 110
20. El sistema visual. Limitations.
El Factor Humano - GEInformàtica, IPO 20 / 110
21. El sistema visual. Limitations.
• Color-blindness ≠ inability to see colors.
• One or more of the color subtraction channels don’t
function normally, making it difficult to distinguish
certain pairs of colors
• The most common type of
colorblindness is red/green
• Others:
• dark red from black
• blue from purple
• light green from white
http://www.dasplankton.de/ContrastA
El Factor Humano - GEInformàtica, IPO 21 / 110
22. El sistema visual. External factors.
• External factors that influence the abolity to distinguish
colors:
• Variation among color displays
• Grayscale displays
• Display angle
• Ambient illumination
• These external factors are usually out of the software
designer’s control.
• BUT designers should keep in mind and follow some
recommendations (see next slide).
El Factor Humano - GEInformàtica, IPO 22 / 110
23. El sistema visual. Recomendations
(guidelines)
• Distinguish colors by
saturation and brightness as
well as hue
• Use distinctive colors
• Avoid color pairs that color-
blind people cannot
distinguish
• Use color redundantly with
other cues
• Color + a symbol better !!
• Separate strong opponent
colors
• Use light colors for the
peripheral information
Pale combination
Dark over dark
Ren over green
Yellow over dark-blue
White over black
Black over orange
El Factor Humano - GEInformàtica, IPO 23 / 110
24. El sistema visual. Recomendations
(guidelines). Example
NO
Bad color
combination
(text against
background)
worsened by
the size of
text.
SI
El Factor Humano - GEInformàtica, IPO 24 / 110
25. El sistema visual. Recomendations
(guidelines). BAD Example
El Factor Humano - GEInformàtica, IPO 25 / 110
26. El sistema visual. Interpretation of colours
• What colours come to mind when you think of
• a Success message?
• doing something wrong?
I actually thought I made
an error somehow (without
reading the message – my
bad) then went back and
repeated the task before I
realized I was being told I
had successfully completed
the task. In ‘warning red‘.
http://spyrestudios.com/the-user-experience-and-psychology-of-colour
El Factor Humano - GEInformàtica, IPO 26 / 110
27. El sistema visual. Interpretation of colours
Twitter uses a range of colours
to communicate different
meanings with regards to
passwords, starting with a red-
ish colour, and progressing to
green to show different levels
of security for your passwords.
Really simple, visual way to
communicate their message.
El Factor Humano - GEInformàtica, IPO 27 / 110
29. El sistema visual. Fovea vs periphery
• The spatial resolution of the human visual field
drops greatly from the center to the edges
• Special consideration when locating feedback
messages in the interfaces
• Ex. Error messages
El Factor Humano - GEInformàtica, IPO 29 / 110
30. El sistema visual. Fovea vs periphery
El Factor Humano - GEInformàtica, IPO 30 / 110
31. El sistema visual. Fovea vs periphery
• Recomendations for making message visible
• Put it where users are looking
• When people click a button or link, designers can
assume users to be looking directly at it (at least for a
few moments afterward).
• Use this predictability to position error messages
near where they expect users to be looking
• Mark the error
• Use an error symbol
• Reserve red color for errors
• In our society, red connotes alert, danger, problem, error, ...
• CARE: Chinese consider red is a auspicious or positive color !!!
El Factor Humano - GEInformàtica, IPO 31 / 110
32. El sistema visual. Fovea vs periphery
• STRONGER METHODS for making message visible
• Use pop-up message in error dialog box
• Use sound
• When a computer beeps, that tells its user something has happened
that requires attention
• Use wiggling or flashing messages briefly when they want to
ensure that users see them
Use all of these “heavy artillery”
methods sparingly, only for critical
messages
El Factor Humano - GEInformàtica, IPO 32 / 110
33. Sistema auditivo
• La audición es crucial para la comunicación humana
• Núcleo de interacciones sociales y transmisión del
conocimiento
• Existen menús auditivos
• IPO
• Estudiar las interfaces auditivas y las multimodales
El Factor Humano - GEInformàtica, IPO 33 / 110
35. S.O. SYNC : Microsoft + Ford
S.O. CarPlay: Apple + Volvo
S.O. Android Auto: Google + multimarca
Use voice commands, steering wheel buttons or
touch screen.
http://mashable.com/2015/03/20/googles-android-auto
El Factor Humano - GEInformàtica, IPO 35 / 110
36. El tacto
• ¿Por qué nos hemos de preocupar?
• Vital en dispositivos TÁCTILES (cómo los móviles)
• Es un canal sensitivo importantísimo en el diseño de sistemas de realidad virtual
• El usuario explora mundos virtuales con las manos
• Clases de receptores
• La piel es nuestro sistema sensorial más grande
• Termoreceptores: Temperatura
• Nocireceptores: Estímulos dolorosos
• Mecanoreceptores: Presión
• Sentidos que detectan acciones del cuerpo
• El Sentido cinescético
• Proporciona información sobre lo que ocurre en la superficie y el interior del cuerpo;
• Incluye sensaciones que provienen de la posición y el movimiento de las partes corporales
• Es un sentido somático (articulaciones y huesos)
• El sentido vestibular
• Proporciona información acerca de la orientación, el movimiento, la aceleración
• Funciones
• Equilibrio
• Mantenimiento de la cabeza en posición erguida
• Ajuste de los movimientos de los ojos para compensar los movimientos de la cabeza
El Factor Humano - GEInformàtica, IPO 36 / 110
37. Dolor
• Dos componentes importantes
• Componente sensorial
• Componente emocional
• Umbral del dolor
• La menor intensidad de estimulación a la cual percibimos dolor
• Tiene un papel constructivo
El Factor Humano - GEInformàtica, IPO 37 / 110
38. Temperatura
• Es posible identificar puntos separados para el frío y el calor en
nuestra piel
• Los umbrales de temperatura están influidos por factores como la
parte del cuerpo, la cantidad de piel expuesta y la velocidad de
cambio de la temperatura
• Con la exposición repetida se produce una adaptación térmica en
la que disminuye la intensidad percibida
• Las personas no localizan bien la temperatura ni la miden con
precisión
El Factor Humano - GEInformàtica, IPO 38 / 110
39. El Olfato
• Realidad virtual
• Posibilidad que ofrecen los olores
para crear mundos virtuales
parecidos a los reales
• Interfaces emocionales
• Tiene conexiones nerviosas
directas con el sistema límbico, el
encargado de procesar las
emociones
• Adaptación
• Si los receptores son expuestos
durante mucho tiempo a un mismo
olor pierden selectivamente la
sensibilidad a ese olor
• Gran variación individual
• En la sensibilidad al olor, lo que
hace que sea difícil diseñar
interfaces olfativas para que sean
usadas universalmente
http://www.google.com/nose
http://www.micro-
scent.net/index.html
Olfactory Interfaces
https://augmentedbody.wordpress.com/2010/11/0
5/olfactory-interfaces
El Factor Humano - GEInformàtica, IPO 39 / 110
40. http://sensoree.com/smell-interfaces
Human Olfactory
Displays and Interfaces:
Odor Sensing and
Presentation
Takamichi Nakamoto
Tokyo Institute of
Technology (Japan)
https://gigaom.com/2013/04/13/how-technology-is-
slowly-developing-its-sense-of-smell
El Factor Humano - GEInformàtica, IPO 40 / 110
41. Perception
• Our perception of the world around us is not a true
depiction of what is actually there. We perceive, to a large
extent, what we expect to perceive.
• Our expectations —and therefore our perceptions— are
biased by three factors:
• the past: our experience
• the present: the current context
• the future: our goals
El Factor Humano - GEInformàtica, IPO 41 / 110
42. Perception
• (from previous examples) When
your perceptual system has
been primed to see building
shapes, you see building
shapes, and the white areas
between the buildings barely
register in your perception.
When your perceptual system
has been primed to see text,
you see text, and the black
areas between the letters barely
register.
• BUT, experience can also bias
other types of perception,
such as sentence
comprehension Multipage dialog box
The “Next” button is perceived to be in a
consistent location, even when it isn’t
Biased by the past
our experience
El Factor Humano - GEInformàtica, IPO 42 / 110
43. Perception
• Users of computer software and Web sites often click buttons or
links without looking carefully at them.
• Their perception of the display is based more on what their past
experience leads them to expect than on what is actually on the
screen.
• This sometimes confounds software designers, who expect users to
see what is on the screen. But that isn’t how perception works
• Ex: previous “Next” & “Back” buttons … many people would not immediately
notice the switch on the last “page”.
• Even after unintentionally going backward a few times, they might continue to
perceive the buttons in their standard locations.
• This is why “place controls consistently” is a common user interface design
guideline.
• Experience tunes us to look for expected features in expected
locations
Biased by the past: our experience
El Factor Humano - GEInformàtica, IPO 43 / 110
44. Perception
• Text Links
• While blue is still the safest link color,
other colors work just as well as long as
the links stand out clearly from the body
text. If you don’t have a particular
reason to prefer another color, we
still recommend blue as the safest
choice.
…..
• The position of links can help you
determine whether or not underlining is
necessary.
• Static items should not have the
same color as hyperlinks.
• Don’t use blue text (or underline text)
for nonclickable items.
• Apply the same treatment consistently
throughout your site.
Biased by the past: our experience
The miscues on this page create confusion. The blue
headings are not clickable. The images are clickable,
but they look like static images. The instructions at
the top of the page tell you what to click on —a sure
sign of design fail.
Beyond Blue Links: Making Clickable Elements
Recognizable, by Hoa Loranger on March 8, 2015
http://goo.gl/79Y4E0
El Factor Humano - GEInformàtica, IPO 44 / 110
45. Perception
• PERCEPTION BIASED BY EXPERIENCE
• Imagine that you own a large insurance company. You are meeting
with a real estate manager, discussing plans for a new campus of
company buildings.
• The campus consists of a row of five buildings, the last two with
T-shaped courtyards providing light for the cafeteria and fitness
center.
• If the real estate manager showed you the map shown next figure,
you would see five black shapes representing the buildings
Biased by the present: the current context
El Factor Humano - GEInformàtica, IPO 45 / 110
46. Perception
• PERCEPTION BIASED BY EXPERIENCE
• Now imagine that you are meeting with an advertising
manager.
• You are discussing a new billboard ad to be placed in
certain markets around the country.
• The advertising manager shows you the same image, but in
this scenario the image is a sketch of the ad, consisting of a
single word.
• In this scenario, you see a word, clearly and unambiguously
Biased by the present: the current context
El Factor Humano - GEInformàtica, IPO 46 / 110
47. Visual Perception
• Visual perception —reading in particular— is not strictly a
bottom-up process. It includes top-down influences too
• bottom-up process: combining basic features such as edges, lines, angles,
curves, and patterns into figures and ultimately into meaningful objects
• Example: the word in which a character appears may affect how we
identify the character
Biased by the past: our experience
El Factor Humano - GEInformàtica, IPO 47 / 110
48. Visual Perception
• Our overall comprehension of a sentence or of a
paragraph can even influence what words we see in it
• Example: the same letter sequence can be read as different words
depending on the meaning of the surrounding paragraph
Fold napkins. Polish silverware. Wash dishes.
French napkins. Polish silverware. German dishes.
Biased by the present: the current context
El Factor Humano - GEInformàtica, IPO 48 / 110
50. Perception
• The biasing of perception by the surrounding context
works between different senses too.
• Perceptions in any of our five senses may affect
simultaneous perceptions in any of our other senses.
• For example:
• What we see can be biased by what we are hearing, and vice versa
• What we feel with our tactile sense can be biased by what we are
hearing, seeing, or smelling
El Factor Humano - GEInformàtica, IPO 50 / 110
51. Perception
• PERCEPTION BIASED BY GOALS
• In addition to being biased by our past
experience and the present context, our
perception is influenced by our goals and
plans for the future
• our goals filter our perceptions
• For example, when navigating through software or a
Web site, seeking information or a specific function,
people don’t read carefully. They scan screens
quickly and superficially for items that seem
related to their goal. They don’t simply ignore items
unrelated to their goals; they often don’t even
notice them
Biased by the future: our goals
El Factor Humano - GEInformàtica, IPO 51 / 110
52. Perception
• PERCEPTION BIASED BY GOALS
Excercise: look in next image for a scisors
Now, did you spot the scissors?
And, can you say whether there is a
screwdriver in the toolbox too?
Biased by the future: our goals
El Factor Humano - GEInformàtica, IPO 52 / 110
53. Perception
• PERCEPTION BIASED BY GOALS
• This filtering of perception by our goals is
particularly true for adults, who tend to be
more focused on goals than children are.
• Children are more stimulus driven: their
perception is less filtered by their goals, then:
• Children are more distractible than adults, but
• it also makes them less biased as observers
Biased by the future: our goals
El Factor Humano - GEInformàtica, IPO 53 / 110
54. Perception
• Perceptual filtering can also be seen in how people
navigate Web sites
Enhorabona!! La teva entrada a
la web serà recompensada amb
un premi de 100€.
Passa per secretaria de direcció
per recollir-lo.
Look for the
departments
structure of EPS
Have you seen that
you won 100€ ??
NO?
Because it was not
related to your goal !!
Biased by the future: our goals
El Factor Humano - GEInformàtica, IPO 54 / 110
55. Perception
• What is the mechanism by which our current goals bias
our perception? There are two:
• Influencing where we look.
• Perception is active, not passive.
• We constantly move our eyes, ears, hands, and so on.
• We more or less ignore anything unrelated to our goal.
• Sensitizing our perceptual system to certain features.
• When we are looking for something, our brain can prime our perception
to be especially sensitive to features of what we are looking for.
El Factor Humano - GEInformàtica, IPO 55 / 110
56. Perception. DESIGN IMPLICATIONS
1. Avoid ambiguity
• Avoid ambiguous information displays
• Test your design to verify that all users interpret the display in the
same way
• Where ambiguity is unavoidable
• rely on standards or conventions to resolve it, or
• prime users to resolve the ambiguity in the intended way
2. Be consistent
• Place information and controls in consistent locations.
• Controls and data displays that serve the same function on different pages
should be placed in the same position on each page on which they appear.
• They should also have the same color, text fonts, shading, and so on.
3. Understand the goals
• Users come to a system with goals they want to achieve.
• Designers should understand those goals.
User
Centred
Design
El Factor Humano - GEInformàtica, IPO 56 / 110
57. Gestalt Principles.
Human Vision is OPTIMIZED to See Structure
• Human vision is holistic:
• The visual system automatically imposes structure on visual input
and is wired to perceive whole shapes, figures, and objects rather
than disconnected edges, lines and areas.
Gestalt principles of visual perception
http://www.scholarpedia.org/article/Gestalt_principles
http://en.wikipedia.org/wiki/Gestalt_psychology
http://www.slideshare.net/chelsc/gestalt-laws-and-design-presentation
• Today’s theories of visual perception tend to be based heavily on
the neurophysiology of the eyes, optic nerve, and brain
• BUT, Gestalt principles are still valid
• at least as a framework for describing visual perception explanations
• Also provides useful basis for guidelines for graphic and UI design
El Factor Humano - GEInformàtica, IPO 57 / 110
58. • Similarity — Similar objects are often perceived as a group.
• Continuation — Continuation occurs when the human eyes
follow the direction from one object to another, perceiving
separate objects as one.
• Closure — When gaps appear between shapes, people tend
to mentally close those gaps and form a perception of a whole
object.
• Proximity — Objects placed close together are often
perceived as a group.
• Figure and Ground — Different shapes that are formed by the
foreground (figure) and background (ground).
http://yusylvia.wordp
ress.com/tag/gestalt
El Factor Humano - GEInformàtica, IPO 58 / 110
59. Gestalt Principles.
Human Vision is OPTIMIZED to See Structure
• Proximity
Items that are closer appear
grouped. Left: rows, Right: columns
Distribution List Membership dialog box,
list buttons are in a group box, separate
from the window-control buttons
El Factor Humano - GEInformàtica, IPO 59 / 110
60. Gestalt Principles.
Human Vision is OPTIMIZED to See Structure
• Proximity
poorly spaced radiobuttons look grouped in
vertical columns
El Factor Humano - GEInformàtica, IPO 60 / 110
61. Gestalt Principles.
Human Vision is OPTIMIZED to See Structure
• Similarity
Items appear grouped if
they look more similar to
each other than to other
objects
Mac OS Page Setup dialog box:
The Similarity and Proximity principles
are used to group the
Orientation settings.
El Factor Humano - GEInformàtica, IPO 61 / 110
62. Gestalt Principles.
Human Vision is OPTIMIZED to See Structure
• Similarity
Online form at Elsevier.com:
- Similarity makes the text fields
appear grouped
- The four menus, in addition to
being data fields, help separate
the text field groups.
- By contrast, the labels are too
far from their fields to seem
connected to them.
El Factor Humano - GEInformàtica, IPO 62 / 110
63. Gestalt Principles.
Human Vision is OPTIMIZED to See Structure
• Continuity
• visual perception is biased to perceive continuous forms rather than
disconnected segments
We see a slider as a single slot with a handle
somewhere on it, not as two slots separated by
a handle.
(A) Mac OS, (B) ComponentOne
El Factor Humano - GEInformàtica, IPO 63 / 110
64. Gestalt Principles.
Human Vision is OPTIMIZED to See Structure
• Clousure
• related to Continuity
• our visual system automatically tries to close open figures so that
they are perceived as whole objects rather than separate pieces
El Factor Humano - GEInformàtica, IPO 64 / 110
65. Gestalt Principles.
Human Vision is OPTIMIZED to See Structure
• Figure/Ground
• human mind separates the visual field into the figure (the
foreground) and ground (the background) and it is influenced by
characteristics of the scene
In UI design, this principle is often used to
place an impression-inducing background
“behind” the primary displayed content
It is also often used to pop up information
over other content. Content that was
formerly the figure —the focus of the users’
attention— temporarily becomes the
background for new information, which
appears briefly as the new.
El Factor Humano - GEInformàtica, IPO 65 / 110
67. More Gestalt Principles
Human Vision is OPTIMIZED to See Structure
• Simetry and order Symmetry gives us a feeling of solidity and
order, which we tend to seek. It’s our nature to
impose order on chaos.
The human visual system tries to resolve complex scenes into combinations of
simple, symmetrical shapes
El Factor Humano - GEInformàtica, IPO 67 / 110
68. More Gestalt Principles
Human Vision is OPTIMIZED to See Structure
• previous Gestalt principles
concerned perception of static
(un-moving) figures and
objects.
• Common Fate concerns
moving objects.
• It is related to the Proximity
and Similarity principles:
Like them it affects whether
we perceive objects as
grouped.
• Objects that move together
are perceived as grouped or
related.
El Factor Humano - GEInformàtica, IPO 68 / 110
69. Gestalt Principles.
Human Vision is OPTIMIZED to See Structure
• Of course, in real-world visual scenes, the Gestalt
principles work in concert, not in isolation
• Recommendation:
• after designing a UI, try to view it with each of the Gestalt principles
in mind to see if the design suggests any relationships between
elements that you do not intend
El Factor Humano - GEInformàtica, IPO 69 / 110
70. Perceiving Structure
• Perceiving structure in our environment helps us make
sense of objects and events quickly
This website buries the important information
in repetitive prose.
New version, page with repetition eliminated
and better visual structure
Structured presentation of airline reservation
information is easier to scan and understand
El Factor Humano - GEInformàtica, IPO 70 / 110
71. Perceiving Structure
• Structure also enhances people’s ability to scan long
numbers
• Segmenting data fields can provide useful visual structure even
when the data to be entered is not, strictly speaking, a number
Easy: (415) 123-4567
Hard: 4151234567
Easy: 1234 5678 9012 3456
Hard: 1234567890123456
Segmented data fields provide useful structure
El Factor Humano - GEInformàtica, IPO 71 / 110
72. Perceiving Structure
• Visual hierarchy lets people focus on the relevant
information
Visual hierarchy is equally important in interactive control
panels and forms -perhaps even more so.
El Factor Humano - GEInformàtica, IPO 72 / 110
73. Perception. READING
• Speaking and undestanding spoken language is a NATURAL human
ability, Reading IS NOT
• Learning to read involves training our brain (& our visual system) to
recognize patterns
Reading involves recognizing features and patterns
• Feature-driven (bottom-up or context-free) reading
• The brain’s ability to recognize basic features (lines, edges, angles, etc.) is built
in and therefore automatic from birth.
• Recognition of morphemes, words, and phrases has to be learned.
• Context-driven (top-down) reading
• The visual system starts by recognizing high-level patterns (words, phrases,
and sentences) or by knowing the text’s meaning in advance.
• It then uses that knowledge to figure out (or guess) what the components of
the high-level pattern must be.
… Context [is] important, but it’s a more important aid for the
poorer reader who doesn’t have automatic context-free
recognition instantiated
El Factor Humano - GEInformàtica, IPO 73 / 110
74. 4QU357M15547G353RV31XP3R4 PR0V4RQU3 L4N057R4M3N7 35F4N74571C41 P07F3RC0535
M3R4V3LL0535!1MPR35510N4N7S!
4LC0M3NÇ4M3N7P0753R37C0574,P3R04R4L4 73V4M3N7LL3G31X4U70M471C4M3N7,53N53
74N50L5P3N54R-H1!
N0M35UN5QU4N75P0D3N LL3G1R41X0.
3NG4NX4-H04L 73UMURS1 H0P075 LL3G1R
Perception: READING: pattern
recognition (top-down processing)
• Can you read this text?? (in catalan)
• Or these?
THE WORK MUST GET DONE. WORK
THE WORK MUST GET DONE. WORK
El Factor Humano - GEInformàtica, IPO 74 / 110
75. Perception: READING
• Careful with geek terminology (especially in system or error
messages)
• with difficult
scripts & typefaces
• with tiny fonts
Your session has expired. Please reauthenticate. login again.
ALL CAPS hard to read (letters look more similar to
each other)
Outline typefaces complicate feature recognition
Human–computer Interaction (HCI) is the study, planning, and design of the interaction between people (users) and computers. It is
often regarded as the intersection of computer science, behavioral sciences, design and several other fields of study. Interaction
between users and computers occurs at the user interface (or simply interface), which includes both sw and hw.
El Factor Humano - GEInformàtica, IPO 75 / 110
77. Memoria sensorial
• La información llega a nuestros sentidos de una forma continua y
muy rápida
• Los procesos encargados de analizarla en la memoria de trabajo
necesitan tiempo para realizar su función y puede ocurrir que la
pierdan antes de almacenarla
• Por esta razón, los canales sensoriales tienen asociados
memorias donde la información se almacena por cortos
períodos de tiempo (milésimas de segundo)
• La función de estas memorias es retener la información para que
pueda ser transferida a la Memoria de Trabajo antes de que
desaparezca
El Factor Humano - GEInformàtica, IPO 77 / 110
78. Memoria sensorial
• Actúa como buffer de los estímulos recibidos a través de los
sentidos
• Existe una memoria para cada canal, y se actualizan
constantemente
• La información se almacena durante periodos muy cortos
• Este almacenamiento nos permite predecir la procedencia del sonido (se
percibe por cada oído con un cierto desfase), o un fogonazo en la
oscuridad (persistencia de la imagen tras haber cesado el estímulo).
• Existen tantas Memorias sensoriales como sentidos tenemos.
• Sin embargo, las que mejor conocemos actualmente son:
• Memoria Icónica, ligada al canal visual
• Memoria Ecoica, ligada al canal auditivo
El Factor Humano - GEInformàtica, IPO 78 / 110
79. Memoria sensorial. Almacenes
• Icónico:
• Recibe la información visual
• La información que se recibe es de carácter perceptual y no
categorial
• Permite mantener 9 elementos durante aprox. 250 mseg
• Se transfieren los elementos a los que el usuario preste
atención
• Ecoico:
• Almacena los estímulos auditivos
• Almacenamiento de
• Sonidos individuales durante 250 mseg
• Palabras con significado durante 2 o más segundos
El Factor Humano - GEInformàtica, IPO 79 / 110
81. Memoria de Trabajo (MT) (Memoria
Operativa). Short-Term Memory (STM)
• Short-term memory is not a store —it is not a place where
memories and perceptions go to be worked on.
• It is not a temporary repository for information just brought
in from the sensory system or retrieved from long-term
memory.
• Instead, short-term memory is a combination of
phenomena arising from perception and attention.
• Each of our perceptual senses has its own very
brief short-term “memory” that is the result of
residual neural activity after a perceptual
stimulus
El Factor Humano - GEInformàtica, IPO 81 / 110
82. Memoria de Trabajo (MT) (Memoria
Operativa). Short-Term Memory (STM)
• STM is equal to the focus of our attention. Whatever is in
that focus is what we are conscious of at any
moment.
• Right now you are conscious of the last few words and ideas
you’ve read, but probably not the color of the wall in front of you.
• But now that I’ve shifted your attention, you are conscious of the
wall’s color, and may have forgotten some of the ideas you read on
the previous page
• The primary characteristics of STM are its low capacity
and its volatility
El Factor Humano - GEInformàtica, IPO 82 / 110
83. Memoria de Trabajo (MT) (Memoria
Operativa). Short-Term Memory (STM)
• Designing a menú (web, phone, ...):
• How many options should have?
• A few? ... But, how many options is “few” ??
• The magical number 7±2, Miller
• Tiempo de acceso: 70 mseg
• Tiempo en la memoria: 20 seg
• BUT: People can only remember about 3-4 items
at a time. The "7 plus or minus 2" rule is an
urban legend. Research shows the real number is
3-4.
from http://uxmag.com/articles/the-psychologists-view-of-ux-
design?goback=%2Egde_72842_member_213335291
El Factor Humano - GEInformàtica, IPO 83 / 110
84. Memoria de Trabajo (MT) (Memoria
Operativa). Short-Term Memory (STM)
• La carga de información en STM y
la probabilidad de un fallo en la
recuperación de información
almacenada en ella dependen de
las demandas de almacenamiento y
del procesamiento de las tareas.
• Los menús profundos y estrechos
demandan más capacidad de
procesamiento.
• En ellos, una opción en el nivel superior
de la estructura de menús está poco
relacionada con la descripción de la
tarea, generando mayor demanda de
procesamiento.
• El usuario necesita recorrer un mayor
camino para encontrar la opción que
necesita.
El Factor Humano - GEInformàtica, IPO 84 / 110
85. Memoria de Trabajo (MT) (Memoria
Operativa). Short-Term Memory (STM)
• En términos de almacenamiento y procesamiento, en la
interacción con los menús telefónicos se generan
grandes demandas de STM por tres razones:
1. E
2. El ritmo de presentación de las opciones es marcado por la
interfaz y no por él. Este ritmo genera una presión temporal que
incrementa las demandas de procesamiento en MT.
3. No existen ayudas externas como ocurre en los menús visuales.
El usuario debe monitorizar el estado de un
ambiente estimular en constante cambio
(la presentación de las opciones de cada
menú). El usuario debe notar los cambios en
ese ambiente porque eso le permite la
evaluación de las alternativas para la
elección de las siguientes opciones y porque
esos cambios le dan un feedback sobre la
eficacia de las opciones ya elegidas.
El Factor Humano - GEInformàtica, IPO 85 / 110
86. Memoria de Trabajo (MT) (Memoria
Operativa). Short-Term Memory (STM)
UI DESIGN implications
• The capacity and volatility of short-term memory have
many implications for the design of interactive computer
systems.
• UI should help people remember essential
information from one moment to the next.
• Don’t require people to remember system status or
what they have done, because their attention is
focused on their primary goal and progress toward it.
There are two things that every designed screen must do well:
describe the current step and describe the next step. It’s as
simple…and hard…as that.
http://bokardo.com/archives/designing-for-the-next-step
El Factor Humano - GEInformàtica, IPO 86 / 110
88. UI DESIGN implications
• Regular dropdown menus in large, multi-level sites
typically hide some or many of the options from the user.
• This requires them to
scroll, search or
remember where
particular options are
within the user
interface,
• more interactively
demanding (i.e. more
clicking is required)
• more cognitively
demanding (i.e. recall
from short-term
memory is required) Mega Dropdown menu (Fat menu)
http://www.nngroup.com/articles/mega-menus-work-well
El Factor Humano - GEInformàtica, IPO 88 / 110
90. Memoria de Largo Plazo (MLP).
Long-Term Memory (LTM)
• It actually is a MEMORY STORE
• the capacity of human long-term memory seems almost unlimited
• weaknesses:
• error-prone,
• impressionist (weighted by
emotions),
• free-associative,
• idiosyncratic (muy personal),
• retroactively alterable,
• easily biased by a variety of
factors at the time of recording
or of retrieval.
Testing is easier:
- What was your previous phone
number (or car identification)?
- What was your first grade
teacher’s name? Second
grade? Third grade? …
- What Web site was presented
earlier that show …?
- An exam,
- …..
El Factor Humano - GEInformàtica, IPO 91 / 110
91. Memoria de Largo Plazo (MLP).
Long-Term Memory (LTM)
• The main thing that the characteristics of long-term
memory imply is that people need tools to augment it.
• Humankind has a need for technologies that augment
memory
• software designers should try to provide software that fulfills
that need.
• designers should avoid developing systems that burden
longterm memory
• Familiar paths (patterns):
• well-learned routes can be done fairly automatically and does not
consume attention and short-term memory.
• They are stored in LTM
El Factor Humano - GEInformàtica, IPO 92 / 110
92. Memoria de Largo Plazo (MLP).
Long-Term Memory (LTM)
This kind of registration
burdens long-term
memory: users may have
no unique, memorable
answer for any of the
questions
El Factor Humano - GEInformàtica, IPO 93 / 110
93. Memoria de Largo Plazo (MLP).
Long-Term Memory (LTM)
UI DESIGN implications
• Recognition is easy; Recall is hard
• Recognition is essentially perception + LTM working in concert.
• If a perception comes in that is similar to an earlier one and the context is
close enough, it easily stimulates a similar pattern of neural activity,
resulting in a sense of recognition.
• Recall is LTM reactivating (old) neural patterns without immediate
similar perceptual input. Much harder than reactivating a neural
pattern with the same or similar perceptions.
• Our brain did not evolve to recall facts humans develop methods and
technologies to help them remember facts and procedures
• Ex.: a sheet of paper or a power point presentation usually is a recall
resource
• The relative ease with which we can recognize things rather
than recall them is the basis of the GUI
[Johnson et al., 1989, The xerox star: A retrospective. IEEE Computer]
El Factor Humano - GEInformàtica, IPO 94 / 110
94. Memoria de Largo Plazo (MLP).
Long-Term Memory (LTM)
UI DESIGN implications
• Recognition vs Recall, golden rules:
1. See and choose is easier than recall and type
See & choose
Remember & type C> copy doc1 doc2
C> remove fileA
See & choose
El Factor Humano - GEInformàtica, IPO 95 / 110
95. Memoria de Largo Plazo (MLP).
Long-Term Memory (LTM)
UI DESIGN implications
• Recognition vs Recall, golden rules:
2. Use pictures where possible to convey function
El Factor Humano - GEInformàtica, IPO 96 / 110
96. Memoria de Largo Plazo (MLP).
Long-Term Memory (LTM)
• La memoria de largo plazo almacena todo nuestro
conocimiento
• Las principales características son:
• Gran capacidad (casi ilimitada)
• Acceso más lento (1/10 s)
• Las pérdidas ocurren más lentamente
• Tipos:
• Procedimental
• Declarativa
El Factor Humano - GEInformàtica, IPO 97 / 110
97. Memoria de Largo Plazo (MLP).
Long-Term Memory (LTM)
• Why
• most smart phones make a shutter sound when you close a
camera to take a picture?
• when you read a book on a tablet seems that "turning the pages"?
link to “the past”
However, increasingly, some of the objects
that serve as reference are
disappearing from memory of users.
The younger generation of iPad users,
• will there ever be operated analog clocks,
calendars, notebooks paper or yellow
pages?
• In the near future, how many of them have
passed the pages of a real book?
El Factor Humano - GEInformàtica, IPO 98 / 110
98. And be aware about
• Our STM decreases with
age.
• However, we can draw
on much more
background knowledge
in our LTM.
Model Human Processor
El Factor Humano - GEInformàtica, IPO 99 / 110
99. Affordance (captación intuitiva)
• Las affordances son las
funciones de un objeto que
el observador percibe
directamente a partir de su
imagen.
• Una buena affordance
atrae al usuario, lo invita a
interactuar con el sistema
sin necesidad de consultar
la ayuda
http://www.grihotools.udl.cat/mpiua/affordances
http://en.wikipedia.org/wiki/Affordance
Everyday designs “intuitivos”:
manecilla para abrir la puerta del
coche
El Factor Humano - GEInformàtica, IPO 100 / 110
100. Affordance (captación intuitiva)
• Requisitos para maximizar la efectividad de las
affordances
• Forma funcional
• un usuario al percibir un botón, la primera impresión que tiene es la de
estar ante un objeto “para ser presionado”
• Visibilidad al usuario
• Elementos como los “links emergentes” que tan solo aparecen cuando
el usuario sitúa encima de los mismos el puntero del ratón, no son
aconsejables en la medida en que no hacen visible su función a
primera vista
• Acción coherente
• Un botón para acceder a un menú oculto que se identifique con una
flecha señalando abajo, deberá presentar el menú desde ese punto y
hacia abajo
• Relatividad del observador: un problema de las affordances es
que no suscitan la misma función a todo tipo de población
• un banco en un parque puede presentar el affordance “sentarse en él”
para un anciano, y “escalarlo” para un niño pequeño
El Factor Humano - GEInformàtica, IPO 101 / 110
101. Affordance. The Principle of 'Visibility'
• VISIBILITY is an important design principle
• if a user cannot see the means of achieving their goals, they will
either
• waste time searching for them, or
• simply seek alternative websites, devices or designs that do not
impede their productivity in such a way
El Factor Humano - GEInformàtica, IPO 102 / 110
102. Affordance (captación intuitiva)
• un usuario al percibir un botón, la primera impresión que
tiene es la de estar ante un objeto “para ser presionado”
El círculo también da una área de
acierto, pero es menor y el usuario se
suele apoyar en los contornos
Install Now
El cuadrado proporciona un
área mayor de acierto para
el usuario
buscar
Si no pintamos el área de acierto,
el usaurio tiene que apuntar muy
bien para acertar el botón
Install Now
El Factor Humano - GEInformàtica, IPO 103 / 110
103. Confusing Affordance
• Which one can
or should be
pressed?
• All three look like
a button, which
means we can
press on it.
The fact is,
only the
middle one is
a button
El Factor Humano - GEInformàtica, IPO 104 / 110
104. Affordance & graphic methafors (icons)
• In the battle of clarity between icons and labels, labels
always win.
http://bokardo.com/archives/labels-always-win
Progressive Reduction:
http://layervault.tumblr.com/post/42361
566927/progressive-reduction
familiarity
El Factor Humano - GEInformàtica, IPO 105 / 110
105. Affordance & graphic methafors (icons)
• Cuando enviamos un video por Whatsapp, se muestra un cuadro del
video con un widget en el centro que indica el progreso en el envío.
• El widget se compone de:
• un círculo que se muestra con un fondo negro transparente y
• una circunferencia en blanco que va completándose conforme progresa el envío,
• además de un cuadrado plano que funciona como símbolo de stop.
• Cuando el video ha sido descargado,
• el círculo cambia a un blanco transparente con un triángulo que funciona como
símbolo de play.
• Muy interesante la doble función comunicativa conseguida en este
diseño a pesar de su simpleza
• por un lado, comunica el progreso en el envío, por el otro, refleja su affordance
como botón.
Además, un usuario de Whatsapp sabrá que algo salió mal en
la descarga del vídeo si la circunferencia nunca se completa
El Factor Humano - GEInformàtica, IPO 106 / 110
106. Non affordance: Lack of Hover State on
Touch Devices
• On touch devices users lack
the subtle but crucial mouse
hover states which provide
instant indication if something
is clickable or not
• Touch devices do not have
the affordance for “instant
indication if something is
clickable or not”
• This proved a major
problem during user
testing of the mobile sites;
• especially on complex,
navigation heavy sites such as
mobile commerce sites
http://baymard.com/blog/mobile-product-list-hit-areas
El Factor Humano - GEInformàtica, IPO 107 / 110
107. Conclusiones
• La persona percibe información a través de los sentidos
• Vista, oído, tacto, ...
• Guarda, manipula y utiliza información
• Reacciona a la información recibida
• Una comprensión de les capacidades y limitaciones de
las personas nos ayudará en el diseño de las interfaces
de los sistemas interactivos
10 things every designer should know about people
http://www.uxforthemasses.com/10-things-every-designer-should-
know-about-people
Lectura
recomendada
El Factor Humano - GEInformàtica, IPO 108 / 110
108. Bibliografía
• Norman, D. A. (2002). The Design of Everyday Things. Basic
Books.
• Anderson, J.R. (1995). Cognitive Psychology and its
implications. NY.
• Card, S.K., Moran, T.P. y Newell, A. (1983). The Psychology of
Human-Computer Interaction. Lawrence Erlbaum Associates.
• Cañas, J.J. (2004). Personas y Máquinas. El diseño de su
interacción desde la ergonomía cognitiva.
• Miller, G.A. (1956). The magical number seven plus or minus
two: Some limits on our capacity for processing information.
Psychological Review, 63, 81-97.
Designing with the Mind in
Mind: Simple Guide to
Understanding User
Interface Design Rules
Jeff Johnson
Morgan Kaufmann (2010)
El Factor Humano - GEInformàtica, IPO 109 / 110
100 Things Every Designer
Needs to Know About
People
Susan Weinschenk
New Riders (2011)
109. El Curso de Interacción Persona-Ordenador ha sido realizado por Toni
Granollers bajo la licencia Creative Commons Reconocimiento-
NoComercial 4.0 Internacional License.
El Factor Humano - GEInformàtica, IPO 110 / 110
Notas del editor
5.- El Factor Humà
Several years ago, the online travel Web site ITN.net used two pale colors —white
and pale yellow— to indicate which step of the reservation process the user was on
(see Fig. 5.5). Some site visitors couldn’t see which step they were on.
La protanopia es la carencia de sensibilidad al color rojo, una disfunción visual relacionada con la percepción del color. Se denomina también dicromacia roja.
Consiste en la ausencia de actividad funcional de los protoconos, que son sensibles a la porción roja del espectro visible. Por tanto, los individuos que sufren protanopia padecen una pérdida clara de sensibilidad a la luminosidad del extremo rojo del espectro cromático.
La deuteranopía o deuteranopsia es una disfunción visual consistente en alteración para la percepción del color.
Los conos de la retina responsables de la recepción de luz con longitud de onda correspondiente al color verde están ausentes o no son funcionales. Por tanto existe una deficiencia a la hora de discriminar entre verde y rojo.
La tritanomalía es una anomalía visual congénita que afecta a la visión de los colores. El individuo que la presenta tiene reducida capacidad para distinguir la diferencia entre algunos tonos de azul y amarillo. Es una variante poco frecuente de discromatopsia o daltonismo que presenta el 0.01 % de la población.1
El daltonismo es un defecto genético que ocasiona dificultad para distinguir los colores. La palabra daltonismo proviene del físico y matemático John Dalton que padecía este trastorno.1 El grado de afectación es muy variable y oscila entre la falta de capacidad para discernir cualquier color (acromatopsia) y un ligero grado de dificultad para distinguir algunos matices de rojo y verde. A pesar de que la sociedad en general considera que el daltonismo pasa inadvertido en la vida diaria, supone un problema para los afectados en ámbitos tan diversos como: valorar el estado de frescura de determinados alimentos, identificar códigos de colores de planos, elegir determinadas profesiones para las que es preciso superar un reconocimiento médico que implica identificar correctamente los colores (militar de carrera, piloto, capitán de marina mercante, policía, etc.). Puede detectarse mediante test visuales específicos como las cartas de Ishihara.2
El defecto genético es hereditario y se transmite generalmente por un alelo recesivo ligado al cromosoma X. Si un varón hereda un cromosoma X con esta deficiencia será daltónico. En cambio en el caso de las mujeres, que poseen dos cromosomas X, sólo serán daltónicas si sus dos cromosomas X tienen la deficiencia. Por ello el daltonismo afecta aproximadamente al 1.5 % de los hombres y solo al 0,5 % de las mujeres.3
El término discromatopsia se utiliza en medicina también para describir la dificultad en la percepción de los colores, pero tiene un significado más general. La discromatopsia puede ser de origen genético, en cuyo caso se denomina discromatopsia congénita o daltonismo. También pueden producirse discromatopsias que no son de origen genético y se presentan en algunas enfermedades de la retina o el nervio óptico.4 5
The spatial resolution of the human visual field drops greatly from the center to the edges. Each eye has approximately six million retinal cone cells. They are packed much more tightly in the center of our visual field—a small region called the fovea— than they are at the edges of the retina (see Fig. 6.1).
Utilitzeu-amb moderació
PERCEPTION BIASED BY GOALS
In addition to being biased by our past experience and the present context, our
perception is influenced by our goals and plans for the future. Specifically, our goals
filter our perceptions: things unrelated to our goals tend to be filtered out preconsciously,
never registering in our conscious minds.
For example, when people navigate through software or a Web site, seeking information
or a specific function, they don’t read carefully. They scan screens quickly and superficially for items that seem related to their goal. They don’t simply ignore
items unrelated to their goals; they often don’t even notice them.
To see this, flip briefly to the next page and look in the toolbox (Fig. 1.6) for scissors,
and then immediately flip back to this page. Try it now.
Did you spot the scissors? Now, without looking back at the toolbox, can you
say whether there is a screwdriver in the toolbox too?
Our goals filter our perceptions in other perceptual senses as well as in vision.
A familiar example is the “cocktail party” effect. If you are conversing with someone
at a crowded party, you can focus your attention to hear mainly what he or she is
saying even though many other people are talking near you. The more interested you
are in the conversation, the more strongly your brain filters out surrounding chatter.
If you are bored by what your conversational partner is saying, you will probably
hear much more of the conversations around you.
The effect was first documented in studies of air-traffic controllers, who were
able to carry on a conversation with the pilots of their assigned aircraft even though
many different conversations were occurring simultaneously on the same radio
frequency, coming out of the same speaker in the control room (Arons, 1992).
Research suggests that our ability to focus on one conversation among several simultaneous
ones depends not only on our interest level in the conversation but also on
objective factors such as the similarity of voices in the cacophony, the amount of
general “noise” (e.g., clattering dishes or loud music), and the predictability of what
your conversational partner is saying (Arons, 1992).
This filtering of perception by our goals is particularly true for adults, who tend
to be more focused on goals than children are. Children are more stimulus driven:
their perception is less filtered by their goals. This characterisitic makes them more
distractible than adults, but it also makes them less biased as observers.
A parlor game demonstrates this age difference in perceptual filtering. It is similar
to the “look in the toolbox” exercise. Most households have a catch-all drawer
for kitchen implements or tools. From your living room, send a visitor to the room
where the catch-all drawer is, with instructions to fetch you a specific tool, such as
measuring spoons or a pipe wrench. When the person returns with the tool, ask
whether another specific tool was in the drawer. Most adults will not know what
else was in the drawer. Children—if they can complete the task without being distracted
by all the cool stuff in the drawer—will often be able to tell you more about
what else was there.
Perceptual filtering can also be seen in how people navigate Web sites. Suppose
I put you on the home page of New Zealand’s University of Canterbury (see Fig. 1.7)
and asked you to print out a map of the campus showing the computer science
department. You would scan the page and probably quickly click one of the links
that share words with the goal that I gave you: Departments (top left), Departments
and Colleges (middle left), or Campus Maps (bottom right). If you’re a “search”
person,
you might instead go right to the Search box (middle right), type words
related to the goal, and click “Go.”
Whether you browse or search, it is likely that you would leave the home page
without noticing that you were randomly chosen to win $100 (bottom left). Why?
Because that was not related to your goal.
What is the mechanism by which our current goals bias our perception? There
are two:
l Influencing where we look. Perception is active, not passive. We constantly
move our eyes, ears, hands, and so on, so as to sample exactly the things in our
environment that are most relevant to what we are doing or about to do (Ware,
2008). If we are looking on a Web site for a campus map, our eyes and pointercontrolling
hand are attracted to anything that might lead us to that goal. We
more or less ignore anything unrelated to our goal.
l Sensitizing our perceptual system to certain features. When we are looking
for something, our brain can prime our perception to be especially sensitive to features
of what we are looking for (Ware, 2008). For example, when we are looking
for a red car in a large parking lot, red cars will seem to pop out as we scan the lot,
and cars of other colors will barely register in our consciousness, even though we
do in some sense “see” them. Similarly, when we are trying to find our spouse in
a dark, crowded room, our brain “programs” our auditory system to be especially
sensitive to the combination of frequencies that make up his or her voice.
To see this, flip briefly to the next page and look in the toolbox (Fig. 1.6) for scissors, and then immediately flip back to this page. Try it now.
Did you spot the scissors? Now, without looking back at the toolbox, can you say whether there is a screwdriver in the toolbox too?
Our goals filter our perceptions in other perceptual senses as well as in vision.
A familiar example is the “cocktail party” effect. If you are conversing with someone at a crowded party, you can focus your attention to hear mainly what he or she is saying even though many other people are talking near you. The more interested you are in the conversation, the more strongly your brain filters out surrounding chatter. If you are bored by what your conversational partner is saying, you will probably hear much more of the conversations around you.
Perceptual filtering can also be seen in how people navigate Web sites. Suppose
I put you on the home page of New Zealand’s University of Canterbury (see Fig. 1.7)
and asked you to print out a map of the campus showing the computer science
department. You would scan the page and probably quickly click one of the links
that share words with the goal that I gave you: Departments (top left), Departments
and Colleges (middle left), or Campus Maps (bottom right). If you’re a “search”
person,
you might instead go right to the Search box (middle right), type words
related to the goal, and click “Go.”
Whether you browse or search, it is likely that you would leave the home page
without noticing that you were randomly chosen to win $100 (bottom left). Why?
Because that was not related to your goal.
What is the mechanism by which our current goals bias our perception? There
are two:
l Influencing where we look. Perception is active, not passive. We constantly
move our eyes, ears, hands, and so on, so as to sample exactly the things in our
environment that are most relevant to what we are doing or about to do (Ware,
2008). If we are looking on a Web site for a campus map, our eyes and pointercontrolling
hand are attracted to anything that might lead us to that goal. We
more or less ignore anything unrelated to our goal.
l Sensitizing our perceptual system to certain features. When we are looking
for something, our brain can prime our perception to be especially sensitive to features
of what we are looking for (Ware, 2008). For example, when we are looking
for a red car in a large parking lot, red cars will seem to pop out as we scan the lot,
and cars of other colors will barely register in our consciousness, even though we
do in some sense “see” them. Similarly, when we are trying to find our spouse in
a dark, crowded room, our brain “programs” our auditory system to be especially
sensitive to the combination of frequencies that make up his or her voice.
For example, on the left side of Figure 2.8, we automatically see two crossing
lines—one blue and one orange. We don’t see two separate orange segments and
two separate blue ones, and we don’t see a blue-and-orange V on top of an upsidedown
orange-and-blue V. On the right side of Figure 2.8, we see a sea monster in
water, not three pieces of one.
A well-known example of the use of the Continuity principle in graphic design
is the IBM® logo. It consists of disconnected blue patches, and yet it is not at all
ambiguous; it is easily seen as three bold letters, perhaps viewed through something
like venetian blinds (see Fig. 2.9).
Slider controls are a user-interface example of the Continuity principle. We
see a slider as depicting a single range controlled by a handle that appears somewhere
on the slider, not as two separate ranges separated by the handle (see
Fig. 2.10A). Even displaying different colors on each side of a slider’s handle doesn’t
completely “break” our perception of a slider as one continuous object, although
ComponentOne’s choice of strongly contrasting colors (gray vs. red) certainly strains
that perception a bit (see Fig. 2.10B).
Fate = destinació
Find the advice about prominence in each of these displays. Prose text format (left) makes people read everything. Visual hierarchy (right) lets people ignore information irrelevant to their goals
Context-driven reading is less likely
to become fully automatic because most phrase-level and sentence-level patterns and
contexts don’t occur frequently enough to allow their recognition to become burned
into neural firing patterns. But there are exceptions, such as idiomatic
expressions
Ejemplos en el libro: pags. 86-89, corregir l’exercici fitxat-se en aquells
Idiosyncratic molt personal
idiosincrasia
f. Rasgos y carácter propios y distintivos de un individuo o de una colectividad:el respeto a la naturaleza forma parte de la idiosincrasia de los pueblos indígenas.
Since prehistoric times, people have invented technologies to help them remember things over long periods: notched sticks, knotted ropes, mnemonics, verbal stories and histories retold around campfires, writing, scrolls, books, number systems, shopping lists, checklists, phone directories, datebooks, accounting ledgers, oven timers, computers, portable digital assistants (PDAs), online shared calendars, etc.
Since prehistoric times, people have invented technologies to help them remember things over long periods: notched sticks, knotted ropes, mnemonics, verbal stories and histories retold around campfires, writing, scrolls, books, number systems, shopping lists, checklists, phone directories, datebooks, accounting ledgers, oven timers, computers, portable digital assistants (PDAs), online shared calendars, etc.