El factor humano en la interacción hombre – máquina (página 2)

Mira fijamente el ojo del pájaro rojo mientras cuentas lentamente hasta 20 Percepción visualColor Experimento Ahora mira inmediatamente un solo punto en la jaula vacía. La imagen débil y fantasmal de un pájaro azul verdoso aparecerá en la jaula Haz lo mismo con el pájaro verde. En la jaula aparecerá la figura débil de un pájaro magenta 20 19 18 17 16 15 14 13 12 11 10 9 8 7 6 5 4 3 2 1 0

Los pájaros fantasmales se denominan imágenes secundarias, y son imágenes que permanecen después de mirar un objeto.

Los conos sólo son sensibles a algunos colores. Cuando se mira fijamente el pájaro rojo, los conos sensibles al rojo comienzan a cansarse y pierden su sensibilidad. Cuando se cambia repentinamente la mirada al fondo blanco de la jaula, se ve el blanco menos rojo en los lugares donde las células sensibles al rojo se han fatigado. La luz blanca menos la luz roja es luz azul verdoso. Por eso la imagen secundaria es azul verdoso

Lo mismo sucede cuando mira fijamente el pájaro verde. Esta vez son los conos sensibles al verde los que se fatigan. Blanco menos luz verde es luz magenta, de modo que se ve la imagen secundaria de color magenta Percepción visualColor Explicación

Percepción visualColor Este fenómeno visual tiene importantes consecuencias para la IPO: Debe evitarse la combinación de colores oponentes en una pantalla: rojo-verde, amarillo-azul Ejemplo: letras azules sobre fondo amarillo. Pueden dejarse de ver las letras, palabras en rojo sobre fondos azules puede parecer que ‘vibran’, etc. La investigación llevada a cabo en Psicología sobre este tema ha permitido disponer hoy de unas guías para la selección del color en las interfaces

Percepción visualColor Recomendaciones generales: Elegir combinaciones de colores compatibles. Evitar las combinaciones rojo-verde, azul-amarillo, verde-azul, rojo-azul Usar altos contrastes de color entre la letra y el fondo Limitar el número de colores (4 para novatos, 7 para expertos) Usar azul claro sólo para las áreas de fondo Usar el blanco para la información periférica Usar códigos redundantes (formas además de colores) Recomendaciones para las pantallas: La luminosidad disminuye en el orden blanco, amarillo, cian, verde, magenta, rojo y azul Usar blanco, cian o verde sobre fondos oscuros Para vídeo inverso usar negro, rojo, azul o magenta Evitar colores muy saturados

Percepción visualColor No se debe abusar del color como medio de codificación porque los problemas de visión del color son muy comunes El 8% de los hombres y el 1% de las mujeres tienen algún problema de visión del color Tipo Descripción Tricrómata Visión cromática normal Dicromático Protanopa Insensible al rojo Dicromático Deuterópata Insensible al verde Tritanopa Insensible al azul y amarillo Monocrómata Sin visión del color

Percepción visualBrillo Reacción a la cantidad de luz emitida por un objeto (luminancia) La agudeza visual mejora con la luminancia, pero cuando es muy elevada se incrementa el parpadeo Debe ser inversamente proporcional a la duración del estímulo Debe tenerse en cuenta que el usuario trabaja en un ambiente luminoso que influye en cómo se ve la información presentada en la interfaz Esto es competencia del diseñador del espacio de trabajo (el ergónomo), aunque el diseñador de la interfaz puede adaptar ésta a la situación en la que será utilizada Ejemplos: alinear las pantallas en relación correcta con las fuentes de luz, nunca colocar una pantalla contra una pared o un espejo, usar vídeo inverso para minimizar los destellos, etc.

Percepción visualProfundidad Importante en entornos 3D para dar realismo En la imagen 2D que percibe la retina deben existir claves que informen de la profundidad de la escena Claves para la percepción de la profundidad: Claves dadas por la propia imagen: Gradiente de textura Superposición Tamaño relativo Altura relativa Tamaño familiar Perspectiva lineal Claves dadas por laestructura del sistema visual: Disparidad binocular Paralaje de movimiento

Percepción visualÁngulo visual La percepción de la distancia está relacionada con el ángulo visual del objeto Si el ángulo visual es mayor el objeto está más cerca Una persona con visión normal puede percibir una línea si tiene un ángulo visual mínimo de 0,5 segundos de arco Los espacios entre líneas sedetectan a partir de 30”a 1’ de arco visual

Percepción visualÁngulo visual El ángulo visual está afectado por el tamaño y la distancia del objeto Objetos del mismo tamaño a diferentes distancias tienen ángulos diferentes Objetos de diferentes tamaños y distancias pueden tener el mismo ángulo

Percepción visualOrganización de objetos La distribución de elementos en la interfaz es una decisión que toma el diseñador basada muchas veces en su propia intuición o en las exigencias del espacio disponible Hoy día existe suficiente información acerca de los procesos psicológicos que subyacen en la percepción organizada de escenas Es posible proporcionar al diseñador las herramientas necesarias para decidir sobre la mejor distribución de los objetos en una interfaz

Percepción visualOrganización de objetos Modelo teórico de Palmer y Rock para la organización perceptual

Percepción visualOrganización de objetos Diferenciación de figura y fondo: ejemplo de configuración ambigua Las personas tienden a percibir tan sólo uno de los lados como un objeto con significado Características de la figura:tiene significado, está máspróxima al observador,está limitada por un contornoy posee una forma definidapor el contorno

Percepción visualOrganización de objetos Las “unidades de entrada” se transforman mediante procesos de división y agrupación para configurar la organización perceptual definitiva de la imagen Procesos de división: Diferencian las diversas partes de una figura Procesos de agrupación: Hacen que varios elementos de la escena se perciban conjuntamente

Percepción visualOrganización de objetos Principios de agrupación:

Percepción visualOrganización de objetos Ejemplo del uso de principios de agrupación: sugerir libros relacionados en un portal de venta de libros Presentar los nuevos libros junto al adquirido (proximidad) Presentar las fotos de las portadas con el mismo tamaño (similitud) … Es bueno usar varios principios conjuntamente pero hay que tener cuidado de que no operen de forma opuesta proximidad conexión

Percepción visualOrganización y tarea del usuario La organización de los elementos puede facilitar o entorpecer el trabajo del usuario Idea para un buen diseño: la organización perceptual de la información debe estar supeditada a cómo el usuario lleve a cabo la tarea sobre la misma (Wickens, 1990) Ejemplo del buscador: Se utiliza un cuadro de texto y un botón Siguiendo la idea, ambos elementos deben estar juntos y de acuerdo con la operación mental que el usuario desarrolla sobre ellos Si se escribe de izquierda a derecha, el botón debe aparecer a la derecha del cuadro de texto

Percepción visualOrganización y tarea del usuario Ejemplo de compatibilidad e incompatibilidad de la organización perceptual y la tarea del usuario

Percepción visualPercepción y atención Al trabajar sobre una interfaz el usuario recibe con frecuencia más información de la que puede procesar al mismo tiempo Ejemplo: página de inicio de un portal de Internet La atención funciona como un filtro que permite restringir la información que va a ser analizada en cada momento Hay una estrecha relación entre percepción y atención Pregunta clave: ¿qué determina la atención del usuario? Los estudios dicen: El ambiente: estímulos llamativos (imagen con colores brillantes) El propio usuario: las personas no rastrean la totalidad de la imagen sino que se centran en las áreas de alto contenido informativo. Analizando estas zonas se hacen una idea de lo que tienen enfrente

Percepción visualPercepción y atención Ejemplo de este fenómeno: “ceguera al banner” (Benway, 1998) Los usuarios con frecuencia no prestan atención a los banners que aparecen en la parte superior de las páginas web La experiencia les dice que su contenido suele ser publicitario por lo que son sistemáticamente ignorados, a pesar de su diseño llamativo