> Manuales > Usabilidad en la web

La tecnología Flash de Macromedia ha recibido duras críticas debido a la aparente escasez de aplicaciones que ejemplifiquen el diseño de interfaces que respeten principios básicos de Usabilidad. En éste artículo, tratamos de examinar el...

La tecnología Flash de Macromedia ha recibido duras críticas debido a la aparente escasez de aplicaciones que ejemplifiquen el diseño de interfaces que respeten principios básicos de Usabilidad. En éste artículo, tratamos de examinar el actual estado

Usabilidad definida

Diferentes disciplinas tienden a explicar el concepto de Usabilidad en formas que se ajustan a sus propios propósitos, y por tanto suelen depender de un contexto particular. Por otro lado, la facilidad de uso es sólo una parte de la ecuación, y por esa razón es que prefiero la definición orientada a la eficiencia que da ISO:

Usabilidad es el grado en que un producto puede ser utilizado por usuarios específicos para lograr metas específicas con efectividad, eficiencia y satisfacción en un contexto de uso específico.
(International Organization for Standardization, ISO 9241-11 1998)

Usabilidad, en el contexto del diseño de interfaces puede ser descrita como una evaluación multidimensional del nivel general de satisfacción con que un usuario es capaz de completar un conjunto de tareas específicas.

Si una imagen vale más que mil palabras...
Para bien o para mal, Flash ha cambiado la cara de la web. La omnipresencia del plugin ha determinado que Flash se convierta en un entorno viable para el desarrollo de aplicaciones de contenido multimedia. En ese sentido, las experiencias creadas con Flash se benefician de la tecnología, más allá de los gráficos y animaciones vectoriales.

Brindarle al usuario la habilidad de interactuar con aplicaciones en el navegador es una de las razones primordiales por las cuales Flash se ha convertido en la herramienta preferida por diseñadores de interacción alrededor del mundo. Asimismo, la capacidad de presentar fácilmente diferentes segmentos de información sin necesidad de cambiar o “actualizar” la página, juega un rol importante en que cada vez más aplicaciones que trabajan con datos dinámicos sean desarrolladas en Flash.

Por otro lado, el soporte de video streaming y su creciente calidad en las últimas versiones del reproductor de Flash, lo han convertido en el plugin de video mejor distribuido del mercado, siendo rápidamente adoptado frente a alternativas propietarias, que además son difíciles de ajustar a escenarios particulares.

Si Flash es tan bueno, cuál es el problema de Jakob Nielsen?

Hacia Octubre del 2000, Jakob Nielsen, reconocido purista de la Usabilidad en la web, escribía en una pieza titulada “Flash 99% Malo”:

La tecnología Flash no promueve la Usabilidad por tres razones: incrementa las posibilidades de malos diseños, rompe con el estilo de interacción fundamental de la Web, y consume recursos que serían mejor utilizados mejorando el valor intrínseco del sitio.
(Jakob Nielsen, Flash 99% Bad)

Aunque éste artículo fue actualizado en Junio del 2002, cuando Macromedia lanzó Flash MX al mercado, introduciendo características que facilitaban la creación de aplicaciones más usables y accesibles (con la venia del Sr. Nielsen), el documento es singularmente representativo del tipo de acusaciones de las que ha sido objeto la tecnología Flash, a lo largo de su existencia.

De hecho, algunos extremistas de la Usabilidad llegan a ningunear el rol del diseño visual en la creación de interfaces amigables, y demandan que los creadores de contenidos eviten a toda costa el uso de cualquier tipo de elementos que requieran de plugins, o incluso imágenes. Los fundamentos varían, pero todos coinciden en que la web fue creada para publicar texto exclusivamente, negando casi 10 años de historia y evolución de Internet.

Para muestra, un botón: El website de Jakob Nielsen es un vívido ejemplo de las fortalezas y debilidades de usar HTML puro en el diseño de un recurso informativo.

Por otro lado, es sumamente importante que tengamos en cuenta que los juicios que los detractores de Flash expresan, están basados en experiencias de segunda mano. Resulta obvio que profesionales no conocen ni han trabajado con la herramienta, y por ello expresan opiniones acerca de lo que la gente ha hecho con Flash, y no en las capacidades reales del producto.

Basado en mi experiencia personal, me siento seguro al decir que Flash provee poderosas herramientas que, utilizadas correctamente, pueden ser puestas al servicio de la Usabilidad. De la misma manera, Flash no es de forma alguna una solución universal, y propone retos como cualquier otra tecnología. Está en nuestras manos discernir donde y cuando una aplicación Flash puede ser la respuesta a nuestras necesidades, y éste artículo pretende servir de orientación, examinando algunos de los problemas encontrados con mayor frecuencia, y su impacto en el diseño y desarrollo de aplicaciones Flash.

DESAFIOS DE LA USABILIDAD EN FLASH

1. Detección del reproductor de Flash

De acuerdo a las más recientes estadísticas publicadas por Macromedia, alrededor del 99% de usuarios de Internet en Europa puede acceder a aplicaciones Flash automáticamente, al contar con el plugin ya instalado en sus computadores. Aunque estos números se ven muy bien, la versión más reciente (Flash Player 7) representa sólo el 92.3% del total de instalaciones, acercándose al final de su ciclo de propagación con un incremento de casi el 4% desde el último censo hace 3 meses.


Típicamente, cada nueva versión del reproductor de Flash tarde entre doce y catorce meses en conquistar la barrera del 90%, que suele ser un indicador importante de que el terreno es ya “seguro” para aquellos desarrolladores que desean implementar aplicaciones que hagan uso de propiedades exclusivas del plugin más nuevo. Mientras tanto, múltiples versiones mayores y menores del reproductor de Flash coexisten en el universo de usuarios de Internet, tal y como se puede apreciar en el gráfico.

Esta información es indudablemente valiosa, pero no más que nuestro conocimiento de las características demográficas propias del proyecto en nos toque trabajar concretamente. Los números publicados por Macromedia son una referencia global, y pueden no reflejar la realidad particular de nuestro público objetivo. En ese sentido, las capacidades del reproductor que elijamos pueden tener diferentes niveles de impacto en lo que los usuarios pueden (o no) ver o hacer.

Estas son las razones que hacen necesaria la implementación de alguna forma de detección del reproductor de Flash. Entre las opciones que tenemos a nuestra disposición, no existe un método 100% efectivo, ya siempre cabe la posibilidad de que la detección falle, ya sea por latencia en la red o limitaciones del método elegido.

Los métodos ampliamente utilizados son tres:
2. Saltar Intros (del todo)

El de los tristemente célebres “intros” es un clásico caso de justificación, en Diseño. Generalmente, los intros suelen tener como objetivo impresionar al visitante haciendo derroche de creatividad, muchas veces en extremo. Mientras que en algunas ocasiones una página de inicio puede ser necesaria para filtrar el público objetivo o brindar información que los usuarios deben considerar antes de acceder a un website, en la gran mayoría de los casos, su presencia es innecesaria y hasta inconveniente.

Debemos entender que los visitantes de un website o los usuarios de una aplicación tienen un objetivo definido o tareas que desean llevar a cabo. Si ponemos obstáculos innecesarios, lo más probable es que estemos restándole eficiencia al trabajo de nuestros usuarios.

Como alternativa a los intros, ofrecer un demo o presentación como parte del contenido del website es recomendable.

3. Carga y precarga

Dada la naturaleza cinemática de Flash, es siempre una buena idea asegurarse de que los contenidos estén cargados en sus respectivo fotogramas, antes de intentar mostrarlos. En una película Flash, los elementos de cada cuadro deben estar disponibles antes de que el segmento pueda ser reproducido sin errores. Si, por ejemplo, el fondo de una aplicación fuera una fotografía de gran tamaño, probablemente pasarían varios segundos antes de que la interfaz pudiera ser mostrada, especialmente si el usuario no cuenta con una conexión a Internet de alta velocidad.

Aquí es donde el concepto de “precarga” es introducido. Básicamente se trata de detener la reproducción de una película, hasta que cierta cantidad del archivo ha sido cargado (no necesariamente el 100%), mientras el usuario es informado del progreso, ya sea cuantitativa como cualitativamente. Mientras que un simple mensaje de “Cargando...” puede ser demasiado escueto, es posible caer en el absurdo de mostrar la cantidad de bytes cargados, bytes totales y restantes, tiempo transcurrido y restante, ancho de banda relativo, etc., todo a la vez, y pretender que para el usuario tenga sentido. No dejar al usuario adivinando es importante, así como lo es brindar información que le sea relevante y fácilmente asimilable.

Por otro lado, para evitar largas esperas, es conveniente separar una aplicación voluminosa en secciones menores, y usar un contenedor para cargar las partes convenientemente.

4. Navegación

La eficiencia de un sistema de navegación depende en gran medida lo exitosa que haya sido la organización de la información. Discutir tópicos de Arquitectura de la Información no es el objeto de este artículo, pero si lo es la apariencia y funcionamiento de los elementos conformantes de un sistema de navegación eficiente.

Innovar no significa tener que reinventar la rueda en cada proyecto, sino construir sobre la base de modelos existentes. En otras palabras, enriquecer las experiencias implica ser consistentes con lo que el usuario conoce y acepta. Por ejemplo, un botón debe parecer y actuar como los botones que resultan familiares a todos quienes hemos utilizado el computador alguna vez.

Lamentablemente, la total libertad creativa que nos permite Flash ha determinado que se contravengan estas reglas básicas, y que se publiquen productos que rompen con los esquemas de forma negativa. Uno de mis maestros (en la música) me dijo alguna vez, que para intentar romper las reglas primero debía conocerlas muy bien. Este principio es igualmente importante en el campo de la comunicación visual: una vez que sabemos lo que funciona y lo que no, seremos capaces de “doblar” las reglas, sin romperlas.

En su afán de protegernos de nosotros mismos, Macromedia ha venido integrando componentes de interfaz a las últimas versiones de Flash, con el objetivo de uniformizar la manera en que nuestras aplicaciones lucen y funcionan.

5. Trabajando con texto

Ciertamente Flash es el standard de facto para la animación vectorial, es también una fuerte alternativa a otros plugins capaces de reproducir video en la web. Sin embargo, no es el mejor medio para mostrar grandes cantidades de información en forma de texto.

Aunque la última versión del reproductor de Flash soporta un cierto grupo de características de las hojas de estilo CSS, permitiendo darle formato a campos de texto con contenidos tanto estáticos como dinámicos, el motor de procesamiento de textos todavía carece de capacidades que son nativas del standard HTML desde hace años. Por ejemplo, es imposible tener texto en dos columnas, a menos que se tengan dos campos de texto separados. Asimismo, es muy difícil predecir cuanto espacio ocupará una cierta cantidad de texto y establecer un método de paginación.

Es por estas razones que sitios de noticias, y otros que requieren mostrar cantidades de texto significativas, suelen recurrir a soluciones híbridas.

Otro motivo es que el tamaño del texto de una película Flash no se ve afectado cuando el usuario decide cambiar el tamaño de la fuente en las preferencias del navegador. Afortunadamente, es posible manipular en tiempo real ciertas propiedades de textos, incluyendo el tamaño de la fuente, a través del objeto TextFormat, tal y como se puede ver en este ejemplo.

6. Contenidos dinámicos

Uno de los puntos establecidos por Jakob Nielsen en su crítica de los sitios desarrollados en su totalidad con Flash, era que resultaba difícil mantenerlos actualizados, ya que era necesario editar directamente el archivo fuente para realizar hasta el más pequeño de los cambios.

El día de hoy, es consabido que existe una gran variedad de técnicas que nos permiten manipular datos desde Flash, tanto de entrada como de salida. Ya sea a través de simples documentos de texto o XML, o gracias a la integración de aplicaciones Flash con fuentes de datos dinámicos usando Flash Remoting y Web Services, es claro que mostrar datos frescos en una aplicación Flash es relativamente sencillo, una vez elegido el método adecuado.

Probablemente elegir la técnica a usarse sea lo que represente un desafío, ya que no siempre resulta sencillo. Muchas son las variables en juego y casi siempre vamos a tener que depender de la infraestructura, personal y conocimientos ya disponibles para nuestro equipo de trabajo.

7. Transferir archivos

Regulaciones de seguridad limitan el acceso del reproductor de Flash a funciones propias del sistema operativo. Una de las más reclamadas, es la capacidad de acceder a los archivos, y poder leer y escribir en el disco del usuario, más allá de las limitantes de las supercookies de Flash. Es por este motivo que no existen campos de archivo entre los componentes de interfaz ofrecidos por Macromedia, lo cual hace imposible que un formulario hecho en Flash pueda, por ejemplo, transferir un archivo desde el computador del usuario a un servidor remoto.

Hace algún tiempo, encontré éste obstáculo mientras desarrollaba una solución para un cliente. Más tarde, ensayando una solución general, introduje una técnica basada en el trabajo conjunto de Flash, Javascript y PHP. El tutorial fue publicado en After-hours.org, un sitio que sirve de punto de encuentro a parte de la comunidad “flashera” de habla hispana.

Básicamente, se trata de usar un marco oculto donde colocar tantos campos de archivo como nos hagan falta, y usar Javascript para establecer comunicaciones entre ambos marcos, el que esta oculto y el que alberga al formulario hecho con Flash. El rol de PHP está limitado a subir el archivo o archivos al servidor, así que es intercambiable por cualquier otra tecnología que usen regularmente, ya sea ColdFusion, JSP, ASP, etc.

8. Aplicaciones Flash indexables

Una de las preguntas que encontramos con mayor frecuencia al elegir Flash para construir un sitio, es si los usuarios podrán encontrarlo en los buscadores. La respuesta no es siempre sencilla, pues depende de varios factores. Google, por ejemplo es capaz de indexar textos y seguir enlaces que se encuentren en una película Flash. Al hablar de texto contenido nos referimos a texto que fue introducido directamente en modo de edición, no información recibida de fuentes externas

Algunas soluciones, como colocar textos de fuentes externas en forma de comentarios en el código HTML, suelen funcionar, mientras que redireccionar spiders a páginas especiales es considerado abuso y puede repercutir negativamente en el posicionamiento de una web en los diferentes motores de búsqueda. Para ellos, no existe nada mejor que contenido relevante y accesible. En ese sentido, aplicaciones híbridas (Flash/HTML) suelen tener los mejores resultados.

Una alternativa usada para reemplazar encabezados por películas Flash, con el propósito de utilizar tipografía especial es sIFR. Desarrollado por Shaun Inman, Mike Davidson, Tomas Jogin y Mark Wubben, y actualmente en su versión 2, sIFR está empezando a ser usado por más y más diseñadores alrededor del mundo, incluyendo su servidor.
Más información.

Por otro lado SEFFS, desarrollado por Claus Wahlers e inspirado por sFIR, es una técnica experimental que permite procesar un documento XHTML y reemplazarlo por una película Flash que lo procesa y redefine; después de todo, XHTML es solamente un tipo especial de XML.
Más información.

9. Flash Accesible

Usando Flash MX 2004 y su panel de Accesibilidad, es posible que algunos lectores de pantallas puedan detectar ciertos elementos de una película Flash, y de esta manera hacerlos accesibles a personas con problemas de visión. Sin embargo, esta característica requiere la versión 7 del reproductor de Flash, Microsoft Internet Explorer y un lector de pantalla compatible con la implementación de Macromedia, actualmente Windows-Eyes de GW Micro, o JAWS de Freedom Scientific.

Información detallada acerca de como desarrollar aplicaciones Flash accesibles puede ser encontrada en el Macromedia Accesibility Center, y ejemplos de sitios creados con Accesibilidad están disponible en este compendio publicado por Bob Regan.

10. Pruebas de Usabilidad

Una evaluación cualitativa de la Usabilidad de una aplicación debe ser parte del proceso de diseño, y no del control de calidad, como suele ocurrir cotidianamente. No me atrevo a consignar un número aquí, pero por la gran mayoría de estudios de Usabilidad llevados a cabo en los Estados Unidos no tienen ningún valor, ya que al enterarse de las deficiencias de un sistema cuando está terminado, es muy difícil tomar acciones correctivas, considerando la posible ramificación de sus repercusiones.

Una evaluación cuantitativa o de casuística, que comúnmente se conoce como prueba de Usabilidad es lo que nos ayudará a determinar en que medida se cumplieron los objetivos.

Como pueden ver, se trata de acciones complementarias, y no excluyentes. Mientras que diseñar usa aplicación teniendo al público en mente no ayuda a establecer metas y cometer menos errores, o por lo menos errores menos fundamentales, una evaluación del producto terminado nos ayuda a determinar el nivel de Usabilidad alcanzado, corregir errores más manejables, y documentar lecciones aprendidas.

La envergadura de estas evaluaciones siempre dependerá del presupuesto disponible, pero es necesario tenerlas en cuenta para la asignación de recursos. Algunas firmas prefieren que las pruebas de Usabilidad sean llevadas a cabo por compañías especializadas, o bajo la dirección de un consultor. Cualquiera sea el caso, es importante resaltar que nuestra participación como productores de contenido es crítica: la mejor consultoría de Usabilidad del mundo no conoce nuestro producto mejor que nosotros mismos.

Oscar Trelles

Manual