Alzado.org

Web 2.0: los nuevos desafíos de la interfaz de usuario

En los últimos meses, en los medios impresos y en internet se habla cada vez más de weblogs (los ya conocidos diarios personales online, con comentarios y citas cruzadas a otros weblogs), se comparten juegos, vídeos o fotografías con familiares o amigos en sitios como Flickr o MySpace, se difunden noticias mediante podcasting (archivos de sonido que se descargan y se pueden escuchar y reproducir en cualquier momento), se coeditan de forma participativa enciclopedias online, como Wikipedia, se consultan o cuelgan anuncios clasificados en Craigslist o Loquo, se añaden textos o tags (la llamada folksonomia) a las fotografías, música, etc., que se cuelgan en la red, para que otros las puedan buscar en sitios web como del.icio.us, se suscriben los usuarios a agregadores de contenido, permitido por RSS, mediante el que los sitios comunican automáticamente sus actualizaciones a sus suscriptores, se utilizan procesadores de texto que recurren a internet como plataforma (Writely), etc.

Esta enorme actividad, esta marea de nuevos anglicismos, está cambiando el mundo de las telecomunicaciones, de los medios de comunicación, del marketing, del software, del entretenimiento,etc. Todo este nuevo conjunto de medios forma lo que algunos llaman la Web 2.0, la nueva etapa de la cambiante internet, la nueva versión en la evolución de internet.

Sin embargo, algunas de las nuevas tecnologías o desarrollos que posibilitan la web 2.0, las Rich Internet Application (RIA) como AJAX, plantean desafíos de usabilidad en sus interfaces y formas de interacción. A. Bosworth ha recogido de forma breve una lista con algunos de los problemas o errores que provoca AJAX (cancelación del botón volver atrás del navegador, dificultad para guardar en favoritos las páginas o de pasarlas a amigos, parpadeos inesperados en algunaspartes de las páginas, etc.).

Hay dos aspectos que son fundamentales en el diseño de las interfaces, que deberían tenerse en cuenta especialmente:

* diseñar sistemas intuitivos de interacción
* informar a los usuarios la respuesta que tienen sus acciones en la pantalla

Hacer interfaces intuitivos y sistemas claros de interacción.

Hasta ahora, al llegar a una página la mayoría de los usuarios saben cómo interactuar: si ven un enlace saben que es para ir a otra página, conocen que deben pulsar un botón para realizar una acción o, en un formulario, saben cómo seleccionar elementos mediante botones de opción, casillas de verificación, etc. En las nuevas aplicaciones, la interacción es mucho mayor, pero los usuarios no tienen un modelo mental claro de su funcionamiento. Se introducen novedades que les pueden generar problemas. No son intuitivas y no siguen las convenciones actuales, por lo que no está claro qué deben hacer los usuarios para interactuar, lo que les exige un proceso de aprendizaje, que puede ser difícil para algunos.

Delante de uno de los mapas interactivos de Google el usuario puede no saber cómo interactuar, no darse cuenta que pulsando el ratón y manteniéndolo pulsado sobre un punto del mapa y arrastrándolo puede desplazarse por el mapa.

En los mapas de Yahoo el cursor tiene un aspecto un poco más descriptivo, con el dedo índice de la mano apuntando, lo que ayuda un poco, y la mano cerrada, como cogiendo algo, cuando se desplaza.

Esta falta de affordance, es decir, de elementos o características del diseño que indiquen las acciones posibles o cómo algo puede utilizarse, es clara en muchas de las aplicaciones realizadas con Ajax. Los usuarios que las conozcan pueden no tener problemas, pero para los usuarios no expertos supondrá un tiempo de aprendizaje, con los consiguientes perjuicios. Por ejemplo, en la imagen siguiente no es intuitivo que los módulos rectangulares se pueden arrastrar y cambiar de lugar, según lo desee el usuario. No hay ningún elemento que lo indique.

Una vez que el cursor se sitúa en la zona azul superior del módulo, cambia de aspecto, pasando a un formato en cruz, y, además, aparecen varios iconos en la parte de la derecha y de la izquierda y la etiqueta â??Editarâ? subrayada.Pero puede ser demasiado tarde para muchos usuarios, que pueden abandonar la página sin conocer esta posibilidad.

En otras aplicaciones, como el de la imagen inferior, no existen elementos de interacción o controles claros, por lo que se ha optado por ofrecer textos explicativos sobre cómo interactuar en la parte de la derecha.

Sin embargo, este recurso no es el más apropiado, puede ser una solución provisional. Los diseños deben ser autoexplicativos, sin necesidad de descripciones de cómo interactuar. En una interfaz las pistas visuales deben explicar su funcionamiento sin descripciones.

En las imágenes siguientes, extraídas de Flickr, no se utilizan controles intuitivos que comuniquen al usuario que los pies de página de las fotografías son editables. Debe pulsar en el texto para que aparezcan los campos de texto para su edición.

Estamos en un momento en el que es necesario inventar o rediseñar nuevos controles o convenciones de interfaces de usuario. Un ejemplo de esto es lo que se hace con el desplazador o indicador de progreso utilizado en las imágenes siguientes.


Amazon


Etrade


Google


Yahoo

Comunicar visualmente los cambios de la pantalla al usuario

El usuario de internet está acostumbrado que al realizar una acción, por ejemplo, pulsando un botón, aparezca durante unos instantes una pantalla oscura y luego, se descargue una nueva página en respuesta a su acción. Este modelo de interacción de petición-respuesta desaparece en algunas de las aplicaciones desarrolladas con RIA o Ajax.

Estas aplicaciones operan con otro modelo de interacción. Por ejemplo, en Ajax el usuario no tiene que esperar la respuesta del servidor a su acción, no interactúa, se detiene y espera. Ajax funciona como un intermediario entre el usuario y el servidor que trabaja en un segundo plano en el intercambio de datos, actualizando sólo partes o elementos de la página. Esto hace más rápida la interacción y evita esperas, pero puede crear problemas a los usuarios al poderles pasar desapercibidos los cambios, dudando si su acción a llegado al sitio.

Uno los principios de usabilidad es tener siempre informados a los usuarios sobre el estado del sistema, dando pistas visuales sobre qué esta ocurriendo, por ejemplo,ofreciendo feedback al usuario de su acción sin dejar dudas sobre si funciona o no.

Algunas RIA no desencadenan la respuesta esperada en los interfaces web y su forma de cambiar su contenido no capta suficientemente la atención del usuario, y no lo percibe.

Se han intentado algunas alternativas para destacar los cambios, utilizando principalmente el color y la animación. El correo electrónico Gmail de Google ofrece en la parte superior derecha una caja roja que indica que la página se está recargando.

Otra técnica utilizada es la de colorear el fondo de la parte que cambia, como en la imagen inferior.

Posibles aplicaciones a entidades financieras

Ofrecemos a continuación algunos de los usos posibles de los nuevos desarrollos, algunos de los cuales ya han sido implementados o son fáciles de deducir. El verdadero potencial está en la creatividad que permiten estas aplicaciones, relativamente fáciles y económicas de desarrollar. Veamos algunos ejemplos de uso:

Como en la mayoría de las ocasiones en las que se introducen novedades, se presta demasiada atención a la tecnología y existe muy poco interés por las interfaces que utilizarán los usuarios. Se debe aprender la lección de etapas anteriores y se debe comenzar a tener en cuenta a los usuarios desde el principio para poder generar aplicaciones de internet intuitivas que faciliten la interacción. Ahora puede ser el momento, antes que se establezcan los estándares de hecho inadecuados, de que se generen convenciones de interfaces y sistemas de interacción intuitivos y fáciles para las personas.

Salir de la versión móvil