Análisis Heuristico Impala Vintage – Gerard López Chacon

Gerard Lopez Chacon
Visibilidad: Pública - - comentario en Análisis Heuristico Impala Vintage – Gerard López Chacon

Análisis Heuristico Impala Vintage – Gerard López Chacon

Gerard Lopez Chacon
Visibilidad: Pública - - comentario en Análisis Heuristico Impala Vintage – Gerard López Chacon
Impala Vintage es un sitio web dedicado a la venta de ropa y accesorios de estilo vintage. Metodologia El análisis de Impala…
Impala Vintage es un sitio web dedicado a la venta de ropa y accesorios de estilo vintage. Metodologia El…

Impala Vintage es un sitio web dedicado a la venta de ropa y accesorios de estilo vintage.

Metodologia

El análisis de Impala Vintage realizado se basa en los Diez Principios de Nielsen (https: //www.nngroup.com/articles/ten-usability-heuristics/).

Nos gustaría aprovechar esta oportunidad para realizar una evaluación 

Usando ejemplos del sitio web de Impala Vintage, ilustraremos cada principio usando  buenos y  malos ejemplos.

  1. Visibilidad del estado del Sistema

El sitio web de Impala Vintage nos muestra el principio de visibilidad de estado del sistema al mostrar todo el rato que en nuestro carrito hay artículos guardados. Manteniendo así al usuario informado sobre si tiene el carrito vacío o no.

Por otro lado un mal ejemplo es que no puedes ver ni el total de la compra ni cuantos artículos dispone el usuario en el carrito, haciendo así que pueda llegar a confundirse con lo que ha seleccionado o no.

  1. Coincidencia entre el sistema y el mundo real

Esta web utiliza imágenes basadas en el mundo real para representar cada uno de los productos que venden dentro de su sitio web. Eso facilita a los usuarios a identificar rápidamente cada producto dentro del sitio. También han introducido logotipos de sus principales marcas para filtrar más rápidamente dentro de sus productos

Solo han puesto 5 marcas dentro de todo el amplio abanico de productos que disponen dentro de su tienda online, eso puede hacer que el usuario que busque marcas fuera de esas no permanezca dentro del sitio web.

  1. Control y libertad del usuario

Una vez ya dentro de la confirmación de la compra, disponemos de un botón donde nos llevará de nuevo al carrito para modificar este y tener el control y libertad que nos explica el principio de Nielsen.

Por otro lado puede ser confuso de encontrar ya que se encuentra en una esquina de la pantalla y puede ser de dificultosa visualización.

  1. Consistencia y estándares

Podemos encontrar el principio de consistencia y estándares que encontraremos en el botón de carrito que está colocado siempre en la misma ubicación que en la gran mayoría de las webs por lo que los usuarios están ya acostumbrados a buscar en ese lugar.

Si no utilizaran esta arquitectura y disposición los usuarios no encontrarán el carrito y puede generar confusión y rechazo.

 

  1. Prevención de errores

Nos hace un recordatorio en la parte inferior de la pantalla para hacernos recordatorio e informarnos de cuánto nos falta en nuestro carrito para que nos salga el envío gratuito.

Por otro lado, debería de estar más cerca de la zona del carrito de la compra para poder localizarlo más rápido y fácilmente.

 

  1. Reconocimiento en lugar de recuerdo

Esta web nos hace una selección llamada Impala vintage que una vez usas con frecuencia el sitio te hace una selección personalizada de los productos que acostumbras a mirar en el sitio.

  1. Flexibilidad y eficiencia de uso

Esta web nos proporciona unos filtros de tallaje de ropa y nos filtra también por colección, esto lo que nos permite es que nuestra experiencia de compra sea más eficiente y nos permite más flexibilidad al usuario a personalizar sus resultados según sus preferencias.

Una mala práctica es que en los filtros no se vuelva a repetir los filtros por marca que anteriormente nos han mostrado dentro de la web principal.

  1. Diseño estético y minimalista

Esta web nos muestra una arquitectura y diseño minimalista donde encontramos los productos bien presentados sobre un fondo blanco que contrasta perfectamente, donde no encontramos ningún tipo de distracción ni elementos que nos hagan perder el hilo de visualización. Además que dispone de una paleta de colores simple y unificada que se repite en todo el largo de la web.

Trabajan con un estilo minimalista muy pronunciado que nos puede llegar a dar la sensación de que está por acabar de diseñar. No obstante es funcional.

  1. Ayudar a los usuarios a reconocer, diagnosticar y recuperarse de errores

Este sitio web dispone de un chat de ayuda que permite a los usuarios obtener asistencia en diferentes posibles problemas que podemos encontrarnos por la web.

10.Ayuda y documentación

En el final de la página muestra un apartado para términos legales e información de contacto. También en el mismo chat se muestran preguntas más frecuentes o información para seguir el pedido.

Propuesta de mejora
  • Repetir el filtro de marcas dentro del apartado de marca. 
  • Hacer un mensaje de pop-up para las informaciones de pedidos mínimos para que te salga el envío gratuito.
Conclusión

El sitio web de Impala Vintage se adhiere a los 10 principios de  buena usabilidad de Nielsen. En esta publicación pudimos observar esto al revisar cada principio y sus ejemplos. Mercadona lo hizo bien esta vez.

Guia d'estudi. Avaluació Heurística, Pla de test i Card Sorting R2. Guia de estudio.Evaluación Heurística, Plan de test y Card Sorting R2

Debate

No hay comentarios.

Anàlisi heurística de Book Track

Eduard Salla Simo
Visibilidad: Pública - - comentario en Anàlisi heurística de Book Track
Anàlisi heurística de Book Track

Anàlisi heurística de Book Track

Eduard Salla Simo
Visibilidad: Pública - - comentario en Anàlisi heurística de Book Track
La selecció L’objectiu d’aquesta publicació és fer una anàlisi heurística, partint dels deu principis de Jakob Nielsen, d’una interfície digital. En aquest…
La selecció L’objectiu d’aquesta publicació és fer una anàlisi heurística, partint dels deu principis de Jakob Nielsen, d’una interfície…

La selecció

L’objectiu d’aquesta publicació és fer una anàlisi heurística, partint dels deu principis de Jakob Nielsen, d’una interfície digital. En aquest cas, he seleccionat l’aplicació per a telèfons intel·ligents Book Track, que és una biblioteca de llibres, més orientada a un ús personal que no a un ús social com altres del mateix tipus. No és una aplicació que utilitzi molt ni de la seva usabilitat en depenen negocis o sistemes estratègics, però fins i tot en aquests casos, un bon disseny i una bona usabilitat acaben decidint als usuaris a fer-ne anar una o una altra.

La metodologia

Aquesta anàlisi es basarà en els 10 principis de Jakob Nielsen, que són unes regles bàsiques sobre les quals s’han generat mètodes d’avaluació d’interfícies des d’un concepte holístic. L’anàlisi acabarà amb una matriu de gravetat, on s’analitzarà la importància dels problemes trobats i s’hi donarà una solució.

Aquests deu principis són:

  1. Visibilitat de l’estat del sistema.
  2. Adequació entre el sistema i el món real.
  3. Llibertat i control per part de l’usuari.
  4. Consistència i estàndards.
  5. Prevenció d’errors.
  6. Reconeixement abans que record.
  7. Flexibilitat i eficiència en l’ús.
  8. Disseny estètic i minimalista.
  9. Ajuda els usuaris a reconèixer i diagnosticar els errors i recuperar-se’n.
  10. Ajuda i documentació.

L’anàlisi

1. Visibilitat de l’estat del sistema.

♥ Bones pràctiques

En general, la resposta del sistema és bona, els botons reaccionen amb canvis de color, els plafons que van apareixent o els canvis de pantalla tenen animacions ràpides i fluides, les cobertes dels llibres també tenen una petita animació. En tot moment, l’usuari veu com l’aplicació reacciona immediatament a les seves accions.

∅ Errors detectats

El formulari de cerca de llibres té un petit error, ja que la primera vegada que s’hi introdueix text,  no fa cap cerca, de forma que s’ha de tornar a posar el focus al camp, i tornar a prémer la tecla de cerca, i llavors sí que mostra els resultats, tal com es veu al gif adjuntat. Canviant l’idioma de la cerca, a vegades els resultats s’actualitzen automàticament i d’altres no.

Un altre error trobat és en la gestió de les ubicacions, on no es mostren les ubicacions introduïdes prèviament, i fa la sensació que no n’hi ha cap d’introduïda, quan no és el cas. A més, quan es prem el botó «+ Seleccionar lloc», llavors surten les entrades prèviament, però no queda gens clar el comportament.

2. Adequació entre el sistema i el món real.

♥ Bones pràctiques

L’aplicació recrea objectes i situacions reals per millorar la seva usabilitat. Els llibres són un objecte físic, i la portada és el seu tret més diferencial. Per això, Book Track mostra sempre la portada dels llibres, en qualsevol llistat on es mostrin.

També ens permet classificar els llibres en una ubicació física: un habitatge, format per habitacions, que estan formades per prestatges o llibreries, de forma que l’entorn digital ens permet trobar fàcilment un llibre en l’entorn real.

Una altra bona pràctica que hi trobem és el control del progrés de lectura: mentre que en llibres digitals mostra el percentatge llegit, en els llibres físics mostra pàgines.

∅ Errors detectats

En el món real, els usuaris tenen diversos dispositius, i aquesta aplicació treballa amb una base de dades diferent per a cada dispositiu, de forma que un usuari només la pot tenir en un únic dispositiu, a excepció que utilitzi importacions / exportacions freqüentment.

3. Llibertat i control per part de l’usuari.

♥ Bones pràctiques

Per utilitzar aquesta aplicació, no s’ha de crear cap usuari i, per tant, no s’envien les nostres dades personals a la base de dades de l’empresa desenvolupadora.

També permet exportar tot el catàleg a un fitxer csv, així com importar de diferents plataformes de catàlegs de llibres. Evidentment, també podem eliminar totes les dades introduïdes a l’aplicació.

∅ Errors detectats

El fet de no treballar amb usuari, significa que per a cada dispositiu, el catàleg de llibres és únic, de forma que no es pot tenir a l’ipad i al mòbil. A més, tampoc disposa de versió web.

4. Consistència i estàndards.

♥ Bones pràctiques

L’aplicació és consistent: les animacions de canvi de pantalla són sempre iguals, tots els llistats de llibres tenen un filtre a la part superior, i, en general, l’aplicació es comporta com esperes, un cop l’has utilitzat.

Una altra bona pràctica de consistència és que les icones de les estadístiques de la pantalla inicial que fan referència a Biblioteca i Llista de desitjos, són les mateixes que trobem en els llistats dels llibres.

 

∅ Errors detectats

El principal problema que li veig en aquest punt és que el disseny no segueix els estàndards de la navegació de les aplicacions per a iOS, que tenen la barra inferior amb tres o quatre punts de navegació.

També destacaria l’ús dels colors, on els llibres que tenim tenen una icona taronja i els que volem una de vermella, són colors poc indicatius i amb significats culturals que poca relació tenen amb la funcionalitat.

5. Prevenció d’errors.

♥ Bones pràctiques

La possibilitat de l’usuari d’aquesta aplicació de cometre errors és bastant limitada, per ser una aplicació relativament senzilla i amb poques funcionalitats, i perquè l’ús principal que se’n farà serà amb les opcions automàtiques: entrar un llibre a partir dels resultats que retorna la cerca, que són modificables en cas que hi hagi algun error.

Amb les dades ja introduïdes, l’única confirmació que es demana és quan es vol esborrar un llibre. Qualsevol modificació de les dades d’un llibre s’accepten directament, comportament raonable, ja que el llibre segueix estant disponible per si la modificació és accidental.

6. Reconeixement abans que record.

♥ Bones pràctiques

Les estadístiques de la pantalla principal van acompanyades d’una etiqueta indicativa, fent molt fàcil la seva comprensió i evitant haver de recordar què significa cada una de les icones.

Amb les dades ja introduïdes, l’única confirmació que es demana és quan es vol esborrar un llibre. Qualsevol modificació de les dades d’un llibre s’accepten directament, comportament raonable, ja que el llibre segueix estant disponible per si la modificació és accidental.

 

∅ Errors detectats

La introducció de llibres mitjançant l’escaneig del codi de barres permet escanejar-ne més d’un de seguit, per, posteriorment, introduir-los tots a la vegada. Però això en cap moment s’indica durant el procés, de forma que l’usuari ho ha de descobrir per si sol, i recordar-ho la pròxima vegada.

7. Flexibilitat i eficiència en l’ús.

♥ Bones pràctiques

Book Tracker ofereix un grau bastant elevat de personalització. La part més evident és, sens dubte, la possibilitat de mostrar o ocultar tota la informació que pots mostrar la pantalla inicial, excepte les estadístiques superiors.

També permet introduir els llibres de tres maneres: escanejant el codi de barres, buscant per usuari, títol, o codi ISBN, o bé introduint manualment tota la informació, funcionalitat molt útil en el cas que el llibre no formi part de les bases de dades d’on extreu la informació.

Les estadístiques de la pantalla inicial són també botons que permeten obrir el catàleg de llibres que es tenen i els que es volen tenir, que són les dues funcions més utilitzades de l’aplicació.

Fins i tot deixa escollir la icona de l’aplicació.

 

∅ Errors detectats

Buscar un autor pot ser complicat perquè s’ha de buscar manualment dins el llistat d’autors, ja que no hi ha cap cerca disponible. Per exemple, he buscat Edgard Allan Poe per una captura del punt 4, i com que no recordava l’ordre de la llista, primer he buscat Alla, després Edgard, i finalment Poe. El mateix passa amb editorials o categories, però aquestes mai seran tan extenses com la d’autors, ni tan utilitzades.

La forma de crear Ubicacions i habitcions i prestatgeries és del tot confusa, és bastant caòtic l’ús d’aquesta part de l’aplicació.

8. Disseny estètic i minimalista.

♥ Bones pràctiques

El disseny és correcte, compleix amb els requisits més bàsics: que sigui homogeni i coherent al llarg de totes les pantalles, que sigui nítid, i que no tingui elements extres. La visualització és clara i no hi ha elements que la sobrecarreguin. I les icones aporten la informació extra per donar context quan és necessari.

∅ Errors detectats

No són pròpiament errors, i potser són casos una mica al límit de què és un error o no, però trobo que el disseny no és atractiu, i que colors com el del fons o el mateix blau principal no estan ben trobats. El disseny de les icones també és millorable.

9. Ajuda els usuaris a reconèixer i diagnosticar els errors i recuperar-se’n.

♥ Bones pràctiques

En aquest cas, la bona pràctica ajuda a què no calgui reconèixer els errors ni recuperar-se’n perquè ja no es produeixen. L’entrada manual de llibres no activa el botó Desar si no s’ha posat un títol, i per crear un auto es necessita, com a mínim, el cognom, que és el paràmetre utilitzar per a l’ordenació. Tampoc hi ha més formularis on es puguin introduir dades incorrectes o es puguin generar errors a conseqüència d’una acció de l’usuari.

10. Ajuda i documentació.

♥ Bones pràctiques

L’aplicació és tan senzilla que no necessita cap mena d’ajuda. L’acció més problemàtica, que és la importació d’un catàleg mitjançant un fitxer csv, està resolta amb un text d’ajuda a la mateixa pantalla d’importar. Aquesta opció ofereix 4 formats de fitxers csv generats per plataformes àmpliament utilitzades, i una cinquena opció, per a formats lliures. Seleccionant aquesta opció, es mostra més ajuda sobre com fer la importació, que bàsicament és una manera estàndard i generalitzada consistent en associar cada columna a una dada (i que també es podria incloure al punt 4. consistència i estàndards).

  

∅ Errors detectats

Hi ha una petita inconsistència lingüística, que podria ser problema de traducció o del text original, depenent de la pantalla es parla d’Ubicació o de Posicions.

A Gesitonar posicions, el botó té un text «+ Seleccionar lloc», on el símbol «+» contradiu totalment l’acció Seleccionar, ja que el «+» s’utilitza sempre per crear.

La matriu de gravetat

Per aquesta matriu, s’han utilitzat aquests valors per avaluar la gravetat:

  • 0 = no és un problema d’usabilitat.
  • 1 = problema sense importància: no és necessari solucionar-lo llevat que es disposi de temps en el projecte.
  • 2 = problema d’usabilitat menor: problema de baixa prioritat.
  • 3 = problema d’usabilitat greu: problema d’alta prioritat.
  • 4 = catàstrofe: imprescindible solucionar-lo.

Entrega R2 - Individual

Debate

No hay comentarios.

Netflix – Análisis heurístico

Judith Guinovart Pons
Visibilidad: Pública - - comentario en Netflix – Análisis heurístico

Netflix – Análisis heurístico

Judith Guinovart Pons
Visibilidad: Pública - - comentario en Netflix – Análisis heurístico
  Entrega R2 - Individual …
  Entrega R2 - Individual …

 

Entrega R2 - Individual

Debate

No hay comentarios.

Análisis heurístico de ebiblio

Cristina Coll Fernández
Visibilidad: Pública - - comentario en Análisis heurístico de ebiblio
Análisis heurístico de ebiblio

Análisis heurístico de ebiblio

Cristina Coll Fernández
Visibilidad: Pública - - comentario en Análisis heurístico de ebiblio
Introducción: Qué encontraremos en el post, qué interfaz se va a analizar Este post contiene el análisis heurístico de la interfaz de…
Introducción: Qué encontraremos en el post, qué interfaz se va a analizar Este post contiene el análisis heurístico de…

Introducción: Qué encontraremos en el post, qué interfaz se va a analizar

Este post contiene el análisis heurístico de la interfaz de ebiblio. Para quien no la conozca, ebiblio es la versión digital de las redes de bibliotecas autonómicas de España. Se puede acceder a ella de varias maneras, principalmente mediante su web (ya sea la versión de escritorio o las adaptables a otros tipos de pantallas) y a través de la aplicación para dispositivos móviles. El análisis se centrará en la versión web de escritorio, aunque pueden mencionarse otras formas de interactuar con la interfaz. Hay una versión de ebiblio para cada CCAA. En el análisis las pruebas y capturas se realizarán con la versión de la Comunidad de Madrid.

Metodología: Explicación acerca de cómo se ha llevado a cabo el análisis

La metodología utilizada en este análisis ha consistido en abordar cada uno de los principios heurísticos de Nielsen de forma individual, y aplicar a cada uno de ellos un ejemplo de buen uso y otro de mal uso en la interfaz de la web de ebiblio. Se ha analizado de forma exhaustiva la usabilidad de dicha aplicación atendiendo a estos principios. Una vez localizados los ejemplos, se ha elaborado un listado con los hallazgos ordenados por su gravedad, indicando los motivos y ofreciendo propuestas de mejora.

El primer abordaje mediante los principios de Nielsen es un ejemplo de análisis cualitativo, mientras que la elaboración del listado cuantificando la gravedad de cada ejemplo de mal uso es una metodología cuantitativa.

Los 10 principios heurísticos de Nielsen: Buen y mal ejemplo de aplicación y justificación

Visibilidad del estado del sistema.

La visibilidad del estado del sistema se refiere a aquellos indicios que nos dan información de en qué punto de la interfaz o del proceso nos encontramos. Algunos ejemplos son las migas de pan o los indicadores visuales de que un documento está cargándose o se ha enviado un formulario.

Un ejemplo de esto que funciona muy bien en la web de ebiblio se puede encontrar en su formulario de contacto. Este servicio cuenta con un formulario para enviar comentarios y dudas, informar de errores y hacer desideratas (es decir, solicitar nuevos títulos para incluir en el catálogo.

El formulario tiene campos obligatorios y no obligatorios. Los obligatorios están marcados con un asterisco (*) pero además aparece un mensaje debajo en color rojo si se intenta enviar el formulario sin alguno de ellos. Hay también un campo opcional para añadir capturas o imágenes que puedan servir de apoyo visual a la propuesta o petición. Cuando se sube una imagen, esta aparece debajo del campo, indicando que la subida ha sido exitosa.

Un ejemplo de esto que puede llevar a error se encuentra en las migas de pan. El sistema de filtrado de ebiblio es muy bueno, pero la interfaz de la web no sitúa las migas de pan en la parte superior, como es habitual, sino en un lateral. En la parte superior lo que se encuentra es una etiqueta del tipo de contenido que estamos buscando.

El problema viene cuando se selecciona una subcategoría. En lugar de añadirse la nueva etiqueta, se reemplaza por la anterior. Esto hace que al eliminar la subcategoría, nos lleve de nuevo a la sección general, en lugar de a la categoría anterior (en este caso, Ficción).

Intuitivamente nos va a salir utilizar esas etiquetas como migas de pan, pero no funcionan exactamente así.

Adecuación entre el sistema y el mundo real.

Las interfaces se comunican con las personas, y esto ocurre, entre otras cosas, porque utilizan un lenguaje que conocen y entienden. Ebiblio en general es un buen ejemplo de cómo se traslada la terminología relacionada con los libros y con las bibliotecas a una plataforma online.

Dentro de que usa una terminología coherente y adecuada a su campo, uno de los puntos que pueden resultar confusos es la distinción entre préstamos y reservas. En ebiblio los préstamos están limitados, pero las reservas se cuentan aparte. No se puede reservar cualquier título, solo los que estén ocupados por otros usuarios en ese momento (es decir, funciona como una lista de espera).

Libertad y control por parte de la persona usuaria.

En este punto, relacionado con la libertad de la persona usuaria y su control de la interfaz, pero sobre todo de su capacidad para volver atrás mientras está navegando, podría hablarse de nuevo de las migas de pan que se trataron en el primer apartado. Sin embargo, creo que es más interesante cómo funciona el sistema de filtrado y la navegación del catálogo.

Para localizar los títulos hay una serie de categorías que pueden acotar la búsqueda. Se pueden marcar varias a la vez, por lo que este sistema de filtrado otorga mucho control a las personas usuarias para que encuentren exactamente lo que buscan. Además, es posible acceder al nombre de una autora o autor o de una editorial y, una vez en la pantalla con todos los títulos de dicha autoría o editorial, marcar los demás filtros que se han mostrado anteriormente.

Un aspecto en el que la posibilidad de volver atrás es menos inmediata es a la hora de devolver un préstamo o cancelar una reserva. En la página de la publicación no es posible hacerlo, y hay que ir hacia el perfil personal para ello.

Consistencia y estándares.

Uno de los ejemplos más claros de este principio se encuentra en el uso de los colores. Tenemos interiorizado, por ejemplo, que el color verde significa que un proceso ha salido bien, mientras que el color rojo se equipara a los errores. Esto ocurre en el formulario de contacto de la web que se mencionó anteriormente.

Sin embargo, para los préstamos se usa un código de colores distinto y mucho menos intuitivo. En ebiblio que un libro esté disponible para prestar se representa con un marco de color rojo, mientras que si está disponible solo para reservas el marco será naranja. Esto se contradice directamente con el código de colores habitual.

Prevención de errores.

La verificación de las acciones es una muy buena forma de prevenir que las personas que utilizan la interfaz se equivoquen. Aquí ebiblio lo hace bien cuando se selecciona un título para prestar, ya que incluye un mensaje de doble confirmación que hay que marcar. De esta manera se evitan los préstamos por error (sobre todo sabiendo que cancelarlos no es una acción tan inmediata).

Un aspecto en el que la interfaz no acierta tanto es en el formulario, ya que, por ejemplo, acciones como subir una imagen o captura de pantalla, tratar de eliminarla y luego recargar la página pueden llevar a un mensaje de error. No se trata de la acción más probable que vaya a realizar alguien que usa este servicio, pero sí es plausible.

Reconocimiento antes que recuerdo.

Una buena práctica de este principio en la interfaz de ebiblio es el uso de un icono que representa unos auriculares para identificar los audiolibros. Además de este símbolo, los audiolibros tienen la imagen cuadrada, mientras que los libros, revistas y periódicos usan una miniatura rectangular.

En otros detalles esto es menos acertado, como ocurre con el banner que encabeza la página principal. Se trata de un slider de imágenes, pero algunas son clicables y enlazan a secciones y otras (como la que se muestra en la captura) no lo hacen. No se puede saber cuáles llevan enlace y cuáles no hasta que no se prueba a pasar el ratón.

Flexibilidad y eficiencia en el uso.

Al tratarse de una web y no de una aplicación, no hay en ella atajos de teclado ni nada similar que ayude a navegar más rápido.

La regla de llegar a cualquier sitio en tres clicks tampoco se cumple, pero no creo que en el caso de una web que busca ser un archivo o base de datos sea necesaria una inmediatez como esa.  La página de inicio está llena de categorías que pueden ayudar a las personas que utilizan la web, pero también distraerlas si lo que quieren es acceder directamente al catálogo.

Diseño estético y minimalista.

La versión de escritorio de ebiblio usa un diseño sencillo y claro. Aquí la prioridad no es la estética, pero trata de ser funcional y coherente consigo mismo. El diseño destaca por el uso de un color de contraste (el ya mencionado color rojo que se usa para indicar qué publicaciones están disponibles para prestar) que también se emplea en los enlaces.

Una carencia que algunas personas usuarias podrían encontrar es la ausencia de modo oscuro (cosa que sí tiene la versión app para dispositivos móviles).

Ayuda a las personas usuarias a reconocer y diagnosticar los errores y a recuperarse.

Este principio está muy relacionado con el primero, ya que ambos se tratan de ofrecer feedback a la persona que utiliza el servicio. Por tanto, aquí se podrían incluir también los mensajes que proporciona el formulario de contacto cuando no se incluye alguno de los campos en él, ya que está alentando a quien utiliza la web a que subsane el error.

En cambio, ebiblio no ofrece un mensaje de error (tipo 404) personalizado cuando se escribe mal la dirección, sino que aparece un mensaje de una sola línea y en francés. Una página personalizada de error 404 que explique a la persona que utiliza la web y, sobre todo, que utilice los mismos encabezados que el resto de secciones, ayudaría mucho a retroceder y no sacaría tanto de la navegación.

Ayuda y documentación.

La web de ebiblio dispone de un apartado de documentación para resolver las dudas más frecuentes acerca de su uso. Es un apartado bien estructurado y completo, que además cuenta con un buscador para localizar mejor la información.

Sin embargo, hay una fricción con las personas usuarias muy clara que, si bien se refleja en este apartado, no se menciona en ningún sitio más de la web. Los libros y otras publicaciones que se descargan de ebiblio pueden leerse en el ordenador, en dispositivo móvil o en lectores electrónicos. Pero para esto último es necesario descargar un programa de DRM que se llama Adobe Digital Editions, que además no es compatible con todas las marcas de lectores (sin ir más lejos, Kindle no es compatible). Se agradecería alguna mención a este hecho que no estuviera dentro del apartado de ayuda, ya que es una información importante.

Listado priorizado según gravedad y justificación. Propuestas de mejora y solución de cada hallazgo

Para finalizar, del desglose de los principios anteriores se han escogido los ejemplos negativos más destacados y se han priorizado en función de su gravedad (leve – medio – grave). Para cada uno se ofrece una justificación de por qué se ha seleccionado y una posible propuesta de mejora.

Ejemplo (y justificación)
Gravedad
Propuesta de mejora
Confusión entre migas de pan y etiquetas
Las migas de pan al explorar el catálogo no aparecen en la parte superior de este, como suele ocurrir en otras webs, sino en el lateral. Arriba aparecen unas etiquetas, pero no se añaden subcategorías, sino que reemplazan a la categoría anterior. Al eliminar la subcategoría, por tanto, no se vuelve a la categoría principal, sino al principio.		 Leve Para mejorar este problema bastaría con que las nuevas etiquetas se añadieran a la derecha de las anteriores. De esta forma se podrían tachar solo algunas y se mantendría el resto en la búsqueda, permitiendo a las personas que usan la web afinarla un poco más.
Uso del color rojo como color principal
El diseño de la web de ebiblio usa el color rojo como color destacado y de contraste. El problema viene cuando en algunos apartados, como el formulario de contacto, el mismo tono de rojo se usa como indicativo de error.		 Leve Que los tonos de rojo fueran claramente diferentes sería una solución sencilla a este ejemplo.
Falta de inmediatez a la hora de cancelar un préstamo
Una vez que se ha solicitado un préstamo, no es posible cancelarlo desde la página de la publicación. Para devolverlo hay que acceder al propio perfil de usuario.		 Media Una opción en la página de la publicación, aunque sea discreta, como desplegable en el botón de “Prestar”, sería interesante para gestionar las devoluciones de forma más inmediata.
Algunos sliders no son clicables
El slider de la página de inicio lleva algunos banners con enlaces clicables y otros que no tienen enlace ninguno. No hay forma de distinguirlo más allá de pasar el ratón por encima.		 Media Hacer que todos los banners pudieran pulsarse sería una buena solución. Otra opción sería usar un indicativo visual (por ejemplo, un icono o símbolo en la esquina) que permitiera diferenciar de un vistazo los que contienen un enlace.
Falta de mensaje de error 404 personalizado
Si se accede a una dirección errónea no solo no hay un mensaje de error 404 personalizado, sino que la página de error no coincide con el resto de la interfaz, por lo que dificulta el hecho de volver atrás.		 Media La solución más evidente a este problema es la creación de una página, clara y descriptiva, de mensaje de error. Si conserva la estructura de encabezados del resto de la web, mejor todavía.
Ausencia de explicaciones acerca del software para usar ebooks salvo en el apartado de ayuda
La única forma de transferir libros y otras publicaciones a un lector de ebooks es mediante un software de DRM que se llama Adobe Digital Editions. Este software no es compatible con algunas de las marcas de lectores más conocidas. Esa información solo aparece en el apartado de ayuda y documentación de la web.		 Grave Incluir esta información en otros apartados, como por ejemplo la página de inicio, y destacarla como aviso importante sería una buena forma de subsanar esta carencia.

 

Bibliografía

Entrega R2 - Individual

Debate

No hay comentarios.

Omio – Análisis Heurístico

Belén Cañamero Ruiz
Visibilidad: Pública - - comentario en Omio – Análisis Heurístico
Omio – Análisis Heurístico

Omio – Análisis Heurístico

Belén Cañamero Ruiz
Visibilidad: Pública - - comentario en Omio – Análisis Heurístico
  INTRODUCCIÓN Omio, antes conocida como GoEuro, es una plataforma que facilita la búsqueda, comparación y reserva de billetes de tren, autobús,…
  INTRODUCCIÓN Omio, antes conocida como GoEuro, es una plataforma que facilita la búsqueda, comparación y reserva de billetes…

 

INTRODUCCIÓN

Omio, antes conocida como GoEuro, es una plataforma que facilita la búsqueda, comparación y reserva de billetes de tren, autobús, avión y ferri para viajes dentro de Europa y otros destinos internacionales. Surgió como una pequeña startup en 2013 y ha ido ganando popularidad desde entonces, ofreciendo a los usuarios la posibilidad de organizar sus viajes de manera sencilla y económica.

Debido a que forma parte de un mercado saturado y competitivo como es el del turismo, los servicios de viaje y el transporte, nos ofrece un servicio que cuenta con una gran base de usuarios. Esto la convierte en una opción muy interesante a la hora de realizar un análisis heurístico puesto que sus características y funcionalidades tienen un impacto significativo en la experiencia del usuario, tanto a la hora de planificar el viaje como en el momento de este, una vez adquiridos los billetes.

METODOLOGÍA

La evaluación heurística es un método crucial en la mejora continua del diseño de interfaces, por ello para el análisis de la aplicación nos basaremos en los principios generales establecidos por Jakob Nielsen y R. Molich en 1990.

En este post vamos a llevar a cabo un análisis heurístico de la aplicación móvil de Omio para Android y estos principios nos servirán de guía detallada para identificar, de manera sistemática, posibles problemas de usabilidad:

Tras esto, crearemos un listado según la gravedad de los hallazgos y propondremos soluciones para cada problema identificado.

LOS 10 PRINCIPIOS HEURÍSTICOS DE NIELSEN

01. Visibilidad y estado del sistema:

Informar a los usuarios sobre lo que sucede en la aplicación resulta esencial, puesto que de lo contrario podemos generarles incertidumbre y frustración.

02. Relación entre el sistema y el mundo real:

Es importante que los elementos de la aplicación reflejen el mundo real de manera coherente, la falta de claridad en la terminología puede provocar confusión y dificultar la navegación de los usuarios.

03. Control y libertad del usuario:

Proporcionar a los usuarios control y libertad para realizar y corregir acciones es fundamental para una experiencia satisfactoria, restringir las opciones puede dificultar el proceso de reserva.

04. Estándares y consistencia:

La consistencia en el diseño y la navegación de la aplicación no solo facilitan la comprensión y el uso por parte de los usuarios, sino que también generan confianza y seguridad, trabajando en la intuición y haciendo que puedan anticipar el comportamiento de la aplicación en ciertos aspectos.

05. Prevención de errores:

Prevenir errores antes de que ocurran es esencial para una buena experiencia de usuario.

06. Reconocer antes que recordar:

Minimizar la carga cognitiva de los usuarios al recordar información previa ayuda a agilizar la compra de billetes y mejora la experiencia general

07. Flexibilidad y eficiencia de uso:

Ofrecer opciones de personalización y funciones avanzadas permite a los usuarios ajustar el sistema a sus preferencias y mejorar su experiencia de búsqueda.

08. Diseño estético y minimalista:

Un diseño estético y minimalista mejora la legibilidad y la comprensión de la información, lo que contribuye a una experiencia de usuario más agradable y satisfactoria.

09. Ayuda a los usuarios para reconocer, diagnosticar y recuperarse de los errores:

Proporcionar a los usuarios las herramientas necesarias para detectar, comprender y resolver los errores que puedan surgir en la aplicación les otorga autonomía y fortalece su confianza en ella. Esto les permite mantener una experiencia positiva pese a los inconvenientes.

10. Ayuda y documentación:

El acceso rápido y sencillo a información de ayuda y documentación permite a los usuarios comprender mejor cómo funciona el servicio, resolver problemas y aprovechar al máximo las diferentes funciones de la aplicación.

LISTADO SEGÚN LA GRAVEDAD

  • Ausencia de progreso durante el proceso de inicio.
    La pantalla inicial es la primera impresión que tienen los usuarios de la aplicación, por lo que la falta de claridad en este punto puede generar una percepción negativa desde el principio y afectar a la experiencia general. Soluciones:

    • Utilizar animaciones o transiciones que indiquen que la aplicación está cargando.
    • Añadir una barra de progreso.
    • Mejorar la velocidad de carga de la aplicación para reducir el tiempo de espera del usuario.
  • Confirmación de cambios menores.
    La falta de mensajes de confirmación a la hora de realizar cambios que no son críticos puede resultar en la pérdida involuntaria de información.
    Soluciones:

    • Implementar de manera generalizada mensajes de confirmación, como al retroceder en el proceso de compra o al abandonar una página.
    • Advertir al usuario sobre las consecuencias de sus acciones antes de realizarlas.
  • Limitaciones de accesibilidad.
    La falta de opciones de personalización que se adapten a las necesidades de todos los usuarios, incluyendo aquellos con necesidades especiales, crean barreras que dificultan la experiencia y el uso de la aplicación.
    Soluciones:

    • Implementar ajustes de contraste, tamaño de texto y otras opciones de personalización que faciliten el uso de la aplicación para personas con discapacidades visuales o cognitivas.
    • Ofrecer la posibilidad de incluir información sobre las necesidades especiales del usuario en los detalles del pasajero.
    • Brindar soporte y asistencia especializados a estos grupos de usuarios.
  • Inconsistencia en la estructura.
    La estructura visual varía en algunas de las pantallas de documentación, lo que puede causar confusión y dificultar la navegación.
    Soluciones:

    • Revisar las secciones incrustadas que provienen de una versión web.
    • Mantener la consistencia en la disposición visual y el idioma en todas las pantallas de la aplicación.
    • Evitar cambios abruptos en la disposición de elementos al acceder a diferentes secciones.
  • Revisión y modificación del billete.
    Dado que la compra de billetes es una acción crítica, la posibilidad de revisar y modificar los detalles antes del pago resulta esencial para evitar errores y garantizar la precisión de la reserva.
    Soluciones:

    • Habilitar una opción clara para revisar y/o modificar los detalles del billete antes de proceder al pago de la compra. Esto puede incluir un botón de «Revisar» o «Editar» en la página de resumen del billete, antes de la confirmación final.

CONCLUSIÓN

Mediante la evaluación de la aplicación móvil de Omio, a través de los principios heurísticos, hemos descubierto oportunidades de mejorar la experiencia de usuario.

De abordar estas áreas problemáticas y aplicar las soluciones propuestas, la plataforma tendría la oportunidad de mejorar significativamente su usabilidad, accesibilidad y la satisfacción general de los diferentes tipos de usuarios.

Bibliografía:

Debate

No hay comentarios.

Análisis Heurístico de Duolingo

Makarena del Carmen Olivera Pinedo
Visibilidad: Pública - - comentario en Análisis Heurístico de Duolingo

Análisis Heurístico de Duolingo

Makarena del Carmen Olivera Pinedo
Visibilidad: Pública - - comentario en Análisis Heurístico de Duolingo
Introducción A continuación se realiza el análisis heurístico de la plataforma de Duolingo, una aplicación educativa de aprendizaje de idiomas. Se ha…
Introducción A continuación se realiza el análisis heurístico de la plataforma de Duolingo, una aplicación educativa de aprendizaje de…

Introducción

A continuación se realiza el análisis heurístico de la plataforma de Duolingo, una aplicación educativa de aprendizaje de idiomas. Se ha elegido esta plataforma debido a su notable crecimiento, con un aumento del 230% en sus acciones y más de 83 millones de usuarios activos mensuales. Fundada en 2011 por Luis von Ahn y Severin Hacker, Duolingo ha logrado una rápida expansión, ofreciendo una experiencia educativa distinta y accesible. A través de la evaluación de los principios heurísticos de Nielsen, se busca identificar áreas de mejora en la interfaz de la aplicación para garantizar una experiencia óptima para los usuarios.

Metodología

Para realizar este ejercicio, se ha tomado como base los diez heurísticos de Nielsen, mostrando un buen ejemplo o un mal ejemplo, según sea al caso.  Asimismo, se ha realizado un ejercicio de priorización para identificar aquellos que son más graves. Por último, se ha incluido una serie de recomendaciones con el fin de solucionar los problemas hallados.

El análisis de la app Duolingo se realizó en un iPhone 14.

Los 10 Heurísticos de Nielsen

1) Visibilidad del estado del sistema

Buen ejemplo: Cuando abres la aplicación, se señala claramente dónde se quedó el usuario mediante un mapa visual que muestra el progreso y los círculos que va completando. Además, un texto animado que dice «Empezar» guía intuitivamente al usuario para continuar desde donde se quedó, lo que proporciona una indicación clara del estado del sistema.

Mal ejemplo: Si bien los círculos indican el progreso que ha hecho el usuario, no detallan cuántos ejercicios exactamente faltan para completar un círculo y pasar al siguiente nivel de aprendizaje.

 

2) Coincidencia entre el sistema y el mundo real

Buen ejemplo: La aplicación utiliza iconos familiares que se alinean con las convenciones del mundo real. Por ejemplo, el icono de la casa se interpreta fácilmente como la página de inicio, el corazón como las vidas disponibles, las pesas como los desafíos y la campana como las notificaciones. Al utilizar símbolos que los usuarios ya están familiarizados, se reduce la carga cognitiva y se facilita la navegación dentro de la aplicación.

Mal ejemplo: Sin embargo, algunos iconos pueden resultar más difíciles de entender para los usuarios. Por ejemplo, un escudo se utiliza para representar el puesto en el ranking, lo cual no refleja de manera intuitiva la idea de clasificación. Del mismo modo, un símbolo de fuego se utiliza para representar los días consecutivos de participación, lo cual puede resultar confuso para algunos usuarios.

3) Control y libertad del usuario

Buen ejemplo: La aplicación brinda a los usuarios un sentido de control y libertad al incluir una opción clara para salir del ejercicio en cualquier momento mediante un botón con una «X». Esta funcionalidad permite a los usuarios interrumpir el ejercicio si lo desean, lo que les brinda flexibilidad y control sobre su experiencia de aprendizaje. Cuando los usuarios presionan esta «X», aparece un pop-up que les solicita confirmar si realmente desean salir.

 

4) Consistencia y estándares

Buen ejemplo: La aplicación los sigue estándares comunes de diseño al ubicar el menú principal de navegación en la parte inferior de la pantalla, lo que es una convención ampliamente reconocida en la mayoría de las aplicaciones móviles. Además, la configuración se encuentra dentro del perfil del usuario, lo cual es coherente con la ubicación habitual de esta función en otras aplicaciones.

5) Prevención de errores

Buen ejemplo: La aplicación cumple con una buena prevención de errores al mostrar un mensaje de error cuando el usuario está sin conexión a internet. Este mensaje alerta al usuario sobre la falta de conexión y le informa que para acceder a las funcionalidades de la app, debe primero conectarse a una red. Por otro lado, la aparición de un pop-up cuando el usuario intenta cerrar una lección en curso previene la pérdida accidental de progreso y brinda al usuario la oportunidad de confirmar su acción de salir o continuar con la lección.

6) Reconocimiento en lugar de recuerdo

Buen ejemplo: La aplicación utiliza el reconocimiento en lugar de la memoria al mostrar claramente el texto «Empezar» en la página de inicio, con una ligera animación para hacer énfasis. Este texto facilita a los usuarios comprender rápidamente cómo comenzar o continuar su lección. Además, en la parte superior de la página de inicio, se proporciona información sobre la etapa y sección en la que se encuentra el usuario, lo que ayuda a recordar su progreso.

Mal ejemplo: Sin embargo, la aplicación no sigue el principio de reconocimiento en lugar de recuerdo al dirigir al usuario directamente a la tienda al hacer clic en el icono de gemas, en lugar de brindar información sobre las gemas. Esta falta de contexto puede confundir a los usuarios y dificultar su comprensión de cómo funcionan las gemas y sus beneficios.

7) Flexibilidad y eficiencia de uso

Buen ejemplo:  La aplicación ofrece a los usuarios opciones flexibles para adaptar su experiencia de aprendizaje según deseen. Por ejemplo, los usuarios tienen la opción de aceptar desafíos de 30 días, lo que les permite establecer metas a largo plazo y mantenerse motivados. Además, los usuarios pueden extender sus días de «racha», con lo cual pueden mantener su progreso incluso si se olvidan de completar un ejercicio en un día determinado.

Mal ejemplo: Aunque la app ofrece algunas opciones de personalización, la falta de personalización de las metas diarias puede ser limitado en comparación con otras plataformas de aprendizaje de idiomas.

8) Estética y diseño minimalista

Buen ejemplo: Duolingo se destaca por su diseño limpio y minimalista que crea una experiencia agradable y para los usuarios. La aplicación utiliza colores que resaltan e ilustraciones entretenidas para crear un ambiente de aprendizaje más dinámico. Además, las tipografías son legibles fáciles de leer, lo que mejora la comprensión del contenido. El diseño se mantiene consistente en todas las secciones de la app, lo que proporciona una experiencia unificada.

Mal ejemplo: Duolingo incluye anuncios y mensajes promocionales dentro de la aplicación para aquellos usuarios con un plan gratuito. Además, siempre se muestra un anuncio después de cada lección. Estas promociones irrumpen con el diseño minimalista que caracteriza a la app lo cual interrumpela estética de diseño minimalista al introducir elementos visuales adicionales, además de interrumpir la experiencia de los usuarios.

9) Ayudar a los usuarios a reconocer, diagnosticar y recuperarse de errores

Buen ejemplo: Cuando los usuarios cometen un error durante una lección, Duolingo proporciona retroalimentación inmediata. Esto puede incluye una notificación visual, auditiva y una explicación sobre por qué la respuesta no fue correcta. Esta retroalimentación instantánea ayuda a los usuarios a reconocer y entender sus errores. Asimismo, al completar un ejercicio auditivo, Duolingo ofrece una opción para reportar algún error con el enunciado. Esta funcionalidad permite a los usuarios diagnosticar problemas e informarlos.

10) Ayuda y documentación

Mal ejemplo: La sección de ayuda está ubicada de manera poco intuitiva y requiere varios pasos para acceder a ella, lo que puede perjudicar la experiencia de los usuarios nuevos o aquellos que necesitan asistencia. Para encontrar la ayuda, los usuarios deben ir a su perfil, seleccionar la tuerca de configuración y hacer scroll para encontrar «Soporte», que está en la parte inferior de la página. Además, las preguntas frecuentes se abren en el navegador incorporado dentro de la app. Tampoco hay funcionalidad de búsqueda en la página de Preguntas frecuentes, lo cual limita la capacidad de los usuarios para encontrar rápidamente la información que están buscando. En general, estas malas prácticas pueden frustrar a los usuarios y dificultar que encontruen la asistencia que necesitan.

 

Priorización de los hallazgos

Según Nielsen, las calificaciones de severidad pueden ser utilizadas para asignar los recursos necesarios para solucionar los problemas más graves y también pueden proporcionar una estimación aproximada de la necesidad de esfuerzos adicionales de usabilidad.

La severidad de un problema de usabilidad es una combinación de tres factores:

  • La frecuencia con la que ocurre el problema: ¿Es común o raro?
  • El impacto del problema si ocurre: ¿Será fácil o difícil para los usuarios superarlo?
  • La persistencia del problema: ¿Es un problema único que los usuarios pueden superar una vez que lo conocen o los usuarios serán molestados repetidamente por el problema?

La siguiente escala de calificación de 0 a 4 se puede usar para calificar la severidad de los problemas de usabilidad:

  • 0 = No es un problema de usabilidad en absoluto.
  • 1 = Problema sin importancia: No es necesario solucionarlo a menos que haya tiempo libre.
  • 2 = Problema de poca importancia: Solucionar esto tiene baja prioridad,
  • 3 = Problema grave: Es importante solucionarlo, y tiene alta prioridad.
  • 4 = Catástrofe: Es imperativo resolver el problema.

Recomendaciones

Visibilidad del estado del sistema:

    • Mala práctica: Falta de información detallada sobre el progreso del usuario en la aplicación.
    • Recomendaciones: Proporcionar información detallada sobre el progreso del usuario, incluyendo el número exacto de ejercicios restantes para completar cada nivel (por ejemplo: «Faltan 7 de 15 ejercicios»). Mejorar la visualización de progreso mediante indicadores visuales más detallados.

Coincidencia entre el sistema y el mundo real:

    • Mala práctica: Uso de iconos que no reflejan de manera intuitiva el concepto que representan.
    • Recomendaciones: Reevaluar y rediseñar algunos los iconos utilizados para que reflejen de manera intuitiva el concepto que representan, tal como es el caso del escudo que se puede confundir con protección cuando en realidad es para ver el ranking de usuarios. Asimismo, se aconseja realizar pruebas de usabilidad con usuarios para validar la comprensión de los iconos.

Reconocimiento en lugar de recuerdo:

    • Mala práctica: Falta de contexto proporcionado antes de dirigir al usuario a una nueva pantalla o función, como el caso de las gemas.
    • Recomendaciones: Proporcionar contexto o información breve antes al momento de ingresar a una sección, como las gemas. Incorporar elementos informativos para ayudar a los usuarios a comprender el propósito y los beneficios de adquirir dichas gemas.

Flexibilidad y eficiencia de uso:

    • Mala práctica: Aunque la app ofrece algunas opciones de personalización, la falta de personalización de las metas diarias puede ser limitado en comparación con otras plataformas de aprendizaje de idiomas.
    • Recomendaciones: Ofrecer a los usuarios la opción de personalizar sus metas no solo mensualmente, sino semanal, quincenal y diaramente, así el usuario puede elegir cuántos minutos o cuántas lecciones completar en dichos intervalos de tiempo.

Estética y diseño minimalista:

    • Mala práctica: Duolingo incluye anuncios y mensajes promocionales con diseños llamados que suelen interrumpir la estética de diseño minimalista e interrumpen también la experiencia de los usuarios.
    • Recomendaciones: Uniformizar el diseño de los anuncios publicitarios para mantener el diseño minimalista y reducir los intervalos en los cuales se interrumpen las lecciones de lo usuarios.

Ayuda y documentación:

    • Mala práctica: Ubicación poco intuitiva de la sección de ayuda, falta de funcionalidad de búsqueda y las preguntas frecuentes se muestran en un navegador incorporado, no están en la misma app.
    • Recomendaciones: Simplificar el acceso a la sección de ayuda, agregar una función de búsqueda dentro de la sección de ayuda e integrar las preguntas frecuentes dentro de la aplicación para facilitar el acceso.

Conclusiones

En resumen, con la evaluación heurística de la aplicaciónde Duolingo se han identificado varios problemas que afectan la experiencia del usuario, desde la falta de claridad en el seguimiento del progreso hasta la interrupción de la estética minimalista por anuncios. Al priorizar estos problemas según su frecuencia, impacto y persistencia, se ha determinado que Flexibilidad y eficiencia de uso y la Ayuda y documentación son los problemas más críticos que requieren atención con alta prioridad. Las recomendaciones incluyen proporcionar información clara sobre el progreso del usuario, mejorar la contextualización de las acciones en la aplicación y facilitar la personalización de metas diarias. Además, se observaron varias buenas prácticas, como la retroalimentación inmediata durante las lecciones y el diseño limpio y consistente en toda la aplicación. Al continuar aplicando estas buenas prácticas y abordar los problemas identificados, Duolingo puede mejorar de manera significativa la experiencia, y aumentar la satisfacción de sus usuarios.

Bibliografía

  • Cuaderno de evaluación de la usabilidad | 4.2. Evaluación heurística. (s. f.). https://quadern-usabilitat.recursos.uoc.edu/es/4-2-evaluacion-heuristica/
  • Design Toolkit  |  Evaluación heurística. (s. f.). https://design-toolkit.recursos.uoc.edu/es/evaluacion-heuristica/
  • Moran, K., & Gordon, K. (2024). How to Conduct a Heuristic Evaluation. Nielsen Norman Group. https://www.nngroup.com/articles/how-to-conduct-a-heuristic-evaluation/
  • Nielsen, J. (2024). Severity Ratings for Usability Problems. Nielsen Norman Group. https://www.nngroup.com/articles/how-to-rate-the-severity-of-usability-problems/
  • Nielsen, J. (2024). 10 Usability Heuristics for User Interface Design. Nielsen Norman Group. https://www.nngroup.com/articles/ten-usability-heuristics/

  • Tucker, H. (2023). Así es cómo Duolingo se convirtió en una acción popular en 2023, entre otros 99 ganadores en mediana capitalización. Forbes México. https://www.forbes.com.mx/asi-es-como-duolingo-se-convirtio-en-una-accion-popular-en-2023-entre-otros-99-ganadores-en-mediana-capitalizacion/

 

Enunciado de la actividad R2

Debate

No hay comentarios.

Análisis heurístico de la web Mercadona

Yasmina Mokhtari Ruiz
Visibilidad: Pública - - comentario en Análisis heurístico de la web Mercadona
Análisis heurístico de la web Mercadona

Análisis heurístico de la web Mercadona

Yasmina Mokhtari Ruiz
Visibilidad: Pública - - comentario en Análisis heurístico de la web Mercadona
Yasmina Mokhtari Producto: https://tienda.mercadona.es Mi folio: https://ymokhtarir.folio.uoc.edu/2024/04/10/analisis-heuristico-de-la-web-mercadona/ ¿Cumple la nueva web de Mercadona los 10 principios de Nielsen? Introducción Hace un tiempo el supermercado…
Yasmina Mokhtari Producto: https://tienda.mercadona.es Mi folio: https://ymokhtarir.folio.uoc.edu/2024/04/10/analisis-heuristico-de-la-web-mercadona/ ¿Cumple la nueva web de Mercadona los 10 principios de Nielsen? Introducción Hace un…

Yasmina Mokhtari

Producto: https://tienda.mercadona.es

Mi folio: https://ymokhtarir.folio.uoc.edu/2024/04/10/analisis-heuristico-de-la-web-mercadona/

¿Cumple la nueva web de Mercadona los 10 principios de Nielsen?

Introducción

Hace un tiempo el supermercado español Mercadona cambio su sistema de compra online modernizándolo y llevándolo no solo a versión escritorio si no a app para dispositivos móviles, cambiando su diseño y con ellos sus funcionalidades para sus clientes/usuarios.

Pero… en temas de usabilidad consigue la nueva propuesta de Mercadona cumplir los 10 principios de Nielsen? ¡Veamoslo juntos!

Metodologia

En esta ocasión, vamos hacer una evaluación heurística del soporte web que proporciona Mercadona para realizar la compra de sus productos online. El analisis llevado a cabo estará basado en los 10 principios de Nielsen (mención especial a esta fuente que ha sido de gran utilidad https://www.nngroup.com/articles/ten-usability-heuristics/) veremos cada principio ejemplificado con un ejemplo de la web de Mercadona poniendo en bandeja un ✅ buen ejemplo y ❌un mal ejemplo.

¡Comenzemos!

1.Visibilidad del estado del sistema

✅ La web de Mercadona refleja el principio de Visibilidad del estado del sistema al mostrar constantemente el total de la compra en el carrito, manteniendo informado al usuario sobre el dinero que está gastando en todo momento.

❌Un mal ejemplo sería si el total de la compra en el carrito no se actualiza automáticamente después de agregar o eliminar productos, lo que podría confundir al usuario sobre el monto final que está gastando.

2. Coincidencia entre el sistema y el mundo real

✅ El uso de iconos basados en el mundo real para representar categorías en la página web de Mercadona es un buen ejemplo del segundo principio de Nielsen, Coincidencia entre el sistema y el mundo real. Esto facilita a los usuarios la identificación rápida y comprensión de las diferentes secciones de productos, mejorando así la usabilidad de la página.

❌Si Mercadona hubiese seleccionado iconos quizás más abstractos a la realidad y no tan fieles a nuestra realidad esto haría que la navegación fuera confusa para los usuarios, ya que no podrían asociar fácilmente el icono con el tipo de producto que están buscando.

3. Control y libertad del usuario

✅ La web de mercadona en todo momento permite volver hacia atrás haciendo uso de botones que indican volver hacia atrás si el usuario así lo desea. Refleja el principio de «Control y libertad del usuario». Esto le brinda a los usuarios la libertad de deshacer acciones o explorar alternativas, lo que mejora su experiencia y les da un mayor sentido de control sobre su navegación.

❌ Sería un error muy grande si la web no contara con estos indicadores de volver hacia atras, crearía un problema para el usuario y desconfianza.

4. Consistencia y estándares

✅ Cumple el principio Consistencia y estándares que el botón de carrito esté colocado en la esquina superior derecha dado que es una convención común en muchas páginas web de comercio electrónico, por lo que los usuarios están acostumbrados a buscarlo allí.

❌ Sería un error colocar el carrito en otra disposición y no aportaría nada a mejorar en cuanto a usabilidad puesto que es un acierto asegurado colocarlo en la esquina superior derecha ya que el usuario por convenciones sociales va a buscarlo alli fijo.

5.Prevención de errores

❌  “Recuerde que el importe mínimo para poder realizar tu pedido es de 50€,” este mensaje aparece una vez el usuario a seleccionado sus productos que desea comprar y clica en el botón de tramitar pedido por lo tanto aunque haya un mensaje de aviso no está cumpliendo el principio de prevención de errores puesto que avisa una vez el usuario ya ha comenzado su compra y ha tomado decisiones.

✅ De manera correcta el mensaje debería aparecer de manera proactiva y clara antes de que el usuario comience a seleccionar productos, para que esté informado desde el principio y pueda tomar decisiones de compra acordes con el requisito mínimo establecido

6.Reconocimiento en lugar de recuerdo

✅ La web de mercadona tiene el apartado de “mis habituales” donde se guardan productos  y cantidades que el usuario suele comprar en base a sus pedidos realizados con anterioridad. Así puede comprar de la forma más rápida y sin necesidad de listas. Esta acción promueve el reconocimiento dejando constancia de los productos seleccionados.

7. Flexibilidad y eficiencia de uso

✅ La web proporciona filtros por marca así permite a los usuarios refinar sus búsquedas y encontrar rápidamente los productos de las marcas específicas que prefieren. Esto no solo hace que la experiencia de compra sea más eficiente al reducir el tiempo necesario para buscar productos, sino que también proporciona flexibilidad al permitir a los usuarios personalizar sus resultados según sus preferencias individuales.

Como en este ejemplo : el usuario ha querido buscar agua pero mercadona cuenta con varios productos a los que se puede atribuir “agua” entonces le sugiere la web filtrar  por categoría y marca para afinar su búsqueda.

❌ Una mala práctica es que estos filtros no están presente en todo momento de la navegación para hacer uso de ellos si no que aparecen el momento búsqueda.

8. Diseño estetico y minimalista

✅ Solo hay que ver la comparativa entre la pagina antigua de mercadona con la nueva pagina que aporta un diseño donde se tiene un enfoque mas claro , mas limpia visualmente gracias a eliminar colores demasiados llamativos que ocupaban grandes superficies como eran el verde y el amarillo usado antes.

Ahora encontramos un diseño que simplifica la paleta de colores. Además, el uso de llamadas a la acción (CTAs) en colores contrastantes ayuda a guiar la atención del usuario hacia acciones específicas, lo que mejora la usabilidad y la claridad de la interfaz. En general, este enfoque más claro y minimalista contribuye a una experiencia de usuario más atractiva y centrada en las necesidades del usuario.

❌ Error era como se encontraba antes la página de mercadona con un diseño antiguo basado en las primeras interfaces con ciertas características como; botones con relieve innecesarios, información encorsetada dejando poco margen de espacio entre información, superficie con colores demasiado llamativos …etc

9. Ayudar a los usuarios a reconocer, diagnosticar y recuperarse de errores

✅La web de consta de un chat de ayuda  permitie a los usuarios obtener asistencia inmediata cuando experimenten problemas durante su experiencia de compra en línea, lo que ayuda a cumplir con el principio de «Ayudar a los usuarios a reconocer, diagnosticar y recuperarse de los errores».

10. Ayuda y documentación

✅ Mercadona cuenta con otra página adicional para dar soporte y ayuda al usuario sobre varios temas referidos a este supermercado entre ellos el apartado “Compra en Mercadona Online” donde están las preguntas más frecuentes y dudas resueltas. Al tener esta opción para el usuario se está cumpliendo el principio 10 de Ayuda y documentación.

Listado priorizado de problemas detectados

Para priorizar los problemas  e indicar su grado de severidad Jacob Nielsen recomienda usar tres medidas o factores: Frecuencia,Impacto y Persistencia.

Haremos uso de esta escala para detectar la severidad de los diferentes problemas. Me gustaría especificar que algunos problemas que planteo aquí son hipotéticos debido a que no he encontrado problemas graves en mi interfaz, pero creo que igualmente se puede aprender de ello.

2=❌Que los filtros no están presente en todo momento de la navegación para hacer uso de ellos es un pequeño error.

2=❌ Sería un error colocar el carrito en otra disposición y no aportaría nada a mejorar en cuanto a usabilidad, pero si estuviese en otro lugar o flotando creo que igualmente el usuario podría realizar su tarea con más dificultad eso sí.

3= ❌ si el total de la compra no se actualizará automáticamente.

3=❌ Si la página no contara con indicadores para volver hacia atrás, seria un obstáculo que puedo hacer perder algún proceso al usuario.

3=❌ que el mensaje de aviso aparezca una vez el usuario ya ha seleccionado sus productos y quiere finalizar su compra es un grave error puesto que puede causar frustración y abandonar la página.

Propuesta de mejora

Sugerencias propias para mejorar la interfaz  
  • Crear un botón de filtros para crear un acceso directo a ellos y así mejorar la navegación, ya que por el momento están escondidos en la interfaz.
  • Que el mensaje de aviso de recordatorio “para hacer un pedido el minimo son 50€” aparezca lo primero de todo al cargar la pagina para asi evitar frustraciones al usuario que puedan hacer abandonar la pagina.

Conclusion 

La web de Mercadona si consigue cumplir los 10 principios de Nielsen las bases para que un interfaz tenga buena usabilidad, lo hemos podido observar en este post haciendo un repaso por cada principio y con ello su ejemplo , esta vez mercadona lo ha hecho bien!

Y a vosotros ¿qué os ha aparecido? Os leo!





Debate

No hay comentarios.

MeetUp

Julio Gabriel Jara Rojas
Visibilidad: Pública - - comentario en MeetUp

MeetUp

Julio Gabriel Jara Rojas
Visibilidad: Pública - - comentario en MeetUp
Introducción La interfaz que analizaré será MeetUp. Se trata de una plataforma en línea que conecta a personas con intereses similares para…
Introducción La interfaz que analizaré será MeetUp. Se trata de una plataforma en línea que conecta a personas con…

Introducción

La interfaz que analizaré será MeetUp. Se trata de una plataforma en línea que conecta a personas con intereses similares para organizar y participar en eventos grupales en persona o virtuales. Permite a los usuarios unirse a grupos locales o crear los suyos propios, y luego participar en actividades como senderismo, cocina, idiomas, etc. Es una manera de conocer gente nueva, hacer amigos y participar en actividades sociales. El sitio web es el siguiente:

Meetup. 2024. Accesible en: https://www.meetup.com/es-ES/home/

Decido utilizar este portal principalmente debido a mi frecuente participación en varios grupos y eventos, que van desde actividades de networking hasta charlas en inglés y excursiones por la montaña. Mi elección está respaldada por mi familiaridad con el portal y la identificación de varias problemáticas que espero abordar.

Metodología

  • Aplicación de las Heurísticas de Nielsen: utilizaré los 10 principios heurísticos de Jakob Nielsen como guía para evaluar la usabilidad de la interfaz seleccionada. Se examinará cada principio en relación con la interfaz, identificando ejemplos de buen y mal uso para cada uno.
  • Conclusión de las Heurísticas de Nielsen: tras aplicar las heurísticas de Nielsen, concluiré brevemente la calidad general de la interfaz en términos de usabilidad y experiencia del usuario.
  • Ranking de Hallazgos: clasificaré los hallazgos identificados durante el análisis en función de su impacto en la usabilidad. Elaboraré un ranking de los hallazgos más graves, priorizando aquellos que afectan significativamente la usabilidad del usuario.
  • Propuestas de Mejora: desarrollaré propuestas de mejora y soluciones prácticas para abordar los problemas identificados durante el análisis. Cada propuesta se justifica explicando cómo podría resolver el problema y mejorar la experiencia del usuario.

Desarrollo

Aplicación de las Heurísticas de Nielsen

  • Visibilidad del estado del sistema

✅ Meetup presenta indicadores visuales claros del estado del sistema, como confirmaciones al inscribirse en eventos y a la disponibilidad de plazas.

❌ Sin embargo, en ciertas ocasiones, Meetup no comunica claramente las razones detrás de ciertas restricciones como el darse de baja de un evento que ha sido cerrado o de poder hacer conexiones en un plazo determinado. Creo que en este sentido se debería mejorar la visibilidad para optimizar la experiencia de los usuarios.

  • Adecuación entre el sistema y el mundo real

✅ Meetup facilita la adecuación entre el sistema y el mundo real al permitir a los usuarios buscar y unirse a grupos y eventos que reflejan sus intereses y actividades en la vida real y luego poder asistir a ellos, ya sea física o virtualmente.

❌ Sin embargo, en algunos casos, la falta de filtro o una clasificación clara de las imágenes de los eventos puede generar confusión y dilemas a la hora de decidir asistir, o no, a una actividad, lo que podría beneficiarse de una mejora en la presentación visual para una experiencia más informativa y satisfactoria.

  • Libertad y control por parte de la persona usuaria

✅ Meetup fomenta la libertad y el control por parte de la persona usuaria al permitirles explorar una amplia gama de grupos y eventos, así como unirse o abandonarlos según sus preferencias.

❌ Notificaciones poco relevantes que generan confusión. Además, limitaciones para cancelar eventos o modificar preferencias en el perfil pueden generar frustración y podrían mejorarse para una experiencia más satisfactoria. Tampoco la manera de notificar es la adecuada y hay que fijarse mucho para ver que alguien ha escrito un mensaje o hay cambios en un grupo.

  • Consistencia y estándares

✅ Meetup demuestra consistencia y sigue estándares al presentar de manera uniforme los diferentes elementos del portal, como puede ser el mapa, o los colores apelando siempre al blanco.

❌ Mejorar la coherencia visual y funcional en algunas secciones de la plataforma podría optimizar la usabilidad y la satisfacción del usuario. Por ejemplo, la publicidad suele ser muy molesta y dificulta la visualización de la información.

  • Prevención de errores

✅ Meetup incorpora medidas para prevenir errores al proporcionar confirmaciones ante acciones críticas, como unirse a un grupo o eliminar un evento, lo que ayuda a los usuarios a evitar errores involuntarios.

❌ Sin embargo, en ciertos casos, la falta de claridad en las indicaciones o la ausencia de confirmaciones podría conducir a errores por parte del usuario. Por ejemplo, muchos organizadores han visto frustrada la eliminación de eventos programados de manera infinita, generando muchas confusiones entre los usuarios. Otro factor: de manera general cuesta recuperar información.

  • Reconocimiento antes que recuerdo

✅ Meetup prioriza el reconocimiento antes que el recuerdo al presentar opciones familiares y fáciles de entender para acciones comunes, como unirse a un grupo o crear un evento, lo que facilita la interacción para los usuarios.

❌En algunos casos como en la ficha de cada evento de vez en cuando aparecen elementos nuevos y cuesta reconocerlos. Por ejemplo, este call-to-action sobre “ver más eventos” no sale en todos los eventos por lo que es una sugerencia poco reconocible, que es útil pero al menos esta heurística no se cumple.

  • Flexibilidad y eficiencia en el uso

✅ Meetup muestra flexibilidad y eficiencia en el uso al permitir a los usuarios personalizar sus preferencias de búsqueda y notificaciones, así como acceder rápidamente a eventos y grupos relevantes desde la página principal.

❌ Sin embargo, algunas funciones podrían optimizarse para mejorar la eficiencia, como la capacidad de filtrar y clasificar resultados de búsqueda de manera más avanzada, lo que permitiría a los usuarios encontrar rápidamente lo que están buscando y mejorar su experiencia general en la plataforma.

  • Diseño estético y minimalista

✅ Meetup sigue un diseño estético y minimalista al presentar una interfaz limpia y organizada, lo que facilita a los usuarios la navegación y la comprensión de la información.

❌ Sin embargo, en ciertas áreas, la plataforma podría beneficiarse de una mayor simplificación visual y una reducción de elementos redundantes para mejorar la legibilidad y la usabilidad. Esto podría contribuir a una experiencia más agradable y efectiva para los usuarios. Un problema importante es la publicidad que dificulta aún más la visualización de la plataforma.

  • Ayuda a las personas usuarias a reconocer y diagnosticar los errores y a recuperarse

✅ Se proporcionan mensajes de error cuando surge un problema durante la inscripción en un evento o la realización de otras acciones importantes.

❌ Sin embargo, en ocasiones, la plataforma podría mejorar aún más al ofrecer sugerencias concretas sobre cómo resolver el problema y brindar opciones claras para recuperarse. Por ejemplo, explicar o justificar por qué no se puede dar de bajas de una reserva, entre otros. Ya que hay muchas reglas que se tienen que adivinar.

  • Ayuda y documentación

✅ Meetup proporciona ayuda y documentación mediante su sección de preguntas frecuentes (FAQ) y guías de uso, que ofrecen orientación a los usuarios sobre cómo utilizar la plataforma, resolver problemas comunes y obtener respuestas a preguntas frecuentes.

❌ Sin embargo, la disponibilidad y accesibilidad de esta ayuda podría mejorarse mediante la implementación de un sistema de búsqueda más eficiente, una estructura de navegación más clara y la inclusión de ejemplos prácticos para una comprensión más fácil y rápida. Esto garantizaría una mejor experiencia para los usuarios al encontrar la información que necesitan de manera más efectiva.

 

 

Conclusión de las Heurísticas de Nielsen

En conclusión, la evaluación de Meetup a través de las heurísticas de Nielsen revela tanto fortalezas como áreas de mejora. Si bien la plataforma demuestra consistentemente elementos como la visibilidad del estado del sistema y la adecuación entre el sistema y el mundo real, hay aspectos como la prevención de errores y la ayuda y documentación que podrían mejorarse para optimizar la experiencia del usuario. La implementación de soluciones centradas en el usuario, como la clarificación de mensajes de error y una ayuda más accesible, podría conducir a una experiencia más fluida y satisfactoria para los usuarios de Meetup.

Ranking de Hallazgos

  1. Visibilidad del estado del sistema

La falta de comunicación sobre ciertas restricciones y reglas en el sistema son fundamentales a la hora de usar la plataforma.

  1. Libertad y control por parte de la persona usuaria

Las notificaciones poco relevantes, las limitaciones para cancelar eventos y la falta de claridad en la comunicación de mensajes y cambios en grupos afectan significativamente la experiencia de los usuarios.

  1. Prevención de errores

La posibilidad de cometer errores debido a la falta de claridad en las indicaciones y la ausencia de confirmaciones importantes, como la eliminación de eventos programados.

  1. Reconocimiento antes que recuerdo

La dificultad para reconocer nuevos elementos en la plataforma, como los call-to-action en la ficha de eventos, afecta la usabilidad y la comprensión de los usuarios.

  1. Consistencia y estándares

La mejora en la coherencia visual y funcional en algunas secciones de la plataforma, así como la reducción de la publicidad molesta.

  1. Flexibilidad y eficiencia en el uso

Optimización de funciones para mejorar la eficiencia, como la capacidad de filtrar y clasificar resultados de búsqueda.

  1. Diseño estético y minimalista

La simplificación visual y la reducción de elementos redundantes, incluida la publicidad intrusiva, se consideran problemas importantes.

  1. Ayuda a las personas usuarias a reconocer y diagnosticar los errores y a recuperarse

La necesidad de ofrecer sugerencias claras para resolver problemas y recuperarse de errores.

  1. Adecuación entre el sistema y el mundo real

La falta de filtro y clasificación clara de imágenes de eventos, aunque importante.

  1. Ayuda y documentación

Mejorar en la disponibilidad y accesibilidad de la ayuda sigue siendo un tema importante.

Propuesta de Mejora

1) Meetup podría mejorar la comunicación de cambios mediante notificaciones claras, mensajes e información relevante.

2) Permitir personalización de notificaciones y clarificar la cancelación de eventos. Se añadirían colores e información gráfica que permita entender claramente estas casuísticas.

3) Implementar confirmaciones antes de acciones críticas y mensajes de error claros. Se implementarán pop-ups y mensajes claros.

4) Otpimizar la consistencia visual para facilitar la navegación. Se crearán plantillas para que los usuarios publiquen actividades de manera más unificada.

5) Reducir la publicidad intrusiva y mejorar la coherencia en la plataforma.

Lliurament de l'activitat R2 - Individual

Debate

No hay comentarios.

¡Bienvenidos y bienvenidas!

Folio
Visibilidad: Pública -
¡Bienvenidos y bienvenidas!

¡Bienvenidos y bienvenidas!

Folio
Visibilidad: Pública -
¡Hola! Esta publicación se ha generado automáticamente en el Ágora. Te encuentras en el Ágora de la asignatura. En este espacio se…
¡Hola! Esta publicación se ha generado automáticamente en el Ágora. Te encuentras en el Ágora de la asignatura. En…

¡Hola!

Esta publicación se ha generado automáticamente en el Ágora.

Te encuentras en el Ágora de la asignatura. En este espacio se recogerán todas las publicaciones relacionadas con las actividades que hagan los compañeros y compañeras del aula a lo largo del semestre.

El Ágora es un espacio de debate en el que estudiantes y docentes pueden ver, compartir y comentar los proyectos y las tareas de la asignatura.

Si solamente ves esta publicación, puede ser porque todavía no se ha hecho ninguna más, porque no has entrado con tu usuario de la UOC o porque no perteneces a esta aula. Si no eres miembro de la UOC y ves alguna publicación, es porque su autor o autora ha decidido hacerla pública.

¡Esperamos que esta Ágora sea un espacio de debate enriquecedor para todos y todas!

Debate

No hay comentarios.

Las intervenciones están cerradas.