Publicado por

PEC 5 – Prototipatge i proposta de valor

PEC 5 – Prototipatge i proposta de valor
Publicado por

PEC 5 – Prototipatge i proposta de valor

PROPOSTA D’APLICACIÓ MUTEK Prototip Tan bon punt el procés iteratiu de sketching ha quedat prou acurat, s’ha procedit a seguir en el…
PROPOSTA D’APLICACIÓ MUTEK Prototip Tan bon punt el procés iteratiu de sketching ha quedat prou acurat, s’ha procedit a…

PROPOSTA D’APLICACIÓ MUTEK

Prototip

Tan bon punt el procés iteratiu de sketching ha quedat prou acurat, s’ha procedit a seguir en el procés de prototipatge de baix nivell, sense aportar cap disseny gràfic definitiu. Cal aclarir que, en aquest nivell de prototipatge no és necessari incloure cap imatge ni colors ni res però, per tal de facilitar l’enteniment, s’han fet servir les imatges auxiliars de Mutek per omplir allà on fes falta una imatge i s’han posat alguns colors per poder identificar més fàcilment què es pot pitjar i què no.

Donat que es plantegen 2 tipus d’usuaris, s’han dissenyat 2 fluxos de prototipatge per tal de permetre abordar els dos tipus d’interacció. Aquests prototips s’han dissenyat fent servir Figma. Per accedir a aquests enllaços de prototipatge, prémer les imatges per cadascun dels prototips.

 

Proposta de valor

A continuació es mostra la proposta de valors que aporta l’applicació acord a les necessitats identificades en la documentació proporcionada en el briefing i les fitxes persona de l’Anne i de’n David.

Debate0en PEC 5 – Prototipatge i proposta de valor

No hay comentarios.

Publicado por

PEC 4 – Anàlisi de LiveNation i Banister

Publicado por

PEC 4 – Anàlisi de LiveNation i Banister

Un dels pasos a l’hora de dissenyar un sistema interactiu consisteix en observar i analitzar altres productes que compleixen un servei similar…
Un dels pasos a l’hora de dissenyar un sistema interactiu consisteix en observar i analitzar altres productes que compleixen…

Un dels pasos a l’hora de dissenyar un sistema interactiu consisteix en observar i analitzar altres productes que compleixen un servei similar al que es vol dissenyar per tal de veure aquells punts de fortalesa així com de feblesa i poder tenir-los presents en el propi disseny. Donat que Mutek va sol·licitar una aplicació que permeti la compra d’entrades així com la retransmissió en streaming dels espectacles, per a aquest anàlisis s’han escollit les següents dues webs: LiveNation i Banister Live.

Per a analitzar els llocs web indicats, es realitzarà una avaluació Heurística seguint els 10 principis de Nielsen. Per tal de tenir presents aquests principis de Nielsen, s’exposa una breu explicació extreta del blog de Interactius [1].

1. Visibilitat de l’estat del sistema.

«El sistema ha de mantenir a l’usuari informat sobre el que passa a través d’una retroalimentació apropiada en un temps raonable.»

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

«El sistema ha de parlar en el llenguatge de l’usuari, amb paraules, frases i conceptes familiars per ell. Utilitzar convencions del món real, fent que la informació apareixi en un ordre natural i lògic.»

3. Llibertat i control per part de la persona usuaria.

«A vegades els usuaris escullen funcinalitats per error i necessiten una ‘porta d’emergència’ per sortir d’un estat indesitjat. Oferir suport per desfer i refer accions.»

4. Consistència i estàndars.

«Els usuaris no haurien de preguntar-se si diverses paraules, situacions o acción signifiquen les mateixes coses. Que es segueixin les normes i convencions de la plataforma sobre la que està implementat el sistema.»

5. Prevenció d’errors.

«Abans que dissenyar bons missatges d’errors, és millor evitar que el problema es dugui a terme.»

6. Reconeixement abans que record.

«Minimitzar la càrrega de memòria de l’usuari fent que els objectes, les accions i les opción estiguin visibles. L’usuari no té perquè recordar la informació d’una part del diàleg a una altra»

7. Flexibilitat i eficiència d’ús.

«Els acceleradors, no vistos per l’usuari principiant, milloren la interacció per l’usuari expert de tal manera que el sistema pot servir per usuaris inexperts i experimentats. És important que el sistema permeti personalitzar accions freqüents.»

8. Disseny estètic i minimalista.

«Els diàlegs no haurien de tenir informació irrellevant o que es necessiti rarament. Cada unitat extra d’informació en un diàleg competeix amb la informació important, disminuint la visibilitat relativa.«

9. Ajuda a les persones usuaries a reconèixer i diagnosticar els errors i a recuperar-se.

«Els missatges d’error han d’estar expressats en un llenguatge pla, sense codis, indicant amb precisió el problema i suggerir una solució.«

10. Ajuda i documentació

«Encara que es millor que es pugui fer servir el sistema sense documentació, és necessarti proporcionar a l’usuari ajuda i documentació. Aquest ha de ser fàcil de buscar, centrat en les tasques de l’usuari, amb informació de les etapes a realitzar encara que no sigui molt extensa.»

 

A continuació es mostrarà el diagrama de flux d’una taca en cadascuna de les webs indicades i es farà una avaluació Heurística d’aquests.


LiveNation

Tasca – Comprar dues entrades a un concert

Escenari: Després de 2 anys de restriccions sanitàries degut a la pandèmia de la Covid-19, Destripando la Historia torna als escenaris de forma presencial arreu de la península. Tu i el teu millor amics, fans incondicionals dels artistes, decidiu assistir al primer concert que facin aprop de la teva ciutat. El concert és promocionat per LiveNation, compra les entrades des d’allà.

Diagrama de flux

En analitzar el diagrama de flux per tal de comprar entrades a través de LiveNation, un dels punts que ha cridat més l’atenció és que ells només promocionen els concerts però tot el que té a veure amb la gestió de les entrades està en mans de TicketMaster, un servei de tercers. Un altre aspecte curiós és que les funcions de promoció són bastant limitades i de seguida surt a altres pàgines webs des don es gestionen les entrades, el cual dona una sensació com si LiveNation, a ulls de l’usuari que navega, es dedica a agrupa els esdeveniment però no té cap mena de control sobre aquests.

Diagrama LiveNation

Avaluació Heurística

A continuació s’exposa l’avaluació Heurística de LiveNation:

1. Visibilitat de l’estat del sistema.

LiveNation aplica una bona pràctica. En tot moment l’usuari està informat de quin punt està en la compra d’entrada i quina mena de decisions i dades ha de prendre.

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

LiveNation aplica una bona pràctica, però millorable. En la majoria dels casos fa servir un llenguatge natural per l’usuari però a vegades hi ha algunes expressions com el botó de «Entradas» per seguir amb la compra que poden despistar una mica i si no fos perquè és l’única opció, potser no seria tant lògic prémer aquest botó.

3. Llibertat i control per part de la persona usuaria.

LiveNation aplica una mala pràctica. Degut a que LiveNation fa servir un servei de tercers per a gestionar la compra d’entrades, en el moment que s’accedeix a TicketMaster perd el control de permetre tornar enrrere i obliga a l’usuari a retrocedir a través del navegador i no pas a través de la web.

4. Consistència i estàndars.

LiveNation aplica una bona pràctica. Segueix els estàndars habituals tant de distribució d’informació com en qüestions d’iconografia.

5. Prevenció d’errors.

LiveNation aplica una mala pràctica. En el moment que s’accedeix a TicketMaster per gestionar la compra d’entrades (i la selecció d’aquestes), Aquest no té en compte si encara hi ha entrades o no per assistir i fins que no selecciones les entrades i continues els pasos, no t’indica amb missatge d’error que no hi ha entrades. Per altra banda, LiveNation si dóna accés a comprar els entrades, hauria de poder visualitzar la disponibilitat d’entrades i no permetre que l’usuari intenti comprar sense poder-ne realment.

6. Reconeixement abans que record.

LiveNation aplica una bona pràctica. En el moment de fer la compra a través de TicketMaster, es conserva la informació de la data, hora i lloc del concert selecionat i això permet que l’usuari no hagi de recordar la seva selecció, així com durant el procés de pagament.

7. Flexibilitat i eficiència d’ús.

LiveNation aplica una bona pràctica, però millorable. Des de LiveNation, permet aplicar filtres de dates, llocs i gèneres per tal de afinar la cerca de concerts i si l’usuari que sap a quin concert vol anar, pot fer ús d’aquests. Tot i així, és l’única opció que permet accelerar el procés ja que és bastant lineal. Per altra banda, si ja s’ha fet mai cap compra a través de TicketMarket, aquest pot guardar la informació per a futures compres, i per tant accelerar-ho.

8. Disseny estètic i minimalista.

LiveNation aplica una bona pràctica. Tota la informació proporcionada és clara i directe, permet que l’usuari no divagui en informació irrellevant

9. Ajuda a les persones usuaries a reconèixer i diagnosticar els errors i a recuperar-se.

LiveNation aplica una bona pràctica, però millorable. Des de LiveNation no hi ha errors posibles, ja que en esspencia és un by-pass per a la compra d’entrades. Però des de TicketMaster sí que hi ha una bona pràctica d’errors doncs aquests són clars si falta informació si algun procés ha fallat i què ha de fer l’usuari per a poder continuar.

10. Ajuda i documentació

LiveNation aplica una bona pràctica, però millorable. La majoria d’accions contenen un Tooltip que indica què vol dir o què fa, però també hi ha informació de l’artista que queda una mica amagat al final de la fitxa de l’artista. Si bé no és rellevant per les tasques a realitzar, si justament es vol accedir a la informació de l’artista, el més coherent és que aquesta informació de descripció aparegui al principi, encara que sigui com a introducció per als següents continguts.

 

 


Banister

Tasca – Assistir a concert en streaming

Escenari: Durant la pandemia, el duo musical de Destripando la Historia s’ha pogut reunir en «petit comité» per transmetre en viu un concert familiar, comentant algunes canços i parlant amb els seguidors responent preguntes. Tu, emocionat, vas comprar les entrades i avui has rebut la notificació de que tot està apunt per començar el concert. Assisteix al concert en streaming a través de Banister.

Diagrama de Flux

Si una cosa destaca Banister és que en concepte de transmissió en streaming té una forma de gestionar-se bastant lineal i similar a la plantejada per Mutek, amb la diferència que aquest diagrama de sequencies correspondria a la transmissió en streaming mentre que la proposada en el projecte és assistir al concert per ARVR i requereix alguns passos més per a gestionar-ho. Arribats en aquest punt, la part més interessant és veure a nivell tècnic com es realitza el setup que connecta amb Banister alhora de transmetre en viu i sobretot, com interactuen amb els oients i quin grau d’interactivitat tenen els artistes directament amb Banister durant el concert. A més a més, també considero interessant veure com es gestionen els errors tècnics que poden succeir en viu per tal de tenir-los presents alhora de dissenyar la interacció per Mutek.

Diagrama de flux Banister

Avaluació Heurística

A continuació s’exposa l’avaluació Heurística de Banister:

1. Visibilitat de l’estat del sistema.

Banister aplica una bona pràctica. Per la naturalesa del concepte de streaming, i la senzillesa a nivell d’espectador, és fàcil saber en tot moment on es troba l’usuari si fora del concert, esperant per entrar o dins del concert.

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

Banister aplica una bona pràctica, però millorable. Tot i que el concert en streaming en concret no disposa de molts elements interactius a part del xat (que sí aplica bona pràctica), per buscar detalls, es podria parlar de la gestió del perfil de l’usuari i l’accés a les entrades, amb algun text més intuitiu o algun icona que recordi a «El meu perfil»

3. Llibertat i control per part de la persona usuaria.

Banister aplica una mala pràctica. Realment no hi ha cap porta d’emergència que permeti a l’usuari refer les seves accions, l’única porta d’emergència que hi ha és pitjar l’icona de Banister per tornar al principi de tot.

4. Consistència i estàndars.

Banister aplica una bona pràctica, però millorable. Com s’ha comentat abans, durant la tranmissió en streaming no hi ha molts elements interactius, però els pocs que hi ha són adequats. Podria ser millorable si hi hagués més possibilitats. A més a més, també seria millorable un aspecte bastant repetitiu d’error i es que no tots els blocs «clickables» segons el cursor que es mostra, es poden pitjar i això fa que perdi una mica la consistència de que no fa res aquell suposat enllaç.

5. Prevenció d’errors.

Banister aplica una mala pràctica. La possibilitat de que l’usuari es pugui equivocar són molt reduides però on si poden haver errors és durant la transmissió d’errors. Banister ofereix i assegura una bona disponibilitat de servidors i accessos però en canvi hi ha hagut ocasions on, malgrat saber exactament quantes persones assisteixen en streaming, no han sabut oferir el servei al 100% i això indica que no hi ha una bona prevenció d’errors que permeti oferir el servei ininterrumpudament.

6. Reconeixement abans que record.

Banister aplica una mala pràctica. Com s’ha comentat abans, no hi ha motles pantalles d’interacció per poder accedir al concert, però sí que es cert que, si en el correu de recordatori no indiqués quins passos seguir per entrar al concert, l’usuari sol hauria de provar ja que no hi ha cap estructura que permeti reconèixer com accedir al concert.

7. Flexibilitat i eficiència d’ús.

Banister aplica una bona pràctica. Per la naturalesa del concepte de streaming, i la senzillesa a nivell d’espectador, no hi ha necessitat de trobar acceleradors a la tasca per a experts. Els accesos directes que un usuari expert pugui necessitar estan tant accessibles com per l’usuari principiant.

8. Disseny estètic i minimalista.

Banister aplica una bona pràctica. Tota la informació que es mostra en pantalla és senzilla i autoexplicativa de manera que no hi ha elements innecessaris que competeixin per l’atenció de l’usuari.

9. Ajuda a les persones usuaries a reconèixer i diagnosticar els errors i a recuperar-se.

Banister aplica una mala pràctica. Un exemple molt clar és quan s’intenta editar el perfil, per canviar la contrasenya per exemple. En intentar editar, apareix un missatge d’error que per un usuari estàndard no li aporta cap informació i només el botó de «Tornar» li permet recuperar-se, però el missatge és clar només per a desenvolupadors. Aquests tipus d’errors haurien d’estar millor descrits i en cas que sigui necessari una traça per a desenvolupadors, aquest hauria de mostrar-se com a extra en pantalla i que quedi ocult fins a pitjar «més detall» o fins i tot troba una altra manera d’accedir-hi.

10. Ajuda i documentació.

Banister aplica una bona pràctica, però millorable. La tasca d’accedir al concert no conté molts passos però en canvi, la informació que fos necessaria per poder accedir al concert, només es troba en el correu que rep per accedir-hi. Això implica que s’ha de tenir a mà el correu per saber on trobar les entrades. Està documentat? sí, però no és tant accessible com hauria de ser.


Bibliografia i Webgrafia

[1] Modroño, T. (2022, January 5). Evaluación Heurística (PARTE I). Interactius. https://interactius.com/evaluacion-heuristica-parte-i/

Debate0en PEC 4 – Anàlisi de LiveNation i Banister

No hay comentarios.

Publicado por

PEC 3 – Definició de la organització i l’etiquetat

Publicado por

PEC 3 – Definició de la organització i l’etiquetat

App Mutek Introducció Per a realitzar l’arbre de continguts partint dels requisits trobats en l’anterior pràctica, s’ha elaborat un inventari de continguts,…
App Mutek Introducció Per a realitzar l’arbre de continguts partint dels requisits trobats en l’anterior pràctica, s’ha elaborat un…

App Mutek

Introducció

Per a realitzar l’arbre de continguts partint dels requisits trobats en l’anterior pràctica, s’ha elaborat un inventari de continguts, a continuació s’ha dissenyat un Card sorting obert per dur a terme de manera online a joves d’edat compresa entre 20 i 30 anys. El fet que el Card sorting s’hagi optat per a que sigui del tipus obert ha permès tenir una visió més àmplia de la percepció que tenen els usuaris a l’hora de categoritzar de forma natural els continguts, però també ha dificultat la tasca, ja que en alguns casos els resultats han estat una mica ambiguos.

Card sorting

En primer lloc, un cop finalitzat el card sorting, s’han analitzat les categories i observat com els usuaris han categoritzat les diferents targetes. A continuació podeu veure la taula obtinguda després d’estandaritzar les categories obtingudes:

Les cartes s’han agrupat en les següents categories:

  • Accés a l’aplicació.
  • Blog i events — on dins podem trobar dues subcategories de Events i Blog.
  • Perfil.
  • Altres/Secció d’artista.
  • Configuracions — on dins podem trobar dues subcategories de Configuració i Tests tècnics.

Arbre de continguts

Degut a l’ambiguitat d’alguns resultats, ha estat necessari crear unes relacions directes entre diferents categories com per exemple les configuracions i l’accés a l’aplicació. S’ha establert que en registrar-se per primer cop es permeti accedir directament a definir les diferents configuracions, però si més endevant es vol modificar, l’aplicació ha de poder permetre-ho i per aquest mateix motiu, també ha de poder accedir-se des de dins l’aplicació, com per exemple des del perfil. Un altre cas on s’ha hagut de prendre una decisió ha estat en les entrades comprades, alguns han suggerit que hauria de ser a events però altres també que hauria d’estar al perfil, però pels requisits establerts inicialment i la lògica contextual s’ha categoritzat com a part del perfil.

Cal comentar també que la categoria de blog i events, per la naturalesa de l’aplicació, és el contingut principal i per tant es pot accedir des de tot arreu així com que no depen directament de cap altre categoria. Per aquest motiu no té cap fletxa de relació. Afegir que la categoria de Secció d’artista queda sobrejada amb un altre color degut a que només els artistes tenen accés a aquests continguts directament.

A continuació podeu veure l’arbre de continguts amb les relacions directes.

Debate1en PEC 3 – Definició de la organització i l’etiquetat

Publicado por

PEC 2 – Escenari i User Journey

Publicado por

PEC 2 – Escenari i User Journey

Hola! Us comparteixo l’escenari proposat per en David Martínez, com gestiona la compra d’entrada per poder gaudir de l’experiència hibrida que ofereix…
Hola! Us comparteixo l’escenari proposat per en David Martínez, com gestiona la compra d’entrada per poder gaudir de l’experiència…

Hola! Us comparteixo l’escenari proposat per en David Martínez, com gestiona la compra d’entrada per poder gaudir de l’experiència hibrida que ofereix Mutek. Em sembla interessant compartir aquest primer escenari per tal de tenir una primera vista del que l’aplicació pot oferir com a nivell interactiu inicial.

 

Escenari

En David fa anys que segueix les activitats que realitza Mutek, té les notificacions de Twitter activades per no perdre’s cap esdeveniment ni noticia rellevant del món de la música. El mòbil sona, en David mira la pantalla i veu que Mutek a fet un post indicant l’inici de temporada dels festivals que organitza i, sobretot, fan èmfasis en la nova possibilitat d’assistir-hi des de qualsevol lloc del món a través de la seva app mòbil.

Com no podia ser d’una altra forma, en David es descarrega la aplicació mòbil i es registra amb el seu correu de Google. Un cop dins, el primer que busca és el llistat de performances, el que veu es com si fos un feed d’una xarxa social on indica informació en primera plana del tipus de performance, l’artista, la data i el lloc. A més a més, disposa d’una icona que li permet guardar a favorits aquell esdeveniment publicat. En David no pot evitar emocionar-se quan veu que l’Anne Woods, una de les seves artistes preferides, realitzarà un concert el proper divendres. Sense dubtar-ho ni un segon més, pitja a l’esdeveniment per veure com podria gestionar l’assistència. Quan obra el detall, veu una descripció de la performance que realitzarà, així com les dades principals que ja es veien en el feed, però a més a més també hi veu dos botons: “Accedir en streaming” (opció que retorna un feedback de que encara no és el dia) i “Comprar entrades”. Quan pitja la segona opció, li apareix dues opcions o bé pot comprar les entrades d’asistència física o bé l’opció de Realitat Augmentada.

La possibilitat d’assistir a un concert amb realitat augmentada li crida l’atenció, però encara més que facin servir la tecnologia de Google ARVR, doncs permet no només experimentar la realitat augmentada des del mòbil, sinó que si disposa de les ulleres de VR podrà experimentar l’experiència d’un concert immersiu virtual. Els passos de compra es divideixen en 3 passos: verificació de les dades de compra, verificació de les dades personals i finalment, introducció del mètode de pagament. Els passos són molts similars a altres llocs de compra online i són clars, per a que no es perdi i en tot moment pot retrocedir en cas de dubte.

 

Salutacions

Debate0en PEC 2 – Escenari i User Journey

No hay comentarios.