No lo entiendo

Leo en Biguel.com un post de hace un tiempo en el que se dan unas recomendaciones para aumentar la credibilidad de una web.

En el libro The Design of Sites, hay un grupo de patrones de diseño de interacción dedicados exclusivamente a la credibilidad. Es una pena que no tengan una web en la que detallen los patrones un poco más (lo suficiente como para que mucha gente decida comprar el libro), porque son muy útiles.

Los dedicados a la credibilidad nos dicen que hay que tener:

• Imagen de marca a lo largo del sitio
• Suscripciones para mantener el contacto cliente-empresa.
• Información clara sobre la privacidad de los datos de los cliente.
• Información sobre la empresa, acercar la parte "física" al cliente.
• Ofrecer conexiones seguras.

Lo bueno de estos patrones es que tratan una necesidad tan esquiva como la credibilidad con soluciones concretas. Nos recomiendan los lugares estratégicos para colocar la información sobre la privacidad de datos, las preguntas frecuentes, cómo redactar boletines electrónicos, etc.

Cuando hacemos un análisis experto uno de los apartados que hay que evaluar es el de estructura y navegación. Hay una regla que nos dice que los menús de navegación no deben tener más de 7±2 elementos y que si superamos esta barrera estaremos saturando al usuario con información.

Esta regla viene del hecho de que una persona, en un momento y tarea dados, tiene la capacidad para recordar y manipular un máximo de 7±2 trozos de información (ver también "memoria de trabajo")

¿Necesita el usuario recordar un menú de navegación? yo creo que no. No debería importar si hay muchos elementos si se distinguen bien unos de otros. En la navegación el proceso mental más importante es el de la evaluación-selección, no el de la memorización.

Si necesitas un menú con más de 7 elementos, procura etiquetarlos de forma clara y distintiva. La cantidad no debería ser un problema.

Cuando cocino (bastante a menudo), procuro tener a mano mi huevo temporizador. El otro día lo perdí y tuve que utilizar el móvil para controlar el tiempo de un pastel en el  horno. Yo me empeñé en conseguir mi huevo, pero me decían "¿qué más te da? ¡si con el móvil también se puede hacer!".

Me paré a pensar por qué me gustaba tanto mi huevo si con los dos objetos podía hacer lo mismo. Tras un análisis no muy profundo, el huevo gana por goleada:

• Lo pongo en el tiempo que quiero con un simple giro de muñeca; no hay menús.
• Sé si está en marcha cuando escucho el tic-tac y de un vistazo rápido veo el tiempo que queda, mientras que la pantalla del móvil sólo se ve de cerca y de frente. 
• No me importa si se mancha mi huevo, porque se limpia fácilmente,  pero tocar el móvil con las manos llenas de masa de pan es muy desagradable.
• El huevo me trata de forma amable y me avisa discretamente cuando me quedan 5 minutos y cuando ya ha terminado el tiempo. El móvil tiene un sonido incordiante que hay que parar a propósito (es como un niño repitiendo sin parar "mamá, me aburro; mamá, me aburro...")

El huevo temporizador es un ejemplo de por qué  me gustan las aplicaciones pequeñas, orientadas a una meta y que sean muy eficientes. Pero la gente suele asociar más funciones = mejor producto y el valor de la experiencia de uso me sigue pareciendo una cosa difícil de explicar a terceros. Al final me hicieron utilizar el móvil.

Como siempre trabajo en equipos pequeño no me queda más remedio que echar muchas horas al día con una web. Vamos perfilando soluciones hasta que llega un momento en que ya tenemos la idea definitiva. Toca ponerla a funcionar e ir puliendo detalles.

En el proceso de desarrollo, cuando el sitio empieza a tener forma y funciones, poco a poco me voy convirtiendo en un "usuario experto", conozco cada palmo de la web y me planteo soluciones en las que no habías caído antes. Pero ¿cómo distingo las verdaderas mejoras de las necesidades de un usuario experto que tiene un conocimiento profundo de lo que construye? cada vez que tengo esta duda, cojo la persona principal para  el sitio en cuestión y me pongo es su lugar.

Me sigue pareciendo increíble lo bien que funcionan las personas para colocarte en perspectiva.

Ayer me di cuenta de una cosa muy útil del Safari, el navegador que utilizo habitualmente. Se trata de una de esas características totalmente transparentes, pero que te ayudan muchísimo cuando navegas.

Cuando abrimos varias pestañas con páginas de un mismo sitio web veremos las partes distintas del título de cada página. Lo explico con un pantallazo, que se entiende mucho mejor. He cogido el Firefox y en el Safari con varias pestañas abiertas de Amazon. Así es como se ven:

Safari, mostrando la parte distintiva del título de cada página.

Firefox, con títulos prácticamente iguales.

En las pestañas del Safari es muy fácil saber dónde están las páginas que nos interesan. En el Firefox vemos siempre la primera parte del título, que es igual en todas las páginas, lo que hace mucho más difícil localizar lo que nos interesa.

Es una idea sencilla y prácticamente invisible, de esos detalles que hacen que un programa sea más agradable de utilizar sin que sepas muy bien por qué.

Comenzamos a publicar los artículos de Galinus en una normativa del gallego más cercana al portugués. Como gallegohablante creo que en Galicia estamos desaprovechando la oportunidad de comunicarnos con una comunidad tan importante como la lusófona. Queremos experimentar con la normativa reintegracionista, que creemos más adecuada en la sociedad de la información.

Ès português, brasileiro, moçambicano, angolano, cabo-verdiano ou timorense? assina no noso livro de visitas, ficaremos muito obrigado.

No es nada que no sepa nadie, pero como me acaba pasar, lo comento: no hay mejor manera de ver tus propios errores que echarle un vistazo a tu trabajo tras un periodo de tiempo.

Cuando creas una web, ésta se vuelve tan familiar que se convierte en esas frases que no terminas pero que la gente más cercana a ti sabe perfectamente lo que significan... y que tanto desconciertan a los que no te conocen.

No voy a hablar de interfaces orientas a resultados, sino de los errores de usabilidad en las bitácoras... bueno, tampoco voy a hablar de eso, sino que aprovecho que se está discutiendo sobre el tema, que tengo sueño, apenas puedo pensar y que llevaba semanas dándole vueltas, para hacer esta bitácora "más usable": me voy a presentar.

Después de leer estos días Torresburriel y Terremoto.net le he tenido que echar un vistazo detenido al Alertbox R.I.P. WYSIWYG. La verdad, me ha sorprendido bastante.

Resumiendo brevemente las palabras de Nielsen: el modelo de interacción WYSIWYG está obsoleto y Microsoft propone un nuevo paradigma para dar el siguiente paso adelante: la interfaz orientada a los resultados, que se va a aplicar en el diseño del nuevo Office.

¿Es el WYSIWYG un modelo de interacción? yo creía que se trataba de un modo, es decir un estado en el que un programa se comporta de una forma en particular (en este caso, ofreciéndonos una previsualización de lo que vamos a ver por impresora, en un PDF, en un navegador, etc.). Jakob Nielsen le llama al modo WYSIWYG modelo de interacción estilo Mac, cuando en realidad el modelo es el WIMP (ventana, iconos, menús y dispositivo de control del cursor). Y a partir de esta asociación errónea "modo=modelo de interacción" habla de las limitaciones de la "interacción" WYSIWYG y cómo la interfaz orientada a resultados las va a solucionar.

Me parece una argumentación tan mal construida que parece impropia de un profesional.

Es una pena, porque creo que es un tema muy interesante (las interfaces gráficas WIMP son muy fáciles de entender, pero es cierto que llevan una carga de trabajo manual muy grande; explorar posibles soluciones a la relación entre función y espacio en pantalla que tan mal se adapta a los programas complejos).

Yo no tengo más que el nombre del nuevo paradigma y unos pantallazos para opinar. Sumido en la ignorancia me pregunto ¿cómo va a mejorar el diseño orientado a los resultados mi experiencia para mandar un correo, para navegar por la web, para subir unos ficheros por FTP, para escuchar música, para disfrutar de mi colección de fotos...?

Diseño centrado en objetivos, si le preguntas a Alan Cooper.

Diseño centrado en la actividad, si le preguntas a Don Norman.

Diseño centrado en el usuario, si le preguntas a la comunidad profesional.

Y ahora Microsoft propone el diseño centrado en los resultados.

¿Y tú con cuál te quedas?

A mí me gusta la visión de Don Norman. No hay mucho sobre métodos basados en la teoría de la actividad, pero me parece muy enriquecedora su reflexión sobre el diseño centrado en el usuario. Si la herramienta es buena, las personas se acaban adaptando a ella.

Hace unas semanas me quedaba un poco frío por la presentación del iPod Nano. El cacharro está muy bien porque apenas ocupa espacio. Yo ya no concibo cómo llevarme la música a todas partes sin un iPod y su integración con iTunes (por mucho que explico a mis amigos cómo se hace, es de esas cosas que hay que probar para ver lo fácil y rápido que es); pero en la presentación del pasado 7 de septiembre esperaba algo que me permitiese disfrutar del ordenador como centro de entretenimiento (¿es esto una enfermedad?).

Ahora, por fin, Apple saca sus nuevos iMac con control remoto para acceder a las fotos, vídeos y música.

¿Y cuántos botones tiene un mando a distancia que controle todas estas cosas? pues 6. Parece otro ejemplo de diseño sencillo y elegante tan típico de Apple.

¿Cómo se mide la felicidad? a veces me siento como si tratase de medir algo tan etéreo como esto.

Por desgracia en el diseño centrado en el usuario solemos trabajar con conceptos no mensurables. Y digo por desgracia porque disponer de cosas concretas facilita mucho el trabajo. Un programador sabe que el sistema que diseña va a recibir una serie de datos y tiene que dar una respuesta en función a esos datos de entrada; conoce el punto de partida y el punto de llegada: sólo hay que preocuparse de lo que hay en el medio. Un ingeniero conoce el presupuesto disponible, las condiciones del medio y las fuerzas límite que tiene que soportar una infraestructura; el problema ya está formulado y hay que buscar una solución óptima. Pero si te dedicas a la usabilidad no tendrás, generalmente, algo tan concreto a lo que agarrarte.

La mayoría de los métodos del diseño centrado en el usuario no ofrecen datos cuantitativos; y cuando los hay ¿podemos establecer una relación entre ellos y la "satisfacción media" del usuario?

¿Cuál es nuestra mejor herramienta teniendo en cuenta esta situación? yo creo que la esencia del diseño centrado en el usuario es hacerse buenas preguntas. Una buena pregunta es el comienzo de una buena respuesta y lo que hacen muchos de los métodos es darnos la perspectiva necesaria para formular estas preguntas.

Una es la búsqueda simple y otra la avanzada. Las diferencias son mínimas y una de ellas no creo ni que el usuario se percate.

 

Las búsquedas simples deben ser eso: simples. Una caja de texto, un botón y puede que algún filtro, como viene explicado en el patrón Search Box. El algoritmo de búsqueda debe ser el que haga el trabajo, no el usuario. Por ejemplo, si introduzco

el sistema podría distinguir fácilmente que "A Coruña" es el nombre de una provincia o de una localidad (lo tiene almacendo en una base de datos) y centrar las búsquedas en esos sitios ( y si hay un negocio que se llame "Informática A Coruña" de un gallego emigrado en Barcelona, que también lo muestre).

Pero en Paginas Amarillas le dan todo el trabajo al usuario: que lea cada campo y decida qué información va en qué caja de texto. Esto es un reflejo claro de un modelo de implementación en el que se refleja en la interfaz la estructura interna del programa, con su base de datos con distintos campos para la actividad, el nombre de la empresa, la provincia, etc.Pero cuando veo la búsqueda avanzada, me parece que esto ya no tiene ningún sentido.

Los patrones de diseño de interacción Search Box y Advanced Search dicen de forma clara y concisa cómo utilizar cada tipo de búsqueda.

¡No más biblias de 500 páginas! Louis Rosenfeld, uno de los autores de libro Information Architecture for the World Wide Web, está montando una nueva editorial sobre diseño de experiencias de usuario. Publicarán libros cortos (de unas 100-150 páginas) sobre métodos específicos, centrados en la parte práctica de la experiencia de usuario.

Uno de los primeros libros que se va a publicar será sobre cómo analizar los log de búsquedas de una web.

La idea me parece fantástica. Espero que salgan pronto a la venta.

Utilizamos la evaluación para detectar errores en sistemas que ya existen (una vez en funcionamiento o cuando todavía están en fase de desarrollo). El diseño nos sirve para traducir necesidades en soluciones para la interfaz. Entender la diferencia entre una cosa y otra a mí me ha ayudado a tener una visión más clara del diseño centrado en el usuario.

Ahí va un listado orientativo.

Métodos de evaluación

• Pruebas con usuarios.
• Análisis heurísticos.
• Análisis de estadísticas del sitio.
• Paseos cognitivos.

Métodos de diseño

• Personas y escenarios.
• Ordenación de tarjetas ('card-sorting').
• Patrones de diseño de interacción.

Esta división no es estanca. Por ejemplo, en unas pruebas de usuario de un prototipo puede hacer que veamos una solución a un problema de una forma totalmente nueva; el card-sorting nos puede a ayudar a ver problemas en el etiquetado o un patrón de interacción nos puede indicar fallos en lugares de la web ilustrándonos con una respuesta mejor al problema de diseño planteado. Hay que considerar la lista como una indicación de cuándo es más útil cada método.

Aprender a moverme en coche por la ciudad ha sido una experiencia curiosa. Desde un principio sabía que iba a tener una carga cognitiva enorme; quería ver cómo iba interiorizando movimientos y señales. Hubo un comportamiento que me sorprendió por su rotundidad y que viene al cuento con lo que comentaba ayer sobre la navegación global y local: una vez me había decidido por una forma de hacer una maniobra (un cambio de sentido, por ejemplo) cualquier otra opción se hacía invisible. Cuando oía una orden, rápidamente buscaba la solución, que generalmente no era la más fácil, sino la primera que veía.

Me acordé de la ceguera a los banners y ceguera a la navegación y de cómo el usuario en una web deja de lado cualquier elemento ajeno a sus objetivos . Suponiendo que este es el comportamiento mayoritario de los usuarios en una web ¿cómo lo traducimos a un método para el diseño de navegación?

Lo primero que hay que entender es que un usuario cuando llega a una página o bien sigue adelante intentando acercarse más a lo que busca o bien abandona la página (porque no encuentra lo que necesita ni pistas que lo acerquen más o porque ya tiene lo que necesitaba y sigue con otra tarea). Centrándonos en la navegación para el usuario que necesita seguir moviéndose por nuestra web, podemos aplicar lo siguiente:

• Centrarse en el contenido exclusivo de cada página. Diseñar para que este contenido sea lo más claro posible, aunque sea a costa de quitarle importancia a otros elementos, como la navegación global o local.
  
• Preguntarse en cada página ¿qué otra información de nuestro sitio es de interés para un usuario que esté en esta página concreta? buscar esas relaciones entre páginas del sitio y enlazar unas con otras. Los enlaces deben ser directos de una a otra, no a través de una categoría que las contiene (navegación contextual frente a navegación local o global).
  
• Identificar las palabras más descriptivas referentes al contenido y procurar utilizarlas en los enlaces (y que esto se identifiquen bien, por supuesto).
  
• Utilizar los enlaces dentro del texto central de las páginas.

Bueno... esto no es que sea un método, sino consejos, aunque espero que sea de ayuda. Además hay un problema: muchas veces el contenido de las páginas es responsabilidad de los redactores y no de arquitectos de la información. En ese caso no nos queda otra que dar unas guías de estilo y tener suerte y que nos hagan caso.

Lecturas interesantes:

• Interface Design Tip: Find the Epicenter. Los autores utilizan esta técnica en el diseño de aplicaciones web, no en páginas con contenido. Aunque no entiendo bien por qué no se puede utilizar este método para diseñar el contenido.
• The Page Paradigm.

Tradicionalmente se le ha dado bastante importancia al diseño de navegación en sitios web. Los métodos de evaluación expertos lo analizan con detalle y la estructura de navegación global, local y contextual es un recurso estándar para los arquitectos de la información (véase un ejemplo en las recomendaciones de estilo de la Universidad de Murcia).

Esquema fundamental de navegación

Pero últimamente no paro de preguntarme si no se perderá demasiado tiempo diseñando la navegación para que nos podamos situar con facilidad dentro de la estructura de un sitio.

No quiero decir que cuidar la navegación como reflejo de la estructura de la web sea una mala práctica; hace un par de meses encontraba unas recomendaciones sencillas sobre cómo diseñar una navegación efectiva que me siguen pareciendo útiles. Pero ahora que lo vuelvo a leer, me sorprende que en último lugar estén los objetivos del usuario. Además ¿cuándo fue la última vez que hiciste más de 3 clics consecutivos utilizando los menús de navegación globales o locales?

Catuxa intenta implicarme en una traducción a golpe de meme. Tengo que buscar 4 términos en inglés relacionados con internet y las nuevas tecnologías y traducirlos al español. Luego tengo que continuar esta cadena con otras 4 personas. Si alguno de ellos sigue con esto, que tambiéen incluya la herencia.

Ahí van mis terminos:

• wireframes: esquema de página.
• eye-tracking: seguimiento de mirada.
• information foraging: rastreo o forrajeo de información.
• widget: cacharro, aparatejo, "chintófano".

Herencia:
bookmark = favorito, marcador
browser = navegador
content management system (CMS) = gestor de contenidos
feed = canal, fuente
freeware = gratuito, edición gratuita
link = enlace
online = en línea
peer-to-peer = persona a persona
plugin = complemento, extensión
post = artículo, anotación, entrada
reader = lector
sidebar = menú lateral
social software = aplicaciones sociales
spam = basucorreo
tag = etiqueta
template = plantilla
trackback = retroenlace
weblog, blog = bitácora, cuaderno de anotaciones
webmaster = administrador
wallpaper = fondo de escritorio
findability = encontrabilidad, recuperabilidad
outsourcing = externalización
stemming = lematización
topic map = mapa conceptual

Se lo paso a

• María
• Juan Carlos
• Torresburiel
• Xiruela