ANPE, Una propuesta de mejora del SEPE utilizando la metodología Design Thinking (Parte II).
Antes de empezar debo avisarte de que el presente artículo es la segunda parte que narra este proyecto de Design Thinking, por lo que si no has leído la anterior te recomiendo que lo hagas, ya que están totalmente ligados. Te dejo por aquí el link, por si quieres consultarlo: https://davidarrebacorral.medium.com/una-propuesta-de-mejora-del-sepe-utilizando-la-metodolog%C3%ADa-design-thinking-parte-i-307e49de7fdc. Dicho esto, comenzamos. 🚀
Bien, como ya vimos anteriormente y siguiendo el esquema del doble diamante, era el turno de idear una solución. No dudé en el enfoque que iba a darle. No obstante, me surgieron algunas complicaciones a medida que la iba desarrollando, pues había demasiados problemas y aspectos que cubrir y quería abordarlos todos. ¿Que cuál fue la solución que ideé? Pues os presento ANPE, Aplicación Nacional Pública de Empleo.
Solución.
Pero hablemos un poco de por qué escogí esta solución. Como vimos en el proceso de investigación, la gente prefería comodidad y rapidez en la tramitación a tener que personarse en las oficinas del organismo. Y actualmente vivimos en un mundo totalmente informatizado, pero cada vez más utilizamos nuestros móviles para todo (ya no sirven solo para llamar, como antaño). Por este motivo elegí una app en vez de reconstruir de nuevo la página web. La idea es que a través de la aplicación vuelvan a estar unidos los organismos autonómicos y el SEPE, facilitando así al usuario todos los procesos y que de esta manera solo tenga un punto al que dirigirse.
El esqueleto de la app.
Ahora que ya tenía claro qué iba a hacer tocaba realizar los diagramas de flujo o flowcharts. Este proceso ayuda bastante a la hora de elaborar una buena arquitectura de la información y además te ahorra tiempo en el diseño de pantallas, puesto que no diseñas de más. Únicamente realicé estos dos que aparecen en las siguientes imágenes, aunque en el prototipo final añadí más flujos, como veremos más adelante. Solo con estos pude realizar la app sin problema.
Tras los flowcharts, me enfrentaba a buscar una estética a la aplicación, así que me moví de lo general a lo específico. Primero diseñé los wireframes de estas tres pantallas. Este fue el resultado:
Guía de estilo.
Después decidí escoger los colores. En esta ocasión quería mantener una cierta similitud con los de la página web del SEPE, que me parecían algo apagados y, a mi parecer, no combinaban bien entre sí. Así que, tras mucho probar, mantuve el naranja ya existente en la página, de él obtuve su complementario, un azul, y lo cambié por el otro azul preexistente. Añadí además una gama cromática con diferentes tonos del nuevo azul, ya que este era demasiado intenso. Por otro lado, utilicé una gama de grises para el texto, y detalles secundarios. Y para finalizar definí tres colores semánticos, un verde para cuando todo estuviera correcto, un rojo para señalar los errores o la falta de algún documento, y un naranja para casos susceptibles de subsanación.
Ya solo quedaba elegir la tipografía. Al tratarse de un organismo del estado quería utilizar una tipografía estándar y tipo palo con buena legibilidad, para que nadie tuviera complicaciones con ella. Sin dudarlo demasiado, escogí Roboto en sus diferentes pesos.
Por último, creé unas elevaciones o sombras para ponérselas a distintos elementos de la app (como cards o botones). De esta manera resaltarán sobre el fondo creando un affordance adecuado, indicando al usuario que podrá pinchar sobre ellos. Con todo lo mencionado ya listo, comencé a crear los componentes necesarios, siguiendo una estructura de atomic design, y diseñar las pantallas correspondientes con ellos. Todo el diseño ha sido creado bajo una grid de 5 px. Para que sea más fácil de entender, os iré mostrando en imágenes las pantallas y comentaré lo que pasa en cada una de ellas. Os dejo aquí un breve vídeo por si queréis comprobar primero su funcionamiento y luego leer la explicación. Pd: el modelo del vídeo es mi perrete 🐶.
Explicamos las distintas prestaciones de ANPE. ¿Cómo funciona?
En primer lugar, nos encontramos con una pantalla de inicio en la que podremos registrarnos o iniciar sesión en el caso de que ya poseamos una cuenta. Al registrarnos, la aplicación nos pedirá que escaneemos o subamos una fotocopia del DNI por ambas caras. Al tratarse de una app, una de las cosas que más me preocupaba era el hecho de que la gente no suele tener sus documentos en el móvil, pero tras investigar me encontré con aplicaciones capaces de escanear hojas y documentos mediante la cámara del dispositivo. La idea es que esta aplicación lleve esta función integrada y de esta forma podamos escanear todo tipo de documentos necesarios para nuestros trámites. Podéis ver cómo funciona el escáner en el vídeo. Tras escanear nuestro DNI nos pedirá hacernos una foto junto a él para verificar nuestra identidad. Acto seguido nos aparecerá un overlay pidiéndonos que esperemos a que nuestra cuenta sea aceptada. No haría falta rellenar ningún dato puesto que con el DNI ya se configuraría la cuenta.
Después de esto, nos encontramos con el home de la app. En la parte superior derecha tendremos un botón que nos llevará al apartado de notificaciones y que nos informará acerca de los procesos importantes que ocurran en nuestra cuenta. En la parte superior izquierda habrá otro botón que, al pulsarlo, nos llevará al apartado settings, por si queremos modificar la configuración de nuestra aplicación. Arriba en el centro, debajo del logo, nos encontraremos con una cabecera, que informará sobre el nombre de la cuenta en el que estamos así como el estado en el que se encuentra el usuario (empleado, desempleado, cobrando una prestación, etc.). Más abajo aparecen unas cards con los distintos procesos que puede realizar el usuario, tales como inscribirse como demandante de empleo, pedir una prestación, renovar esa prestación… Finalmente, abajo, se incluye un elemento común en todas las pantallas, que es una barra de navegación o navbar que permitirá al usuario desplazarse por todas las secciones de la app, ya sea la home, la sección de información, la de trámites o el perfil.
Supongamos que queremos realizar un trámite, como por ejemplo solicitar una prestación. Pulsamos la card correspondiente, y nos llevará a otra pantalla que indica a qué tipo de prestación deseamos optar. En ella aparecerá, además de los diferentes tipos de prestación, un fab que indica una interrogación, al pulsar el cual se nos ofrecerán dos opciones: por un lado ir a las preguntas frecuentes, y por otro iniciar un chatbot que nos brindará ayuda en caso de necesitarla. Pero supongamos que lo tenemos claro y pulsamos, por ejemplo, sobre solicitud de prestación por desempleo. Entonces surgirá una nueva pantalla que nos mostrará los requisitos que debemos cumplir, y observamos que existen dos con un tick verde, lo que indica que se cumple, y uno con una x en rojo. Como podemos observar, el botón de continuar es de color gris, indicando que está desactivado, y para poder continuar deberemos pulsar sobre el trámite con la x. En ese momento aparecerá un mensaje de aviso que nos comunica que estamos a punto de empezar otro trámite. Si damos a continuar nos llevará a él. En este nuevo trámite sí contamos con todos los requisitos en verde, así que le damos a finalizar y nos saldrá otro overlay indicándonos que se ha solicitado correctamente y que podemos ver su evolución en el apartado trámites.
En el apartado información encontraremos una barra de búsqueda y dos secciones. Por un lado veremos las últimas noticias acerca del organismo público de empleo y por otro se nos mostrará una serie de preguntas frecuentes que pueden llegar a sacar al usuario de más de un apuro.
En el apartado trámites, podremos ver tres secciones: trámites aceptados, trámites en curso y trámites denegados. Además, podremos pinchar sobre ellos para tener una información más completa y descargar un justificante de su solicitud en caso de necesitarlo.
Finalmente llegamos al apartado perfil. En una primera sección se nos ofrece toda la información correspondiente del usuario, la cual podremos editar en cierta medida si lo deseamos. Un poco más abajo nos encontramos tres botones. Al pulsar “mis citas” podremos ver un calendario de estas y si tenemos alguna programada. Tendremos la posibilidad de cambiarlas o cancelarlas en el caso de que ya no las necesitemos. Para mejorar la poca empatía que muestra el organismo decidí añadir un sistema de citas urgentes, que se solicitan desde la pantalla home. La idea es que en casos de extrema necesidad el usuario pueda solicitar una cita urgente detallando por qué la desea. Esta cita será revisada por un funcionario y, en caso de que lo crea conveniente, será concedida.
En mis documentos, como su propio nombre indica, podemos ver todos los documentos que hemos escaneado o subido y añadir nuevos si así lo deseamos. En el caso de que la aplicación no los reconozca o hayan caducado, aparecerán con una exclamación en naranja, indicándonos que algo va mal.
Por otro lado, al pulsar en mis prestaciones tendremos acceso a estas, tanto las activas como las pasadas. Podremos seleccionar la que queramos y acceder a los meses en los que estas estuvieron activas, además de descargar un justificante de cada mes.
Prototipado
Una vez terminado el diseño, el paso final consiste en prototipar. Os dejo una captura de mi archivo de Figma para que podáis ver más o menos cómo lo hice, aunque advierto que es un poco caótico 😅.
En un futuro…
Esto ha sido todo. Espero que os haya gustado esta solución. Obviamente, no es perfecta y tiene ciertos aspectos que pulir, por lo que he hecho una lista de posibles futuribles:
- En cuanto a diseño, la home inicial quizás debería ser simplificada, cumpliendo con la ley de Hick, puesto que considero que existen demasiadas opciones y puede ser complicada para el usuario. Además, también crearía una familia de iconos propia, ya que los que se encuentran en el prototipo actualmente no corresponden a la misma, vulnerando de esta manera la heurística de consistencia y estándares.
- En cuanto a prestaciones, la primera y más importante sería crear una página web del mismo estilo que la aplicación para que no esté únicamente limitada a personas con smartphone. Y la segunda sería aplicar esta misma solución a autónomos y empresas, puesto que esta app solo está pensada para el ciudadano medio.
Y concluye mi artículo. Si has llegado hasta aquí, muchas gracias por invertir tu tiempo en leerlo. No dudes en seguirme para estar al tanto de los próximos que escriba y si tienes cualquier duda estaré atento a los comentarios. Un saludo :).
