+ All Categories
Home > Documents > Diseño y Evaluación de Interfaces -...

Diseño y Evaluación de Interfaces -...

Date post: 06-Jul-2018
Category:
Upload: danglien
View: 213 times
Download: 0 times
Share this document with a friend
47
31/10/2013 1 Dra. Sandra Baldassarri http://webdiis.unizar.es/~sandra [email protected] Diseño y Evaluación de Interfaces Paradigmas de Interacción Tema: Paradigmas de Interacción Estilos y paradigmas de interacción Objetivos Dar una visión general de los distintos tipos de interfaces y dispositivos de interacción Resaltar las características principales de diseño de cada una Considerar qué interfaz es mejor para un determinado tipo de aplicación y/o actividad Reconocer qué paradigmas subyacen bajo cada una de ellas
Transcript

31/10/2013

1

Dra. Sandra Baldassarri

http://webdiis.unizar.es/~sandra

[email protected]

Diseño y Evaluación de Interfaces

Paradigmas de Interacción

Tema: Paradigmas de Interacción

Estilos y paradigmas de interacción

Objetivos

Dar una visión general de los distintos tipos de

interfaces y dispositivos de interacción • Resaltar las características principales de diseño de cada una

Considerar qué interfaz es mejor para un determinado tipo de aplicación y/o actividad

Reconocer qué paradigmas subyacen bajo cada una de ellas

31/10/2013

2

Tema: Paradigmas de Interacción

Contenidos

• Paradigmas y estilos de interacción – Consideraciones de diseño

– Considerar qué tipo de interfaz es la adecuada para cada actividad

• Evolución histórica de los paradigmas de interacción

• Algunos paradigmas destacados – Realidad Virtual

– Realidad Aumentada

– Computación Ubicua

– Interfaces Tangibles

– Dispositivos móviles

– …

Tema: Paradigmas de Interacción

Introducción

• Estilos y paradigmas en Interacción Persona-Ordenador – El paradigma predominante en los ‘80 era el diseño de

aplicaciones centradas en el usuario para un único usuario, en el escritorio del ordenador.

– A mediados de los ‘90 hubo un cambio en la forma de pensar

– Varios avances tecnológicos llevaron a una nueva generación de entornos informáticos para los usuarios, como por ejemplo: • Multimedia, Realidad Virtual, Computación ubicua, Interfaces

basadas en Agentes, ...

• El efecto de llevar la interacción “más allá del

escritorio” provocó nuevas preguntas y desafíos e implicó considerar nuevos fenómenos y cuestiones.

31/10/2013

3

Tema: Paradigmas de Interacción

Introducción

• Por ejemplo, computación ubicua: – Los ordenadores se diseñan para estar “embebidos” dentro

del entorno. Hay que re-pensar la Interacción entre la Persona y el Ordenador en este contexto.

• Hay que tener en cuenta: – ¿Cómo se permite que la gente acceda e interactúe con la

información en su trabajo, en su vida cotidiana, etc.?

– Diseñar experiencias con interfaces que forman parte del entorno, sin dispositivos específicos de control

– ¿Cómo se da información contextual relevante en el momento y lugar adecuado?

– Asegurar que la información que se transmite entre los distintos dispositivos interconectados es segura y fiable

Tema: Paradigmas de Interacción

¿Qué es un estilo de interacción?

• Interacciones – Todos los intercambios que suceden entre la persona y el

computador • Baecker and Buxton, 1987

• Estilo de interacción – Un término genérico para agrupar las diferentes maneras

en que los usuarios se comunican o interaccionan con el ordenador • Preece, 1994

• Sistema multimodal • Varios estilos de interacción

31/10/2013

4

Tema: Paradigmas de Interacción

¿Qué es un paradigma?

• La palabra paradigma viene del latín paradigma y éste del griego parádeigma que quiere decir ejemplo, modelo. En este aspecto los paradigmas de interacción representan los ejemplos o modelos de los que se derivan todos los sistemas de interacción.

• La evolución de las interfaces y los estilos de interacción dieron lugar a diferentes paradigmas a lo largo de la historia de la computación. Los paradigmas interactivos más conocidos hoy en día son: – El ordenador de sobremesa

– La realidad virtual

– La realidad aumentada

– La computación ubicua

Tema: Paradigmas de Interacción

Tipos de interfaces

Interfaces en los ’40 – Procesamiento en lotes (batch) – Tiempo compartido: un ordenador, varios usuarios

Interfaces en los ‘50 –Pantallas (Video display units) – Sketchpad (I. Shuterland)

Interfaces en los ‘60 –Herramientas de programación para soporte a tareas específicas

•Programming toolkit

Interfaces en los ‘70 – Ordenadores personales – Smalltalk (Alan Kay) – Metáforas

31/10/2013

5

Tema: Paradigmas de Interacción

Tipos de interfaces

Interfaces en los ‘80 –Comandos –WIMP/GUI

Interfaces en los ’90 –Multimedia, –Realidad virtual –Hipertexto, Web –Voz –Lápices, gestos (simples), pantalla táctil

Interfaces en el 2000 –Móvil –Multimodal (Gestos) –Cooperativa, colaborativa –Tangible , Multitouch (Perceptive Pixel) –Realidad mezclada y aumentada –Portable –Cerebro-ordenador –Interacción WII

Tema: Paradigmas de Interacción

Evolución histórica

Interfaces en los ’40

• Procesamiento en lotes (batch)

Impersonal computing

31/10/2013

6

Tema: Paradigmas de Interacción

Evolución histórica

Interfaces en los ’40

• Tiempo compartido

– 1940-1950s – fuerte crecimiento tecnológico

– J.C.R. Licklider en ARPA

– un solo ordenador, múltiples usuarios

Interactive computing

Tema: Paradigmas de Interacción

Evolución histórica

Interfaces en los ’50

• Pantallas (Video Display Units) – Mejora significativa en el dispositivo de salida (antes

papel)

– 1962 – Sutherland's Sketchpad I. Shuterland

– Los ordenadores se comienzan a utilizar para la visualización y la manipulación de datos

31/10/2013

7

Tema: Paradigmas de Interacción

Evolución histórica

Interfaces en los ’60

• Herramientas de programación

para soporte a tareas específicas

– Douglas Engelbart, Stanford

Research Institute

– 1963 – Augmenting man's intellect

– 1968 Demostración NLS/Augment

system

– Herramienta de programación que

pemite construir sistemas interactivos

complejos a partir de bloques

Tema: Paradigmas de Interacción

Evolución histórica

Interfaces en los ’70

• Ordenadores personales – 1970s – Lenguaje LOGO para programar gráficos

simples (educación)

– Un sistema es más potente si es más fácil de usar

– El futuro de la computación se basa en ordenadores pequeños y potentes, dedicados a una sola persona

– Alan Kay presenta Dynabook en Xerox’s Parc

31/10/2013

8

Tema: Paradigmas de Interacción

Evolución histórica

Interfaces en los ’80

– Interfaces basadas en comandos

– WIMP/GUI

Tema: Paradigmas de Interacción

Interfaces basadas en comandos

• Interfaz por línea de comandos – Primer estilo de interacción de uso generalizado.

– Es una manera de dar instrucciones directamente al

ordenador.

– Pueden tener la forma de teclas de función, un

carácter, abreviaciones cortas o palabras enteras.

31/10/2013

9

Tema:

Interfaces basadas en comandos

• Interfaz por línea de comandos de Second

Lifecommand-based para usuarios con

discapacidad visual

Tema: Paradigmas de Interacción

Interfaces basadas en comandos

• Interfaz por línea de comandos

– Ventajas

• Flexibilidad

– Permite la iniciativa del usuario

– Es atractivo para usuarios expertos

• Potencialmente rápido para tareas complejas

• Capacidad para hacer macros

– Desventajas

• Requiere aprendizaje y entrenamiento

• Difícil de memorizar

• Gestión de errores pobre

31/10/2013

10

Tema: Paradigmas de Interacción

Interfaces basadas en comandos

• Consideraciones de diseño e investigación

– La forma, los tipos de nombres y la estructura son

aspectos claves para un buen diseño

– La consistencia es el principio de diseño más

importante

• e.g., siempre utilizar la primera letra del comando

– Actualmente las interfaces basadas en comandos son

muy populares para scripting en la web

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

31/10/2013

11

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

• Interfaces WIMP/GUI – Windows

• Pueden abrirse, cerrarse, moverse en la pantalla usando el ratón, superponerse, agrandarse y achicarse, hacer scroll.

– Icons • Representan aplicaciones, objetos, comandos, y herramientas

que se abren al hacer click sobre ellas

– Menus • Ofrecen listas de opciones sobre las que moverse y

seleccionar

– Pointer Device • Un ratón controla el cursor como punto de entrada a las

ventanas, menús e iconos de la pantalla

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

• Interfaces WIMP/GUI

• GUI - Interfaz Gráfica de Usuario

– Bloques básicos de construcción similares a las WIMP

pero más variados

• Color, 3D,sonido, animación

• Varios tipos de menús, iconos, ventanas

– Nuevos elementos gráficos como barras de

herramientas, desplegables, ...

31/10/2013

12

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

• Interfaces WIMP: Windows

– Las ventanas se inventaron para superar las restricciones físicas de las pantallas de ordenador, permitiendo presentar más información y realizar varias tareas

– Las barras de scroll dentro de las ventanas también permitieron mostrar más información

– La opción de ventanas múltiples dificultaba encontrar una ventana en particular, por lo tanto surgieron diferentes técnicas:

– Listar

– Iconos

– Achicar / Minimizar

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

• Interfaces WIMP: Apple’s shrinking windows

31/10/2013

13

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

• Interfaces WIMP: Elección de una opción

(scrolling window)

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

• Interfaces WIMP: Elección de una opción

¿es mejor este método?

31/10/2013

14

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

• Interfaz por ventanas: Consideraciones de

diseño e investigación

– Permite a los usuarios moverse con fluidez entre

diferentes ventanas (y monitores)

– ¿Cómo cambiar la atención de una a otra para

encontrar la información buscada sin distracciones?

– Deben utilizarse los principios de espaciado,

agrupación y simplicidad

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

• Interfaces WIMP: Menu

– Diferentes estilos de interfaces tipo menú

– Listas planas, cascada, pop-up, contextual, expansible...

• Menús de listas planas

– Bueno para mostrar pocas opciones al mismo tiempo.

Especialmente útil cuando el tamaño del dispositivo de

visualización es pequeño, como iPods

– Pero es necesario anidar opciones unas dentro de otras, y

en casos requiere varios pasos para lograr llegar a la

opción deseada.

– Moverse a las pantallas previas suele ser tedioso

31/10/2013

15

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

• Interfaces WIMP: Menú

– Estructura de menú de lista plana para iPod

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

• Interfaces WIMP: Menú

• Menús expansibles

– En una sola pantalla permite mostrar más opciones

que el menú de lista plana

– Navegación más flexible, permite que la selección de opciones se realice en la misma pantalla

– Los más populares son los menús expansibles en cascadas • Menús primarios, secuandarios e incluso hasta 3 niveles

• Requiere un control preciso del ratón

• Puede provocar seleccionar opciones incorrectas

31/10/2013

16

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

• Interfaces WIMP: Menú

– Menú en cascada

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

• Interfaces WIMP: Menú

• Menú contextual – Otorga acceso a comandos más usados que tienen sentido

en el contexto de la tarea actual

– Aparece cuando el usuario presiona la tecla Control mientras también presiona algún otro elemento de la interfaz

– Ayuda a superar algunos problemas de navegación asociados con los menus en cascada

31/10/2013

17

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

• Interfaces WIMP: Menú

– Ventajas

• Entrenamiento reducido

• Toma de decisión estructurada

• Permite el uso de herramientas de gestión de diálogos

• Errores fáciles de gestionar

– Desventajas

• Peligro de muchos menús

• Puede hacerlo más lento a usuarios experimentados

• Requiere una visualización rápida

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

• Interfaz por menú: Consideraciones de diseño e

investigación

– ¿Cuáles son los mejores nombres / etiquetas / frases

a utilizar?

– La ubicación de los elementos en la lista es un factor

crítico (cardsorting)

– Ej: Quit / Save necesitan estar separadas

– Existen varias directrices internacionales que

enfatizan sobre la navegación, estructura,

profundidad... – Ej: ISO 9241

31/10/2013

18

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

• Interfaces WIMP: Iconos

– Los iconos son más fáciles de aprender y recordar que los comandos

– Pueden diseñarse para ser compactos y con posiciones que varían en la pantalla

– Actualmente son popular en todas la aplicaciones y sistemas operativos

• Representan objetos del escritorio, herramientas (e.g., paintbrush), aplicaciones (e.g., web browser) y operaciones (e.g., cut, paste, next)

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

• Interfaces WIMP: Iconos

– Desde su comienzo en Xerox Star los iconos han ido cambiando su aspecto:

– Blanco y negro → color, sombras, imágenes fotorrealistas, visualizacion en 3D, animación

– Muchos iconos han sido diseñados de forma muy detallada y han sido animados para hacerlos visualmente atractivos e informativos

– En la actualidad las interfaces GUIs son altamente motivadoras, con numerosos iconos incorporados

31/10/2013

19

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

• Interfaces WIMP: Iconos

• Forma de los iconos – El mapeo entre la representación y lo que representan

puede ser: • similar (una imagen de un fichero representa al objeto fichero),

• análogo (una imagen de unas tijeras representa ‘cut’)

• arbitrario (el uso de una X representa ‘delete’)

– Los iconos más efectivos son los similares

– Determinadas operaciones son acciones difíciles de representar • Usar una combinación de objetos y símbolos que capturan la

parte más destacada de la acción

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

• Interfaces WIMP: Iconos

– Primeros iconos

31/10/2013

20

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

• Interfaces WIMP: Iconos

– Iconos recientes

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

• Interfaces WIMP: Iconos

– Iconos simples + etiquetas

31/10/2013

21

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

• Interfaz por iconos: Consideraciones de diseño

e investigación

– Existen recursos que no tienen iconos asociados o

fáciles de dibujar y/inventar

• Guías de estilo, estándares, librerías

– Las etiquetas se pueden usar junto con los iconos

para mejorar la identificación

– Utilización de rollovers para grandes conjuntos de

iconos (e.g., procesadores de texto, editores de

fotografía)

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

• Ejemplo: Iconos de una cámara de fotos

Toshiba

31/10/2013

22

Tema: Paradigmas de Interacción

Interfaces WIMP/GUI

Trabajo:

• Realizar prototipos de iconos simples para representar las siguientes operaciones que deberían aparecer en la pantalla de una cámara digital: – Borrar la última foto que se ha sacado

– Borrar todas las fotos guardadas

– Formatear la tarjeta de memoria

• Evaluar vuestros diseños con usuarios

Tema: Paradigmas de Interacción

Evolución histórica

Interfaces en los ’90

– Interfaces multimedia

– Realidad virtual

– Hipertexto, Web

– Voz

– Lápices, gestos (simples), pantalla táctil

31/10/2013

23

Tema: Paradigmas de Interacción

Interfaces Multimedia

• Consiste en la combinación de varios medios (texto, gráficos, audio, vídeo, animación) en una sola interfaz con diferentes formas de interactuar

• Los usuarios interactúan a través de enlaces en imágenes o texto para:

– Lanzar una aplicación o programa

– Ejecutar videos o animaciones

– Moverse de un lugar a otro de la aplicación

• Una interfaz multimedia exige la presencia de

interactividad e integración entre los medios.

Tema: Paradigmas de Interacción

Interfaces Multimedia

• Entorno de aprendizaje multimedia BioBlast

31/10/2013

24

Tema: Paradigmas de Interacción

Interfaces Multimedia

• Ventajas – Facilita un acceso rápido a diferentes formas de

representación de la información

– Permite un aprendizaje fácil y una mayor comprensión

– Permite que los usuarios puedan explorar diferentes partes de un juego, una historia, un tema de estudio...

– Generalmente incluye vídeos y animaciones junto con textos y diagramas

• Desventajas – Si no se diseña y planifica correctamente puede

generar frustración.

Tema: Paradigmas de Interacción

Interfaces Multimedia

• Consideraciones de diseño e investigación – Hay que diseñar las aplicaciones multimedia para

ayudar a los usuarios a explorar, seguir e integrar las diferentes representaciones • Proveer simulaciones y ejemplos interactivos que el usuario

tenga que completar para resolver una tarea

• Usar ‘dynalinking,’ donde la información que se muestra en una pantalla cambie en relación a lo que ocurra en otra (Scaife y Rogers, 1996).

– Existen diferentes guías de estilo que recomiendan como combinar múltiples medios para diferentes tipos de tarea

31/10/2013

25

Tema: Paradigmas de Interacción

Interfaces web

• Interfaz Web

– Los primeros sitios web estaban basados en texto,

con hipervínculos

– Se comienza a tener en cuenta como estructurar la

información de la mejor manera posible para permitir

que los usuarios naveguen y accedan a la información

de forma fácil y rápida

– Actualmente en este tipo de interfaces se hace

hincapié en que las páginas sean distintivas,

llamativas, ...

Tema: Paradigmas de Interacción

Interfaces web

31/10/2013

26

Tema: Paradigmas de Interacción

Interfaces web

• Interfaz Web: Swim

Tema: Paradigmas de Interacción

Interfaces web

• Interfaz Web: Consideraciones de diseño e investigación – Las interfaces web se están convirtiendo en GUIs

– Debate: ¿usable o atractivo?

– Es necesario considerar cuál es la mejor forma de diseñar, presentar y estructurar la información para lograr un buen funciomiento del sistema

– El contenido y la navegación también son temas centrales

– Principios de diseño de Veen

(1) ¿Dónde estoy?

(2) ¿A dónde puedo ir?

(3) ¿Qué hay aquí?

31/10/2013

27

Tema: Paradigmas de Interacción

Interfaces web

• Ejemplo: Nike.com website

Tema: Paradigmas de Interacción

Interfaces web

• Trabajo: Análisis del sitio web Nike.com

–¿Qué tipo de website es?

–¿Contradice los principios de Veen? ¿Es eso importante?

– ¿Qué tipo de experiencia de usuario ofrece?

– ¿Cuál es tu experiencia como usuario?

31/10/2013

28

Tema: Paradigmas de Interacción

Realidad Virtual

• Simulaciones gráficas generadas por ordenador

que proveen:

– “the illusion of participation in a synthetic environment

rather than external observation of such an

environment” (Gigante, 1993)

• Nuevos tipos de experiencias, que permiten que

los usuarios interactúen con los objetos y

naveguen por el espacio 3D

• Creación de experiencias de usuario muy

atractivas

Tema: Paradigmas de Interacción

Realidad Virtual

• Puede dar un mayor nivel de fidelidad en la representación de los objetos

• Induce a un sentido de presencia donde la persona “siente” las experiencias – “a state of consciousness, the (psychological) sense of

being in the virtual environment” (Slater and Wilbur, 1999)

• Permite diferentes puntos de vista: 1ª y 3ª persona

• Hay que tener cuidado con el tipo de periféricos – Los cascos no suelen ser confortables

y pueden causar mareos y desorientación

31/10/2013

29

Tema: Paradigmas de Interacción

Realidad Virtual

d

Tema: Paradigmas de Interacción

Realidad Virtual

• Consideraciones de diseño e investigación

– Hay mucha investigación en cómo diseñar RV realista y de forma segura para facilitar el entrenamiento • Por ej: simuladores de vuelo

• Tratamiento de fobias (arañas, hablar en público)

– Consideraciones de diseño • Tener en cuenta cuál es el mejor modo de navegar: ¿1ª o 3ª

persona?

• Tener en cuenta cómo controlar las interacciones y los movimientos (utilizar movimientos de cabeza y cuerpo)

• Considerar cuál es el mejor modo de interactuar con la información (uso de teclas, punteros, joystick)

• Considerar el nivel de realismo necesario para dar sensación de presencia

31/10/2013

30

Tema: Paradigmas de Interacción

Realidad Virtual

• Ejemplo

¿Cuál es el juego de “snake” más atractivo?

¿Cómo se presentaría este juego en Realidad Virtual?

Tema: Paradigmas de Interacción

Interfaces por voz

31/10/2013

31

Tema: Paradigmas de Interacción

Interfaces por voz

• Interfaz por voz

– La persona interactúa con un sistema a través del lenguaje, por ej, planificador de viaje, telefonía

– Generalmente se utiliza para sistemas que ofrecen informacion muy específica, como realización de determinadas transacciones (comprar un billete de tren, etc).

– También se utiliza para personas con limitaciones

• Reconocimiento de lenguaje en procesadores de texto, lectores de web, sistemas de control del hogar

Tema: Paradigmas de Interacción

Interfaces por voz

• El uso más popular de los sistemas de interacción por voz corresponden a respuesta automática en telefonía:

– Los usuarios deben especificar sus requerimientos con sus propias palabras

• “Tengo problemas con mi buzón de voz”

– Y el sistema ofrece automaticamente el servicio apropiado

• ¿Cuál es vuestra experiencia con estos sistemas?

31/10/2013

32

Tema: Paradigmas de Interacción

Interfaces por voz

• Lenguaje natural

Tema: Paradigmas de Interacción

Interfaces por voz

• Lenguaje natural

– Ventajas • Conocimiento del propio lenguaje

• Uso de la voz, por tanto, manos libres

– Desventajas • Interfaces todavía no inteligentes

– Funcionalidades y conceptos

• Diferencias en lenguajes, argots, voces – Pueden ser necesarios diálogos de clarificación

31/10/2013

33

Tema: Paradigmas de Interacción

Interfaces por voz

• Consideraciones de diseño e investigación:

– ¿Cómo diseñar sistemas que puedan seguir una conversación?

• Ayudar a una navegación eficiente a través de un sistema de menús

• Permitir recuperarse fácilmente de los errores

– Tener en cuenta el tipo de voz del actor (hombre, mujer, neutral, dialectos)

• ¿la gente prefiere escuchar y es más paciente con una voz de hombre o de mujer? ¿qué acento es mejor/peor tolerado?

Tema: Paradigmas de Interacción

Interfaces móviles

• Interfaces móviles

– Dispositivos para llevar en la mano y utlizarlos mientras la persona se mueve. Por ej, PDAs, teléfonos móviles

– Las aplicaciones que se ejecutan en este tipos de dispositivos se han multiplicado en el último tiempo

• En restaurantes para hacer pedidos

• En supermercados para verificar el stock

• En educación para soportar aprendizaje a distancia

31/10/2013

34

Tema: Paradigmas de Interacción

Interfaces móviles

• Teléfonos móviles ¿accesibles para todos?

Tema: Paradigmas de Interacción

wikipedia

Interfaces móviles: panorámica

En 2011 se vendieron un 11% que en 2010

31/10/2013

35

Tema:

dotMobi

Interfaces móviles: panorámica

En 2011 las ventas de smartphones supusieron un 31’8%

Tema:

• Pantallas pequeñas, número reducido de teclas y de controles

• Uso de pantallas táctiles (¡pero no todos!)

• Diseños fisicos muy variados

• La orientación del dispositivo puede cambiar

• La usabilidad y las preferencias pueden variar enormemente dependiendo de la destreza y de la entrega del usuario.

Interfaces móviles: desafíos

31/10/2013

36

Tema:

Screen Resolution and Formats

dotMobi

Tamaños de pantalla

reducidos

Interfaces móviles: desafíos

Tema:

Numeric Keyboard and Joystick

Half Keyboard and Ball

Full Keyboard and Touchscreen

Touchscreen

(Multi-touch)

Cursor Keys

Interfaces móviles: desafíos

Diseños físicos muy variados

31/10/2013

37

Tema: Paradigmas de Interacción

Interfaces móviles

• Consideraciones de diseño e investigación

– A pesar de los avances en interfaces móviles pueden ser complicadas de usar, a diferencia de las GUIs

– Especialmente para personas con pocas habilidades manuales o con manos grandes

– La clave consiste en diseñar para pantallas pequeñas reales y controlar el espacio limitado que poseen

Tema: Paradigmas de Interacción

Interfaces móviles

• No hay que considerar sólo a los teléfonos

móviles, también hay que tener en cuenta

interfaces móviles para cubrir necesidades

especiales.

31/10/2013

38

Tema: Paradigmas de Interacción

Interfaces colaborativas

• Interfaces colaborativas

– Están diseñadas para que se usen por más de un usuario al mismo tiempo

• Múltiples entradas, incluso permite entradas simultáneas por grupos

• Dispositivos de visualización grandes, o de pared, donde la gente puede interactuar a través de lápices o gestos

• Mesas interactivas donde pequeños grupos pueden interactuar con la información utilizando sus manos / dedos

Tema: Paradigmas de Interacción

Interfaces colaborativas

• Smartboard

• DiamondTouch Tabletop

31/10/2013

39

Tema: Paradigmas de Interacción

Interfaces colaborativas

• Consideraciones de diseño e investigación

– Estilo de interacción directo y fluido que incluye gestos, utilizar las manos o lápices.

– El diseño debe tener en cuenta el efecto en la colaboración del tamaño, la orientación y la forma del dispositivo

– Las superficies horizontales soportan mejor el trabajo colaborativo que las verticales

– Utilizar mesas (tabletops) más grandes no mejora el trabajo en grupo pero facilita la división del trabajo

Tema: Paradigmas de Interacción

Interfaces tangibles

• Interfaces tangibles:

– Interacción basada en objetos físicos que tienen una

representación digital

– Cuando una persona manipula los objetos físicos

produce un efecto digital, como lanzar una animación

– Los efectos digitales pueden tener lugar en diferentes

medios o espacios físicos, o pueden estar embebidos

en el objeto físico

31/10/2013

40

Tema: Paradigmas de Interacción

Interfaces tangibles

Chromarium cubes Flow Blocks

Tema: Paradigmas de Interacción

Interfaces tangibles

• Consideraciones de diseño e investigación

– El tipo de relación que se utiliza entre la acción física y el efecto digital

• Si se trata de una aplicación educativa este mapeo es crítico

• Si se trata de una aplicación de entretenimiento se puede establecer un mapeo más implícito e inesperado

– Hay que considerar el objeto físico a utilizar

• Normalmente se utilizan bloques, cubos, porque son simples y ofrecen flexibilidad

• También se utilizan tarjetas con marcadores si se trabaja sobre una superficie

31/10/2013

41

Tema: Paradigmas de Interacción

Interfaces portables

• Interfaces portables

– Los primeros desarrollos consistían en cámaras montadas en la cabeza o en gafas que permitían al usuario grabar lo que veía y acceder a información digital

– Luego se introducen joyas, sombreros, ropa inteligente, zapatos, chaquetas... • Permiten que el usuario pueda interactuar con información

digital mientras se mueve

– Las aplicaciones incluyen visitas turísiticas

Tema: Paradigmas de Interacción

Interfaces portables

• http://www.youtube.com/watch?v=9c6W4CCU9M4&feature=player_embedded

31/10/2013

42

Tema: Paradigmas de Interacción

Interfaces portables

• Consideraciones de diseño e investigación – Comfort

• Tienen que ser ligeros, pequeños, preferiblemente ocultos en la ropa

– Higiene

• Se pueden lavar o limpiar las ropas una vez usadas?

– Fácil de llevar

• Tener en cuenta que tan fácil es quitar un dispositivo electrónico y cambiarlo por otro

– Usabilidad

• Tener en cuenta como puede controlar el usuario los dispositivos embebidos en la ropa

Tema: Paradigmas de Interacción

Realidad Aumentada y Mixta

• En la Realidad Aumentada se superponen representaciones virtuales sobre dispositivos físicos u objetos

• En la Realidad Mixta se combina la visualización del mundo real con visualizaciones de un entorno virtual

• Existen muchas aplicaciones desarrolladas: en medicina, juegos, simulaciones, etc.

31/10/2013

43

Tema: Paradigmas de Interacción

Realidad Aumentada y Mixta

• Aplicaciones:

– Medicina:

• Objetos virtuales como rayos-X y escáneres se superponen

sobre parte del cuerpo del paciente

• Ayudan a los médicos a entender qué es lo que se examina o

se opera

– Control de tráfico aéreo

• Se superpone sobre la pantalla de vídeo información dinámica

de los despegues y aterrizajes de aeronaves virtuales junto

con los planos reales

• Permite realizar planes y simulaciones de gestión de tráfico,

etc.

Tema: Paradigmas de Interacción

• Aplicaciones: reconstrucción arquitectónica:

Vilars

Realidad Aumentada y Mixta

31/10/2013

44

Tema: Paradigmas de Interacción

Realidad Aumentada y Mixta

• Aplicaciones: Juegos

Tema:

Realidad Aumentada y Mixta

¿Realidad Aumentada “inteligente”?

• Aplicaciones de Smartphone que intentan guiar

a usuarios caminando por una ciudad:

– Se superponen flechas e información local (e.g.

McDonalds más cercano) en una imagen de la calle

en la que está caminando el usuario

– ¿Significa esto que la gente perderá más tiempo

mirando su smartphone que mirando los lugares por

los que pasa?

31/10/2013

45

Tema: Paradigmas de Interacción

• Aplicaciones: visitas guiadas

Realidad Aumentada y Mixta

Tema: Paradigmas de Interacción

Realidad Aumentada y Mixta

• Consideraciones de diseño e investigación

– ¿Qué tipo de “aumento” digital?

• ¿Cuándo y dónde en el entorno físico?

• Necesidad de llevarlo a cabo sin que produzca distracciones de las tareas que se tienen que llevar a cabo

• Necesidad de ser capaz de alinear correctamente los objetos del mundo real

– ¿Qué tipo de dispositivo?

• Smartphone

• Gafas

• ¿otros...?

31/10/2013

46

Tema: Paradigmas de Interacción

Tipos de interfaces

Interfaces en los ‘80 –Comandos –WIMP/GUI

Interfaces en los ’90 –Multimedia, –Realidad virtual –Hipertexto, Web –Voz –Lápices, gestos (simples), pantalla táctil

Interfaces en el 2000 –Móvil –Multimodal (Gestos) (kinect) –Cooperativa, colaborativa –Tangible , Multitouch (Perceptive Pixel) –Realidad mezclada y aumentada –Portable –Cerebro-ordenador (BCI) –Interacción WII

Tema: Paradigmas de Interacción

¿Qué interfaz es mejor?

• Para aprendizaje ¿son mejores las interfaces multimedia o las tangibles?

• ¿La interfaz por voz es tan efectiva como una interfaz basada en comandos?

• ¿Una interfaz multimodal es más efectiva que una monomodal?

• Los entornos virtuales ¿son los mejores para juegos?

• Las interfaces colaborativas ¿son mejores para soportar la comunicación comparadas con los PCs en red?

31/10/2013

47

Tema: Paradigmas de Interacción

Resumen

• Desde la era de las WIMP/GUI han surgido muchas interfaces innovadoras incluyendo voz, móviles, portables, tangibles, etc.

• Para decidir que interfaz usar hay que considerar aspectos de diseño e investigación

• Las interfaces web cada vez se asemejan más a las interfaces basadas en multimedia

• Una consideración importante que subyace en el diseño de cualquier interfaz es cómo se representará la información al usuario de forma que pueda llevar a cabo una tarea determinada


Recommended