Introducció i metodologia:

Es realitzarà un anàlisi heurístic de l’aplicatiu de compra online de roba i complements H&M. S’analitzarà la plataforma tenint en compte els deu principis heurístics de Nielsen. D’aquesta manera es podrà enumerar visualment les característiques positives i les negatives.
S’ha escollit l’aplicació d’H&M pel seu disseny molt visual i aparentment per la seva facilitat alhora de comprar quelcom.
Es recopilarà el màxim d’informació possible de les diferents plataformes on es pot emprar H&M i es sintetitzarà segons els deu principis heurístics de Nielsen. Es posarà la lupa en que fa bé i que no tant bé, per d’aquesta manera descobrir i enumerar les seves problemàtiques i les posteriors possibles solucions.

Els deu principis heurístics de Nielsen:

• Visibilitat de l’estat del sistema

Positiu: el cercador de l’aplicació es ben visible i un cop hi entres, ràpidament et dona la opció de cercar per varies vies. Pots fer-li una foto a la peça de roba, pots escanejar l’etiqueta en qüestió o pots cercar la botiga més pròxima. Totes aquestes opcions les posa molt a l’abast i de manera molt visual. L’usuari ràpidament entén el funcionament del cercador i no li cal temps d’aprenentatge.

Negatiu: L’aplicació té una “home” molt vinculada al disseny de moda per dir-ho d’alguna manera. De bones a primeres tens fins a 4 planes que fan referència a col·leccions concretes, novetats, etc. Aquestes planes es podrien considerar que son baners estètics ja que només busquen captar l’atenció amb fotografies de modelatge on la peça de roba no es la protagonista. Per tant, l’usuari ha de fer “scroll” fins a 4 vegades per arribar als productes com a tal.

• Correspondència entre el sistema i el món real

Positiu: per a habituar-se a l’aplicació, la mateixa compta amb una iconografia molt ben treballada que correspon a elements reals que faciliten l’enteniment al 100%.

Negatiu: hi manquen determinats icones i l’usuari no es pot familiaritzar tant ràpid. Per exemple el contacte amb l’empresa o app. A la majoria d’altres llocs surt representat amb una figura humana amb uns auriculars. En el cas de H&M no consta per enlloc i has de saltar de pantalla en pantalla i “navegar” entre text per poder cercar el contacte.

• Control i llibertat de l’usuari

Positiu: el més interessant de l’aplicació es que tens una “llista de desitjos” i et permet guardar els articles del teu interès i a l’apartat de cercar, també guarda tot el que has buscat prèviament.

Negatiu: l’aplicació t’obliga si o si a registrar-te. No pots realitzar la compra com a “usuari convidat” com a molts altres llocs. Per tant, una gran part de l’app no es accessible si prèviament no has passat pel seu registre.

• Consistència i estàndards

Positiu: durant tot moment, l’aplicació, estiguis en el dispositiu que estiguis, manté una correlació amb el seu disseny. Es pot apreciar que tenen un llibre d’estil molt ben treballat i es podria dir que el segueixen quasi al mil·límetre.

Negatiu: quan arribes al tràmit de realitzar el pagament, lògicament automàticament canvies a la pàgina de l’entitat bancaria col·laboradora i aquí es on es trenca la correlació a la que es feia referència.

• Prevenció d’errors

Positiu: en tot el procés de compra, son diverses vegades les que abans d’arribar a l’últim pas de pagar, et visualitza l’article perquè puguis comprovar que tot està correcte.

Negatiu: en el cas d’efectuar una comanda per error, no la pots cancel·lar de manera immediata. Has d’esperar a que arribi ja sigui al teu domicili o a una botiga física.

• Reconeixement abans que record

Positiu: es molt fàcil reconèixer si hi ha talles disponibles. Visualment està molt ben treballat perquè l’usuari ràpidament sàpiga si està la seva talla.

Negatiu: mai està el filtratge aplicat i sempre apareixen tots els articles encara que hi hagin poques talles, molts cops visualitzes quelcom que t’agrada i quan hi entres a seleccionar talla et trobes que no hi ha de la teva.

• Flexibilitat i eficiència d’ús

Positiu: l’aplicació et deixa filtrar el producte en qüestió per categories de diverses característiques. Talla, color, tipus de peça, temporada de l’any, etc.

Negatiu: sovint, no escriure al cercador la nomenclatura correcte pel qual H&M nomena un producte fa que la cerca acabi en fracàs i no trobis el que busques.

• Estètica i disseny minimalista

Positiu: l’aplicació té un disseny molt elegant i simple i a la vegada funcional que fa que l’usuari es pugui familiaritzar ràpid i trobi el que busca relativament aviat.

Negatiu: les fotogràfiques de modelatge de l’inici busquen tenir una benvinguda més moderna i desenfrenada i només fan que molestar a la gent que va directament a cercar algun article ja que ha de fer “scroll” fins a 4 vegades.

• Ajuda als usuaris a reconèixer, diagnosticar i recuperar-se dels errors

Positiu: a vegades, si t’equivoques en alguna lletra al cercar un producte, el cercador automàticament t’ho corregeix i et localitza el producte amb un nom semblant al que has escrit.

Negatiu: Cal acotar bastant en diversos productes ja que hi ha moltes tipologies i si no especifiques concretament, no localitzes el que estàs cercant.

• Ajuda i documentació

Positiu: l’aplicatiu té un centre d’ajuda a l’usuari molt complet amb FAQS, xat en viu, telèfon gratuït de contacte, perfils socials i seguiment de comanda. L’usuari té múltiples opcions per posar-se en contacte amb l’empresa per qualsevol de les diverses qüestions.

Negatiu: el centre d’ajuda no es gens accessible i costa bastant de localitzar. Has de passar varies pantalles fins arribar al xat en viu i al telèfon. Sembla ser que es quelcom premeditat afegint certa dificultat per reduir el nombre de consultes.

Llistat segons gravetat de les troballes.

1. “Home” decorativa

• Gravetat alta – L’usuari te interès en comprar quelcom, no en visualitzar fotografies de model a la “home”.
• Proposta millora: Degut a entenem que la “home” ha de lluir i s’ha de mantenir, proposaria crear una nova pestanya que fos “categoria” on es podrà trobar directament tota la tipologia de roba

2. Necessari registre per comprar

• Gravetat alta – L’aplicatiu obliga a que l’usuari es registri per realitzar compres.
• Proposta millora: Permetre com fan altres webs de que l’usuari pugui comprar com a “convidat”.

3. Centre d’ajuda amagat

• Gravetat alta – El centre d’ajuda està clarament amagat de manera premeditada.
• Proposta millora: Posar-lo visible per a que l’usuari pugui contactar fàcilment.

4. Filtratge

• Gravetat mitjana – L’usuari no pot configurar el fet de que li apareguin només X talles.
• Proposta millora: Degut a que H&M vol fidelitzar i demana registrar-se, que et demani escollir les teves talles i que només et surti contingut en aquelles talles.

5. Acotar nomenclatura

• Gravetat mitjana – Els usuaris es poden frustrar al no localitzar productes per no escriure’ls de la manera com H&M en fa referència.
• Proposta millora: Cercar i localitzar nomenclatures alternatives i ferles constar a la base de dades. D’aquesta manera l’usuari podrà buscar tal i com ell ho coneix i el programari sabrà localitzar-ho.

6. Donar marge de cancel·lació

• Gravetat mitjana – Els usuaris no poden cancel·lar un producte comprat encara que hagi sigut fa pocs minuts. Han d’esperar a que arribi ja sigui a domicili o botiga. Llavors tramiten la devolució.
• Proposta millora: Que hi hagi un temps de marge on puguis cancel·lar. Que aquest temps de marge sigui just abans de realitzar l’enviament.

7. Més concreció al finalitzar la compra

• Gravetat mitjana – Tot i mostrar visualment el producte fins a dues vegades abans de realitzar el pagament, aspectes com la talla o les unitats escollides es mostren en un tamany molt petit. Justament la talla o les unitats son dos aspectes on els usuaris es poden confondre més.
• Proposta millora: Tallatge i unitats més a la vista de l’usuari.

8. Icones dubtoses

• Gravetat baixa – Algunes icones son compostes per text + icona. Pot confondre a usuaris ja que el botó com a tal correspon al text, la icona que ho acompanya es quasi “decoratiu”. Alguns usuaris podrien fer clic al icona sense obtenir cap resposta.
• Proposta millora: Utilitzar icones o text. O si es vol fer servir les dues, fer-ho d’alguna manera perquè tot junt sigui un enllaç o que visualment es vegi que es una agrupació.

9. Donar més protagonisme al producte

• Gravetat baixa – L’aplicació podria semblar una revista de moda i no una web de venta de productes.
• Proposta millora: Posar el producte al centre del tot. Que l’usuari sigui conscient que està entrant a una web de venta de roba.

10. Sistema de cerca millorable

• Gravetat baixa – El sistema de cerca tot i donar moltes alternatives no acaba de ser del tot fiable i es que en el cas de la fotografia, si les etiquetes son de models molt antics, no les reconeix. Tampoc reconeix segons quina peça depenent de com s’hagi fet la fotografia.
• Proposta millora: Advertir que les etiquetes mes antigues no seran llegibles i posar una mini guia ensenyant visualment com fer la foto correctament perquè localitzi el producte fotografiat.

R2 Avaluació Heurística (Late checkout)

Avaluació de la usabilitat | R2 Avaluació Heurística | 1r semestre 24-25 | Héctor Sánchez I Pedrero | 15/11/24

Introdució

En aquest folio es farà una avaluació heurística sobre una pàgina web d’una firma d’alta costura coneixia nacionalment i internacionalment per les seves narratives darrere les col·leccions. Per analitzar-ho es faran servir els 10 fonaments de Jakob Nielsen on es veuran diverses regles que permeten crear interfícies que proporcionen una experiència d’usuari més satisfactòria.

Que es una avalució heuristica?

L’avaluació heurística és un mètode que s’utilitza per identificar problemàtiques envers la usabilitat d’un sistema, es fa servir sobretot a entorns professionals i per la millora de les interfícies. En aquest estudi s’extreuen dades qualitatives tenint com a centre de la recerca la relació sistema i persona, sense requerir una persona directa per fer la recerca.

La recerca es pot fer de forma general o en detall depenent de la necessitat de l’estudi de la interfície, ja que amb una recerca superficial s’identifiqui problemes més notoris, però amb una recerca detallada es pot centrar en elements en concret i obtenir una resolució especifica que pot suposar una gran millora.

Una vegada tenint clar el tipus d’estudi, s’ha de passar per diverses fases:

• Durant el procés d’ideació una nova interfície, fer un estudi permet obtenir dades per la millora dels prototips i obtenir elements per la millora de la usabilitat.
• Quan és un producte que no ha sortit a mercat es pot corregir errors pel llançament del producte
• En producte existent per tenir coneixement de millores que podria tenir el producte

Ben Schneiderman l’any 1987 va crear 8 regles bàsiques que s’han de tenir en compte per la creació de noves interfícies per la millora de l’experiència. L’any 1994 Jakob Nielsen crea 10 punts a seguir més específics pel disseny de productes digitals, no aporta canvis radicals, però són punts més específics en l’àmbit d’interfícies i sistemes. Tot aquest punt a l’hora d’analitzar una interfície no té el mateix valor que avaluacions d’usabilitat, ja que la informació que s’extreu és diferent i no es capturen problemes amb un ús real.

És una tècnica que permet obtenir resultats de forma eficaç i combinada amb avaluacions d’usabilitat es poden obtenir un ampli coneixement de la interfície.

A continuació s’han analitzat els 10 punts de Nielsen a la pàgina web de la marca d’alta costura Late checkout per tenir el coneixement de les característiques de la seva usabilitat.

Analisi dels10 punts de Nielsen

1. Visibilitat de l’estat del sistema

El sistema ha d’estar informant a l’usuari sobre les accions que succeeixen al sistema fent ús d’elements visuals o comentaris. En aquest cas es pot percebre quan fas ús del menú, que es veu que és una àrea o està passant una acció o quan afegeixes un producte al carretó, però no és perceptible quan cerques en la tenda i les àrees interactives no es mostren correctament.

En aquest vídeo es pot veure com el sistema informa els usuaris quines accions estan succeint

En aquest vídeo es pot veure com el sistema no informa que es pot seleccionar un producte.

Impacte en l’usuari: Impacte alt (4)

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

El sistema ha de fer servir un llenguatge i usar conceptes familiars pels usuaris, mostrant el contingut en un ordre natural i lògic que faciliti la compressió als usuaris. En aquest cas es pot percebre que tota la web és perceptible i coherent pels usuaris, però a l’àrea de les col·leccions es fan servir conceptes propis de la marca que només tenen coneixement els usuaris habituals.

En aquest vídeo es pot veure com tots els elements dels sistemes són comprensibles, però a l’àrea de personatges no es té el coneixement exacte perquè serveix aquella pantalla si no és un usuari experimentat.

Impacte en l’usuari: Impacte baix (2)

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

Els usuaris ha de tenir llibertat per fer servir les funcionalitats del sistema, però sempre hi haurà problemes els quals seleccionaran elements i activaran accions no desitjades, l’usuari a ha de tenir la llibertat de retrocedir i refer les seves accions. En la web es pot veure en l’àrea d’afegir producte, ja que quan s’afegeix et dona l’opció de modificar els elements al cistell.

Es pot modificar i eliminar les peces de roba afeixades

Quan l’usuari s’equivoca i selecciona un element que no volia ha de tornar a fer tot el procés de nou.

Impacte en l’usuari: Impacte baix (2)

4. Consistència i estàndards.

Els usuaris tenen una sèrie de convencions que han après a través de la seva experiència navegant per webs, s’han de fer servir un vocabulari i elements reconeixibles per facilitar la navegació i que puguin assolir el seu objectiu. La web en general és fàcilment reconeixible, inclou tots els elements que una tenda en línia ha de tenir, però la part de personatges no es pot arribar a entendre la seva utilitat si no ets un usuari habitual.

En aquest vídeo es pot veure com tots els elements dels sistemes són comprensibles, però a l’àrea de personatges no es té el coneixement exacte perquè serveix aquella pantalla si no és un usuari experimentat.

Impacte en l’usuari: Impacte baix (2)

5. Prevenció d’errors

La resolució de problemes és important, ja que quan es fa ús d’una interfície hi existeix la possibilitat d’això, els missatges que s’han de rebre han de ser clars i concís per resoldre amb èxit. En el cas de la web és l’àrea de finalitzar pagament on es pot veure que si no poses bé una dada personal o deixes un espai sense completar es marcarà cromàticament i apareixerà un missatge clar i concís amb la problemàtica i solució.

Es pot observar com es remarca les àrees sense completar i et mostra com solucionar-ho.

Impacte en l’usuari: Impacte molt baix (1)

6. Reconeixement abans que record.

Els sistemes han de ser fàcilment reconeixibles perquè puguin recordar les rutes per accedir a l’àrea que han cercat, d’aquesta manera la següent vegada que facin una cerca tindran el coneixement de la ruta sense pensar-hi com accedir. La web és simple i permet recordar les rutes dels usuaris sobretot mitjançant el menú superior pel fet que és l’element que connecta tots els elements.

La ruta més fàcil per accedir a la major part del contingut és a través del menú superior, per a l’usuari és més fàcil saber quines rutes seguir.

És difícil accedir a la pàgina d’informació sobre devolucions perquè es troba en una àrea que els usuaris no arriben normalment, serà més difícil de recordar.

Impacte en l’usuari: Impacte mitjà (3)

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

Hi existeix una gran varietat d’usuaris, ús més experimentats d’altes, el sistema s’ha d’adaptar pels usuaris més experimentats amb la creació de rutes més directes per accedir al contingut que volen consultar. En aquest cas es fa servir submenús de la barra superior per facilitar i accedir de forma més directa i també la barra de buscador. Dins de les seccions de tipologies no existeix cap filtre que ajudi els usuaris a buscar elements més específics com per exemple la talla.

Recorregut d’un usuari principiant per cercar un producte a la tenda.

Recorregut d’un usuari experimentat per cercar un producte a la tenda.

No hi ha eines que permetin filtrar el contingut dins de les pàgines amb els productes.

Impacte en l’usuari: Impacte mitjà (3)

8. Disseny estètic i minimalista.

Una interfície ha d’utilitzar els elements mínims necessaris per facilitar l’experiència d’ús de l’usuari perquè pugui assolir el seu objectiu sense distraccions. En aquesta web es fan sevir els elements mínims perquè els usuaris puguin accedir als continguts, però hi ha pàgines destacades que no són tan rellevants per un públic general.

Inclouen només continguts d’interès pels usuaris per facilitar la cercar i la millora de l’experiència.

Pàgina de Stockists en un espai destaca, aquesta pàgina no és d’interès per a la major part d’usuaris, pot dificultar la cerca.

Impacte en l’usuari: Impacte molt baix (1)

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

Similar al punt 5 la resolució de problemes és important i els missatges que és rebre del sistema han estat clars i concisos per obtenir la solució al problema. Es podria posar el mateix exemple que en l’anterior cas en què es pot veure que si no poses bé una dada personal o deixes un espai sense completar la compra, es marcarà cromàticament i apareixerà un missatge.

Es pot observar com es remarca les àrees sense completar i et mostra com solucionar-ho.

Impacte en l’usuari: Impacte molt baix (1)

10. Ajuda i documentació.

Les ares per ajudar als usuaris són molt importants perquè quan tinguin problemàtiques generals les puguin solucionar sense ajuda d’una altra persona, normalment les webs compten amb pagines informatives pels usuaris. En aquesta web es pot veure que no compten amb una pàgina de preguntes freqüentes, però si tenen un apartat de devolucions clar i concís, però es troba a l’inferior, una àrea que no tots els usuaris visualitzaran.

La pàgina d’informació per ajudar als usuaris sobre les devolucions es troba l’inferior i molts usuaris no podran trobar aquesta pàgina informativa de gran importància.

Impacte en l’usuari: Impacte crític (5)

Avaluació de la usabilitat | R2 Avaluació Heurística | 1r semestre 24-25 | Héctor Sánchez I Pedrero | 15/11/24

Bibliografia:

INTRODUCCIÓ

L’aplicació de Vinted ha estat escollida pel seu ús personal i la popularitat creixent cap a un mercat més sostenible. La compra venda de roba i productes de la llar de segona mà, s’ha convertit en una tendència actual de comerç en línia.

El fet que aquesta plataforma tingui vàries funcionalitats rellevants com la de crear anuncis per a vendre, navegar i cercar productes, fer pagaments en aquesta mateixa o gestionar els enviaments, fa que aquesta sigui interessant per a analitzar i estudiar la seva bona i mala implementació dels 10 principis de Jakob Nielsen.

METODOLOGIA

Per a dur a terme aquesta anàlisi dels principis heurístics, primerament s’ha fet un estudi d’aquests amb els recursos proporcionats i la cerca per Internet.

Un cop sabuts aquests i tenint un coneixement previ, s’ha començat a fer ús de l’app a analitzar per veure com s’apliquen al llarg de tota la interfície i les seves funcionalitats importants. Identificant-los en el seu bon ús i detectant possibles millores i recomanacions.

Obtenint, una avaluació objectiva i força detallada per a millorar l’experiència com a usuari per a un ús més eficient i efectiu, i al mateix temps, més agradable.

PRINCIPIS DE JAKOB NIELSEN

1. VISIBILITAT DE L’ESTAT DEL SISTEMA

+ L’app manté informat a l’usuari sobre l’estat de les seves compres. Informa de la seva confirmació, rebent un correu al compte associat i una notificació a la mateixa aplicació. També mostra un seguiment del procés d’enviament i notifica un cop aquest ha acabat i s’ha entregat el paquet al comprador.

– A vegades aquesta retroalimentació (feedback) no és immediata. Tenint retard en l’actualització de l’estat del procés o la visualització i edició del producte a vendre. Generant desconfiança.

2. CORRESPONDÈNCIA ENTRE EL SISTEMA I EL MÓN REAL

+ Fa ús d’un llenguatge clar i familiar. Els botons van acompanyats de les seves descripcions (etiquetes)  de termes intuïtius com “vender”, “buscar”, “mensajes”… En fer el filtratge de cerca, les categories s’adeqüen a les necessitats que esperem trobar, fent una bona segmentació depenen de si vols roba d’home, de dona, per a nens…

–  L’aplicació no té un mecanisme de revisió de les publicacions prou detallat, això fa que a vegades, publicacions amb imatges poc nítides, mal il·luminades o que mostrin pocs detalls de la peça. Comportant incertesa per part dels compradors en no mostrar realment com és aquesta.

3. CONTROL I LLIBERTAT D’USUARI

+ Permet modificar el perfil, editar les publicacions un cop penjades, eliminar articles o afegir-los com a favorits. També permet fer un control simple de les transaccions, donant l’opció d’enviar el teu saldo al compte bancari associat amb tan sols un clic.

– No és possible modificar el lloc d’entrega del paquet un cop comprat aquest. Has de cancelar la compra i fer una de nova.

4. CONSISTÈNCIA I ESTÀNDARS

+ Manté una estructura coherent en tota la plataforma (web, app). Les icones i botons estan en llocs consistents, facilitant la navegació. Mantenint un mateix estil uniforme en tota l’app.

5. PREVENCIÓ D’ERRORS

+ Fa una bona implementació en els processos de compra i venda. Per exemple, quan l’usuari fa la compra, l’app mostra un resum detallat d’aquesta abans de la seva confirmació. Ressaltant la informació important com els preus de l’enviament, de protecció com a comprador i el preu total.

– Tot i que les confirmacions són força clares a vegades alguns errors en la validació de dades com l’adreça de l’enviament o el mètode de pagament no es comuniquen de manera immediata. On els usuaris finalment s’acaben adonant de l’error un cop s’està acabant el procés de compra (enviament i la seva entrega).

6. RECONEIXAMENT ABANS QUE RECORD

+ Vinted aprofita l’historial de cerca i els productes vistos anteriorment per facilitar la navegació i la compra de l’usuari. Oferint recomanacions personalitzades i mostrant productes similars.

– Les cerques i el seu filtratge corresponent només queden guardades a l’historial, donant la possibilitat de guardar-les. Aquestes estarien bé tenir un apartat corresponent a part del simple historial, per així, anar veient si s’han publicat nous productes relacionats amb la cerca d’una forma més visible que no pas l’historial, on la cerca pot ser antiga i no aparèixer o estar en les últimes posicions.

7. FLEXIBILITAT I EFICIÈNCIA D’ÚS

+ L’ampli filtratge de cerca, ajuda als usuaris a trobar més ràpidament els productes específics segons els seus criteris com la talla corresponent, el preu mínim i màxim, la comndició d’estat (nou, usat…), etc. Beneficiant-se d’aquestes cerques com s’ha comentat, per a rebre recomanacions personalitzades, fent més eficient aquest procés

– L’app pot anar més lenta a l’aplicar múltiples filtres de cerca o quan la connexió d’internet és baixa. Obtenint una experiència menys satisfactoria al no carregar les imatges dels productes a veure o fer una navegació més duradera.

8. ESTÈTICA I DISSENY MINIMALISTA

+ Presenta un disseny visual atractiu, net i minimalista i modern per a l’ús actual. Amb colors suaus i un fons blanc per ressaltar les imatges dels anuncis dels productes i els botons i icones. Fent que la navegació sigui més agradable.

– Tot i ser un disseny minimalista, la pàgina d’inici pot veure’s força sobrecarregada. Oferint les recomanacions dels productes, els productes vistos anteriorment, les novetats, marques poc interessants, etc.

9. AJUDA ALS USUARIS A RECONÈIXER, DIAGNOSTICAR I RECUPERAR-SE DELS ERRORS

+ Proporciona missatges d’error clars quan l’usuari comet algun error, com en el cas de fer una transacció fallida o un pagament no processat. També en intentar publicar un producte sense finalitzar les seves dades.

-Alguns errors poden ser poc detallats. Com pot ser quan penges un article i aquest ja no està disponible, l’app ofereix solucions força generalistes, sense ser del tot clares i detallades de com evitar i solucionar el problema.

10. AJUDA I DOCUMENTACIÓ

+ Compte amb una secció de guia i d’ajuda dins l’app. Aquesta cobreix una àmplia varietat de temes que van des de com crear un anunci fins a com gestionar les transaccions o solucionar problemes comuns.

– Aquesta podria ser més visual. Millorant-la estèticament agregant més vídeos tutorials de passos a seguir de diferents funcionalitats rellevants. Millorant l’experiència principalment pels nous usuaris. 

LLISTA PRIORITATS SEGONS GRAVETAT

1. Feedback/retroalimentació immediata (en l’enviament i publicació d’un producte)
2. Càrrega lenta de les imatges al tenir poca cobertura, connexió o filtratges forces detallats
3. Millorar l’apartat de suport i ajuda, fent-lo més visual i atractiu
4. Minimitzar sobrecàrrega inicial
5. Poca visibilitat de cerques guardades d’interès

PROPOSTES DE MILLORA

1. Implementar un sistema d’actualització a temps real per l’estat de les comandes fetes
2. Optimitzar les imatges perquè s’adaptin a una resolució òptima al dispositiu mòbil. Reduint el seu pes i càrrega.
3. Crear tutorials visuals breus dels passos a seguir.
4. Simplificar pàgina d’inici agrupant seccions i deixant més espai en blanc. Traient partit a les recomanacions i deixant de banda altres característiques com la de nous productes, que aquesta pot ser vista en fer una cerca.
5. Tenir una secció similar a la de productes favorits per a guardar les cerques d’interès. Sent aquesta més visible i més senzilla d’accedir.

CONCLUSIÓ

L’app de Vinted en general fa un bon treball en l’aplicació dels principis de Jakon Nielsen. Oferint una interfície intuïtiva i eficient, amb un disseny atractiu i funcionalitats flexibles per la compra i venda de productes.

No obstant això, existeixen possibles millores, especialment en la millora d’una retroalimentació immediata per evitar errors o problemes d’incertesa.

Amb aquestes possibles millores comentades (velocitat de càrrega, simplificació inicial…), l’experiència en l’app potser encarà més fluida i satisfactòria.

Anàlisi Heurística de l’Aplicació Duolingo

Índex

1. Introducció
2. Metodologia
3. Anàlisi dels 10 Principis Heurístics de Nielsen
4. Llistat Prioritzat segons Gravetat de les Troballes
5. Propostes de Millora
6. Conclusió
7. Referències

1. Introducció

En aquesta anàlisi, es revisa l’aplicació mòbil Duolingo per a l’aprenentatge d’idiomes, destacant els seus punts forts i àrees de millora basant-nos en els 10 principis heurístics de Jakob Nielsen. L’elecció de Duolingo es fonamenta en la seva àmplia història de més de 12 anys de producte, caracteritzada per iteracions constants de disseny i un enfocament en l’aprenentatge interactiu.

2. Metodologia

L’anàlisi s’ha basat en l’aplicació pràctica dels principis heurístics de Jakob Nielsen per identificar àrees de millora i aspectes positius de la interfície. Cada principi ha estat avaluat en funció de la seva aplicació dins de l’app, utilitzant tant el context teòric del Quadern d’Avaluació de la Usabilitat com el marc de disseny de Duolingo per mantenir una avaluació centrada en l’usuari i alineada amb els valors estètics de la marca (imatge 01). Aquesta metodologia segueix l’enfocament del design thinking, posant l’usuari al centre per trobar solucions pràctiques a possibles problemes de disseny.

Anàlisi dels 10 Principis Heurístics de Nielsen

3.1. Visibilitat de l’estat del sistema

Troballa positiva: L’aplicació Duolingo informa els usuaris del seu progrés mitjançant notificacions visuals constants, com ara la icona de flama que indica les ratxes de pràctica diària (veure imatge 02).

Imatge 02 – Duolingo APP – “day streak”

Troballa negativa: No sempre és evident el progrés detallat en l’aprenentatge de cada unitat, fet que pot confondre els usuaris avançats.

Imatge 03 – Duolingo APP – “progress feels generic”

3.2. Correspondència entre el sistema i el món real

Troballa positiva: Les icones utilitzades a l’aplicació, com les que representen el correu i el correu electrònic (veure imatge 04 i 05), fan correspondència amb elements del món real, facilitant la comprensió.

Imatges 04 i 5 – Duolingo APP – “Les icones indiquen que les notificacions es poden configurar per correu electrònic i sms”

Troballa negativa: Algunes metàfores visuals poden resultar menys intuïtives per a nous usuaris, com les icones de lliga (Imatge 06 i 07).

Imatges 06 i 07 – Duolingo APP – “Icones de lliga i insígnies de Challenge mensuals ”

3.3. Control i llibertat de l’usuari

Troballa positiva: L’aplicació Duolingo permet als usuaris sortir d’una lliçó i reprendre-la més tard, proporcionant una certa flexibilitat en la gestió del temps d’aprenentatge (veure imatge 08).

Imatges 08- Duolingo APP – “Icona del botó de tancament ”

Troballa negativa: No hi ha una funció clara de desfer o retrocedir quan es comet un error en un exercici. Aquesta absència pot augmentar la frustració dels usuaris, ja que han de repetir tota la pregunta o exercici per corregir errors mínims. Incorporar una opció de desfer o retrocedir ràpidament ajudaria a millorar l’experiència d’usuari i reduir la frustració.

Imatge 09- Duolingo APP – “error popup ”

3.4. Consistència i estàndards

Troballa positiva: L’aplicació manté una coherència visual i funcional en tota la interfície, seguint les pautes del seu guia de disseny de marca (Imatges 10 – 12).

Troballa negativa: Algunes seccions, com les notificacions (veure imatge 13), poden presentar elements que no segueixen la mateixa coherència de disseny.

Imatges 13- Duolingo APP – “Notificacions ”

3.5. Prevenció d’errors

Troballa positiva: Les pistes visuals i les opcions múltiples ajuden a prevenir errors en la selecció de respostes (veure imatge 14).

Imatge 14- Duolingo APP – “opcions múltiples ”

Troballa negativa: Quan s’introdueixen respostes escrites, no hi ha validació en temps real per evitar errors tipogràfics. (veure imatge 15)

Imatge 15- Duolingo APP – “exemple de errors tipogràfics ”

3.6. Reconeixement abans que record

Troballa positiva: Els usuaris poden reconèixer ràpidament paraules clau gràcies a la repetició en els exercicis (veure imatge 16 i 17).

Imatge 16 i 17- Duolingo APP – “exemple de repetició en els exercicis ”

Troballa negativa: Els menús secundaris i la navegaciò poden requerir que els usuaris recordin on es troben certes opcions.

Imatge 18 i 19- Duolingo APP – “Navegacio i menu secundari ”

3.7. Flexibilitat i eficiència d’ús

Troballa positiva: L’aplicació ofereix funcionalitats que permeten personalitzar l’experiència d’aprenentatge (veure imatges 20 i 21).

Imatge 20 I 21- Duolingo APP – “exemple de l’experiència d’aprenentatge personalitzable  ”

Troballa negativa: La manca de dreceres per a usuaris avançats pot limitar la seva eficiència.

Imatge 22- Duolingo APP – “exemple de l’experiència d’aprenentatge limitada per usuaris avançats”

3.8. Estètica i disseny minimalista

Troballa positiva: El disseny de l’aplicació és net i agradable, amb icones i colors que no sobrecarreguen la interfície (veure Imatge 23).

Imatge 23- Duolingo APP – “exemple d’il·lustració a la plataforma”

Troballa negativa: Algunes pantalles poden mostrar informació massa condensada, com a la secció de lliga (veure imatge 24).

Imatge 24- Duolingo APP – “l’experiència de vegades pot ser una mica aclaparadora”

3.9. Ajuda als usuaris a reconèixer, diagnosticar i recuperar-se dels errors

Troballa positiva: L’aplicació proporciona missatges clars quan es cometen errors durant un exercici (veure imatge 25).

Imatge 25- Duolingo APP – “exemple de missatges d´error”

Troballa negativa: Els missatges d’error podrien ser més detallats per ajudar els usuaris a entendre per què han fallat.

Imatge 26- Duolingo APP –  “exemple de missatges d´error”

3.10. Ajuda i documentació

Troballa positiva: L’aplicació ofereix documentació accessible a través de la seva pàgina de suport.

Imatge 26- Duolingo APP – “FAQ page”

Troballa negativa: No hi ha ajuda integrada directament a l’aplicació per a preguntes freqüents mentre es realitzen les activitats.

4.Llistat Prioritzat segons Gravetat de les Troballes

1. Manca de funció de desfer: Proposta de millora: afegir una funció de desfer ràpida.
2. Validació en temps real per a respostes escrites: Proposta de millora: implementar una funció de validació instantània.
3. Inconsistència en el disseny de notificacions: Proposta de millora: unificar l’estil segons el guia de disseny de marca.
4. Manca d’ajuda integrada: Proposta de millora: afegir una secció d’ajuda en context.
5. Sobrecàrrega visual en algunes pantalles: Proposta de millora: simplificar la informació mostrada.

5.Propostes de Millora

Per millorar l’experiència de l’usuari a l’aplicació de Duolingo, és crucial abordar aspectes que augmentin la seva satisfacció i autonomia. Primerament, la implementació d’una opció de desfer per corregir errors immediats durant les lliçons proporcionaria un major control i reduiria la frustració, especialment en activitats que impliquen múltiples passos. Això ajudaria a fomentar una experiència més fluida i alineada amb les expectatives d’usabilitat segons el principi de control i llibertat de l’usuari. A més, la validació instantània de respostes, amb un feedback clar i intuïtiu, ajudaria els usuaris a comprendre els seus errors i aprendre en temps real, enfortint el procés d’aprenentatge i reduint la repetició innecessària d’exercicis.

Per altra banda, per garantir la consistència visual i evitar la confusió, seria necessari unificar el disseny de totes les seccions de l’aplicació. Això implicaria revisar i ajustar l’ús d’icones, colors, i etiquetes, seguint de manera estricta la Duolingo Brand Design Guide, tal com s’ha observat en exemples positius i negatius. Aquesta coherència reforçaria la percepció de qualitat i professionalitat.

Una altra proposta és la incorporació d’ajuda contextual interactiva, com tutorials breus o missatges d’assistència que apareguin quan l’usuari ho necessiti. Aquesta característica oferiria suport addicional als nous usuaris o aquells menys experimentats, reduint l’abandonament i augmentant la satisfacció general. L’ús d’informació visual clara, com el ressaltat de seccions importants, ajudaria a evitar errors per manca de comprensió.

Finalment, es podria afegir una funcionalitat de seguiment de progrés més detallada que permeti als usuaris visualitzar les seves millores i identificar àrees que necessiten més pràctica, la qual cosa milloraria l’experiència global i motivaria la retenció a llarg termini. Aquestes propostes no només millorarien la usabilitat, sinó que també alinearien l’aplicació amb els principis de disseny centrats en l’usuari, com promou el Design Thinking, posant l’èmfasi en l’empatia i la resolució de problemes reals (Interaction Design Foundation).

6. Conclusió

L’aplicació Duolingo és un exemple de bona aplicació de molts principis de disseny heurístic, com la consistència visual i el suport al reconeixement sobre la memòria. No obstant això, l’anàlisi revela algunes àrees de millora clau per optimitzar l’experiència de l’usuari. En particular, la manca d’una funció de desfer i la necessitat de validació instantània de respostes limiten el control de l’usuari, augmentant la frustració en cas d’errors. A més, unificar el disseny de totes les seccions garantiria una experiència més coherent i professional. La implementació d’aquestes propostes ajudaria Duolingo a reforçar la seva posició com a aplicació d’aprenentatge líder, assegurant una experiència d’usuari que no només sigui eficient, sinó també agradable i intuïtiva.

7.Referències

Universitat Oberta de Catalunya (UOC). (n.d.) Quadern d’Avaluació de la Usabilitat. Barcelona: UOC.

Interaction Design Foundation. Design Thinking. Available at:https://www.interaction-design.org/literature/topics/design-thinking

Duolingo Design Guide. Available at:https://design.duolingo.com/

Introducció

Aquest post tractarà sobre un anàlisi heurístic individual seguint els 10 principis de Jakob Nielsen amb exemples sobre la página web de Domestika. Domestika és una página web dedicada a oferir cursos online de diferents arts creatives com artesanía, disseny, belles arts o cinema. Els cursos són de pagament i cada creador també pot crear un curs pròpiament dit. A més a més la página web vol conenctar els diferents usuàris mitjançant fórums o buscar feina.
L’anàlisi s’ha dut a terme fent una primera visita a la página web per aprendre com es navega i posteriorment he fet un anàlisi mitjançant notes escrites de cada un dels deu principis d’anàlisi heurístic mirant si el principi és freqüentment, si els usuàris ho poden superar i si el problema és fàcil de superar o reapareix. A partir d’aquí presento la problemàtica i plantejo una possible solució si és un problema o el principi està ben solucionat. A continuació ensenyo les conclusions extretes.

Anàlisi segons els principis de Jakob Nielsen

1. Aquí presento dos exemples del primer punt d’anàlisis heurístic de Jakob Nielsen que consisteixen en veure en que está treballant el sistema: el primer exemple és el temps que queda per agafar una oferta de cursos més barats ja que és una cosa que va canviant. Aquest exemple no acaba de funciona bé ja que no és una reacció a una interacció que hagis fet sinó que t’informa d’una promoció que canvia amb el temps. L’altre exemple és que quan donés clic per buscar un curs en concret, la pestanya s’allarga i brilla perquè sàpiguis on estaràs escrivint. Aquest és un bon exemple per dir-li a l’usuàri que l’ordinador está reaccionant a les teves accions.
   
2. Quan parlem de l’adequació del sistema i el món real, sempre parlem de crear similituds que ens siguin fàcils de reconèixer, en aquest cas Adequació entre el sistema i el món real es pot aconseguir mitjançant les icones d’avisos i de compra mitjançant una campana i un carro de la compra, que són objectes de la vida quotidiana que relacionem amb les accions que ens donaràn a la página web.
3. Un exemple de llibertat i control per part de la persona usuària l’he descobert quan he trobat un curs interessant i quan volia tirar enrere ho podia fer mitjançant unes paraules interactives situades a la part superior esquerra, per veure tots els cursos o per anar a la página principal de domestika. Penso que s’hauria de millorar aquest principi ja que aquesta opció es pot repetir si cliques a la icona general del navegador web de tirar enrere o si prems el logotip de domestika que et porta a la página principal. També es podría millorar afegint el tipus de curs que estàs mirant mitjançant una icona o unes paraules més especifiques.
4. El principi número 4 de consistencia i estàndards es compleix si ens fixem en la lupa del cercador ja que aquesta lupa compleix uns estàndards presents a totes les aplicacions i pàgines web, com que és universal i molt utilitzat millor usar aquest que els usuàris ja coneixen que algún altre que sigui diferent però faci la mateixa acció.
   
5. L’opció per suprimir errors que hagis comés el podem trobar quan pots suprimir un curs que està a la teva llista de la compra i que has posat per error. És una bona forma d’entendre aquest principi mitjançant l’ús d’un símbol que sembla una paperera molt visible. Així pots modificar la cistella de la compra si de cas havies afegit una curs de més ho havies fet una pre-selecció.
   
6. El principi reconèixer abans que recordar el podem trobar quan es més fàcil anar a la pestanya “mis cursos” per veure els cursos que ja has comprat abans que fer memòria d’aquests, sobretot si en tens molts. Aquesta pestanya et permet no haver de recordar quins cursos has comprat sinó que anant allà el spots veure directament i quan entres en un curs també et pots marcar les coses que ja has vist per quan tornis a estudiar amb aquests cursos sàpigues per on passaves.
   
7. El principi flexibilitat i eficiència en l’ús es compleix quan vas a buscar feina a Domestika ja que pots acotar la cerca de forma eficient mitjançant les opcions de la part superior com la localització de la feina o la disciplina on hi ha aquesta feina.
   
8. Tot i que aquesta pàgina web gira al voltant de la creativitat, aquesta no traspassa en el disseny de la pàgina web i tal com podem veure a la imatge on es podem triar la categoría del curs que ens interessa hi segueix havent un disseny estètic i minimalista amb la informació simplificada i necessària i amb una unitat estètica entre totes les fotografies.
   
9. Quan la web t’ajuda a reconèixer, diagnosticar errors i recuperar-se es quan comets un error al fer el pagament del curs i la pàgina web t’avisa amb un missatge dient que el número de la tarjeta no és vàlid, perquè quan ho tornis a escriure t’hi puguis fixar millor, el fet que el missatge et digui exactament que és el que ha fallat t’ajuda a l’hora de que puguis solucionar el problema més fàcilment.
   
10. Un mal exemple de l’últim principi, Ajuda i documentació, és que si estàs buscant com fer un pas però en aquest cas l’ajuda está molt amagada i quan hi entres tens molt de text explicatiu. Aquests factors fan que no sàpiguis cap a on anar o respondre per solucionar el dubte que tens.
    

Possibles solucions

Vists els problemes principals d’aquesta pàgina web fent l’anàlisi heurístic considero que el punt que s’hauria d’arreglar és el número 10: Ajuda i documentació ja que s’hauria de col·locar l’ajuda més a mà de qualsevol usuàri en comptes d’estar amagada als primers pasos. Això segurament es podria solucionar col·locant una icona fixa a la pestanya superior del disseny i fent que en comptes de tant de text hi hagués vídeos explicatius explicant la solución als problemes més típics.
També m’agradaria ressaltar que el principi número 3: Llibertat i control de les persones usuàries s’hauria de simplificar tenint en compte les opcions per defecte que hi ha al navegador i afegir el tipus de disciplina creativa en la qual está classificat aquest curs. No sé si en comptes d’utilitzar text, es podrían utilizar icones que descrivissin cada apartat.

Altres consideracions

Finalment també considero interessant plantejar una millora general de la web que té a veure amb el punt 8: disseny estètic i minimalista. Considero que hi ha un predomini important del text per buscar informació i segurament es podría simplificar utilitzant icones per gran part de la informació o buscar paraules clau més concretes i exactes.

Ramon Casas Colomé