Usabilidad
Como una F, así es como leen los usuarios una página web. A una increíble velocidad nuestras vistas recorren la página creando la estela de una letra "F" en mayúscula.
Las áreas de color rojo son las que los usuarios miraron más; seguida de las amarillas,
luego las azules y, finalmente, las grises no atrajeron ninguna mirada
Estas imágenes forman parte del último estudio llevado a cabo por useit (la web del gurú de la usabilidad Jakob Nielsen) y que se ha publicado hoy día. El estudio es sobre la base de 232 usuarios que observaron miles de páginas Web. El resultado fue constante, aún en diferentes diseños. El modelo de lectura dominante se parece a una F y tiene tres componentes:
- En primer lugar, los usuarios leen con un movimiento horizontal, por lo general a través de la parte superior del área de contenido. Este componente inicial forma la barra superior de la F.
- Después, los usuarios bajan la página un poco (mueven el scrollbar) y luego leen en un segundo movimiento horizontal que típicamente cubre un área más corta que el movimiento anterior. Este elemento adicional forma la barra inferior de la F.
- Finalmente, los usuarios exploran el lado izquierdo del contenido en un movimiento vertical. A veces esto es una exploración lenta y sistemática que aparece como una raya sólida sobre un "eyetracking heatmap". Otros usuarios de veces se mueven más rápido, creando un "spottier heatmap". Este último elemento forma el tallo de la F.
Asi pues, el informe nos da algunas luces para mejorar nuestros diseños... En que áreas colocar el contenido más importante, en cuales algún texto ó gráfico de relleno, etc. Obviamente, esto no significa que todos usuarios no visualicen o revisen las demás partes de la página, no debemos descuidarlas.
Por fin, después de casi tres meses que Gmail añadió el botón "delete" a sus cuentas de correo en ingles, los usuarios de este servicio en español tenemos la misma comodidad para "suprimir" nuestros mensajes.
Como lo muestra la imagen, el boton suprimir ya esta en la interfase y ha sido puesto a la izquierda del menu desplegable. Antes, para borrar un mensaje se necesitaba seleccionarlo, pulsar en el desplegable y luego suprimir. Ahora, con el nuevo botón, estos pasos se han reducido, haciéndo a Gmail más agradable.
Prototype es una excelente librería JavaSript que nos facilita la construcción de aplicaciones dinámicas. Una muestra de la potencia de esta librería son los ajax workshops que esta creando la web de ajaxlessons.com.
Su último tutorial enseña como cambiar el contenido de una página web con Ajax y un menú de pestañas (Ver resultado final). Si bien, el tutorial es muy completo (incluye el diseño CSS), lo que realmente llama la atención es la facilidad con la que se pueden crear aplicaciones Ajax con Prototype.
Tutorial | Building Tabbed Content (Ingles)
Vía | Digg
Si haz usado flickr, te habrás quedado sorprendido del sistema que utiliza para editar rápidamente el título y la descripción de las fotografías. Crear este sistema es lo que vamos a aprender en este mini tutorial.
Si nunca has usado flickr, la idea básicamente consiste en:
- Mostrar el texto a editar.
- Indicar que el texto es editable cuando se pasa el puntero del mouse.
- Al hacer clic sobre el texto, se transforma en un formulario y podremos editarlo en la misma página.
- Dar la posibilidad de cancelar o guardar el texto modificado.
- Indicar que se estan guardando los cambios
- Mostrar el nuevo texto y la posibilidad de volver a editarlo
Puedes ver el ejemplo aquí: Edición in Situ con Ajax...
La voluntad de hacer al software más cómodo de usar tiene un auge vigente. Prueba de ello es la celebración, en todo el mundo, del día de la Usabilidad. Y ¿Es tan importante la Usabilidad? Por supuesto. Para poder cumplir nuestros objetivos con cualquier software, primero debemos sentirnos a gusto con el, debemos percibir que el software ayuda a desempeñarnos mejor de una manera fácil, sin ningún esfuerzo que sólo nos ocasione fastidio y frustración.
En este sentido, Cesar Soplín ha creado un agregador de sitios Web que hablan sobre usabilidad, estándares y tecnología. Desde ya cuenta con enlaces a muy buenos artículos sobre estos temas que valen la pena leer.
Agregador: Indexes
Enlace (Ingles): worldusabilityday.net
El diseño emocional es un modo de entender el humor de la gente y su conducta, en respuesta emocional al uso de un producto ó servicio.
El tema es tratado plenamente en el libro “Emotional Design” o Diseño Emocional, escrito por Donald Norman.
Basta la portada de su libro para notarla como ejemplo: El exprimidor de naranjas evoca fuertes emociones; nos disgusta o nos fascina.
No te has preguntado alguna vez ¿Por qué el vino tiene mejor sabor cuando se sirve en elegantes copas? ó ¿Por qué el coche impecable y brilloso, parece que se conduce con más facilidad?
Recientes investigaciones han demostrado cómo los objetos que nos resultan atractivos funcionan mucho mejor. No nos limitamos a usar un producto, sino que establecemos una relación emocional con él.
El Diseño emocional se demuestra, por primera vez, siempre que nos encontramos con un objeto. Nuestra reacción viene determinada no sólo por lo bien que pueda funcionar, sino por el aspecto que tiene, si nos parece atractivo e incluso por la nostalgia que suscita en nosotros.
Entrevista a Donald Norman: Donald Norman y el diseño emocional
