Explicació de l’Esbós (Sketching)

Per a aquest repte, he elaborat un esbós que parteix del storyboard i que permet visualitzar les pantalles clau de l’aplicació. L’objectiu principal era establir una base clara de les interaccions bàsiques i les funcionalitats proposades, utilitzant les tècniques de sketching que hem treballat durant l’assignatura. Amb aquest esbós, he intentat reflectir com es podria dissenyar l’aplicació per respondre a les necessitats de les persones usuàries, mantenint una atenció especial als principis de disseny centrat en les persones.

Estructura i Conceptes Aplicats

L’esbós consta de 6 pantalles principals, que cobreixen el flux d’interacció des de la pantalla inicial fins a les funcionalitats més avançades. A continuació, detallo cada una:

1.Pantalla d’inici i registre:

•He mantingut un disseny simple amb un enfocament clar cap a les accions principals: iniciar sessió o registrar-se.

•Vaig aplicar el principi de visibilitat per assegurar que els elements essencials estiguessin fàcilment identificables.

2.Pantalla de configuració d’objectius:

•En aquesta pantalla, l’usuari pot seleccionar i personalitzar els seus objectius.

•Els elements visuals inclouen afordances perceptibles i agrupacions clares que guien l’usuari.

3.Pantalla de connexió de comptes:

•Aquí, vaig representar el procés de vinculació de comptes externs, utilitzant símbols familiars per transmetre confiança i seguretat.

•Vaig incorporar metàfores visuals per fer el procés més intuïtiu.

4.Pantalla de seguiment del progrés:

•Aquesta pantalla inclou gràfics interactius i elements visuals que ajuden a l’usuari a entendre el seu progrés de manera ràpida.

•He fet servir el principi de mapatge natural, assegurant que els controls estiguessin alineats amb les expectatives de l’usuari.

5.Pantalla de notificacions:

•Vaig destacar com l’aplicació informa l’usuari sobre assoliments o tasques pendents.

•Els elements visuals com el contrast de colors reforcen l’atenció en les notificacions importants.

6.Pantalla de funcionalitats avançades:

•Aquesta pantalla mostra com l’usuari pot explorar més opcions, com consells personalitzats o informes detallats.

•He aplicat restriccions visuals per evitar sobrecarregar l’usuari amb massa informació alhora.

Reflexió sobre l’Esbós

Treballar en aquest esbós m’ha permès experimentar amb diferents maneres de plasmar les idees inicials en dissenys clars i comprensibles. Vaig utilitzar les fitxes del Design Toolkit com a guia per assegurar que cada pantalla reflectís principis de disseny com l’accessibilitat, l’alineació i la proximitat. També vaig consultar els resultats del benchmarking del repte 3 per garantir que les solucions estiguessin alineades amb les necessitats reals dels usuaris.

Proposta d’Alta Fidelitat (High Fidelity)

Tot i que no es demanava explícitament per al lliurament, vaig voler anar un pas més enllà i crear una proposta d’alta fidelitat per mostrar com podria veure’s l’aplicació en la seva versió final. La meva intenció era oferir una visió més realista de l’experiència d’usuari i del disseny visual.

Aspectes destacats de la Proposta d’Alta Fidelitat

1.Colors i tipografia:

•Vaig triar una paleta de colors càlids i amables per reforçar una sensació de confiança i comoditat.

•Les tipografies seleccionades són clares i llegibles, prioritzant sempre l’accessibilitat.

2.Disseny visual coherent:

•He seguit un llenguatge visual coherent entre les pantalles per garantir una experiència fluida.

•Vaig utilitzar elements interactius clars, com botons amb efectes visuals que reforcen l’afordança.

3.Retroalimentació d’usuari:

•He inclòs elements de feedback visual, com animacions subtils i canvis de color, per assegurar que l’usuari tingui sempre clares les accions que està realitzant.

4.Funcionalitats avançades:

•A la pantalla de seguiment del progrés, vaig afegir gràfics més detallats i interactius que permeten a l’usuari explorar dades específiques.

•A la pantalla de funcionalitats avançades, vaig incorporar opcions com filtres i configuracions personalitzades.

Reflexió sobre la Proposta d’Alta Fidelitat

Crear aquesta versió d’alta fidelitat m’ha ajudat a veure com les decisions de disseny inicials poden traduir-se en una experiència d’usuari més rica i atractiva. Tot i que la proposta no era un requisit, considero que afegeix valor al projecte, ja que permet visualitzar com podria evolucionar l’aplicació en futures iteracions.

Conclusió

Tant l’esbós com la proposta d’alta fidelitat són passos clau per comprendre millor les necessitats dels usuaris i traduir-les en solucions efectives i atractives. Aquest procés m’ha permès aplicar els coneixements adquirits durant l’assignatura i reflexionar sobre com el disseny pot millorar les experiències digitals d’una manera centrada en les persones.

Explicació del Storyboard

El storyboard que he creat per aquest repte està pensat per visualitzar com seria l’experiència d’usuari amb l’aplicació que he dissenyat. He volgut destacar les interaccions més importants per tal de mostrar com l’usuari pot completar les seves tasques d’una manera intuïtiva i satisfactòria. A través de les vinyetes, he representat el flux d’interacció pas a pas, assegurant-me que tot estigui alineat amb els principis de disseny centrat en les persones.

Estructura i Conceptes Aplicats

He desenvolupat el storyboard en 6 vinyetes, cadascuna representant un moment rellevant en l’ús de l’aplicació. Aquí descric el procés:

1.Pantalla d’inici i registre:

•He volgut començar amb un procés senzill i accessible perquè l’usuari pugui registrar-se sense complicacions. Vaig tenir en compte que aquest primer contacte és clau per transmetre confiança i motivar a seguir utilitzant l’aplicació.

•Vaig aplicar els principis de visibilitat i accessibilitat, assegurant-me que tot fos clar i fàcil d’entendre.

2.Configuració d’objectius:

•Aquí he representat l’usuari personalitzant els seus objectius dins l’aplicació, ja sigui per organitzar estalvis o gestionar projectes personals.

•He aplicat el concepte d’afordances perceptibles, utilitzant icones i elements visuals familiars perquè l’usuari comprengui fàcilment com interactuar.

3.Connexió amb comptes externs:

•En aquesta vinyeta, l’usuari connecta el seu compte bancari o altres eines externes amb l’aplicació. Vaig pensar que era important reflectir un procés segur i fluid.

•Vaig utilitzar metàfores visuals, com el símbol de cadenat, per reforçar la sensació de seguretat.

4.Monitoratge de progrés:

•He inclòs una escena on l’usuari consulta el seu progrés mitjançant gràfics interactius que destaquen les dades clau.

•En aquesta part vaig aplicar mapatge natural, assegurant-me que la informació es presenti de manera lògica i intuïtiva.

5.Notificació d’assoliments:

•Vaig representar com l’usuari rep una notificació per haver assolit un objectiu. Aquest moment vol reflectir la satisfacció i motivació que l’aplicació genera.

•He incorporat principis visuals, com el contrast i el color, per destacar aquest moment positiu.

6.Accés a funcionalitats avançades:

•Finalment, he inclòs una escena on l’usuari explora altres funcionalitats, com consells personalitzats o informes més detallats.

•Aquesta vinyeta reflecteix com l’aplicació pot evolucionar amb l’usuari, oferint opcions clares per continuar millorant l’experiència.

Aprenentatges i Reflexió

Treballar en aquest storyboard m’ha ajudat molt a entendre la importància de pensar en tot el procés des del punt de vista de l’usuari. He intentat integrar tot el que he après durant l’assignatura, especialment els principis de disseny centrat en les persones, per garantir que cada interacció tingui sentit i aporti valor. A més, he revisat les activitats anteriors, com el benchmarking del repte 3, per assegurar-me que les necessitats de l’usuari estiguin sempre al centre de les meves decisions de disseny.