Triangulitos, Columnas y Más: Aciertos de Usabilidad de un Menú Desplegable – Vol. 1

Ayer ingresé desde mi teléfono celular al sitio web del Festival de Jazz de Buenos Aires y me gustó mucho la usabilidad del menú. Resulta que el festival tiene varias sedes y artistas, y el sitio tiene la capacidad de mostrarle al usuario la información de distintas formas, otorgando una excelente experiencia de usuario.

Aprovecho para mencionar que utilizaré reglas heurísticas de usabilidad de Jakob Nielsen, principios de interacción de Bruce Tognazzini y principios heurísticos de Donald Norman para analizar la usabilidad de este sitio web.

Debajo tenemos una captura de pantalla con el menú superior – plegado – presentado como un elemento flotante.

post57_menujazzba1-2
Figura 1

Desde el comienzo podemos notar una muy buena práctica de usabilidad pues aparece la palabra Menú justo al lado del ícono del Hamburger Menu. Aparecen ambas referencias al menú sin comprometer la carga cognitiva del diseño.

Al presionar cualquiera de estos dos elementos se despliega debajo el menú, como se ve en la figura 2.

Continue reading Triangulitos, Columnas y Más: Aciertos de Usabilidad de un Menú Desplegable – Vol. 1

Usabilidad Engañosa en el Sitio de Facebook: ¿Fuiste una Víctima?

Adivinanza

Supongamos que querés usar Facebook en el celular, y al ingresar un día de repente aparece la pantalla debajo.

¿A dónde presionarías para desestimar la opción que Facebook sugiere?

post56_fbookux_1-0
Figura 1: ¿A dónde está la opción “Cancelar”?

Nota: si tardaste un segundo o más en encontrar el botón, sos víctima de la Usabilidad Engañosa…

Análisis de Usabilidad

A primera vista no parecería haber nada raro en el diseño de esta pantalla, pero analizándolo más detalladamente con heurísticas encontramos tres puntos interesantes.

Continue reading Usabilidad Engañosa en el Sitio de Facebook: ¿Fuiste una Víctima?

Illusion of Completeness: Destapando el Casillero Semi Cubierto

El otro día quise compartir un hipervínculo con mi celular y me pareció muy acertada la usabilidad del elemento interactivo que apareció. Este fue un ejemplo de cómo utilizar el concepto del ‘Illusion of Completeness’ adecuadamente para mejorar la experiencia de usuario.*

Siguiendo los principios heurísticos de Donald Norman, podemos decir que si hay Illusion of Completeness no se respeta el principio de Visualización de las Cosas:

Esto se debe hacer desde el lado de la operación para que el usuario sepa lo que es posible y cómo debe hacerse; y desde el lado de la evaluación para que el usuario pueda conocer el efecto de sus acciones. Las acciones del sistema deben corresponder con las intenciones y expectativas del usuario; y el estado del sistema debe ser visible (Fuente: notas de Gonzalo Auza para el curso de UX del Instituto Tecnológico Buenos Aires).

En mi caso, al mantener presionado el hipervínculo con mi dedo durante un segundo, lo que se conoce en inglés como ‘tap and hold’, apareció un rectángulo dividido en varios casilleros para que yo elija uno.

Captura de pantalla
Figura 1: Al hacer ‘tap and hold’ en la URL, apareció debajo un elemento con cuatro íconos.

Aparecían cuatro opciones visibles, pero lo interesante es que a la derecha del rectángulo parecía haber una opción más, semi escondida (mirar debajo la Figura 2 por favor).

Continue reading Illusion of Completeness: Destapando el Casillero Semi Cubierto

Minimalismo y Plantación de Árboles, una Excelente Combinación para la Experiencia de Usuario

Una de las diez reglas heurísticas de usabilidad de Jakob Nielsen es aplicar el minimalismo en el diseño, para evitar información de más que pueda provocar distracciones y así disminuir la velocidad del usuario.

En ese sentido, el sitio mobile de Ecosia me pareció impecable: al ingresar, solamente tres elementos nos llaman la atención. Los enumero, siguiendo la captura de pantalla, debajo.

Captura de pantalla.
Al ingresar, solo podemos ver 3 cosas. ¡Excelente usabilidad!

Continue reading Minimalismo y Plantación de Árboles, una Excelente Combinación para la Experiencia de Usuario

Evitando el ‘Illusion Of Completeness’; el caso de TechCrunch

El otro día estaba navegando con mi celular en Twitter y encontré un artículo que me gustó. Al querer leerlo me encontré con un excelente ejemplo de cómo evitar el ‘Illusion of Completeness’.

Al leer un tweet que hacía referencia a un artículo de TechCrunch, hice clic en el hipervínculo y se abrió el sitio web de TechCrunch.

Captura de pantalla.

Comencé a leer el artículo e hice scroll hacia abajo. En ese momento noté que había un párrafo cuyo texto contenía un degradé del color negro al gris.

Continue reading Evitando el ‘Illusion Of Completeness’; el caso de TechCrunch