Value Proposition canvas
Wireframe de la pàgina d’inici de la web: LA VANGUARDIA
A continuació afegeixo el Wireframe de la pàgina d’inici de la Vanguardia.
Les captures originals de la web d’inici son les següents:
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 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.
Mapa d’experiència (Anar al gimnàs)
En aquest projecte d’avaluació continuada he volgut fer el mapa conceptual del procés que segueixo per anar al gimnàs. Per tal d’explicar-me amb més claredat, afegiré imatges del procés. Tractaré de respondre a les preguntes: Com ho faig?, Com ho sento?, Com ho concec? I el tipus/Estil/Context de la interacció.
- Fer la motxilla
Anotacions: Fer la motxilla és una tasca que moltes vegades fa més mandra que el mateix entrenament. Tot i això, ja tinc la llista mental de les coses que necessito i no acostumo a oblidar res. Em sento en l’obligació de fer-la, apàtic.
Com ho faig?
Obro el calaix agafant amb les dues mans les manetes i estiro cap a fora. Agafo amb una mà la motxilla i amb l’altre la cremallera per obrir-la. A continuació agafo amb una mà la tovallola mentre obro la motxilla amb l’altra mà. El mateix amb l’aigua que prèviament he agafat de la nevera.
Com ho sento?
Es tracta d’una accionarial rutinària que no em suposa cap esforç, ja que prèviament tinc un mapa mental dels passos que he de seguir.
Com ho conec?
El procés d’obrir i tancar una cremallera és quelcom que he vist sempre, no suposa cap impediment.
Tipus d’interacció: Manipulating
Estil d’interacció: Gesture
Context d’interacció: Interacció tangible
2. Anar de casa al cotxe
Anotacions: Per sort, el cotxe sempre està aparcat a la mateixa porta de casa i no trigo ni 2 minuts en sortir per la porta de casa i entrar a la del cotxe. Obro el cotxe amb el comandament a distància. Em sento a gust, còmode pel fet de tenir aquesta comoditat i no perdre temps.
Com ho faig?
Obro la porta de casa amb una mà, surto i la tanco, sol estar bastant dura i costa de tancar. Pujo les escales a peu, fins a arribar a una altra porta, i repeteixo el procediment. Camino fins al cotxe i obro el cotxe amb el comandament a distància.
Com ho sento?
Es tracta igualment d’una rutina que repeteixo moltes vegades al dia i que no suposa cap esforç, ja que tinc al cap la força exacta per tancar-la. Aquest fet em frustra bastant.
Com ho conec?
Durant setmanes, aquesta porta està espatllada, per tant he anat assolint com tancar-la de la manera adequada.
Tipus d’interacció: Manipulating
Estil d’interacció: Gesture
Context d’interacció: Interacció tangible
3. Conduir fins al gimnàs
Anotacions Arrenco el cotxe. Sempre he de mirar per ficar la Clau, m’angoixa. Condueixo 10 minuts fins a l’aparcament al costat del gimnàs. Sempre hi ha lloc a la primera, em fa sentir a gust i segur, no perdo temps en aparcar.
Com ho faig?
Fico la clau i la giro per tal de poder arrencar el cotxe. Condueixo jugant amb els pedals, les mares i els intermitents fins arribar al gimnàs.
Com ho sento?
La interacció amb els vianants, els senyals de trànsit, els semàfors, moltes vegades m’angoixa.
Com ho conec?
Com es tracta d’un recorregut curt que faig cada dia, no em suposa un gran esforç.
Tipus d’interacció: Manipulating/Exploring
Estil d’interacció: Gesture/Touch
Context d’interacció: Interacció tangible
4. Deixar les coses a la taquilla
Anotacions: Abans d’entrar a la sala d’entrenament, he de desar la motxilla i la roba a la taquilla. La taquilla és molt petita i a l’hivern no cap bé la roba i la motxilla. Funciona amb una moneda d’1€ o de 0,5€. He d’enrecordar-me d’agafar la targeta de soci, la clau de la taquilla i els auriculars. El fet de la capacitat i del funcionament m’angoixa bastant, sempre he de pensar a portar una moneda, tot i que sol estar a dins de la motxilla. La clau i la target sempre cau de la butxaca, m’enfada.
Com ho faig?
Fico els objectes amb les dues mans a dins de la taquilla, fico una moneda, tanco la porta i giro la clau. Trec la clau i la fico a la butxaca.
Com ho sento?
Es tracta d’un procés molest. Enrecordar-te que has de treure la targeta, la clau, la moneda, no perdre-la…
Com ho conec?
És un procés que tot i conèixer, moltes vegades se t’oblida algun pas: oblidar-te la moneda a casa, oblidar-te la targeta de soci a dins de la taquilla i haver d’obrir-la de nou…
Tipus d’interacció: Manipulating
Estil d’interacció: Gesture
Context d’interacció: Interacció tangible
5. Entrar al gimnàs
Anotació: Per entrar al gimnàs he de passar la targeta del lector. Sempre triga bastant a reconèixer-la, em molesta que mai funcioni a la primera. Un cop validat, passo la barrera.
Com ho faig?
Passo la targeta amb contact-less per la màquina per tal que em deixi passar la barrera.
Com ho sento?
Hauria de ser un procés fàcil, però la màquina no funciona bé. Em genera angoixa, pèrdua de temps.
Com ho conec?
Conec la forma d’entrar i també les dificultats i limitacions que té la màquina d’entrada per detectar les targetes de soci.
Tipus d’interacció: Manipulating
Estil d’interacció: Touch
Context d’interacció: GUI
6. Entrenar
Anotacions: Entreno aproximadament una hora. Començo escalfant a la cinta de córrer. Sempre faig el mateix perquè no provo que el funcionament dels botons sigui molt amigable, em molesta.
Després utilitzo les màquines. La temperatura és correcta, m’agrada. La música (àudio) està massa baixa per ser un gimnàs, no motiva.
L’aplicació mòbil, on miro el meu entrenament (Imatge), té algunes carències, no recorda el pes que vas agafar el dia anterior. Això no m’agrada, em fa perdre temps en provar pesos.
Com ho faig?
Faig servir les màquines, la majoria no són electròniques, excepte la cinta de córrer (la qual he de pressionar botons per fer-la servir) i alguna altra. Faig servir l’aplicació mòbil per a saber quin entrenament he de fer.
Com ho sento?
Es tracta d’un procés habitual que no suposa cap dificultat per a mi. Tot i que l’aplicació mòbil i alguns elements de la sala serien millorables.
Com ho conec?
Conec gairebé la majoria de les màquines. Tot I això, tenen una breu explicació de com es fa servir. En cas de no saber, hi ha un entrenador a la sala que ajuda a entendre com fer l’exercici.
Tipus d’interacció: Manipulating/Instructing (App)
Estil d’interacció: Gesture/Touch (App)
Context d’interacció: Interacció tangible/GUI(App)
Benvinguts i benvingudes!
Hola!
Aquesta publicació s’ha generat automàticament i només pots veure tu.
Et presentem el teu Folio, un portafolis on podràs publicar les PAC i les activitats dels teus assignatures, a més dels teus projectes propis. Et convidem a explorar-lo i personalitzar canviant el tema, els colors o la imatge de capçalera.
Per personalitzar el teu Foli i començar a publicar entrades, navega per la barra superior i fes clic a Afegeix / Entrada o accedeix al Tauler, on trobaràs el menú lateral de WordPress amb totes les opcions de l’eina.
Les publicacions que vinculis les activitats de les assignatures es mostraran a l’Àgora de l’aula. Des d’allà podràs veure les publicacions dels teus companys i companyes i deixar comentaris.
Et recordem que pots triar el nivell de visibilitat de cada publicació: pública, protegida amb contrasenya, campus, aula, visible només per al professorat i privada.
Et deixem un link a l’espai d’aprenentatge on trobaràs totes les indicacions bàsiques per actualitzar el teu Foli, fer publicacions, vincular-les a les activitats de les assignatures i fer lliuraments en el RAC. Fes-li un cop d’ull!
Si tens qualsevol dubte, pots posar-te en contacte amb el professorat de la teva assignatura o amb el servei d’atenció.