Me gusta cómo Gmail no se apalanca y continúa tomando acciones para mejorar. Hace unas semanas nos avisó a todos del nuevo sistema de etiquetas para clasificar nuestros mails y de la forma tan cómoda de usarlas (arrastras el mail a la etiqueta o viceversa).
También hace unos días hablaba con lluís mientras que mirábamos un momento para entrar en su correo electrónico. Al estar en catalán, me llamó la atención que su checkbox tradicionalmente llamado “recordar contraseña” en el registro tuviera el mensaje de “permanecer conectado” (en catalán). Lo achaqué a que era la traducción que habían hecho al catalán de ese mensaje y como nos tuvimos que ir se nos olvidó. Hace unos minutos me he dado cuenta de que en mi home de Gmail en castellano también aparece ese mensaje (¿cuándo lo habían cambiado?).
¿Por qué implementar pequeñas funcionalidades cuando la herramienta ya funciona? ¿Por qué cuidar detalles que parecen que no pueden ser más revisados? Creo que la respuesta son tres aspectos: entender de una forma diferente el papel y la actitud de tu empresa (obviamente, por tus propios intereses), dar valor añadido a tu producto y cuidar a tu cliente / usuario.
Hace unas semanas vimos para clase el siguiente vídeo de Joshua Porter para Webstock 09 “Designing Sign Up Screens & Flows”. Se trata de una conferencia sobre las mejores prácticas que se pueden llevar a cabo para crear un formulario lo más fácil y atractivo posible. De este modo, el usuario puede saltar este escollo (que siempre le resulta molesto o fastidioso) para comenzar a usar nuestra aplicación.
Entre los consejos que aportaba estaban el de ofrecer un alta inmediata u ofrecer el servicio sin ningún tipo de compromiso o el mínimo posible.
Curiosamente, he leído hace un rato un artículo que daba la razón a ese último punto. Se trata de “The $300 Million Button” de Jared M. Spool. Es un artículo muy interesante porque (además de tener el título como de una película) cuanta cómo la simple modificación de un botón puede mejorar drásticamente el funcionamiento de un formulario y por tanto el rendimiento y los resultados de una Web. La clave estaba en explicar al usuario y ofrecerle la posibilidad de escoger. ¡leerlo si podéis!
Una vez acabada la recta final del postgrado, voy a escribir un post que llevaba tiempo deseando poner en mi blog. Se trata de un detalle que observé en la página web de la Agencia Tributaria.
Resulta que llega un usuario estándar como yo, con cero de ganas por buscar información sobre la declaración de la renta de este año y que con sólo pensarlo ya le entra dolor de cabeza. Con mi poca predisposición encuentro fácilmente el enlace en la home que me lleva a la Renta 2009. Y allí dentro empiezo a buscar algún enlace que me lleve a la solicitud del borrador.
primer menú para la declaración de la Renta 2009
En el menú comienzo a leer y encuentro el apartado de información… ¡bien! información es lo que yo necesito porque verdaderamente no sé qué para qué estoy buscando exactamente (de un año para otro las cosas se olvidan). Encuentro “borrador de la declaración de la renta”. Y pincho.
menú de información sobre la declaración
Entro y ojeo los enlaces. Miro alguno como “descripción general” para poder sentirme más seguro (sentir que tengo el control de la situación) antes de dar al fatídico enlace de “solícitud”. Por fin me decido y pincho para encontrarme a continuación lo siguiente:
solicitud de declaración en la información
¡Vaya! Creí que iba a poder hacer ya la solicitud… bueno, no importa, me dice los medios a partir de los cuales puedo hacerlo. ¿O no? Un momento… estoy en Internet, estoy en la web de la Agencia Tributiaria, estoy mirando dónde puedo pedir el borrador y… ¿a dónde me indicas? ¡Si ya estoy en www.agenciatributaria.es!
Moraleja: me dió muchísima rabia y encima me sentí más perdido en Spiderman en un desierto! ¿Qué les habría costado poner un enlace más profundo al formulario en cuestión? Es como si llegase al hospital corriendo con mi mujer dando a luz y en el mostrador le digo al enfermero o enfermera “¿A dónde puedo llevar a mi mujer?” y me responden “¡No se preocupe, llévela al hospital!”.
Son pequeños detalles pero tienes que contar que ese pequeño detalle va a ser luego un bache en el usuario que no está mirando en tu web si le ha tocado un premio sino que está con la fastidiosa declaración.
PD: Por cierto, la solución a todo esto estaba en el menú principal. Debajo de la “información” teníamos la “tramitación” pero mis ojos no llegaron a pasar por ahí. Por tanto, es inevitable que vayamos a dar determinadas cosas por sentado al plantear la usabilidad de una web, pero el usuario puede hacer cosas tan “raras” como dejar de leer toda la información cuando cree que ya ha encontrado la que le conviene.
Últimamente he leido en un par de post reflexiones en torno al valor de la información en la Web. La información es lo que mueve la Web y velar por su calidad, tanto lo que se refiere a mala/buena información como a la forma de llegar a ella (acceso y uso), debe ser lo que mueva a los que trabajan en la Web.
El último post de Daniel Torres Buriel trata este tema con ocasión de su conferencia en FESABID 2009. Daniel aclara que debemos “dal valor a aquello que no es tecnología”. Los estándares web, la accesibilidad más allá del tipo de dispositivo y el desarrollo de herramientas y su evolución responden a la satisfacción de necesidades concretas pero son exactamente eso: medios y herramientas. Pero lo importante es la información que genera el usuario y que la Web gestiona. Por tanto, la Web (residencia de la información) debe acercarse a las personas mediante la accesibilidad y la usabilidad y a la información mediante la arquitectura de la información. Porque los usuarios toman la información que les dan y además buscan la que le interesa. En el enlace está el post pero aquí incluyo también la key note que deja él mismo.
Por otra parte, en el post de César Martin para Alzado.org titulado “Más aplicaciones, menos información” analiza la situación actual de la prensa online y sugiere diferentes caminos para que esta se adapte a Internet de forma completa. Señala cuatro modos de optimizar su exitencia online y deja fuera la de aumentar el número de noticias/periodistas (aumentar la cantidad de información) y recomienda otras que confluyen en generar aplicaciones que se adapten y satisfagan lo que necesitan sus usuarios o que fomenten la calidad de su uso para a su vez generar beneficios a ese medio.
Creo pues que ambos coinciden en saber bien qué tiene valor (la información) y qué debe servir a ella (la tecnología aplicada bajo criterios de accesibilidad y usabilidad).
Recuerdo cuando era pequeño jugando a la Nintendo cómo a la hora de empezar la partida podías escoger tres modos de juego: fácil, normal o difícil. Estos tres modos definían la complejidad de los retos que tenías que afrontar para poder “pasarte”el videojuego. Era común “pasártelo” primero en modo fácil y acabar “pasándotelo” (no siempre) en modo difícil.
El artículo habla de la experiencia de usuario desde un punto de vista psicológico, centrándose en el aspecto de la atención que el autor llama flow. Flow es la atención del usuario puesto sobre una tarea concreta en una interfaz y que se surge de la relación entre la complejidad de esa interfaz y sus habilidades para manejarse con este tipo de herramientas. Para que el usuario pueda cumplir con su tarea necesita que propiciemos esta atención y eliminemos los agentes distractores externos e internos.
Por otro lado, el desequilibrio entre estos factores puede desembocar en aburrimiento (demasiado fácil) o en ansiedad (demasiado difícil). Por tanto, lo que el autor propone es el diseño controlando estos aspectos para propiciar una experiencia óptima del usuario y ofrecer al propio usuario que decida cómo de compleja quiere / necesita que sea la interfaz.Hay que tener en cuenta que también influye el grado de importancia de esa tarea en concreto o la situación o contexto en que se encuentra el usuario.
Cuando tanto la complejidad como las habilidades son de un alto grado (un usuario experimentado en una interfaz compleja) este experimenta lo que el autor llama arousal. Este estado se caracteriza por su alto grado de concentración, pérdida de noción de paso del tiempo, sensación de control absoluto de la interacción, etc.
¡Dios mio! No recuerdo exactamente una web donde me haya ocurrido pero… ¿por qué videojuego podría empezar?
He encontrado esta imagen en la Web y no podía resistir el incluirla. Se trata del Legend of Zelda para Super Nintendo. Al comienzo del juego te familiarizabas con los botones y con el funcionamiento. A medida que ibas recorriendo cada pantalla, los obstáculos y las pruebas se hacían más difíciles pero seguías intentándolo porque cada vez tenías más destreza para manejarte con los controles. Era en estos casos en que puedo poner la mano en el fuego y afirmar que lo que pasaba por mi cabeza… en fin, decir que era arousal es poco.
Otro ejemplo es el Bubble Bobble. Parecía un juego tremendamente fácil pero en las últimas pantallas no había nadie que lo consiguiera.
Conclusión: Por una parte, apuntar los consejos que aporta el autor para manejarnos con este concepto del flow. Entre otros, propiciar que todos los elementos del diseño, de la arquitectura de la información, de la navegación, etc. hagan el uso lo más sencillo posible. Esto incluye aportar un continuo feedback al usuario de las tareas que va cumpliendo. Y también, saber jugar con cada tipo de usuario y sus habilidades para ofrecerle lo que necesita (de lo más sencillo a lo más complejo).
Por otra parte, todo este camino nos lleva una vez más a reflexionar la importancia de que el usuario pueda tener la capacidad de poder decidir y configurar su interacción con la aplicación o la web. En el proyecto, hemos hablado de ofrecer al usuario la posibilidad o incluso el potencial de decidir cómo quiere que sea la estética y la jerarquización de su perfil o su usuario, así mismo este está decidiendo cómo quiere que sea de sencilla o compleja esta para el visitante.
El error 404 se produce cuando el servidor no encuentra la página que le solicitamos, esto puede deberse a un enlace roto, alguno de los documentos está mal enlazado (ya sea con otro dentro del mismo sitio, o en un buscador, o algún otro sitio), o simplemente la página ha caducado…
Aquí podemos encontrar algunos ejemplos divertidos que intentan especificar un resultado concreto y no un mensaje estándar, Situación que ayuda al usuario a encontrar la información que buscaba explicando qué ha ocurrido.
En la última clase de repaso de los wireframes y también en la clase de diseño hablamos mucho sobre formularios. Las funcionalidades que ofrecía la página de registro (que apareciese el check box de “Acepto las condiciones…” activado, los formularios para la activación de cuentas, los dos “examinar” para las imágenes en “Mi perfil”, la búsqueda de contenidos en nuestros proveedores a través de tags en sus sites… y en el fondo, muchas de las plantillas que identificamos las denominamos como “formularios”.
Investigando sobre el “diseño emocional” de Don Norman acabé en el blog “El Factor Humano” de Nelson Rodríguez-Peña. Está muy interestante e incluye mucha información sobre usabilidad. Uno de sus últimos post es sobre el reciente libro Web Form Design: Filling In the Blanks, de Luke Wroblewski. Nelson Rodríguez simplemente añade que el libro cumple con todas sus expectativas y más y lo recomienda como referencia en el azaroso mundo este de los formularios Web.
Ahora vamos a estar centrados en la fase de “hachazos” para acotar todos los aspectos que faltan de los wireframes y no tenemos mucho tiempo. De todos modos, en un futuro y con más tiempo puede ser muy intersante echar un vistacillo si no al libro (a no ser que alguien se lo compre) a las imágenes que el autor usa de ejemplo y que están disponibles en Flickr.
Hay muchísimos ejemplos de buenas y no tan buenas prácticas. Si nos hubiesen dicho toda la tela que lleva detrás esto de los formularios, no nos lo habríamos creido… de todos modos, como dice el autor, un formulario es una de las partes clave en la interacción con la Web ya sea para comprar entradas de cine, meter los datos para participar en alguna encuesta o concurso, registrarse en una red social, etc.
El Mediaculum es una aplicación web donde puedes reunir todos tus trabajos y mostrarlos en tu curriculum.
Para que el diseño de la web sea adecuado para el usuario, aplicamos la técnica de creación de “Escenarios de Uso” que facilita ponernos en el lugar del [...]
Aprofitant l’exercici de l’agregador de continguts personals, hem fet un CARD SORTING amb tots el continguts que hauria de tenir la pàgina. El primer pas ha sigut fer inventari de continguts que creiem que havien d’aparèixer al projecte entre tota la classe, després per grups, els hem posat cada un en un post-it i els hem classificat per categories. Gràcies a aquest procés és molt més senzill i visual estructurar i jerarquitzar el menú de la web i etiquetar (labeling) els títols de cada apartat.
Hi ha diferents aplicacions que permeten fer aquest procés online o mitjançant petits programes. Alguns exemples són: Optimal Sort, Websort o CardZort.
Hemos hecho un ejercicio de análisis de comparación de la usabilidad de dos sitios competidores. He juntado algunas de las preguntas que uno se puede hacer para determinar la usabilidad de un sitio web. Casi todas estas han surgido a lo largo del ejercicio y al comentarlos en clase, pero si se me ocurre alguna más, intentare añadirla.
Usabilidad
Se identifica bien de quien es sitio y a que se dedica?
Se identifica bien el sistema de navegación?
el usuario puede seleccionar los textos para copiarlos?
Diseño adaptable al tamaño de la ventana?
Es el tamaño de la tipografía correcto?
si hay banner cerca del logo, confunde?
Accesibilidad
tiene un saltar a contenido para que desde un movil o un ciego
tienen alt las imágenes?
explica de que va la pagina?
Tiene accesos de teclado?
Esta centrado el contenido en la ventana del navegador?
Se puede ver en un móvil?
Buscabilidad
indexación en google
esta bien hecho el seo?
Semántica
separación css/contenido
si esta en flash, esta insertado mediante javascript
Es necesario que este en flash? Se puede hacer sin?
Diseño
Usa bien el recurso de las imágenes?
Es consistente la estética
Como se ve en 800 x 600?
Influyen los banners mas de la cuenta en la percepción general de la estética?
Si hay animación en el banner, distrae demasiado del contenido?
Lanzaderas de selección de idioma: comunican algo?
Queda inaugurado el blog de Israel Perez Gonzalez, alumno del postgrado de Direccion y Proyectos web 2008/2009 de la escuela Superior de Diseño Elisava.