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

En mi post anterior analicé el menú del sitio web del Festival de Jazz de Buenos Aires. Recordemos que el festival tiene varias sedes y artistas, y el sitio permite al usuario visualizar la información de distintas formas, otorgando una excelente experiencia de usuario.

Nuevamente, 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.

Lo que más me gustó de este menú flotante es el pequeño triangulito que aparece al lado de las palabras Programación, Entradas y Multimedia. No ocupa espacio y permite entender fácilmente que hay sub opciones para estas opciones.

En mi caso yo quería ver los artistas en base a las sedes y al presionar sobre Programación se desplegó la opción “X Sede”. ¡Perfecto, justo lo que necesitaba! Ver figuras 1 y 2 por favor.

post57_menujazzba3-2
Figura 1: Presioné el ‘triangulito’ para ver la programación.

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

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

¿Deberían Limitarse las Publicidades en Idioma Inglés en Argentina?

¿Viste alguna vez en un país extranjero una publicidad de gran envergadura en idioma no nativo?

En Argentina, y especialmente en Buenos Aires, hay una tendencia a asociar el idioma inglés con lo altivo, lo relacionado a la alta calidad.

Aclaro que este post – o mejor dicho, esta ‘entrada’ – está un poco fuera del foco de este blog, pero hace ya varios meses que me da vueltas en la cabeza el tema.

La publicidad, que siempre está atenta a las tendencias culturales, nos brinda innumerables ejemplos día a día: vemos carteles inmensos en la vía pública con frases en inglés, locales de ropa en ‘shoppings’ – mejor dicho, Centros Comerciales – con frases como ‘Winter Sale’, y sitios web publicitando servicios con frases de cabecera en el idioma anglo sajón. También está de moda usar remeras con frases elocuentes de todo tipo, casi siempre en inglés.

Continue reading ¿Deberían Limitarse las Publicidades en Idioma Inglés en Argentina?

Diseñando para el Error – Volúmen 3

En dos posts anteriores, titulados “Diseñando para el Error – Volúmen 1” y “Diseñando para el Error – Volúmen 2”, les comenté parcialmente acerca de la usabilidad de una página de reunión web (ver debajo).

Captura de pantalla

Debajo enumero los últimos tres ítems presentes en la captura de pantalla.

Voy a utilizar reglas heurísticas de usabilidad de Jakob Nielsen, principios de interacción de Bruce Tognazzini y principios heurísticos de Donald Norman para explicar cada punto (este post está orientado a heurísticas generales y no directamente relacionadas al diseño para el error):

Continue reading Diseñando para el Error – Volúmen 3

Folksonomía, Taxonomía, y más: La difícil Experiencia de Sacar un Turno Online

El otro día me enviaron una carta por una infracción vehicular que cometí y me informaron que debía obligatoriamente sacar un turno para hablar con un Agente de Faltas en una sede comunal específica. Para sacar un turno viví un proceso de usabilidad muy dudosa y me llevé una experiencia de usuario mala.

Al ingresar a la URL de turnos, me pedían primero un dato que no tiene mucho sentido para mí: el Dominio. ¿Qué es el Dominio? ¿El código de la infracción, la patente, mi DNI, algún otro dato que no sé de dónde sacar?

captura de pantalla
Pantalla 1

Debajo describo los pasos que aparecen en la captura de pantalla.

Continue reading Folksonomía, Taxonomía, y más: La difícil Experiencia de Sacar un Turno Online

Formularios y Experiencia de Usuario: Es Posible una Feliz Convivencia

Mi amiga Rocío me recomendó un artículo interesantísimo de Andrew Coyle en donde alista – acompañado de fotografías – buenas prácticas de usabilidad para el diseño de formularios.

Voy a nombrar solo una de ellas: “Use the field length as an affordance”.

captura de pantalla
Fuente: Andrew Coyle en https://uxdesign.cc/design-better-forms-96fadca0f49c#.v1w7dnajn

Aplicando el concepto de ‘affordance’, que se traduce como Ofrecimiento en español y tan bien describe Donald Norman en su libro The Design of Everyday Things, utilizar el largo de un campo para indicar al usuario el largo de la respuesta es una excelente práctica de usabilidad.

Si bien este detalle puede pasar desapercibido y parecer irrelevante, hace a la experiencia de usuario sin lugar a dudas.

En fin: ¡Recomendadísimo el artículo! https://uxdesign.cc/design-better-forms-96fadca0f49c#.v1w7dnajn

¿Cuál te pareció la recomendación menos sólida de todas?

¡Horror! Scrolling Horizontal en el Año 2016

Estaba navegando con mi computadora desktop en un sitio web, cuando de repente me encontré con una barra de scroll horizontal.

captura de pantalla

¡Oh no! ¡Qué horror!

En el año 2016, demás está decir que es una mala práctica para la experiencia de usuario que se incluya una barra de scrolling horizontal.

No tengo muchas más palabras, solo mencionar que sería genial que alguien en el equipo de desarrollo trabaje sobre este horror de usabilidad web.

¿Encontraste sitios con barra de scrolling horizontal este año? ¡Comentalos acá debajo!

Diseñando para el Error – Volúmen 2

En mi post anterior, titulado “Diseñando para el Error – Volúmen 1”, les comenté parcialmente acerca de la usabilidad de una página de reunión web (ver debajo).

Captura de pantalla

Debajo enumero los ítems 3 y 4 presentes en la captura de pantalla (en el post anterior describí los primeros dos ítems). En el siguiente y último post finalizaré el análisis.

Voy a utilizar reglas heurísticas de usabilidad de Jakob Nielsen, principios de interacción de Bruce Tognazzini y principios heurísticos de Donald Norman para explicar cada punto:

Continue reading Diseñando para el Error – Volúmen 2