5. Percepción (colour) Intro HCI

Post on 21-Aug-2015

814 views 0 download

Transcript of 5. Percepción (colour) Intro HCI

5 Percepción Humana

HCI-UTM2

Contenido

Repaso Sistema de visión humana Percepción del color Deficiencia de colores Guías para el diseño Tarea 4

HCI-UTM3

Resumen

Responda estas preguntas antes de diseñar Quién, qué, dónde, cuándo, cada cuándo? Relaciones entre usuarios y datos? Qué otras herramientas tienen los usuarios? Qué pasa si las cosas salen mal?

Seleccionar tareas Tareas reales con cobertura funcional racional

Cómo deben verse las tareas? Completas, tareas específicas que los usuarios

quieren hacer

HCI-UTM4

El color puede ser una poderosaherramienta para mejorar las interfacesde usuario, pero su uso inapropiadopuede reducir severamente el rendimientode los sistemas que desarrollamos.

Porqué estudiar el color?

HCI-UTM5

Espectro visible

HCI-UTM6

Sistema de visión humana

La luz pasa a través del lente Se enfoca en la retina

HCI-UTM7

Sistema de visión humana

HCI-UTM8

El ojo y una cámara

HCI-UTM9

Retina

La retina está cubierta de receptoressensibles a la luz

Principalmente para visión nocturna y percepcióndel movimiento

Es sensible a un amplio espectro de luz No puede diferenciar entre colores Percibe intensidades o grados de gris

Conos Sirven para percibir los colores

HCI-UTM10

Cont.

HCI-UTM11

Retina cont.

El centro de la retina tiene la mayoría delos conos El centro del ojo está lleno del humor vítreo El límite de la retina está dominado por

bastones Permiten detectar movimientos en los

extremos de la periferia

HCI-UTM12

Percepción del color por conos

Los fotopigmentos sirven para percibir el color Tres tipos: azul, verde, “rojo” (amarillo

realmente) Cada uno es sensitivo a una banda diferente del

spectrum La cantidad de actividad de cada uno de los tres

genera el color Registrado y se envía al cerebro como

R-V da una percepción de color rojo o verde R+V da una percepción de brillantes y amarillo Am-Az da amarillo o una percepción de color azul

HCI-UTM13

Sensibilidad de Color

http://www.cs.gsu.edu/classes/hypgraph/color/coloreff.htm

Really yellow

HCI-UTM14

Distribución de los fotopigmentos

No están distribuidos de igual forma Principalmente rojos (64%) y algunos azules (4%)

Insensibles a longitudes de onda cortas Morado a azul fuerte

Alta sensibilidad a longitudes de onda largas Amarillo y naranja

Centro de la retina no tiene conos azules Desaparición de pequeños objetos azules si fijamos

la vista cuidadosamente

HCI-UTM15

Sensibilidad del color y detecciónde imágenes

Más sensible al centro del espectro Azules y rojos deben ser más brillantes que

los verdes y amarillos La brillantes está determinada por rojos

con verdes La brillantez está expresada en una escala de

luminosidad La energía de la luz está corregida por la

sensibilidad de la longitud de onda

HCI-UTM16

Cont.

Las formas están detectadas al encontrarlos márgenes Combinar brillantez y color para crear una

mejor definición en la imagen Qué significa?

Que es difícil trabajar con márgenes y figurasazules

HCI-UTM17

SENSIBILIDAD AL COLOR(cont.)

Mientras envejecemos Los lentes se tornan amarillos y absorben

longitudes de onda más cortas La sensibilidad al azul se reduce

Los fluídos entre los lentes y la retina absorbe más luz Percibe un menor nivel de brillantez

Qué significa? No utilice azul para textos pequeños

No utilice azul para textos pequeños!!

HCI-UTM18

Sensibilidad del ojo

HCI-UTM19

Enfoque

Diferentes longitudes de onda se enfocana diferentes distancias a través de loslentes del ojo Existe la necesidad de renfocar

constantemente Causa fatiga

Debemos ser cuidadosos con la combinaciónde colores seleccionada

HCI-UTM20

Cont.

Los objetos rojos parecen más cercanosque los azules

Colores puros (saturados) requieren demás enfocamiento que los de coloresmenos puros (desaturados)

HCI-UTM21

Daltonismo

Problema identificando colores El 9% de la población

Diferentes respuesta a los fotopigmentos Reducen la capacidad de identificar tonos o cambios

de colores Particularmente aquellos de baja brillantez

Deficiencia de color rojo y verde, la más común Causado por la carencia de fotopigmentos rojos y

verdes? No pueden discriminar colores que tengan que ver con

pigmentos R y V

HCI-UTM22

Salón de la Fama o Infamia? Caja de diálogo

Pregunta si deseaborrar o no

yes (verde) no (rojo)

HCI-UTM23

Cont. Caja de diálogo

Pregunta si desea borrar o no yes (verde) no (rojo)

Problemas? Deficiencia en colores R y V Identificación cultural

Occidental Verde bueno Rojo malo

Oriental y otros difieren

HCI-UTM24

Componentes del color

Matiz (Hue) Propiedad de la longitud de onda (eg. “color”)

Brillantez Cuánta luz parece ser reflejada de la superficie Algunos son inherentemente claro u obscuro

Saturación Pureza del matiz

Eg. El rojo es más saturado que el rosa El color es una mezcla del matiz y un color

acromático La porción de matiz puro es el grado de saturación

HCI-UTM25

Cont.

Brillantez Saturación

HCI-UTM26

Ilusiones ópticasPuede Vd identificar la edad de la mujer?

HCI-UTM27

Guías del color

Evite el despliege simultáneo de coloresaltamente saturados, colores extremos Eg. No morados o azules al mismo tiempo

que rojos Eso causaría reenfocar la mirada frecuentemente

Colores desaturados son mejores (pastel) Colores opuestos van bien juntos

(rojo y verde) o (amarillo y azul)

HCI-UTM28

Seleccione colores no conjuntosen la rueda de hue

HCI-UTM29

Cont.

Es difícil detectar cambios de algunos colores Difícil en rojos, morados y verdes Fácil en amarillos, y verde-azul

Usuarios de edad necesitan altos grados debrillantez para distinguir colores

Difícil identificar los márgenes de una figura sisólo están creados por el color mismo Use Use brillantez brillantez y y definición definición de de colorescolores

HCI-UTM30

Guías de color (Cont.)

Evite rojo y verde en los márgenes (why?) Amarillos y azules en la periferia

Evite azul puro para textos, líneas y figuraspequeñas El azul es un muy buen color de fondo Evite colores adyacentes que difieran solo por el

color azul (evite azul para límites de figuras)

HCI-UTM31

Cont.

Evite distinciones de color sencillo Las combinaciones de colores deben diferir

en 2 o 3 colores únicamente Eg. 2 colores no deben diferir sólo en la cantidad

de rojo Ayuda para personas que no distingan bien

los colores

HCI-UTM32

Resumen

El color puede ser muy útil, sin embargo Ponga atención a

Cómo se combinan los colores La percepción humana Personas con algún grado de daltonismo

Mostrar información con color

HCI-UTM33

Tarea 3

Trabajo de Investigación“Percepción Humana”

Debe contener lossiguientes temas:

1 Los sentidos (intro) + Visión Audición Tacto Gusto

2 Consideraciones de lapercepción humanadurante el diseño de GUI(conclusiones)

Fecha de entrega: martes8 de diciembre, 2009,hora de clase(Aniversario 28 de lamuerte de John Lennon)

HCI-UTM34

Lecturas

Leer Capítulo 2 “The user’s physicalcapabilities”,

The Essence of Human-ComputerInteraction, por Christine Faulkner,

Ed Prentice Hall