Poketit — UX/UI Case Study

Desconecta de forma fácil

En las últimas décadas el ocio y entretenimiento de las personas ha ido variando, en gran parte debido al desarrollo de las tecnologías y los dispositivos digitales. Además en los últimos ocho meses la aparición de un virus ha causado un cambio radical en los hábitos que ya teníamos adquiridos. De realizar actividades en grupo, a preferir un ocio en solitario, el incremento del consumo de plataformas digitales, incluso hemos aprendido a entretenernos en nuestras casas.

Optamos por centrar nuestro proyecto en el ocio porque nos parecía interesante cómo había cambiado el sector a raíz de la pandemia y cómo podríamos encajar el desarrollo de una aplicación con las restricciones actuales y la desescalada futura.

Primero de todo, nos gustaría presentar al equipo que está detrás de Poketit y que ha hecho esto posible: Alba, Lois, Miriam y Cristina.

Alba Calvo, Lois Brea, Cristina Pastor y Miriam Ruiz.

Metodología

Para este proyecto utilizamos la metodología Design Thinking combinada con la filosofía Agile, de manera que desarrollamos el tema a lo largo de las fases: empatizar, definir, idear, prototipar y testar.

Comenzamos explorando el tema de manera amplia, para poco a poco ir enfocándonos en algo más concreto. Ni mucho menos de forma lineal, si no que a lo largo de todo el proceso iteramos y pivotamos hasta dar con la solución.

Empatizar

Desde el comienzo pusimos en el centro al usuario ya que queríamos conocer sus necesidades, motivaciones y frustraciones a la hora de realizar actividades de ocio y tiempo libre.

Objetivos e hipótesis

Los objetivos que teníamos en un principio a la hora de hacer las entrevistas y averiguar cómo disfruta la gente del ocio eran los siguientes:

• Conocer cuáles son los impedimentos a la hora de relacionarse en actividades de ocio.
• Descubrir lugares o formas frecuentes de ocio.
• Investigar cuánto están los usuarios dispuestos a invertir en ocio.
• Conocer si es importante relacionarse con otras personas en actividades de ocio o si la gente prefiere el ocio individual.
• Saber si ha cambiado la forma de entretenerse de la gente con la llegada del COVID-19.

También tuvimos en cuenta algunas hipótesis como:

• La gente deja de hacer actividades de ocio por no encontrar gente/sitios.
• A la gente le cuesta generar grupos de ocio.
• La gente joven tiene cada vez menos dinero para dedicarle a actividades de ocio.

Entrevistas

Establecidos los objetivos y las hipótesis, era el momento de divergir. Realizamos un Mindmap para ayudarnos a construir las preguntas del guión de nuestra entrevista.

Mindmap

¿Disfrutan las personas al 100% de su tiempo libre? ¿Hacen lo que realmente les gusta? ¿Tienen frustraciones? Son algunas de las preguntas que nos vinieron a la mente cuando decidimos empezar por hablar con gente de nuestro alrededor.

Este estudio cualitativo constó de 17 entrevistas a gente de entre 20 y 40 años.

Algunas de las preguntas que hicimos a los entrevistados fueron:

1. ¿Qué consideras ocio?
2. ¿Cómo disfrutas de tu tiempo libre?
3. ¿Cual es tu experiencia con el ocio/entretenimiento online?
4. ¿De qué forma ha afectado la pandemia a tus hábitos/ocio?
5. ¿Consideras importante relacionarte con otras personas a la hora de realizar actividades de ocio/aficiones/hobbies?

Definir

Tras indagar y recopilar información, era hora de analizarla. Para ello despiezamos las entrevistas de manera que pudiéramos ver de forma clara en qué coincidían nuestros usuarios.

Descubrimientos

Estos son los principales insights que extrajimos de las 17 entrevistas:

• Falta de organización: Se relaciona directamente con una mala gestión del tiempo. No es una falta de tiempo real si no una falta de organización y programación de las tareas y de manejar su interacciones sociales.
• Falta de prioridades: Fallan al dar la importancia adecuada a sus opciones de esparcimiento o a las personas con las que lo comparten. Provoca la aparición de patrones que se repiten y que generan estrés o hastío en el individuo.
• Concentración: Debido a la velocidad de la era tecnológica en la que vivimos los tiempos de las tareas se han reducido drásticamente lo que provoca en el individuo una ambivalencia entre sentir que no “aprovecha el tiempo” y una continua procrastinación, como por ejemplo revisar el feed de sus redes sociales cada pocos minutos.
• Socialización: Los individuos se sienten a veces presionados a escoger el ocio grupal por encima del ocio personal por cuestiones de sentirse aceptados o de sentimientos de exclusión o reclusión. También aparece el efecto FOMO (“fear of missing out”), aprehensión a perder experiencias gratificantes por estar ausente o miedo al arrepentimiento.
• Sobreoferta: La sobreestimulación relacionada con el esparcimiento consigue que los individuos se sientan frustrados al no ser capaces de elegir una sobre otra. Esto sumado al corto spam de atención provoca una incapacidad de desarrollar un crecimiento dentro de la disciplina escogida junto a una incapacidad para desconectar de la vida laboral.

En definitiva, era evidente la relación entre las distintas problemáticas, las cuales quedaban englobadas por dos grandes ramas: la ansiedad social y la falta de organización.

Además, el término “desconectar” fue el más repetido en las entrevistas. Ese momento en el que terminas tu jornada de trabajo o estudio, y decides qué hacer con lo que queda del día. También pudimos observar que existía un verbatim que se repetía en la mayoría de entrevistas: la gente admitía que no tenía tiempo para realizar las tareas que le resultan gratificantes durante su tiempo libre. Algunos nos decían que utilizaban sus huecos libres para trabajar en otras cosas, que siempre acababan haciendo lo mismo o que no llegaban a desconectar.

Con toda esta información obtenida y para investigar más a fondo acerca de todos estos insights sacados de las entrevistas decidimos crear nuestro User Persona.

User Persona

Susana es una diseñadora gráfica de Madrid muy entregada a su trabajo y a su familia y amigos. Le dedica mucho tiempo a las RRSS como plataforma de trabajo donde muestra su portfolio, pero también las utiliza simplemente para distraerse un rato; a veces piensa que malgasta demasiado tiempo en estas redes. Le gusta la pintura y practicar deportes, pero le frustra no poder dedicarle todo el tiempo que le gustaría.

Customer Journey

Para analizar la problemática en profundidad recurrimos al Customer Journey desde el momento en que Susana empieza a disfrutar de su tiempo libre, al salir del trabajo.

A las 18h, Susana, sale del trabajo y quiere hacer algún plan, así que saca su móvil para buscar opciones pero se encuentra con notificaciones en redes sociales y se pasa media hora haciendo scroll. A las 19h se da cuenta de que se le ha ido el santo al cielo y que había cogido el móvil para buscar planes. Se pone a ello y se siente abrumada por la sobre oferta, así que decide quedarse en casa y ver algo en Netflix. Finalmente se pone una serie, que realmente no le interesa demasiado, y continúa revisando las redes sociales mientras la ve por el rabillo del ojo. Al final del día se siente frustrada por no haber hecho “nada” y se va a la cama con la sensación de que ha perdido el día.

La realidad

Lo que en un principio parecía ser un problema de falta tiempo se redujo a un problema de falta de organización. Era muy evidente, todas aquellas personas no podían llegar a realizar sus hábitos favoritos en su tiempo libre, porque no tenían una buena organización.

Pero un momento, ¿estábamos realmente en lo cierto? ¿A qué se referían todas esas personas cuando nos indicaban sus frustraciones a la hora de desconectar? Desconectar, ¿cómo? y ¿de qué? Poco a poco, indagando en los porqués de ésta falta de tiempo nos dimos cuenta de que la mayor parte de los entrevistados no relacionaba el uso del móvil con el tiempo libre, a pesar de ser un gran consumidor de horas muertas. Aquí fue cuando conseguimos relacionar la palabra “desconexión” que tanto nos habían mencionado, con este gran problema actual: la procrastinación en las redes sociales y en definitiva, el uso excesivo del móvil.

Ideación

¿Sabías que pasamos casi medio año pegados a las pantallas? En concreto las redes sociales provocan en los adolescentes desde adicción a las mismas, ansiedad y son una de las principales causas del ciberbulling y el sexting.

Todo esto nos llevó a coger este camino e intentar buscar una solución. De esta manera encontramos nuestro reto en forma de “How might we”:

Benchmark

Una vez localizado por fin el problema en el que nos íbamos a centrar decidimos hacer un poco de benchmark para ver qué soluciones había ya en el mercado y encontramos las siguientes aplicaciones:

• Foursquare: App que propone actividades y sitios interesantes en la zona donde el usuario se encuentre. Después puede votar, comentar y compartir la experiencia. Nos gustó la idea de proponer actividades que te saquen un poco del mundo virtual.

Pros: Propone muchas opciones de ocio cerca de la localización del usuario.

Contras: Sobre oferta que no se centra en sus gustos, al igual que el compartir, votar y comentar las experiencias hace que el usuario pase más tiempo en el móvil y es precisamente lo que queremos evitar.

• Familytime: App que limita el uso del móvil o de ciertas aplicaciones. Es una app más dedicada al control parental.

Pros: Es eficaz ya que cuando el usuario se pasa del tiempo indicado la app que está utilizando se cierra.

Contras: Nos parece demasiado violento y no es lo que pretendemos con nuestra propuesta. No queremos castigar al usuario, si no concienciarlo de una forma más amigable y motivarle mediante otras actividades o recompensas a que poco a poco vaya utilizando menos el móvil.

• Headspace: App de mindfulness. Nos fijamos mucho en esta app por su apariencia divertida a la vez que relajante. Predominan los colores primarios sobre un fondo blanco que hace que respiren en todo momento y no agobien. Nos pareció muy interesante el cambio de apariencia según la página de la app, como es el caso del apartado de “dormir”, que cambia a tonos azules y un fondo oscuro.

Con esta información obtenida decidimos hacer una lista de lo que queríamos y no queríamos que tuviese nuestra propuesta para llegar así a una solución más concreta.

Con esta aplicación lo que queríamos era:

• Motivar al usuario
• Transmitir buen rollo
• Tener un aspecto desenfadado
• Tener un uso limitado y que no fuera fácil engancharse a ella
• Recompensar el esfuerzo de alguna manera
• Ofrecer ocio en base a los gustos de cada usuario de forma individual
• Alejar a los usuarios de las pantallas

Cosas que no queríamos:

• Que fuese una red social
• Que fuese una app adictiva
• Que tuviese sobre oferta de ocio
• Que tuviese contenido con el que competir o compararse con otros usuarios, ya que puede general ansiedad
• Que el usuario se sintiese culpable al saber que pasa mucho tiempo usando el móvil, hacerle sentir mal

Después de haber establecido qué queríamos y qué no queríamos en nuestra aplicación, utilizamos la herramienta Crazy 8 para establecer las funcionalidades básicas que tenían que estar dentro de la App.

Y así llegamos por fin a nuestro MVP: Una app que se centra en concienciar sobre el uso diario del móvil y que mediante metas diarias y puntos acumulados motiva al usuario con recompensas reales y además propone actividades de ocio siempre alejadas de las pantallas.

Prototipado

Es normal que a la primera no salgan los resultados esperados y, como todos ya sabemos, el proceso no es lineal si no que podemos regresar una y otra vez a las distintas fases para asegurarnos de que, finalmente, el resultado sea el mejor posible. Por eso en un principio pensamos en distintos apartados y funcionalidades de nuestra app bastante más ambiciosas pero, siendo críticos y ayudados también del feedback de compañeros, pivotamos varias veces hasta llegar al prototipo final.

Antes de entrar en detalle, era importante centrarnos en los wireframes de la app que junto con los userflows, determinarían la estructura y la organización del prototipo. Las tres pantallas más importantes a definir fueron la Homepage, la propuesta de actividades de ocio a la que llamamos “Ideas” y el apartado de Recompensas, donde el usuario puede desenvolver las funciones principales de Poketit.

Userflows

Wireframes

Y así nace Poketit, la app que te premia por usar menos el móvil y te propone además actividades de ocio distintas y alejadas de las pantallas.

Lo primero que encontramos al abrir la App por primera vez, es un Onboarding sencillo donde se explica nuestra propuesta de valor.

Desde la Home podemos ver nuestro uso diario del móvil y una meta a lograr para ir acumulando puntos a los que hemos llamado “pokets”. También podemos ver un apartado llamado “corre que vuela”, que es una actividad de ocio por tiempo limitado y alguna recompensa disponible para canjear cuando tienes los suficientes pokets.

En el apartado de “ideas” encontramos recomendaciones de actividades de ocio que pueden ayudar a alejarnos un poquito más de las pantallas. Estas propuestas son siempre centradas en nuestro gustos ya que previamente se hace un pequeño cuestionario para conocer nuestras preferencias.

También podemos encontrar el ya mencionado “corre que vuela”, que a parte de ser una actividad limitada como hemos dicho anteriormente, siempre está relacionada con un establecimiento o lugar en el que, a la llegada a este, hay que escanear un código QR y automáticamente se añaden pokets a la app.

En el apartado de recompensas podemos ver en la parte superior los pokets acumulados. Debajo tenemos las recompensas disponibles y las que aún están por desbloquear. Para canjear una recompensa solo hay que hacer tap en ella y se nos descargará un código QR que habrá que presentar en el establecimiento indicado.

Por último tenemos un apartado de perfil en el que podemos ver un poco más detallado nuestro progreso y acceder a los ajustes.

Test de usuarios

Una vez listo el prototipo navegable decidimos hacer un pequeño testeo con 8 usuarios de entre 20 y 40 años, ya que era la franja de edad que elegimos en un principio como consumidores de nuestra app. La finalidad de este testeo era ver si en general se entendía el funcionamiento de la app al igual que el de sus distintos apartados.

Una parte importante de Poketit es la cabecera, donde aparece toda la información de los pokets acumulados, tu meta diaria y lo que tienes que hacer para ganar los próximos pokets, así que nos centramos bastante en comprobar si se entendía bien esa zona de la home.

Con el feedback que nos dieron los usuarios corregimos pequeños detalles como:

• Unificar elementos que aparecían representados de distinta forma en varios apartados de la app cuando significaban lo mismo.
• Cambiar algunos copys para una mayor comprensión y en otros casos para que continuase teniendo esa apariencia amigable y desenfadada.
• Añadir alguna página intermedia como la de proporcionar datos personales para un mejor funcionamiento de la app.

Independientemente de estos cambios todo el mundo entendió el contenido de la cabecera de la home y su finalidad, nuestra mayor preocupación.
Después de cada testeo preguntamos a los usuarios qué les había parecido la app y los comentarios fueron muy positivos, entendieron nuestra propuesta de valor a la perfección y les pareció muy interesante.

Branding

Desde el primer momento queríamos que nuestra aplicación fuera amable, divertida y desenfadada, y sobre todo que no supusiera un esfuerzo para los usuarios utilizarla, por eso construimos la identidad visual en base a esos valores.

Naming

Una vez establecidos, era hora de darle una personalidad a la marca, para ello tuvimos que decidir un nombre. No fue tarea fácil, dimos con varias opciones que se ajustaban a lo que ofrecíamos, pero que no representaban lo que buscábamos al cien por cien.

Hasta que finalmente dimos con “Poketit”. Pensado del “put something in the pocket”, meter algo en el bolsillo. La idea era que el nombre reflejara lo que esta aplicación busca que los usuarios hagan, y es guardar en móvil en el bolsillo y no utilizarlo.

Logotipo

Como queríamos que existiera concordancia entre logotipo e identidad visual de Poketit, este fue lo último que hicimos.

A la hora de construir el logo, se eligió la tipografía Palanquin Dark Semibold, con formas redondeadas y de un grosor considerable, que le quitaba seriedad al logo y lo acercaba más a los valores de marca.

Logo

Además, sustituimos la primera “o”, por el bolsillo con el móvil, distintivo del nombre de la aplicación “Poketit”. La construcción del isotipo se hizo mediante la unión de dos “t”, de manera que la parte inferior fuera el bolsillo y la superior el móvil.

Desarrollo del isotipo

Durante el desarrollo del logo, descubrimos que funcionaba mejor Poketit, sin la “c”, por lo que decidimos quitarla. De forma visual, parecía más compacto, más corto que “Pocketit”.

Desarrollo del imagotipo

Design system foundations

Con un nombre y unos valores de marca establecidos, elegir los elementos para darle una identidad fue sencillo.

• Paleta de color

El color que tuvimos presente en todo momento fue el naranja, un color asociado a la energía, la felicidad y el dinamismo. Poco después decidimos que al naranja le acompañaría un verde turquesa, similar a su color complementario, y un rojo coral, además del azul marino.

Los colores primarios de Poketit son naranja, verde y rojo. Están presentes en la pantalla principal y en la primera pantalla de todas. Una vez exploras los otros apartados de la app, descubres que cada uno de los colores se corresponde a un apartado: Rojo para ideas, naranja para recompensas y verde para perfil.

A su vez, como colores secundarios, utilizamos los primarios con una opacidad del 60%. Los podemos encontrar en los fondos de las ilustraciones sobre todo.

El azul marino se ha utilizado como color neutro para los textos. Y, otro color que también está muy presente en toda la aplicación, es el blanco. El fondo blanco ayuda a que los elementos respiren y además ayuda a captar la atención de los usuarios.

• Tipografía

Como contrapunto a la atmósfera tan colorida que habíamos creado, elegimos la fuente Roboto, sencilla y sin serifas, de manera que fuera legible para los usuarios.

• Ilustraciones

Para mantener la estética divertida, optamos por utilizar ilustraciones en lugar de imágenes. Las ilustraciones las sacamos de icons8.com, pero las creamos nosotros mediante el Vector Creator, en estilo “Flame”.

• Iconografía

Los iconos utilizados en la aplicación, son de creación propia, ya que queríamos que estuvieran ligados a la tipografía. Que fueran de contorno fino y que solo se rellenaran los iconos que estuvieran en la barra de navegación cuando estuviéramos en la pantalla seleccionada.

• Design system

Nuestro sistema de diseño está basado en el Atomic Design y por ello creamos un sistema de componentes sólido y con multitud de variaciones que se adaptase fácilmente a los distintos apartados de la app.

Modelo de negocio

En Poketit intervienen básicamente tres actores:

• Los partners, que son esos establecimientos que ofrecen las recompensas en forma de descuentos, “2x1 o clases de prueba gratuitas”, al igual que los que aparecen en el apartado “corre que vuela”, publicitándose así.
• Los usuarios, que son los que finalmente van a canjear esas recompensas o a realizar las actividades del apartado “corre que vuela”.
• La propia app de Poketit, que es la que funciona como conexión entre estos establecimientos y los usuarios.

En definitiva, nosotros acercamos estas ofertas y sugerencias a los usuarios, favoreciendo el consumo de productos de estas empresas. De manera que, encontramos un modelo de negocio donde, como hemos mencionado, conectamos usuarios y empresas, y en el que nosotros nos llevamos una parte de las ganancias y la publicidad que aparece en la app.

Conclusiones

Creemos que con Poketit llegamos a cumplir los objetivos que nos marcamos:

• Concienciamos al usuario del uso que hace del móvil y conseguimos alejarlo un poco de este.
• Logramos que se centre en lo que realmente le gusta hacer ofreciéndole planes y recompensas acorde a sus gustos.
• Después de un tiempo utilizando la app el usuario se sentirá más motivado y mejor consigo mismo.

Porque en Poketit somos conscientes de que la tecnología no es nuestra enemiga, si no nuestra aliada para facilitarnos la vida e incluso para desconectar.
Nuestra idea es entrar en el sistema para cambiarlo.

Gracias

UXER SCHOOL nos ha guiado desde el principio enseñándonos de cero todo el proceso inicial de research hasta el momento de ver nuestro prototipo final formado. Por eso queremos dar las gracias a todos los mentores que han pasado por el bootcamp, porque también son parte de este proyecto. Han sido casi tres meses muy enriquecedores y no podemos estar más orgullosos del resultado.