5. Percepción (colour) Intro HCI

34
5 Percepción Humana

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

Page 1: 5. Percepción (colour) Intro HCI

5 Percepción Humana

Page 2: 5. Percepción (colour) Intro HCI

HCI-UTM2

Contenido

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

Page 3: 5. Percepción (colour) Intro HCI

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

Page 4: 5. Percepción (colour) Intro HCI

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?

Page 5: 5. Percepción (colour) Intro HCI

HCI-UTM5

Espectro visible

Page 6: 5. Percepción (colour) Intro HCI

HCI-UTM6

Sistema de visión humana

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

Page 7: 5. Percepción (colour) Intro HCI

HCI-UTM7

Sistema de visión humana

Page 8: 5. Percepción (colour) Intro HCI

HCI-UTM8

El ojo y una cámara

Page 9: 5. Percepción (colour) Intro HCI

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

Page 10: 5. Percepción (colour) Intro HCI

HCI-UTM10

Cont.

Page 11: 5. Percepción (colour) Intro HCI

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

Page 12: 5. Percepción (colour) Intro HCI

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

Page 13: 5. Percepción (colour) Intro HCI

HCI-UTM13

Sensibilidad de Color

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

Really yellow

Page 14: 5. Percepción (colour) Intro HCI

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

Page 15: 5. Percepción (colour) Intro HCI

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

Page 16: 5. Percepción (colour) Intro HCI

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

Page 17: 5. Percepción (colour) Intro HCI

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!!

Page 18: 5. Percepción (colour) Intro HCI

HCI-UTM18

Sensibilidad del ojo

Page 19: 5. Percepción (colour) Intro HCI

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

Page 20: 5. Percepción (colour) Intro HCI

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)

Page 21: 5. Percepción (colour) Intro HCI

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

Page 22: 5. Percepción (colour) Intro HCI

HCI-UTM22

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

Pregunta si deseaborrar o no

yes (verde) no (rojo)

Page 23: 5. Percepción (colour) Intro HCI

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

Page 24: 5. Percepción (colour) Intro HCI

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

Page 25: 5. Percepción (colour) Intro HCI

HCI-UTM25

Cont.

Brillantez Saturación

Page 26: 5. Percepción (colour) Intro HCI

HCI-UTM26

Ilusiones ópticasPuede Vd identificar la edad de la mujer?

Page 27: 5. Percepción (colour) Intro HCI

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)

Page 28: 5. Percepción (colour) Intro HCI

HCI-UTM28

Seleccione colores no conjuntosen la rueda de hue

Page 29: 5. Percepción (colour) Intro HCI

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

Page 30: 5. Percepción (colour) Intro HCI

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)

Page 31: 5. Percepción (colour) Intro HCI

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

Page 32: 5. Percepción (colour) Intro HCI

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

Page 33: 5. Percepción (colour) Intro HCI

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)

Page 34: 5. Percepción (colour) Intro HCI

HCI-UTM34

Lecturas

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

The Essence of Human-ComputerInteraction, por Christine Faulkner,

Ed Prentice Hall