Tentándole (interacción)

francisco tosete | usabilidad, interacción, diseño y arquitectura de información

histórico de posts

August 26, 2009

Truco de verano para Visio: Moverse por páginas con el teclado

Un utilísimo atajo de teclado que cualquier Diseñador de Interacción que prototipe interfaces trabajando con Microsoft Visio debería conocer:

Moverse página adelante / página atrás: ctrl + AvPág / RePág

A disfrutar de las vacaciones ;-)

July 29, 2009

Cerrado por vacaciones

Filed under: Viviendo la vida

Se acabó el “curso académico” y toca relajarse y disfrutar de unas bien merecidas vacaciones en los próximos días. Querido lector, nos reencontramos a finales de septiembre - comienzos de octubre. Entierra el portátil en el cajón más remoto de la cómoda bajo siete llaves y…

…disfruta de un estupendo verano

Opera, Gestos faciales, interacción táctil, diseño de interacción emocional e interfaces orgánicas

Por distintas razones este post no ha podido ver la luz hasta ahora y lo he ido actualizando poco a poco. En estos tres últimos meses es sorprendente la avalancha de novedades y la cantidad de dispositivos, interfaces y patrones de interacción nuevos que he podido ver. Entre otros, os aconsejo echar un vistazo a la web de la compañía sueca The Astonishing Tribe, concretamente a su sección Showroom. Sin más, os dejo con el post.

–O–

No sé quién será la persona a la que se le ha ocurrido la idea pero desde luego creo que ha abierto un campo de investigación en el que hay mucho, mucho por decir, por escribir, por explorar y en el que se pueden hacer muchas cosas.

Opera fue el primer navegador que introdujo los gestos de ratón para interactuar con el mismo a la hora de navegar, una característica competitiva que Firefox debería incorporar de forma nativa dado que tiene una de las mejores extensiones que se han desarrollado hasta la fecha para el navegador: all-in-one-gestures.

Aunque no se ha utilizado casi la interacción mediante gestos del ratón creo que es precursora de las interfaces táctiles y mientras llegan este tipo de dispositivos con la nueva generación de sistemas operativos y se establecen y consolidan unos estándares para la interacción táctil y gestual sobre superficies, las aplicaciones (ya sea Firefox ya sea cualquier otra) y sistemas operativos deberían incorporarla.

Respecto a la interacción táctil no tengo en absoluto claro cómo será porque no veo a la gente manteniendo los brazos levantados durante 8 horas interactuando con una interfaz como la de Minority Report ni veo a la gente tocando constantemente una pantalla que está delante suyo con una inclinación de 120º o de 90º respecto a la vertical.


No es natural. Puntualmente puede que sí pero para una interacción durante un período tan dilatado de tiempo como toda una jornada laboral, la interacción con la interficie se tiene que dar ante todo, pienso, en un área en un plano horizontal.

Creo que todavía tiene que aparecer una nueva gama de periféricos de entrada para interactuar con el ordenador que supere las limitaciones que tiene el ratón. Por ejemplo, ahora mismo estoy escribiendo en una pantalla con una resolución de 1366x768 píxeles. El cursor de mi ratón ocupa aproximadamente 20 píxeles de ancho por 20 píxeles de alto y define un único punto de interacción en su punta igual que un bolígrafo.

Una infrautilización de nuestros principales periféricos de salida por excelencia, las manos y los dedos (en el sector recreativo ya han considerado que sea todo el cuerpo, ahí está el Proyecto Natal de Microsoft).


—- ( paréntesis ) —-

Portátil y prototipo de periférico de entrada de interacción táctil

Visión superior de un portátil y de un posible prototipo de área táctil como periférico de entrada en un plano horizontal.
Al estar situada a los lados del teclado y enfrente del mismo se define una superficie mucho más ergonómica para las dos manos, usable y adecuada que la de cualquier trackpad actual para desarrollar cualquier tipo de interacción táctil. Al ser un área única corrida tiene la ventaja de que las manos se pueden deslizar por toda la superficie táctil hasta unirse lo que podría ser útil para definir algunos tipos de interacción. Por contra presenta el problema de que en las esquinas derecha e izquierda inferiores puede ser un área en la que se sitúen las muñecas de nuestros brazos y antebrazos cuando no se encuentren a ambos lados del trackpad del portátil cuando estemos escribiendo.

Portatil. Periferico con areas tactiles separadas

Otra posible solución teniendo en cuenta el problema de las muñecas es plantear un nuevo prototipo de periférico que conste de tres superficies separadas, dos a ambos lados del portátil y una tercera enfrente. La ventaja de esté tipo de área táctil (y de la anterior) frente a los actuales trackpads es que definen una única superficie de interacción o superficies múltiples de interacción mucho mayores con las ventajas que ello conlleva en cuanto al desarrollo de nuevos módelos de interacción hombre-ordenador. Al tener áreas táctiles específicas para cada mano a izquierda y derecha se pueden definir nuevos patrones de interacción que podrían solucionar algunos de los problemas que existen en los sistemas operativos de hoy día al interactuar con los objetos virtuales. Las manos, en lugar de unirse físicamente pueden “unirse” directamente en la interficie virtual.

Por ejemplo, en un patrón de interacción como el de arrastrar y soltar sólo tenemos de una única herramienta para relacionarnos o interactuar con en el escritorio virtual, el cursor o puntero del ratón, que en el actual modelo de interacción hombre-ordenador, para microinteracciones puede tener un funcionamiento confuso o poco usable dado que tiene que servir para realizar diferentes acciones. En el mundo físico utilizamos las dos manos para realizar cualquier acción, disponiendo además de diez posibles herramientas para realizar microinteracciones, los diez dedos con sus correspondientes “punteros” las yemas de los dedos.

Cuando seleccionamos un objeto del escritorio de nuestro ordenador posicionamos el cursor sobre el mismo, presionamos el botón izquierdo y desplazamos el objeto. Existen diversas soluciones para dar un feedback al usuario e informarle de la acción que realiza. En Windows Vista por ejemplo, según desplazamos el cursor del ratón debajo arrastramos una réplica o thumbnail del objeto semitransparente que posicionamos sobre el área de destino sobre la que queremos soltarlo.

El problema que se presenta es que a veces el área de destino queda oculta bajo otras ventanas que tenemos abiertas. Así, antes de realizar dicha interacción tenemos que preparar la superficie de nuestro escritorio virtual de tal forma que podamos ver tanto el objeto que vamos a desplazar como el área de destino sobre la que queremos soltar el objeto a trasladar. En el mundo físico si queremos situar un objeto sobre una superficie que está ocupada por otros objetos, cogemos lo que queremos mover con una mano, mientras que con la otra, o con la misma que sostiene el objeto, apartamos los objetos que molestan -despejamos el área de destino- y finalmente posamos el objeto que estamos trasladando. En el mundo virtual y en el modelo de interacción actual no tenemos dos manos ni dos punteros, y aunque hay algún patrón de interacción similar que permite “apartar” objetos y posicionar otros como por ejemplo los módulos de Netvibes, el modelo de interacción es claramente inferior.

Disponiendo de un periférico como el reseñado tenemos la ventaja de que podríamos interactuar con las dos manos, así, podríamos tener dos focos de interacción (foco = puntero más o menos dado que un foco viene definido por el área espacial que abarcan los cinco dedos de una mano) Uno de estos focos o “punteros” podríamos utilizarlo para seleccionar el objeto e irlo arrastrando mientras con el otro foco “puntero”, podríamos ir apartando de enmedio las ventanas virtuales que nos molestasen.

Windows Vista. Arrastrar y soltar un objeto virtual como por ejemplo, un icono
Si quisiéramos desplazar el icono de Firefox desde su posición actual en el escritorio hasta otro punto situado debajo de las ventanas, la interacción nos resultaría imposible si previamente no apartamos éstas y dejamos despejada (visible) el área sobre la que vamos a actuar. Aunque algunos sistemas operativos como por ejemplo Leopard (Mac OS X) tienen atajos para despejar el escritorio o visualizar e intercambiar dinámicamente entre ventanas (exposé y dashboard) y aunque la próxima versión de Windows implementará algo similar (posicionando el cursor en la esquina inferior derecha de la pantalla todas las ventanas que tenemos abiertas se volverán transparentes para visualizar las superficies ocluidas) sería mucho más rico e interesante el modelo de interacción con el nuevo periférico propuesto, una mano para arrastrar el objeto virtual y otra para apartar las ventanas virtuales

El mundo real es mucho más rico (de momento) en cuanto a lo que a interacción física se refiere. Llevamos demasiado tiempo anclados en el paradigma de interacción de un único punto o herramienta para interactuar con los espacios virtuales -escritorios, World Wide Web, etc- el puntero o cursor del ratón. Ya va siendo hora de que comencemos a investigar y desarrollar nuevos modelos y perífericos, de que extendamos la máquina y la posibilidad de interactuar con ella más allá del ratón para superar estas graves carencias. Es hora de reclamar una interacción hombre-ordenador mucho más humana y natural y menos artificial. La tecnología actual ya puede permitir realizarlo con creces.

— ( /paréntesis ) —

Como artefacto cognitivo o herramienta que amplifica nuestras capacidades humanas el bolígrafo es mucho menos eficiente que un teclado en cuanto a la generación de escritura se refiere por varias razones:

  • gracias a éste último utilizamos los diez dedos de la mano asignando a cada uno de ellos un conjunto finito de teclas en un área espacialmente próxima. La superficie total cubierta por ambas manos sobre la que se puede interactuar simultáneamente es mucho mayor por ende que con la punta de un bolígrafo.
  • Frente al bolígrafo, la usabilidad de un teclado depende de factores ergonómicos tales como el tamaño de las teclas, la separación espacial de las mismas la elevación del teclado respecto de la superficie, la textura y el material de las teclas que define su adherencia, la resistencia frente a las pulsaciones.
  • Un teclado, al igual que una arquitectura de información es un mapa. Uno muy particular, pero al fin y al cabo un mapa que muestra a la vez todos los componentes de un espacio cognitivo, abstracto que podemos visualizar, y lo más importante, interiorizar y cuya explotación podemos mecanizar mediante una formación previa, un curso de mecanografía.

Un bolígrafo no muestra en su superficie el alfabeto. Éste lo tenemos interiorizado gracias también a una formación previa (educación) y gracias a la que formalizamos la escritura según dibujamos los trazos de las letras.

El gesto necesario para escribir una “a” es mucho más costoso y difícil de ejecutar físicamente que el realizar una pulsación sobre una pequeña superficie física definida, una tecla, que ofrece como resultado inmediato dicho carácter en un lapso de tiempo mucho menor y que, gracias a que existe en un espacio digital, en una interfaz líquida que puede ser dinámicamente alterada y reescrita puede ser editada en un brevísimo espacio de tiempo.

Por contra, frente a la especialización del teclado para un tipo concreto de tarea, la escritura, el bolígrafo es mucho más versátil funcionalmente ya que podemos ejecutar otras tareas que con el teclado es imposible como por ejemplo dibujar cualquier tipo de trazo.

Versatilidad versus especialización.

Eso es lo que hacen los artefactos y para eso utilizamos las herramientas. Para potenciar determinadas capacidades físicas y cognitivas frente a otras.

Ahora, después de la interacción por voz y de las interfaces táctiles, los ingenieros de Opera proponen un nuevo tipo de interacción basada en gestos de la cara y emociones:


Lo más sorprendente quizá, del concepto, es su faceta emocional. Toda la nueva investigación en cuanto al diseño de interacción emocional y de interfaces que se puede derivar de ella. O lo que es lo mismo, la pregunta que cabría plantearse es cómo podría o debería reaccionar una interfaz en cuanto al estado emocional de una persona en un momento determinado.

Opera. Gestos faciales para interactuar con el navegador
Captura de imagen de la web de los Labs de Opera. Gestos faciales para interactuar con el ordenador.

Algunos posibles escenarios que podrían imaginarse (al fin y al cabo las ideas son las que mueven a la innovación y al desarrollo):



Nota: los vídeos pueden verse con mucha mejor calidad en los Labs de Microsoft Office

Si el sistema operativo detectase que tenemos ojeras marcadas podría reaccionar aumentando el tamaño de las fuentes o de los componentes para facilitar la lectura (se podría presuponer que la persona ha pasado una noche de fiesta o ha dormido mal porque su hijo recién nacido no le ha dejado descansar mucho). Desde un punto de vista psicológico podría alterar el fondo de pantalla mostrando uno acorde con nuestro estado de ánimo, comenzando con tonos oscuros e imágenes del universo y cambiándolo paulatinamente hacia tonos claros como azules e imágenes del mar o de alguna playa caribeña. Al tiempo podría escoger y reproducir automáticamente una selección escogida de canciones de entre las almacenadas en nuestra biblioteca musical personal en nuestro disco duro o en línea. De forma paulatina el sistema operativo variaría la música que estuviésemos escuchando desde ritmos lentos (música clásica, jazz…) a ritmos vivos (pop, rock, punk) con el fin de mejorar nuestro estado anímico y emocional y nuestra productividad.

Los programas de videoconferencia podrían modificar dinámicamente su apariencia, tonos y colores, de acuerdo a nuestros gestos faciales que manifestarían nuestra respuesta emocional. Lo curioso (o lo preocupante) es que el que nos observa, si estamos realizando una videoconferencia, también podría valorar nuestra respuesta emocional de acuerdo a nuestras expresiones corporales simplemente viendo de qué color se vuelve la interfaz de su herramienta de mensajería.

En cuanto a la telefonía móvil y los nuevos dispositivos móviles, ahora que estamos entrando en la era de las pantallas táctiles y que tienen incorporados cámaras que podrían visualizar nuestra expresión facial mientras llevamos a cabo cualquier tipo de interacción con el dispositivo (escribir un mensaje de texto, consultar la agenda, etc) la posiblidad de que la interfaz respondiese de forma “orgánica” a nuestro estado anímico podría ser francamente interesante.

Hay está por ejemplo el espectacular y particular modelo de interacción emocional, gestual y natural sobre el que está trabajando Nokia. Besamos el teléfono para mandar un mensaje a nuestra persona favorita:


Para los cajeros bancarios, además de las posibilidades que ofrece en cuanto a seguridad biométrica, podría ser interesante su aplicación para personalizar la experiencia de usuario (hilo musical o efectos sonoros por ejemplo) y los colores de la interfaz en función del estado anímico del cliente. Sería una experiencia mucho más “amable” y cercana.

Por último, en cuanto a las personas con algún tipo de discapacidad física este tipo de interacción supone un avance que ha de ser investigado con mayor profundidad.

Interacción, emociones, diseño… lo importante, es soñar. Imaginemos hoy el futuro de mañana:



Vídeo hecho para Microsoft por Invivia para explorar cómo podríamos relacionarnos en entornos físicos y de Realidad Aumentada



Vídeo hecho para Microsoft por Invivia para explorar cómo podríamos relacionarnos en entornos físicos y de Realidad Aumentada



Un sueño en un entorno de Realidad Aumentada

Llama la atención cómo en el vídeo el hombre crea los objetos e interacciona con ellos con las yemas de los dedos. Exactamente igual que en el vídeo del prototipo del Sexto Sentido.

Video de el Sexto Sentido. Interaccion con los dedos de la mano

Diseño de interacción natural, diseño gestual y diseño emocional.

Excitante la investigación en los nuevos límites de nuestras disciplinas.

July 26, 2009

Innovando en periódicos digitales: Integración de Twitter en artículos en The Huffington Post

Filed under: Uncategorized

Conocí The Huffington Post hace ya un tiempo por una entrada que escribió Enrique Dans en su blog y la verdad es que tiene cosas muy interesantes. Por ejemplo, me gusta el módulo de enlaces abajo a mano derecha en la home y el tratamiento que hacen de las imágenes y la composición reticular.

Otra idea que me parece realmente una buena práctica a seguir es la integración directa de Twitter en artículos periodísticos escogidos.

The Huffington Post e integración de Twitter en artículo final
The Huffington Post e integración de Twitter en artículo final

Si echamos la mirada hacia atrás vemos que, con la introducción de cada nuevo soporte informativo y con la aparición de cada nuevo canal o medio, las barreras de la asincronía han tendido a diluirse en pro de la sincronía. Hoy la comunicación puede ser instantánea gracias a la telefonía móvil, a Internet, a los SMS, a Twitter.

La prensa acortó el período de tiempo que transcurría entre el acontecer de un suceso y su divulgación entre una gran masa de público. Aún así, debido a las limitaciones del soporte (físico, no dúctil ni maleable, como una interficie dinámica como el monitor) y del canal (distribución a través de los kioscos o puntos de venta o acceso ad-hoc) el período que transcurría desde que el periodista se informaba, redactaba la noticia, se aprobaba por el consejo de redacción, se imprimía, se distribuía y llegaba hasta las manos del usuario final podía ser francamente dilatado.

Con la introducción de las nuevas tecnologías esa barrera, como tantas otras, acaba de caer.

Definir en la plantilla del artículo un área dinámica para integrar un módulo de Twitter me parece una estupenda idea. Entre otras cosas:

  • Permite que el periodista cuente en tiempo real a los lectores las últimas novedades en relación al suceso relatado.
  • Permite que los lectores lo lean en tiempo real (¿cuando se ha visto actualizarse en tiempo real un artículo de un periódico impreso? ¡¡ !! )
  • Permite, si se habilita la posibilidad, que los usuarios participen informando a su vez sobre la noticia. La enriquece notablemente.
  • Fideliza a los lectores del periódico.
  • Les convierte en periodistas.
  • Crea comunidad social.
  • Aumenta la redifusión de los contenidos e introduce un componente viral francamente interesante

Por otro lado, Twitter, como los SMS, tiene una característica fundamental que hace de él un canal de comunicación único y ciertamente singular. Sólo permite emitir mensajes de 145 caracteres lo cual supone que la interacción para generar el mensaje se desarrolla en microtiempos con todo lo que ello conlleva de cara al usuario en cuanto a atención que tiene que prestar para su redacción, fidelización con la herramienta o facilidad de uso entre otros aspectos. Otro día hablaremos del diseño para microtiempos. Un aspecto esencial en interacción.

Un periódico digital no es, ni debe ser un periódico impreso. Los periódicos digitales tienen que ser más de lo que han sido hasta ahora en papel. Es absurdo que un periódico no tenga una alta frecuencia de actualización a lo largo del día frente a la edición de papel. Están desaprovechando una de las principales cualidades de la Web, la sincronía. No a la inmutabilidad. ¡¡Mejor sincronía!! inmediatez, novedad, tensión… conviértete en agencia difusora de noticias las 24 horas del día. ¡¡Crea atención constante!! lograrás un mayor tráfico y generarás mayores beneficios. El producto “enlatado” del periódico inmutable 24 horas puede tener su cierto sentido en la Web, pero mucho mejor mantener una home fundamentalmente dinámica con un alto grado de actualización y variabilidad.

Si además convertimos cada artículo en un potencial foco sincrónico de transmisión de información su valor a lo largo del tiempo y su consulta se potenciarán francamente. Y cuando no estén de actualidad decaerán, como sucede con cualquier producto documental impreso. La diferencia frente a estos es que gracias a la Web y a los buscadores no tenemos agujeros de memoria. El conocimiento puede, potencialmente, pervivir por siempre y ser accesible instantáneamente en cualquier momento en que le haga falta al usuario.

Integra Twitter en tus artículos y especialmente en la Home de tu periódico. La Web no es un papel impreso. Es interacción, es sincronía, es diálogo, canal bidireccional instantáneo. Un periódico digital es mucho más que uno impreso. A ver si pronto vemos algo de ello en alguno de los periódicos nacionales.

July 25, 2009

Realidad Aumentada en el iPhone 3.1

Apple quiere dar un empujón definitivo a las nuevas aplicaciones de Realidad Aumentada para el iPhone.


« Artículos anteriores | Artículos posteriores »





















Get free blog up and running in minutes with Blogsome
Theme designed by Hadley Wickham