Publicado por

Repte 2. Post d’anàlisi heurística d’Amazon (Avaluació de la usabilitat).

Repte 2. Post d’anàlisi heurística d’Amazon (Avaluació de la usabilitat).
Publicado por

Repte 2. Post d’anàlisi heurística d’Amazon (Avaluació de la usabilitat).

Anàlisi heurística d’Amazon En aquest post es durà a terme una avaluació heurística de la pàgina web d’Amazon mitjançant els principis d’usabilitat…
Anàlisi heurística d’Amazon En aquest post es durà a terme una avaluació heurística de la pàgina web d’Amazon mitjançant…

Anàlisi heurística d’Amazon

En aquest post es durà a terme una avaluació heurística de la pàgina web d’Amazon mitjançant els principis d’usabilitat de Nielsen. En aquesta avaluació s’analitzarà com Amazon aplica aquests principis al disseny d’interfície d’usuari i es destacarà tant els aspectes positius com els negatius. A més, es discutiran possibles àrees de millora per a la interfície d’usuari d’Amazon i es proporcionaran suggeriments per fer-ne millores.

Finalment, es llistaran i justificaran les troballes en funció de la seva gravetat i també es proposarà un llistat de millores o solucions. L’objectiu d’aquesta avaluació heurística és identificar problemes i oportunitats de millora en la usabilitat d’una interfície d’usuari.

No oblidarem la importància de la inclusió i raonarem sobre la perspectiva de gènere i inclusió tenint en compte diversos aspectes.


Com s’apliquen els principis de Nielsen a Amazon (www.amazon.com)

1.Visibilitat de l’estat del sistema.

✅ Bon ús: Quan un producte s’ha afegit al carretó de la compra es fa saber a l’usuari que ha realitzat correctament l’acció.

❌ Mal ús: mostrar massa informació, sense detallar amb exactitud quan es realitzarà l’entrega del producte.

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

Bon ús: Amazon utilitza un llenguatge clar i senzill per descriure les accions i els elements de la interfície d’usuari, cosa que facilita als usuaris comprendre i utilitzar la botiga en línia. Per exemple, veiem a l’hora de comprar un producte, utilitza un llenguatge fàcil de comprendre.

Mal ús: Falta d’icones en els botons de la barra d’inici o en el cercador per categories.

Veiem un menú i un llistat de categories molt plans, amb molt de text i poc visual.

3.Llibertat i control per part de la persona usuària.

Bon ús: Amazon ofereix als usuaris l’opció de personalitzar l’experiència de l’usuari al lloc web en funció dels seus interessos, historial de compres i preferències. Per exemple, Amazon suggereix productes relacionats amb les compres anteriors dels usuaris i permet als usuaris filtrar els resultats de cerca per categoria, marca, preu i altres factors personalitzables. Això brinda als usuaris més llibertat i control per trobar els productes que desitgen de manera més eficient i personalitzada. A més, Amazon també permet als usuaris personalitzar les recomanacions de productes i millorar la precisió de les recomanacions en proporcionar comentaris sobre els productes comprats.

Mal ús: En alguna ocasió, la web no dona opció a tornar enrere en la teva cerca i per tant, es perd la cerca. En el cas que es mostra a continuació, quan estem a la fitxa d’un producte, si fem clic sobre “Ver detalles”, s’obre una finestra amb els detalls però en cap cas et deixa tornar enrere.

Si cliquem sobre el botó “ver detalles”:

S’obre aquesta pantalla on no podem tornar al producte i perdem la cerca.

4.Consistència i estàndards:

Bon ús: Amazon utilitza un disseny consistent en tota l’aplicació, amb botons i elements de navegació ubicats en llocs predictibles, la qual cosa ajuda els usuaris a trobar el que estan buscant de manera intuïtiva sense haver d’aprendre res nou. A part dels icones com el carretó de la compra (Amb un símbol d’un carretó real), la lupa del cercador…

Mal ús: En alguns casos, quan cerquem un producte, ens ofereix la possibilitat de filtrar aquest producte amb les nostres preferències. Aquest filtratge és extremadament exhaustiu, poc intuïtiu (l’usuari no sap si ho ha de marcar tot), s’ha de fer scroll per tal de poder-lo visualitzar sencer… Aquest fet por confondre a l’usuari.

5. Prevenció d’errades:

Bon ús: Amazon mostra un resum de l’ordre abans que l’usuari la confirmi, cosa que permet als usuaris revisar i corregir qualsevol error abans de finalitzar la compra.

Mal ús: Sovint, Amazon anuncia productes dels quals no disposa d’stock. A la web t’anuncia que “Temporalment no hi ha stock” però et deixa comprar-lo igualment. Si l’usuari no s’ha fixat que no existeix stock i el compra per error, no s’avisa enlloc.

Tot i que s’anuncia que no existeix stock, el deixa comprar:

I, com es veu a la següent pantalla et deixa comprar-lo, sense avisar i sense especificar quan tindran stock o quan arribaran.

6.Reconeixement abans que recordar:

Bon ús: Amazon permet als usuaris realitzar cerques per paraula clau, per categoria o per departament, i ofereix una gran quantitat de filtres per refinar la cerca, cosa que ajuda els usuaris a trobar productes sense haver de recordar exactament com es diuen.

Cercador per paraules clau:

Cercador de productes per categories:

Mal ús: A la barra de menú superior no existeix cap canvi per informar a l’usuari que es troba en la pàgina seleccionada. Per exemple, en el cas mostrat en la imatge, l’usuari es troba a l’apartat “Cheques regalo” però no veiem cap canvi en el menú. No fa us de les molles pa o breadcrumb.

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

Bon ús: Amazon utilitza un algorisme de recomanació que s’adapta als interessos de l’usuari i proporciona resultats rellevants, cosa que ajuda els usuaris a trobar productes ràpidament. A més dels anteriors mecanismes anteriorment comentats per trobar de forma fàcil el que l’usuari vol trobar.

Mal ús: De vegades, la pàgina d’Amazon pot tenir massa informació o massa elements en una sola pàgina, el que pot fer que sigui difícil per als usuaris trobar el que estan buscant.

8.Disseny estètic i minimalista:

Bon ús: Amazon en algunes de les seves pàgines (la minoria) utilitza un disseny net i minimalista que fa que la pàgina sigui fàcil de llegir i utilitzar.

Mal ús: De vegades, Amazon mostra anuncis o promocions intrusives que poden distreure o confondre els usuaris. En la majoria de casos son anuncis patrocinats per venedors que venen el seu producte a Amazon.

9.Ajuda les persones usuàries a reconèixer i diagnosticar els errors i a recuperar-se:

Bon ús: Amazon mostra missatges d’error clars i específics quan es produeix un problema, cosa que ajuda els usuaris a reconèixer el problema i buscar solucions.

Mal ús: De vegades, els missatges d’error d’Amazon poden ser genèrics o poc informatius, cosa que dificulta als usuaris identificar i resoldre el problema.

10.Ajuda i documentació:

Bon ús: Amazon ofereix una àmplia gamma de recursos d’ajuda i documentació per als usuaris, incloent preguntes freqüents, tutorials i vídeos instructius, cosa que ajuda els usuaris a aprendre a utilitzar la botiga en línia i a solucionar problemes.

Mal ús: De vegades, la documentació d’Amazon pot ser difícil de trobar o no estar actualitzada, cosa que pot fer que els usuaris no trobin la informació que necessiten.

En general, la pàgina web d’Amazon aplica bé la majoria dels principis de Nielsen, encara que en alguns casos hi pot haver problemes o àrees de millora. En qualsevol cas, és important recordar que l’avaluació heurística és una tècnica subjectiva i que diferents avaluadors poden tenir opinions diferents sobre l’eficàcia d’una interfície d’usuari.

Nivells de gravetat del no compliment dels principis

Gravetat Heurística Problema Solució
10 Ajuda i documentació Documentació difícil de trobar o no ser actualitzada. Això pot ocasionar que els usuaris no trobin la informació que necessiten. Posar aquesta informació en un lloc més visible on l’usuari pugui trobar la informació ràpidament.
9 Reconèixer i diagnosticar els errors Missatges genèrics. Indicar clarament, el l’exemple, el nombre de números que té un BIC, un IBAN i informar de com trobar-ho. També, informar a l’usuari que el nom no pot contenir valors numèrics.
8 Llibertat i control per part de la persona usuària En alguna ocasió, la web no dona opció a tornar enrere en la teva cerca i per tant, es perd la cerca Afegir un botó, que es vegi ràpidament, on l’usuari tingui la opció de tornar enrere.
7 Prevenció d’errades Sovint, Amazon anuncia productes dels quals no disposa d’stock. A la web t’anuncia que “Temporalment no hi ha stock” però et deixa comprar-lo igualment. Si l’usuari no s’ha fixat que no existeix stock i el compra per error, no s’avisa enlloc. Que existeixi un botó diferente al de “Comprar” per tal que l’usuari sapiga que no el pot comprar temporalment.
6 Reconeixement abans que recordar A la barra de menú superior no existeix cap canvi per informar a l’usuari que es troba en la pàgina seleccionada Destacar a la barra de menú (amb colors, subratllats…), l’apartat en el que es troba l’usuari.
5 Flexibilitat i eficiència d’ús. De vegades, la pàgina d’Amazon pot tenir massa informació o massa elements en una sola pàgina, el que pot fer que sigui difícil per als usuaris trobar el que estan buscant. Tot i tractar-se d’una web d’e-commerce on la prioritat es vendre el màxim possible, seria important no recarregar la pàgina amb tanta informació, a vegades irrellevant. Simplificar el disseny per tal d’aconseguir un espai més minimalista.
4 Adequació entre el sistema i el món real Falta d’icones en els botons de la barra d’inici o en el cercador per categories. Implementar icones en alguns dels botons del menú i de la cerca per categories per tal d’ajudar a l’usuari a identificar aquesta acció visualment, relacionant les icones amb el món real.
3 Disseny estètic i minimalista En ocasions, Amazon mostra anuncis o promocions intrusives que poden distreure o confondre els usuaris. En la majoria de casos son anuncis patrocinats per venedors que venen el seu producte a Amazon.

 

No saturar la web amb tants anuncis i recomanacions constantment, això atempta contra el disseny i l’excés d’informació addicional podria molestar a l’usuari.
2 Visibilitat del sistema Mostrar massa informació, sense detallar amb exactitud quan es realitzarà l’entrega del producte. Concretar l’entrega i eliminar la informació irrelevant.
1 Consistència i estàndards Filtratge extremadament exhaustiu, poc intuïtiu Fer un filtratge de producte molt més intuïtiu, sense tants apartats i que es pugui visualitzar a primera vista sense fer scroll.

 

 


Consideracions de la interfície des d’una perspectiva de gènere i inclusiva.

En l’actualitat, la perspectiva de gènere i inclusió és una qüestió important en la societat, i això també s’aplica a la indústria del comerç electrònic. Amazon, com a una de les plataformes més importants en línia, ha d’estar al dia en aquest aspecte.

Pel que fa al llenguatge utilitzat en la pàgina web d’Amazon, es pot observar que s’intenta ser inclusiu, ja que s’evita l’ús de termes exclusius com «ell» o «ella». Això es pot veure en les descripcions dels productes, en les quals s’utilitzen termes més neutrals i genèrics, com «la persona usuària» o «les persones que comprin aquest producte». A més, també s’utilitza el llenguatge inclusiu en els missatges de benvinguda i de confirmació de la compra.

En quant a la interacció amb la pàgina web, sembla que no hi ha cap assumpte de la identitat de gènere de la persona usuària. Amazon no demana informació sobre el gènere de la persona al registrar-se, i la interacció amb la plataforma es fa sense cap mena de discriminació.

En relació a les imatges mostrades, Amazon té en compte la diversitat i inclusió. Això es pot veure en la varietat de persones i models que apareixen en les imatges dels productes.

Pel que fa als colors, la pàgina web d’Amazon utilitza una paleta de colors que no es considera exclusiva o discriminatòria. Les combinacions de colors són fàcils de llegir i no es fan servir colors que podrien ser perjudicials per a persones amb discapacitats visuals.

En conclusió, es pot dir que Amazon té en compte la perspectiva de gènere i inclusió en la seva pàgina web. S’intenta ser inclusiu en el llenguatge utilitzat, no es discrimina en la interacció amb la plataforma i es mostra una varietat de persones i models en les imatges dels productes. També s’utilitza una paleta de colors que és accessible i inclusiva. No obstant això, sempre hi ha espai per a la millora i Amazon pot continuar treballant per ser més inclusiu i per abordar les qüestions relacionades amb la diversitat de manera més profunda i sistemàtica.

Per Adrián Sáez Cordón.

Debate0en Repte 2. Post d’anàlisi heurística d’Amazon (Avaluació de la usabilitat).

No hay comentarios.

Publicado por

Evaluación Heurística Ataquilla.com

Publicado por

Evaluación Heurística Ataquilla.com

Ataquilla.com En este artículo se examinará la página web de venta de entradas de Ataquilla, que es uno de los servicios de…
Ataquilla.com En este artículo se examinará la página web de venta de entradas de Ataquilla, que es uno de…

Ataquilla.com

En este artículo se examinará la página web de venta de entradas de Ataquilla, que es uno de los servicios de venta de entradas más populares en Galicia. Este servicio permite buscar entradas para eventos según la ubicación y la fecha, lo que puede dificultar la navegación en algunos casos.

Ataquilla es un servicio de venta de entradas de la Fundación Galicia Obra Social, conocida comercialmente como Afundación. Esta organización se dedica principalmente al desarrollo de obra social y la gestión del patrimonio cultural en Galicia.

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

Una Evaluación Heurística es una técnica en la que un experto evalúa un producto para identificar problemas de usabilidad potenciales, utilizando una lista de principios de usabilidad. Esta técnica es eficaz para identificar problemas antes de llevar a cabo pruebas con usuarios.

Para la realización del análisis heurístico y análisis desde de la perspectiva de genero de la web se realizaron los siguiente pasos:

    1. Primero me dediqué a explorar todas las secciones del sitio web para entender cómo acceder a las diferentes páginas. Probando las diferentes funcionalidades de la web.
    2. Realice un listado con las 10 principios heurísticos de Nielsen, con algunos ejemplos, para entender mejor cada heurística, también busqué información adicional en Internet.
    3. Volví a explorar la web iba identificando prácticas positivas y negativas en general,
    4. Después, creé una listado de ejemplos de buenas practicas y de malas practicas de cada uno de los casos y posibles mejoras  para mejorar la experiencia de los usuarios.
    5. Mientras hacía esto, también tomaba capturas de pantalla de los ejemplos que os adjunto.
    6. Finalmente, volví a navegar por todo el portal para buscar aspectos relacionados con la perspectiva de género e inclusión.
Los 10 principios heurísticos de Nielsen: Cada uno de los principios con su buen y mal ejemplo de aplicación y justificación de por qué motivo es un ejemplo ese hallazgo

#1: Visibilidad del estado del sistema

Este principio de usabilidad web nos indica que siempre tenemos que tener informado al usuario de lo que está pasando en nuestra web y ofrecerle una respuesta en el
menor tiempo posible

A) Generalmente se pueden encontrar Breadcrumbs para saber qué parte del portal nos encontramos, pero estos no son muy identificables y es fácil que se pierdan de vista mientras navegamos, por esta Web. Teatro seria la indicación de en que sección de la web nos encontramos, pero acaba desapareciendo.

Es una mala práctica por parte de la web el no incluir este tipo de indicaciones de forma clara para que los usuarios puedan guiarse. Se tiene que incluir algún tipo de indicación en la barra de menú.

#2: Coincidencia entre el sistema y el mundo real

El sistema tiene que “hablar” el lenguaje del usuario con palabras o frases que a éste lesean familiares y que pueda reconocer con facilidad.
La información tiene que mostrarse con un orden lógico y las imágenes o iconos usados tienen que ser claros, sin darle la posibilidad al usuario de equivocarse.

A) Se pueden ver los patios de butacas de los diferentes lugares y que sitios están libre cuando son entradas numeradas. Utilizar diferentes colores para representar los diferentes tipos de asientos disponibles es una buena práctica en el diseño de interfaces de usuario. El uso de colores distintos para los asientos puede facilitar la comprensión y la toma de decisiones por parte de los usuarios, ya que les permite identificar rápidamente los tipos de asientos disponibles, como asientos normales, asientos preferenciales o asientos especiales, de manera visual.
B) La información se muestra de forma clara y en orden lógico. No es difícil moverse por el portal.

Es una Buena practica el poder ver de un solo vistazo cuales son los asientos que estas disponible y en que zonas

#3: Control y libertad del usuario

A veces, un usuario se equivoca, es normal, está dentro de la naturaleza humana el equivocarse.
Tenemos que darle al usuario la posibilidad de subsanar el error y no sentirse frustrado por no poder realizar algo.
Cuando es fácil para las personas dar marcha atrás en un proceso o deshacer una acción, se fomenta una sensación de libertad y confianza.

A) La web permite con facilidad el rectificar la compra de una entrada que se compra por error.

Es una buena practica el facilitar al usuario poder eliminar el exceso de entradas y modificar con facilidad en cualquier momento de la compra.

#4: Consistencia y estándares

Los usuarios no deberían tener que preguntarse si diferentes palabras, situaciones o acciones significan lo mismo. Tenemos que tener en cuenta es seguir los convenios establecidos para ciertos iconos.

A) Los elementos con los que se pueden interactuar cambian de aspecto cuando se pasa el ratón, de manera que los usuarios puedan identificar claramente qué elementos son interactivos.
B) Indican con colores de forma clara las butacas que esta disponibles y tipo de asiento

Es importante asegurarse de que los colores utilizados sean accesibles para todos los usuarios, incluyendo a aquellos con discapacidades visuales o dificultades en la percepción del color.

#5: Prevención de errores

Prevenir cualquier error que pueda cometer el usuario. Y dado el caso de que este cometa uno, tenemos que poner a su alcance todas las opciones posibles para poder corregirlo.
Hay dos tipos de errores: los deslices y las equivocaciones. Los deslices son errores inconscientes causados por falta de atención.
Los errores son errores conscientes basados en un desajuste entre el modelo mental del usuario y el diseño.

A) Tiene un buscador que tiene la función de auto completado y que permite buscar por nombre y lugar.
B) El formulario avisa si se produce un error cuando se escribe, donde y porque.

Es una buena practica que mientras se escribe se pueden ver todos los resultados al momento lo que ayuda a que la persona que escribe no tenga que saber exactamente el nombre completo del evento.

6: Reconocimiento en lugar de recuerdo

Minimizar la carga de memoria del usuario haciendo visibles los elementos, acciones y opciones. El usuario no debería tener que recordar información de una parte de la interfaz a otra.
La información necesaria para utilizar el diseño (p. ej., etiquetas de campo o elementos de menú) debe estar visible o recuperarse fácilmente cuando sea necesario.

A) Durante todo el proceso de compra se tiene claro el numero de entradas cuanto va a acostar y la butaca

Es una buena practica que el usuario no tenga que recordar información de una página a otra. Es importante que la información sobre la cantidad de entradas, el precio y la ubicación de las butacas se muestren claramente en todo el proceso de compra, para que el usuario pueda revisar y confirmar su selección en todo momento. Al hacer que la información necesaria para el proceso de compra sea fácilmente visible, se reduce la carga de memoria del usuario y se mejora la experiencia de usuario en el sitio web.

#7: Flexibilidad y eficiencia de uso

Los accesos directos, ocultos para los usuarios novatos, pueden acelerar la interacción para el usuario experto, de modo que el diseño pueda satisfacer tanto a los usuarios inexpertos como a los experimentados. Los procesos flexibles se pueden llevar a cabo de diferentes maneras, de modo que las personas puedan elegir el método que mejor les funcione.

A ) La barra de buscador permite buscar eventos específicos lo que sirve para agilizar el trabajo para usuarios avanzados.  Además, es positivo que el portal esté diseñado pensando tanto en usuarios avanzados como en usuarios novatos. La capacidad de buscar actividades por calendario y ubicación de forma sencilla es una buena práctica, ya que facilita la búsqueda y selección de eventos según las preferencias del usuario. Esto asegura que tanto los usuarios experimentados como los novatos puedan utilizar el portal de manera eficiente y encontrar las actividades culturales que deseen participar.

Es una buena práctica en el diseño del portal incluir una barra de búsqueda que permita a los usuarios buscar eventos específicos. Esto agiliza el trabajo de los usuarios avanzados, ya que les permite encontrar rápidamente los eventos o actividades que están buscando.

#8: Diseño estético y minimalista

Las interfaces no deben contener información que sea irrelevante o que rara vez se necesite.
Se trata de asegurarte de mantener el contenido y el diseño visual enfocados en lo esencial. Asegúrese de que los elementos visuales de la interfaz respalden los objetivos principales del usuario.

A ) La Web es sencilla y no contiene información a mayores que puede molestar o distraer. No tiene publicidad como sucede en otros  portales  de venta de entradas  Online.
B ) La  paleta de colores de portal esta constituido por 3 colores (Azul, Rojo y Blanco) que son los colores corporativos de A fundación.  Se evita una saturación de colores.

Mejoras:  Aun que el uso de los colores y de las tipografías están justificadas a nivel de identidad grafica de la fundación, esta genera problemas de contraste dentro de la web.

#9: Ayude a los usuarios a reconocer, diagnosticar y recuperarse de errores

Los mensajes de error deben expresarse en un lenguaje sencillo (sin códigos de error), indicar con precisión el problema y sugerir una solución de manera constructiva.
Los mensajes de error deben presentarse con tratamientos visuales que ayuden a los usuarios a notarlos y reconocerlos.

A) El formulario avisa si se produce un error cuando se escribe, donde y porque. Lo que evita tener que hacer dos veces el formulario en caso de error.
B) Los avisos son en inglés esto es una mala practica.

Mejoras: Habría que cambiar los mensajes de error el formulario al castellano o galego también hay que tener en cuenta el tamaño de los mensajes de error  ya que el contraste puede ser muy bajo.

#10: Ayuda y documentación

Es mejor si el sistema no necesita ninguna explicación adicional. Sin embargo, puede ser necesario proporcionar documentación para ayudar a los usuarios a comprender cómo completar sus tareas.
El contenido de la ayuda y la documentación debe ser fácil de buscar y debe centrarse en la tarea del usuario.

A) Dispone de una pagina de ayuda, pero no es esta accesible de forma directa.
B) No es muy completa comparada con las de otros servicios.

Mala practica; hay que dar un acceso directo desde contacto para facilitar a los usuarios el acceso a la información. También habría que hacer un una reforma de la pagina de ayuda para dividir las consultas en diferentes problemáticas y soluciones. Incluso añadir una barra de búsqueda para facilitar la búsqueda de información.

Listado de Mejoras
    1. La funcionalidad de inicio de sesión o creación de cuenta no esta disponible en la web esta función es importante, lo que les permitiría guardar sus preferencias, ver el historial de compras anteriores, recibir notificaciones relevantes y tener un proceso de compra más eficiente en futuras visitas. No tener esta opción resultar en una experiencia mala para los usuarios, ya que tendrían que volver a ingresar su información en cada compra. Por que el botón de entrar no es para loguearse.  
    2. Ayuda a la Documentación: No hay un acceso a la ayuda en la barra del menú ni a través de contacto. Dentro de la pagina de ayuda no hay mucha información, no esta dividida en temáticas para ayudar a los usuarios a localizar la temática de su problema  y así encontrar una solución a su problema.
    3. Diseño estético y minimalista. – Hay que hacer una revisión de la identidad grafica del sitio para ajustar los colores y tipografías en algunos apartados de la web. Esta problemática podría afectar a personas mayores y con problemas de visión.
    4.  Visibilidad del estado del sistema: Se deberían poder encontrar Breadcrumbs o «migas de pan» en las interfaces de usuario para indicar la ubicación del usuario dentro del portal o sitio web. Sin embargo, si estos elementos no son fácilmente identificables o se pierden de vista durante la navegación. Es importante que los usuarios cuenten con indicaciones claras para poder orientarse y saber en qué parte del portal se encuentran.
    5.  Ayude a los usuarios a reconocer, diagnosticar y recuperarse de errores: El formulario de contacto anqué indica donde esta el error es importante que este en Castellano o en Galego también que los tamaño de las tipografías sean de tamaños mas grandes.
Consideraciones de la interfaz desde una perspectiva de género e inclusión.

En términos de inclusión y perspectiva de género, es importante considerar no solo los aspectos técnicos, sino también los aspectos culturales y sociales en el diseño de la interfaz de una web. En cuanto a la accesibilidad, se han identificado problemas en el contraste de los botones de llamada a la acción, lo que dificulta la legibilidad y navegación para algunos usuarios.

Asimismo, se han detectado problemas similares en algunas tipografías y colores que se utilizan en la página.

Este problema se puede deber a que para la creación de  la web  usaron los colores corporativos de la entidad que esta detrás de la Ataquilla
Las imágenes cuentan con etiquetas de accesibilidad, como «alt» lo que ayuda a dar accesibilidad a la pagina.

En relación a la perspectiva de género, la web parece tratar al usuario de forma neutral, sin hacer distinción por género ni recopilar información de género en los formularios. No se han incluido imágenes de espectadores ni de personas, lo que podría considerarse una estrategia para evitar la identificación de géneros  y hacer la web neutra.

Si bien es cierto que no hacer distinción de género en la interfaz de una web puede ser considerado un paso hacia la neutralidad, también es importante considerar la inclusión de todas las identidades de género en el diseño de la página. Esto implica no solo evitar la discriminación, sino también incluir representaciones de género diverso en las imágenes y contenido de la página, para que todos los usuarios se sientan identificados y bienvenidos.

En ese sentido, la falta de imágenes de espectadores o personas en la página podría limitar la inclusión de algunas identidades de género, especialmente si el contenido del sitio web se dirige a un público diverso. Por lo tanto, se sugiere considerar incluir imágenes y contenido que representen la diversidad de género en la página, para asegurar una experiencia inclusiva y representativa para todos los usuarios.

Debate0en Evaluación Heurística Ataquilla.com

No hay comentarios.

Publicado por

Evaluación heurística MercadoLibre

Publicado por

Evaluación heurística MercadoLibre

Post de analisis heurístico En este post se realiza un análisis heurístico de la página web del ecommerce latinoamericano Mercadolibre. El análisis…
Post de analisis heurístico En este post se realiza un análisis heurístico de la página web del ecommerce latinoamericano…

Post de analisis heurístico

En este post se realiza un análisis heurístico de la página web del ecommerce latinoamericano Mercadolibre. El análisis se realiza teniendo en cuenta los diez principios de Nielsen y su aplicación sobre la pagina teniendo en cuenta sus implementaciones buenas y malas.

Metodología

Para realizar el análisis se han seguido los textos propuestos en los recursos de la PEC en especial los relacionados con la evaluación heurística (Nielsen, 1994; Modroño, 2017, 2018; Cuaderno de evaluación de la usabilidad).  Se han tomado capturas de pantalla de cada uno de los ejemplos de los principios que se reflejan en la página, seguido de los ejemplos de buenos y malos usos de los principios heurísticos, también, se realizan recomendaciones a implementar para mejorar el diseño de la pagina y corregir lo errores notados.

1. Empate entre el sistema y el mundo real 

Buena práctica: un ejemplo de buena práctica es la forma en la que organizan algunas de las categorías de productos, la que se muestra en la imagen es la de productos de supermercado; se organizan productos con base en su utilidad, al igual que en las tiendas físicas.

Mala práctica: me parece que existe un exceso de categorías entre categorías, todo está muy “cuadriculado”, puede que el usuario pueda ubicar mejor el producto que quiere de esta manera, pero, igual es mucha información en pantalla, cosa que en tiendas físicas está mejor distribuida. Sería más útil poner un buscador dentro de las categorías, para que el usuario no pierda tanto tiempo buscando productos.

2. Diseño estético y minimalista

Este punto me parece que es un poco irónico, ya que la página cumple con un diseño estético pero a veces poco minimalista, como vamos a ver a continuación:

 

Buena práctica: en este caso, tenemos que las categorías se agrupan bajo iconos sencillos y reconocibles a los usuarios, lo cual está muy bien y no satura la interfaz.

Mala práctica: pero, por otro lado, tenemos que en la página también se muestran las categorías de manera escrita, lo cual se hace de una forma excesiva y saturante para el usuario. Como se puede ver en la imagen de abajo, todo lo que está en texto, son categorías. Quizás no sea necesario tener que quitar las categorías para solucionar, en cambio, se podrían colocar pestañas que permitan reducir la cantidad de texto en pantalla para hacer más cómoda la interacción al usuario.

3. Ayudar a reconocer, diagnosticar y recuperarse de errores

Buena práctica: En este caso se nos informa de un error en el que tratamos de ingresar con una cuenta de correo correspondiente al dominio venezolano de la página, a la página colombiana; la solución que se nos da es un link que nos redirige hacia el dominio de Venezuela.

Mala práctica:  en este caso, al tratar de crear una cuenta, en la fase de reconocimiento facial aparece un error, pero no dice ni como solucionarlo ni por que se ocasiona, entonces dejan al usuario básicamente a medio camino de crear su cuenta. Hacer evidente el error, para que el usuario sepa que está pasando sería de mucha ayuda, en conjunto con un link directo hacia soporte. 

 

4. Visibilidad del estado del sistema 

 

Buena práctica: Mercadolibre siempre nos permite conocer en qué paso de la compra nos encontramos con la opción del carrito, como también nos permite conocer qué elementos pasados hemos visto a través del historial.

 

Mala práctica: el sistema falla en siempre dar la ubicación del usuario en la página, por ejemplo, en la imagen nos encontramos en la categoría cables, pero en ningún momento se nos indica que nos encontramos allí. Sería bueno añadir un mapa de la página accesible en todo momento, para guiar al usuario.

5. Control y libertad del usuario 

Buena práctica: al crear una cuenta, te dan la opción de deshacer y de repetir alguno de los pasos anteriores por si te equivocaste al hacerlo; como también, si dejas el proceso detenido y sin completar, puedes continuarlo después.

Mala práctica: es curioso, que la mala práctica se encuentre en el mismo proceso de creación de cuenta. Solo que esta vez, se da cuando hay un fallo al reconocer tu imagen facial; el error puede seguir ocurriendo y nunca se te dan opciones para retomar después, o hacer algo distinto; es poco claro que puedes salir de la página sin perder el proceso. Así, implementar un botón que permita volver a la página anterior, o a la página principal, sería una buena idea.

 

 

6. Ayuda y documentación 

 

Buena práctica: como podemos ver, la página cuenta con un apartado de FAQ y de ayuda bastante completo, cuenta con un buscador también, para facilitar la búsqueda de información del usuario.

Mala práctica:  una mala práctica que tiene la página es que no hay forma de contacto directo, no hay direcciones de correo electrónico, ni chats de ayuda. Todo depende de que el usuario lea instrucciones y busque su solución. La solución, por lo tanto sería implementar chats de soporte, links o medios de contacto mas evidentes para el usuario.

 

7. Prevención de errores 

Buena práctica: el sistema cumple con avisar alteraciones que puede tener el servicio que presta la página, en este caso nos está avisando de que no se realizan envíos hacia la ubicación deseada y que el producto no está disponible si no hasta un día después de realizar la compra. Esto no crea falsas expectativas.

Mala práctica: En este caso tenemos una mala práctica al momento de crear una cuenta, en la que se da un fallo al utilizar la cámara del dispositivo para realizar reconocimiento facial; la cosa es, que la cámara si funciona durante todo el proceso, pero la pagina de igual manera da error y ninguna de las soluciones que propone sive. Una opción que se podría implementar, seria un link hacia soporte en caso de que el usuario no encuentre la solución.

8. Flexibilidad y eficiencia de uso 

Buena práctica: en este caso tenemos la opción del carrito de compra, la cual nos permite añadir objetos a nuestro carrito, para seguir explorando más productos para añadir. Es una opción “avanzada” que puede ahorrar tiempo de navegación a las personas.

Mala práctica: Como mala práctica, tenemos el hecho de que al iniciar sesión, después de haber seguido todos los pasos correctamente y darle al botón iniciar sesión, la página nos dice que hay que rellenar un captcha; cosa que se pudo haber hecho desde el principio. Una solución podría ser que el captcha siempre esté activo.

9. Reconocimiento mejor que recuerdo

 

Buena práctica: dentro de las categorías de compra de la página suelen haber buscadores especializados de productos, los cuales ayudan al usuario a poder realizar la búsqueda de manera más sencilla. En este caso tenemos un buscador de automóviles con varias opciones de búsqueda.

Mala práctica: en este caso tenemos que en la barra superior parece haber un exceso de “títulos” que en sí, si guían al usuario durante su navegación, pero que pueden ser reducidos mediante un símbolo, como lo es el de menú hamburguesa.

10. Consistencia y estándares 

 

Buena práctica: Una buena práctica es que los botones de acciones importantes están estandarizados con el color azul de fondo y la letra blanca para la fuente. Esto se cumple por todo el recorrido de la página.

Mala práctica: un ejemplo de mala práctica es como se utiliza el banner principal de la página, para meter publicidad de suscripciones, cuando en casi ninguna pagina que conozco pasa esto, es raro ver eso en la esquina superior derecha siempre. Una solución podría ser quitar la publicidad y no colocar nada, o colocar otro tipo de imagen que le aporte utilidad a los usuarios, por ejemplo ahí podría ir una opción de chat de ayuda.

Consideraciones de la interfaz desde una perspectiva de género e inclusión

En si, durante mi uso de la interfaz no encontré ningún tipo de discriminación directa hacia grupos sociales. La empresa como tal, cuenta con una política inclusiva bastante seria, en relación a sus empleados, aunque navegando por la página se pueden encontrar unos cuantos descuidos del género de los usuarios, como por ejemplo, en las categorías dedicadas a ropa, los filtros por género solo consisten en: hombre, mujer, niño, niña y sin género (aunque en realidad me parece que son categorías que se adaptan al tipo de ropa que se vende). La página no hace uso de colores de manera sexista, ni de manera excluyente.

De hecho, la página tiene un apartado exclusivo de accesibilidad en donde se explica su compromiso para hacer una página accesible para todo público, independientemente de sus capacidades. Constantemente se están evaluando para adaptar el uso de la página a todo público.

Debate0en Evaluación heurística MercadoLibre

No hay comentarios.

Publicado por

PEC2: Evaluación heurísitca

Publicado por

PEC2: Evaluación heurísitca

1. Objetivos 1.1. Interfaz La interfaz elegida es la aplicación Style DNA: Your Pocket Stylist. Se trata de un virtual closet y outfit planner…
1. Objetivos 1.1. Interfaz La interfaz elegida es la aplicación Style DNA: Your Pocket Stylist. Se trata de un…

1. Objetivos

1.1. Interfaz

La interfaz elegida es la aplicación Style DNA: Your Pocket Stylist. Se trata de un virtual closet outfit planner que tiene como objetivo ayudar al usuario a almacenar su ropa, así como las distintas combinaciones que se pueden realizar con ellas y descubrir nuevas marcas. Contiene las siguientes funciones principales:

  • Un armario virtual donde los usuarios pueden tomar fotos de su ropa o buscar imágenes en línea para agregarlas a su colección de ropa.
  • Categorización de prendas que las organiza las prendas en diferentes categorías para una fácil navegación.
  • Creación de conjuntos que permite a los usuarios arrastrar y soltar prendas en una interfaz visual y guardar los conjuntos completos en su armario virtual.
  • Recomendaciones de conjuntos que utiliza un algoritmo de inteligencia artificial para ofrecer recomendaciones personalizadas en función de las prendas que el usuario tiene en su armario virtual, así como poder incluir a estos conjuntos ropa nueva que puede adquirir el usuario.
  • Seguimiento de tendencias que permite a los usuarios estar a la moda con las últimas tendencias y recibir sugerencias para incorporarlas en su estilo personal.

1.2. Metodología

Se llevará al cabo la evaluación a través de los diez principios de Nielsen, justificando en cada parte cómo afecta ese principio a la interfaz e interacción del usuario. Así mismo, he señalado un listado de gravedad respecto a la experiencia del usuario.


2. Análisis

2.1. Los diez principios heurísticos de Nielsen

1. Visibilidad del estado del sistema.

Descripción: Después de realizar el test personalizado, la app enseña una pantalla de carga. A medida que sube la barra de carga, la app enseña al usuario distintas funcionalidades, como podemos observar en la foto.

Valoración: No obstante, tengo la impresión de que realmente es un simulador de carga, pues mientras lo hacía, aparecía la opción de subscribirte a un plan y los distintos precios, desapareciendo por completo la pantalla de carga; esto provocaba que rompiera dicha simulación.

Gravedad: 2. No demuestra de verdad una barra de carga, sino que se realiza como una estrategia para atraer al usuario a subscribirse a un plan de pago y estropea su experiencia del usuario, al percibirse como spam.

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

Descripción: La aplicación se ajusta a los objetos de la vida real.

Valoración: Las subclases del índice son abundantes. Quizás una segunda agrupación resultaría más sencilla para el usuario.

3. Libertad y control por parte de la persona usuaria.

Descripción: Esta captura de pantalla muestra el test inicial que se le realiza al usuario para personalizar mejor el contenido expuesto.

Valoración: El usuario no puede rectificar lo que ha elegido después de darle «next», lo cual resulta bastante problemático, ya que no se puede volver a realizar el test una vez estás registrado.

Gravedad: 1. Este error perjudica en gran medida la experiencia el usuario, pues realizar de nuevo el test supondría borrar su cuenta y volver a realizarlo. Debería ser un proceso fácil y rápido.

4. Consistencia y estándares.

Descripción: Este es el menú principal de la aplicación, situado en la esquina inferior izquierda. Como se puede observar, la aplicación cumple con la consistencia y estándares, como por ejemplo el símbolo situado en la esquina superior izquiera: la bolsa indica el carro de la compra, pero en este caso se ajusta al contexto de compra de ropa.

Valoración: El icono de la bolsa de compra resulta ser muy pequeño. Un tamaño más grande ayudaría a encontrarlo al usuario, sobre todo con problemas de visión.

5. Prevención de errores.

Descripción: Después de realizar el test personalizado, se le pide al usuario un selfie para comprobar los colores más acordes a su constitución.

Valoración: La prevención de realizar una mala foto está muy bien expuesta e ilustrada en este caso.

6. Reconocimiento antes que recuerdo.

Descripción: En el perfil, se puede observar las estadísticas de la cantidad de cada uno de los parámetros estéticos que mejor le quedan al usuario. Además, todos los iconos van acompañados de un icono.

Valoración: Los iconos de «Color» y «Fabric» no representan del todo el concepto asignado. Quizás el cambio a otros símbolos más universales (una paleta de pintor, un rollo de tela) ayudarían más al usuario con su asociación.

7. Flexibilidad y eficencia en el uso.

Descripción: Se trata de la función de añadir prendas al armario virtual.

Valoración: El usuario puede realizar una foto de su compra, pero para aquellos usuarios que quizás, por diversos motivos de salud o desconocimiento de tecnología, les resulte más difícil utilizar la cámara, añadir las prendas desde el catálogo ya formado es buena idea.

8. Diseño estético y minimalista.

Descripción: Este es el apartado del catálogo, donde el usuario puede buscar los objetos que desea.

Valoración: Precisamente al tratarse de un apartado de búsqueda, debería ser un diseño mñas estructurado.

Gravedad: 5. Hay muchas objetos en una interfaz de búsqueda. Debería tener un diseño más sencillo, así como una ligera reducción de tamaños de algunas letras, que disconcordan con la página en general.

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

Descripción: Se trata de la pantalla de ayuda de la aplicación.

Valoración: Más opciones ayudarían al usuario, de diversas índoles.

Gravedad: 3. Resulta ser demasiado escaso ante los numerosos problemas a los que se puede encontrar el usuario (problemas con la cámara, etc.).

10. Ayuda y documentación.

Descripción: Se trata de los ajustes de la apliación.

Valoración: Se debería incluir ajustes de usuario, como por ejemplo, las preferencias.

Gravedad: 4. Los ajustes, realmente, no incluyen la opción de modificar, por ejemplo, las preferencias o ajusted de perfil.

2.2. Consideraciones: inclusión y género

Este tipo de aplicaciones suelen ir enfocadas exclusivamente a mujeres con bastantes consecuencias negativas, como por ejemplo un mayor foco de consumismo y un reforzamiento de los esteriotipos de género. La ropa no tiene género, ni debería ser catalogada dependiendo de ello: un hombre puede ponerse un vestido. No obstante, la implementación futura que realiza la aplicación para incluir también hombres usuarios me parece buena idea; espero que el catálogo no se limite a cada género y cada usuario pueda acceder al otro si así lo desea.


3. Conclusiones

La aplicación es relativamente nueva y tiene margen de mejora; una vez solventados los problemas que presenta, podría resultar en una aplicación muy cómoda para el usuario.

Debate0en PEC2: Evaluación heurísitca

No hay comentarios.

Publicado por

Evaluación Heurística Registraduría

Publicado por

Evaluación Heurística Registraduría

Para la siguiente evaluación heurística, seleccioné el portal web de la Registraduría Nacional del Estado Civil, el organismo colombiano encargado del registro…
Para la siguiente evaluación heurística, seleccioné el portal web de la Registraduría Nacional del Estado Civil, el organismo colombiano…

Para la siguiente evaluación heurística, seleccioné el portal web de la Registraduría Nacional del Estado Civil, el organismo colombiano encargado del registro civil y la identificación de toda la población del país, así como de organizar y garantizar la participación electoral. Como muchas personas colombianas hemos accedido a este portal por lo menos alguna vez, para validar algún aspecto referente al documento de identidad, o la participación e información sobre comicios electorales, es un gran referente para analizar lo que día a día consultan las personas en el país.

https://www.registraduria.gov.co


Para una mejor visualización del contenido, revisa la entrada del folio

Seleccioné como análisis la versión escritorio del portal, pues según el Departamento Administrativo Nacional de Estadística – DANE, en los hogares colombianos “prevalece la tenencia del computador portátil tanto a nivel nacional (27,5%) como en las cabeceras (33,7%) y centros poblados y rural disperso (6,8%) por encima del computador de escritorio y la tableta” (DANE, 2022).


Metodología

  1. Primero realicé una navegación completa del portal para familiarizarme con todas las secciones y entender de qué forma se accedía a las diferentes páginas.

  2. Fui identificando algunas buenas y malas prácticas de forma general, pero no las relacioné directamente con las heurísticas.

  3. Luego hice la lectura de los contenidos de la PEC, asociados a la Evaluación Heurística y las 10 Heurísticas de Nielsen. Complementé el tema con varias lecturas en internet, para entender mejor una a una cada heurística.

  4. Hice una matriz con el nombre de la heurística, dónde había hallado el bueno o mal uso de la misma, la justificación del bueno o mal uso, y la recomendación de solución. Adicionalmente iba tomando captura de imagen y video de dichos usos.

  5. Como un último paso, volví a navegar por todo el portal para identificar aspectos sobre la perspectiva de género e inclusión.

1. Visibilidad del estado del sistema

Buen uso: Cuando el usuario ingresa su número de documento, el sistema le indica a través de un ícono y texto, que este ya puede ser procesado.

Dónde: Formulario consulta de lugar de votación.


Mal uso: El usuario no puede devolverse, pues cuando da clic a la flecha de retroceder queda en la misma página. Por lo tanto no hay un feedback correcto.

Dónde: Directorio de servidores de la registraduría.


2. Coincidencia entre el sistema y el mundo real

Buen uso: El uso del ícono de Más (+) en las categorías del menú, que tienen más categorías internas de navegación, es una convención que invita al usuario a desplegar la información.

Dónde: Formulario consulta de lugar de votación.


Mal uso: El mensaje de página no encontrada o 404, indica cuál es el problema, pero redirecciona automáticamente al usuario a la página de inicio, sin que este tenga tiempo de inspeccionar más elementos o tal vez, captar el error.

Dónde: Error 404


3. Control y libertad del usuario

Buen uso: El informe le brinda al usuario diversos filtros y visualizaciones para que el usuario pueda interpretar el contenido..

Dónde: Informe de delitos e irregularidades electorales.


Mal uso: Los filtros le permiten al usuario seleccionar las variables a través de checkboxes, pero el sistema dificulta deseleccionarlos todos de forma rápida.

Dónde: Filtro de año y línea, en la biblioteca de recursos.


4. Consistencia y estándares

Buen uso: En gran parte de las secciones del portal de la registraduría, se utiliza el elemento del círculo con una flecha, para indicarle al usuario que allí puede acceder a más contenido.

Dónde: Informe de delitos e irregularidades electorales.


Mal uso: El título de banner de capacitación virtual está dentro de un recuadro que lo asemeja a un botón, aunque no tenga esta funcionalidad. Adicional a esto, la zona contiene tres botones que sí cumplen su función, lo que puede confundir al usuario.

Dónde: Banner de capacitación virtual.


5.Prevención de errores

Buen uso: Antes de que el usuario continúe con el pago del trámite, el mensaje en el modal le indica que este pago sólo aplica para ciertos casos. Lo cual ayuda a prevenir errores posteriores en el proceso.

Dónde: Modal pago cédula digital.


Mal uso: Cuando el usuario intenta seleccionar la opción de sede, en la consulta de Servicio al Colombiano, aparece una ventana que no especifica el error, y da un mensaje muy escueto. Por lo cual el usuario no puede prevenirlo.

Dónde: Cuestionario de servicio al colombiano.


6. Reconocer antes que recordar

Buen uso: En la gran mayoría de páginas, se encuentra el módulo de servicios. Esto le permite al usuario, realizar acciones recurrentes desde cualquier parte del portal donde esté el módulo.

Dónde: Módulo de servicios.


Mal uso: El estilo de navegación de la sección, no permite que el usuario ubique fácilmente en qué parte de la categoría se encuentra, pues no hay un breadcrumb específico.

Dónde: Enfoque diferencial del Sistema Integral de Capacitación Electoral.


7. Flexibilidad y experiencia de uso

Buen uso: En la parte superior de la gráfica, hay un tab desplegable que da instrucciones a los usuarios no expertos, sobre el uso de la herramienta.

Dónde: Informe de Mecanismos de Participación Ciudadana en Colombia.


Mal uso: La experiencia de uso está enfocada directamente en usuarios expertos, y no hay herramientas de ayuda u onboarding para usuarios no expertos.

Dónde: Consulta de documentos de escrutinio.


8. Diseño minimalista

Buen uso: La página de inicio del sitio web de la Registraduría, muestra las tres categorías principales, simplificando las opciones que puede seleccionar el usuario. En vez de mostrar todo en una sóla página, la decisión de diseño fue segmentar el contenido en los tres ejes más relevantes.

Dónde: Página de inicio.


Mal uso: La disposición de las tarjetas que contienen el nombre y la foto del servidor, hace que el usuario tenga que hacer mucho scroll para verlas todas. A pesar de que esta información sea necesaria, la forma en que se muestra no plantea un diseño minimalista.

Dónde: Directorio de servidores.


9. Ayuda al usuario a reconocer, diagnosticar y recuperarse de los errores

Buen uso: Al escribir la contraseña, el sistema le indica al usuario la longitud de caracteres requeridos, con lo cual se reconoce y diagnostica el error.

Dónde: Registro de datos para el trámite de la cédula digital.


Mal uso: La página carga unos segundos, y luego aparece un error en inglés que nos indica que algo ha ocurrido, pero no nos explica ni la causa ni la forma de recuperación.

Dónde: Informe resultados electorales en Colombia.


10. Ayuda y documentación

Buen uso: La implementación de la cédula digital en Colombia es un tema reciente. Por lo cual, la sección brinda un apartado de preguntas frecuentes, que específica por categorías de interés (Generales, trámite y Activación) para el usuario.

Dónde: Cédula digital.


Mal uso: La sección cuenta con un gran flujo de información referente a estadísticas, informes y documentos, pero no hay herramientas de ayuda o preguntas frecuentes que guíen al usuario en la interacción.

Dónde: Implementar un onboarding, así como una sección de glosario y preguntas frecuentes.


Priorización de hallazgos

1

En el Informe resultados electorales en Colombia, la página carga unos segundos, y luego aparece un error en inglés que nos indica que algo ha ocurrido, pero no nos explica ni la causa ni la forma de recuperación.

Gravedad: 8/10


Justificación: Este informe hace parte de Datos para la democracia, y es muy importante para consultar resultados electorales en el país. Que exista un error técnico y que el usuario no pueda acceder al informe, es un gran inconveniente.


Propuesta de mejora: Especificar el error a través de un mensaje en español, que explique cuál ha sido la causa. Así mismo, brindarle al usuario la opción de ver otros informes.

2

Cuando el usuario intenta seleccionar la opción de sede, en la consulta de Servicio al Colombiano, aparece una ventana que no especifica el error, y da un mensaje muy escueto. Por lo cual el usuario no puede prevenirlo.

Gravedad: 7/10


Justificación: Este cuestionario hace parte del listado de encuestas de satisfacción. Que exista un error técnico y que el usuario no pueda realizarla, es un gran inconveniente. 


Propuesta de mejora: Ajustar el funcionamiento técnico del cuestionario, pues este error impide que el usuario pueda avanzar, y no hay forma de que tampoco lo pueda prevenir.

3

En la Consulta de documentos de escrutinio, la experiencia de uso está enfocada directamente en usuarios expertos, pero no hay herramientas de ayuda u onboarding para usuarios no expertos.

Gravedad: 5/10


Justificación: Podría inferir que esta sección es muy consultada en fechas electorales, por muchos tipos de usuarios. Es muy importante garantizar la flexibilidad de uso, por la cantidad y complejidad de los datos.


Propuesta de mejora: Implementar un onboarding indicando para qué sirve cada sección, así como herramientas de ayuda y definiciones.

4

En la biblioteca de recursos, los filtros le permiten al usuario seleccionar las variables a través de checkboxes, pero el sistema dificulta deseleccionarlos todos de forma rápida.

Gravedad: 4/10


Justificación: Este tipo de interacción dificulta el control que el sistema le da al usuario para filtrar las publicaciones, pero puede ser solucionado fácilmente.


Propuesta de mejora: Incluir una opción que pueda limpiar todas las variables en una misma acción, como un botón, o un checkbox general.

5

En el Directorio de servidores de la registraduría, el usuario no puede devolverse, pues cuando da clic a la flecha de retroceder queda en la misma página. Por lo tanto no hay un feedback correcto.

Gravedad: 4/10


Justificación: Los errores técnicos de interacción pueden  causar frustraciones en los usuarios. Este en particular hace que el usuario quede en loop en una misma página. Aunque puede ser solucionado fácilmente.


Propuesta de mejora: Ajustar la funcionalidad técnica de la flecha, para corregir el error de interacción.

6

El mensaje de página no encontrada o 404, indica cuál es el problema, pero redirecciona automáticamente al usuario a la página de inicio, sin que este tenga tiempo de inspeccionar más elementos o tal vez, captar el error.

Gravedad: 3/10


Justificación: Si bien el error 404 puede ser menos frecuente, el comportamiento que tiene en el sitio web de la registraduría puede causar disonancia cognitiva al usuario.


Propuesta de mejora: Quitar el redireccionamiento automático. Adicionar un botón de volver al inicio para que el usuario controle la acción.

7

En la sección de Enfoque Diferencial del Sistema Integral de Capacitación Electoral, el estilo de navegación, no permite que el usuario ubique fácilmente en qué parte de la categoría se encuentra, pues no hay un breadcrumb específico.

Gravedad: 2/10


Justificación: Es muy importante indicar a los usuarios en qué parte del sistema están, para garantizar una óptima interacción.


Propuesta de mejora: Implementar una miga de pan o breadcrumb en este tipo de secciones, para ayudarle al usuario a reconocer en cuál sección se encuentra navegando.


Perspectiva de género e inclusión

Al ser un portal con un alcance poblacional alto, el sitio web de la Registraduría ha trabajado por generar un lenguaje de inclusión notoriamente verificable. El uso de imágenes con personas diversas es rastreable, y en muy pocas partes detecté que se dirigieran a las personas usuarias asumiendo su género. Tal vez hay algunas alusiones puntuales en varias partes del portal como la siguiente:

En general el lenguaje cuida su neutralidad. También quiero reseñar que el portal cuenta con material pedagógico con enfoque diferencial, para la capacitación electoral. Esto es una gran iniciativa de inclusión social.

Así mismo, el portal cuenta con una herramienta de accesibilidad que permite una gran cantidad de opciones para usuarios con diversas discapacidades físicas. Los usuarios pueden desde aumentar el tamaño y editar la alineación de la tipografía, resaltar enlaces, editar el contraste y la saturación, ajustar el color del texto y los fondos, así como ocultar las imágenes, usar un teclado virtual e iniciar un traductor de texto a voz. De la misma forma, hay varias opciones predeterminadas que el usuario puede activar para diversas discapacidades visuales y cognitivas.

♥Gracias♥

Debate1en Evaluación Heurística Registraduría

Publicado por

Evaluación Heurística – Julián Cruz

Publicado por

Evaluación Heurística – Julián Cruz

NETFLIX – TÉCNICAS OCULTAS DE DISEÑO DE EXPERIENCIA E INTERACCIÓN QUE LA HACEN LA PLATAFORMA DE STREAMING CON MÁS USUARIOS DE TODO…
NETFLIX – TÉCNICAS OCULTAS DE DISEÑO DE EXPERIENCIA E INTERACCIÓN QUE LA HACEN LA PLATAFORMA DE STREAMING CON MÁS…

NETFLIX – TÉCNICAS OCULTAS DE DISEÑO DE EXPERIENCIA E INTERACCIÓN QUE LA HACEN LA PLATAFORMA DE STREAMING CON MÁS USUARIOS DE TODO EL MUNDO. 


Desde su creación en 1997 a día de hoy, Netflix cuenta con más de 200 millones de usuarios, pero, ¿a qué se debe esta victoria frente las múltiples plataformas de streaming que existen actualmente? Sigue leyendo para descubrirlo.


 

El 29 de agosto de 1997 en, California, Estados Unidos, surge a la superficie de la tierra el término “Netflix” por primera vez. Esta se presentó al mundo como una compañía de alquiler de contenido visual y ha desde entonces revolucionado la manera en la que digerimos y procesamos material digital; formando un nuevo ecosistema y cambiando por completo la forma de ver series y películas.

La plataforma ofrece actualmente más de 3,600 películas y 1,800 series televisivas, contenido accesible en cualquier lugar y a cualquier hora del día, con tan solo unos pocos clics, dejando atrás aquellas ataduras a los horarios de transmisión programados.

Desde su aparición han emergido numerosas plataformas con el mismo enfoque como Hulu, Amazon Prime Video, HBO, entre otros. La gran mayoría de estos productos/servicios no solo han adoptado la funcionalidad de Netflix, sino también una gran parte del diseño de la interfaz, ¿por qué?

Todos estos factores mencionados anteriormente generan la incertidumbre de la que nace este post. Por esto, vamos a averiguar los secretos ocultos de Netflix y como su utilización de diseño de interfaz, a través del diseño de experiencias e interacción, no solo la han posicionado como la plataforma número 1 de streaming a nivel mundial, sino que ha hecho que otras plataformas del mismo servicio tengan una interfaz muy similar.

Los 10 principios heurísticos de Jakob Nielsen

Gracias a años de investigación, existen múltiples metodologías para indagar y entender el funcionamiento de plataformas digitales, y aquellos aspectos que generan una identidad de alta usabilidad, llamativa y funcional. Una de estas técnicas son los principios heurísticos de Jacob Nielse, la cual pondremos en práctica para descubrir aquellos recursos ocultos que hace de Netflix el servidor que es hoy.

Las 10 heurísticas de usabilidad de Jakob Nielsen son un conjunto de pautas preestablecidas que tienen como objetivo generar una evaluación de efectividad sobre una interfaz de usuario. Esta lista es considerada una de las más universales, ya que indaga aspectos visuales y funcionales, abarcando el territorio en su totalidad.

A continuación encontrarás las 10 heurísticas y algunos ejemplos de la aplicación de cada una de ellas en la plataforma de Netflix, junto con un pequeño análisis de posibles propuestas de mejora para cada una de ellas.

1. Visibilidad del estado del sistema.

Este principio tiene como objetivo el mantener al usuario al tanto de lo que está pasando en todo momento, proporcionando retroalimentación de forma clara, organizada y sin generar una sobrecarga de información.  Algunos ejemplos de la empleabilidad de este recurso en Netflix son:

a) Indicador de carga – Al reproducir contenido, Netflix presenta una animación en pantalla que indica al usuario que el contenido se encuentra en proceso de carga, iniciando su reproducción de forma automática una vez esta haya terminado.

b) Conexión a internet – Si la conectividad del usuario es de baja calidad, Netflix proporcionará un mensaje indicativo de que “algo salió mal”, sugiriendo al individuo comprobar su conexión a internet e intentar generar un nuevo acceso.

c) Progreso de visualización – Por medio de una barra de visualización, el usuario se mantiene informado, en todo momento, del tiempo restante del contenido en reproducción/ su posición relativa con respecto a la duración total del contenido.

Posible mejora:Indicador de carga – Este podría no solo informar al usuario de que el contenido se encuentra en proceso de carga, sino también indicar el tiempo estimado de duración de este proceso.

2. Relación entre el sistema y el mundo real.

Este principio tiene como objetivo presentar al usuario con información/contenido que haga alusión directa a aquel que existe en el mundo no virtual, de tal forma que se genere un mayor entendimiento, sin la necesidad de tener conocimientos técnicos o lingüísticos específicos. Adicionalmente, dispone una interfaz visualmente fácil de navegar utilizando imágenes/iconografía clara, un orden lógico entre elementos, etc. Algunos ejemplos de la empleabilidad de este recurso en Netflix son:

a) Mi lista – Netflix presenta como una de las categorías del menú la opción de “mi lista”. Esta es fácilmente reconocible como el contenido que cada individuo ha guardado previamente para su reproducción en un futuro.

b) Iconografía – La utilización de iconos universales como la “lupa” son implementados en la plataforma, de tal forma que la persona pueda rápidamente reconocer como y donde puede generar la búsqueda de un contenido específico.

c) Categorías – Netflix presenta un sistema de organización por categorías y subcategorías. Esto facilita y reduce el tiempo de búsqueda de contenido, de tal forma que el usuario pueda elegir de manera clara y directa si desea ver una serie o una película, y el género de dicho contenido.

Posible mejora:Categorías – Aunque las categorías ofrecidas actualmente ofrecen una gama fácil de vincular con los gustos reales de las personas, Netflix podría presentar otros menús/opciones alternativas con otros criterios del mundo real como “fechad de lanzamiento” o “país de origen”.

3) Control y libertad del usuario.

Este principio tiene como objetivo el otorgar al usuario una cierta libertad de exploración de la interfaz, permitiendo que este pueda hacer y deshacer acciones sin mayor repercusión. Algunos ejemplos de la empleabilidad de este recurso en Netflix son:

a) Reproducción de contenido – A través de una barra de visualización, el usuario tiene el control de pausar, adelantar y retroceder el contenido que se está visualizando en todo momento y cuantas veces este lo desee.

b) Retomar contenido – La plataforma permite que el usuario abandone el contenido en cualquier momento, y si este lo desea, podrá reanudar con la visualización cuando lo desee desde el punto en el que la dejo por última vez.

c) Creación de perfiles – Dependiendo el plan adquirido, Netflix ofrece la opción de generar diferentes usuarios dentro de una misma cuenta. Con cuentas compartidas, esta función permite que cada individuo guarde su propio contenido, acceda a capítulos a su ritmo y genere una serie de “recomendados” basada en sus gustos reales, entre otros.

Posible mejora: Reproducción de contenido – Aunque actualmente el usuario tiene libertad al momento de pausar, adelantar y retroceder contenido, algunas opciones adicionales podrían proporcionar un control aún mayor, como la habilidad de adelantar a una velocidad mayor.

4) Consistencia y estándares

Este principio tiene como objetivo el presentar al usuario una plataforma que posea una consistencia técnica, funcional y visual. Estos elementos deben verse reflejados, se forma coherente en las diferentes pantallas de la interfaz y de la interfaz de distintos dispositivos electrónicos, facilitando la navegación de la misma. Algunos ejemplos de la empleabilidad de este recurso en Netflix son:

a) Multiplataforma: Actualmente, Netflix puede ser accedido desde un ordenador como página web, desde dispositivos móviles y tablets a través de una app y desde otras consolas como la Play Station o el Xbox. Sin importar el dispositivo utilizado para la utilización del reproductor, los aspectos técnicos, funcionales y visuales son los mismos, teniendo bajo consideración la adaptación generada en cada uno para la pantalla del dispositivo.

b) Consistencia visual: A través de todas las pantallas de la interfaz, Netflix mantiene una identidad visual claramente establecida, manteniendo constancia y coherencia por medio de su uso de color, tipografía, iconografía, organización de contenido, lenguaje, entre otros.

c) Iconografía: Netflix utiliza iconos preestablecidos y comúnmente utilizados en plataformas digitales como puede ser el triángulo para indicar la función de “reproducir” o la campana para indicar “notificaciones”

Posible mejora: Multiplataforma – Aunque existe una clara y eficaz consistencia de la interfaz entre dispositivos, existen de igual forma alteraciones como el orden de categorías en el que se presentan los títulos del menú principal, los cuales podrían verse reflejados de la misma forma en las distintas plataformas.

5) Prevención de errores

Este principio tiene como objetivo asegurar que el sistema prevea posibles errores antes de que estos sean efectuados por el usuario. Algunos ejemplos de la empleabilidad de este recurso en Netflix son:

a) Resumen & tráiler: Antes de acceder a un contenido específico, al realizar la acción de hoover sobre la portada de este, Netflix presenta al usuario con un pequeño video relacionado con la trama, junto con un resumen general del contenido. Estas características ayudar a prever que el usuario consuma contenido no deseado y pueda acceder a elementos más cercanos a sus gustos propios.

b) Auto Play: Netflix ofrece una función (que puede ser deshabilitada si el usuario lo desea) en el que los capítulos de una serie se reproducen uno tras otro de forma automática. Esta característica ayuda a evitar que el contenido sea abandonado de forma automática y el individuo deba buscarlo y acceder a él nuevamente tras cada episodio.

c) Control parental: Al igual que en el ejemplo a, esta función permite bloquear contenido no apto para niños, evitando que estos accedan de forma accidental y por falta de conocimiento a estos.

Posible mejora: Doble confirmación – Una acción de ocurrencia constante es la de acceder a contenido de forma accidental. Esto se debe a que con tan solo dar clic o tap sobre la imagen de alguna película/serie, el contenido empieza su reproducción de manera automática. Netflix podría proporcionar una doble confirmación, de tal forma que se deba dar clic a la imagen/título seguido en un clic a “reproducir”.

6) Reconocer antes que recordad

Este principio tiene como objetivo generar una interfaz que no requiera habilidades de memoria para su utilización, sino que el usuario de forma intuitiva pueda reconocer y dar uso a las diferentes opciones para una interacción fácil y rápida. Algunos ejemplos de la empleabilidad de este recurso en Netflix son:

a) Iconografía – nuevamente esta característica juega un papel importante, ya que permite que los usuarios realicen acciones como “búsqueda” de forma intuitiva al presentarla a través de un icono de lupa y no por medio de una serie de procesos complejos.

b) Miniatura/portada – Recordar nombres de títulos no es siempre lo más fácil, por lo que presentar todo el contenido por medio de una imagen representativa del contenido, genera un acceso más rápido a lo deseado.

c) Barra de búsqueda – Este elemento está altamente trabajado en la plataforma de Netflix, ya que no solo permite que el usuario busque por medio del título de la película o serie, sino que en caso de que este no recuerde este, podrá realizar la búsqueda ingresando el nombre de algún actor, el género, palabras clave, entre otros.

Posible mejora: Gustos propios – Netflix ofrece actualmente marcar contenido como favorito y esto ayuda a que la plataforma ofrezca contenido similar que cree que te puede interesar. Habiendo dicho esto, podría presentar otras opciones de preferencia como por ejemplo el poder destacar productoras o directores favoritos y recibir propuestas con base a esas preferencias.

7) Flexibilidad y eficiencia de uso

Este principio tiene como objetivo presentar un sistema que sea accesible tanto para personas con experiencia previa como para aquellos que no tienen experiencia. Algunos ejemplos de la empleabilidad de este recurso en Netflix son:

a) Implementación de otros principios heurísticos – la correcta utilización de principios heurísticos como la utilización de elementos que permitan reconocer antes que recordar, el generar una consistencia visual y utilizar contenido estandarizado y/o el utilizar lenguaje que vincule el sistema con el mundo real, ayudan a cumplir este principio.

Posibles mejoras: Busqueda – al igual que el buscador de Google permite realizar una búsqueda rápida normal como lo hace Netflix actualmente, este podría presentar la opción de realizar búsquedas más específicas, así requieran un poco más de conocimiento para usuario experto que sepan exactamente el estilo de contenido que desean visualizar. Ej. Búsqueda con varios criterios incluyendo género, director/a, y entre los años x y x.

8) Diseño estético y minimalista

Este principio se basa explícitamente en la identidad visual de la interfaz, buscando un resultado visual que sea placentero y que invite de forma directa a querer interactuar. Se debe poder presentar todo el contenido de una forma limpia, evitando agobiar al usuario. Algunos ejemplos de la empleabilidad de este recurso en Netflix son:

a) Paleta de color: La identidad visual de Netflix está constituida por 3 colores (negro, blanco y rojo), por lo que, aparte de los colores de las imágenes del contenido, la plataforma como tal solo presenta información en estas tonalidades, evitando así una sobresaturación visual.

b) Utilización de recursos gráficos: Netflix utiliza recursos básicos y necesarios para la presentación de su contenido como iconos, imágenes y videos, pero evita la presencia de material adicional como gifts, sonidos al interactuar, ilustraciones, etc.

c) Texto: La pantalla principal de la plataforma posee la menor cantidad de texto posible, presentando la información de manera visual por medio de imágenes. Información adicional en formato texto puede ser encontrado al ingresar a un título específico, manteniendo una landing page limpia y organizada.

Posible mejora: Organización – Netflix podría utilizar submenús para presentar el contenido del landing page, ya que actualmente ofrece más de 30 subcategorías en esta página, cada uno con más de 10 títulos distintos, generando ruido y generando posibles agobios.

9) Ayudar a los usuarios a reconocer, diagnosticar y corregir los errores.

Este principio se basa en generar un sistema que proporcione al usuario con alertas de error que sean claros, concisos y entendibles por todos los usuarios, buscando proporcionar una ayuda para la solución de los mismos. Algunos ejemplos de la empleabilidad de este recurso en Netflix son los mensajes de error como:

a) “Error conectando a Netflix. Reintentar en 15 segundos”, cuando el error es debido a algún fallo técnico del propio servidor.

b) “El usuario o la contraseña son incorrectos, inténtalo de nuevo”, para informar al usuario que ha escrito de forma errónea alguno de estos dos elementos.

Posible mejora: Aunque actualmente Netflix proporciona con alertas de error, indicando el posible motivo principal del fallo, como puede ser “error de conectividad a internet”, este podría proporcionar al usuario con un paso a paso de posibles soluciones que podría intentar con la finalidad de solucionar el problema.

10) Ayuda y documentación

Este principio tiene como objetivo el presentar al usuario con elementos que le puedan ayudar a resolver inconvenientes o simplemente ayudas para tener un mejor control general de la interfaz. Un ejemplo de la empleabilidad de este recurso en Netflix es la disposición de herramientas para intentar resolver las posibles inquietudes o problemáticas del usuario, como pueden ser:

a) Centro de ayuda – apartado donde el usuario podrá buscar las preguntas más recurrentes sobre la plataforma, pudiendo filtrar por medio de una búsqueda por palabras clave.

b) Contacto – El usuario tiene a disposición un chat 24 horas y un número de teléfono en donde se le proporcionara contacto directo con un experto que le ayudara a resolver los problemas.

Posible mejora: Aunque la interfaz de Netflix es bastante intuitiva, cuando el usuario accede por primera vez a esta, la plataforma podría ofrecer un pequeño walk through, indicando donde están los elementos más importantes y como está clasificada la información.


Ranking de Mejoras

En los apartados anteriores vinculados a las 10 heurísticas, se ha propuesto una posible mejora para cada una de ellas. Esta información se ha expuesto para mostrar como hasta una plataforma de nivel mundial, con millones de usuarios, siempre tendrá un espacio de crecimiento y mejora. En caso de que este post sea leído por los programadores/ diseñadores/ researchers de Netflix, de las 10 posibles mejoras proporcionadas anteriormente, hemos creado un ranking de las 5 posibles mejoras vinculadas a distintas heurísticas, que encontramos más significativas:

1. Flexibilidad y eficiencia de uso – Permitir a usuarios con más experiencia acceder a un sistema de búsqueda más detallado, dando la opción de filtrar por autor, fecha de lanzamiento, productora, etc.

2. Ayudar a los usuarios a reconocer, diagnosticar y corregir los errores – Para ciertos usuarios, una simple alerta de “compruebe su conexión a internet” puede no ser suficiente, por lo que un paso a paso de posibles soluciones puede proporcionar una gran ayuda.

3. Control y libertad del usuario – Ofrecer una libertad mayor durante la reproducción de contenido será siempre una ventaja, por lo que opciones como la de adelantar o retroceder a una mayor velocidad, pueden ser nuevas implementaciones novedosas y eficaces.

4. Prevención de errores – Muchas veces el tener que realizar una doble confirmación puede causar molestia en el usuario, pero una correcta implementación puede ayudar a que este no acceda de forma equivocada a contenido no deseado tras haberle dado clic de forma accidental.

5. Visibilidad del estado del sistema – EL usuario quiere estar siempre al tanto de lo que está pasando, por lo que el tener un indicador de carga que informe el tiempo estimado restante de esta operación, sería una adición funcional significativa.

En conclusión, basado en las 10 heurísticas de usabilidad de Jakob Nielsen, Netflix aprobaría una evaluación de efectividad sobre su interfaz de usuario con una matrícula de honor. Este emplea los principios explorados en esta metodología para generar un espacio visual, funcional, intuitivo y coherente.


Inclusión en Netflix

Antes de dar por concluido el análisis de esta plataforma, hemos efectuado un último proceso de investigación, indagando la perspectiva de inclusión de la interfaz.

Netflix durante los últimos años, ha ejecutado implementaciones significativas en su plataforma, buscando crear una propuesta más inclusiva, fomentando así una experiencia apta y placentera, teniendo en cuenta las diversas necesidades y preferencias de sus posibles usuarios.

Algunas de las características presentadas por Netflix para conseguir una mayor inclusión son:

1) Accesibilidad – Netflix ofrece funciones tales como “sistemas de asistencia auditiva, controles de brillo, accesos directos de teclado, lectores de pantalla y comandos de voz.” Adicional a esto, proporciona herramientas propias como “la función para personalizar la apariencia de los subtítulos y los subtítulos ocultos, y la posibilidad de ajustar la velocidad de reproducción” Permitiendo así una experiencia apta para personas con posibles discapacidades.

Por otro lado, Netflix ofrece en muchos de sus títulos, “subtítulos descriptivos para personas sordas y con problemas de audición y con audio descriptivo para personas ciegas o con problemas de vista”, sin mencionar la amplia variedad de idiomas presentes en gran parte del contenido.

2) Inclusión – El propio contenido de la plataforma es una manifestación de los valores de esta entidad. Netflix participa en la creación y distribución de contenido que representa individuos y grupos con distintos antecedentes. Dentro de su catálogo podemos encontrar películas/series producidas en diferentes países de todo el mundo, contenido LGTBIQ+ friendly y mucho más.

Otra implementación significativa es el esfuerzo presentado en la mayor parte del contenido vinculado con la marca, en la que se ve utilizado un lenguaje neutral de género, evitando usar pronombres como él o ella, y refiriéndose al usuario como “persona” o “individuo”

En conclusión, Netflix de forma irrefutable, ha trabajado en proporcionar un servicio accesible e inclusivo, a través de distintas herramientas / opciones para facilitar su uso a individuos con necesidades específicas, además del propio contenido presentado al usuario, que cada vez retrata más diversidad.

¡Espero te haga gustado este post y nos vemos pronto con el análisis de otra plataforma!

 

Debate0en Evaluación Heurística – Julián Cruz

No hay comentarios.

Publicado por

¡Bienvenidos y bienvenidas!

¡Bienvenidos y bienvenidas!
Publicado por

¡Bienvenidos y bienvenidas!

¡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!

Debate0en ¡Bienvenidos y bienvenidas!

No hay comentarios.

Las intervenciones están cerradas.