Conozco lo mucho que disfrutás juntándote con tus amigos a ver los partidos de tu club o de tu selección, y también sé que es complicado encontrar un lugar donde se sientan cómodos para verlos.

Es por ello que diseñé Findbar, una app que te permite buscar y reservar en bares o restaurantes donde transmiten partidos de fútbol.

Findbar es ideal para que todos los hinchas que quieran reunirse a alentar a su club, encuentren fácilmente un lugar acorde a sus gustos y puedan disfrutar al máximo el partido.

Problema

En un país tan futbolero como el nuestro, es muy común que grupos de amigos, familiares y hasta conocidos se reúnan a ver un partido. Lo hacen en casas, restaurantes y bares. Es difícil encontrar un lugar donde las personas se sientan a gusto, transmitan el partido que quieren ver y haya mesas disponibles.

Propuesta

Un producto digital que permita buscar en un área delimitada un bar o restaurante que transmita los partidos. Que además proporcione información referida a la forma de emisión del partido y del bar en general, permitiendo realizar reservas desde la misma aplicación.

Con findbar vas a poder:

🔎 Buscar por ubicación, zona o establecimiento

✔️ Filtrar por partido

📆 Reservar en simples pasos

📱 Validar tu reserva mediante un QR y disfrutar!

MVP

Funcionalidades principales:

👉 Buscar: Bares o restaurantes que transmitan partidos, pudiendo buscarlos por ubicación cercana, dirección o por partido que transmiten.

👉 Reservar: Poder realizar reservas en esos bares o restaurantes directamente desde la aplicación.

👉 Brindar información: Sobre los establecimientos, como rango de precios, tipo de comida/bebida, horarios, forma de transmitir el partido.

👉 Calificación/Opiniones: Los usuarios podrán calificar a los establecimientos y dejar su opinión.

👉 Historial de reserva/favoritos: Los usuarios podrán consultar los lugares que reservaron previamente y marcar sus establecimientos favoritos.

Segunda versión:

👉 Nuevos filtros de búsqueda: Si tienen pantalla o televisor, si dan el partido con sonido o ponen música, si van mas hinchas de un club en particular.

👉 Descuentos y promociones: Los usuarios podrán acceder a diferentes beneficios por utilizar la aplicación.

Usuarios

Para conocer las motivaciones, frustraciones y necesidades de nuestros potenciales usuarios, se realizaron entrevistas cualitativas.

🧍 Fueron entrevistadas 3 personas
📋 El cuestionario fue semi-estructurado

A modo de síntesis, los resultados fueron volcados en un mapa de empatía

Qué piensa y siente

• Quiere poder estar 100% concentrado en el partido
• Quiere estar cómodo viendo el partido
• Le gusta que se viva clima de cancha en los bares

Qué dice y hace

• Ve partidos de fútbol de su equipo
• Ve partidos de otros equipos o de la selección si son importantes
• Ve algunos partidos de Europa

Qué lo frustra

• Qué los lugares que dan partidos, pasen música en vez del relato del partido
• Qué no se vea bien el partido desde el ubicación que quedó disponible en el bar
• Tener que contactarse telefónicamente para reservar
• Que haya muchos monitores dando el partido

Qué lo motiva

• Bares identificados con un equipo, que mayoritariamente vayan hinchas de ese club a ese bar
• Que el lugar tenga un whatsapp para realizar la reserva
• Ver partidos en una pantalla con proyector

En base a la información recopilada, se diseñó el user persona

Cardsorting

Se realizó un card sorting abierto para conocer el mapa mental de los posibles usuarios de la aplicación. Se eligió la modalidad abierto para evitar influenciar en la mente de los participantes y así poder descubrir cuales serían las mejores categorías a utilizar.

Matrix de similitud

Las mayores agrupaciones se dieron entre:

“Mis Reservas” y “Favoritos”
“Mis Reservas” y “Datos Personales”
“Favoritos” y “Datos Personales”
"Preguntas frecuentes" y "Contáctenos"

Por otro lado, se puede observar que las siguientes categorías muestran bastante coincidencias entre ellas:

"Mapa" - "Tipo de comida/bebida" - "Rango de precios" - "Partidos que transmiten" - "Descuentos y promocione" - "Reservar mesa" - "Calificaciones y opiniones" - "Buscar"

Dendrograma AAM

*“Reservar mesa” en la arquitectura final no fue incluida como parte de esta subcategoría, sino como una diferente, ya que si observamos los nombres de las categorías en las que esta tarjeta fue agrupada, hay una leve tendencia a colocarla dentro reservar.

Arquitectura de la información

Después de realizar el cardsorting, se armó la arquitectura de la información en base a los resultados obtenidos.

Userflow

Una vez definida la arquitectura, se diseñó el userflow para la funcionalidad principal de la aplicación: reservar mesa en un establecimiento donde pasen el partido que el usuario busca ver.

Wireframes

En baja

En media

En este punto, se realizó un prototipo funcional para poder testear el diseño de la aplicación y realizar los cambios, en caso de que fuera necesario, en una fase temprana del proceso de diseño.

Pruebas de usabilidad

Para poder evaluar la usabilidad de la app, se realizó un testeo moderado a distancia.

🧍 Participaron 5 usuarios
📋 Realizaron 1 tarea
📱 Se utilizó un prototipo funcional en media

Tarea para los usuarios:

Usando la app, busca un bar donde den el superclásico y reserva una mesa para vos y tus dos amigos*

*Debido a que las primeras dos personas testeadas realizaron la reserva en el bar sugerido en el home, sin utilizar la búsqueda, se modificó la tarea para los siguientes usuarios. La misma pasó a ser: Usando la opción de búsqueda, encontra un bar donde den el superclásico y reserva una mesa para vos y tus dos amigos.

Criterio de éxito:

• Que el usuario realice una reserva para 3 personas en un bar, llegando a la página de confirmar la reserva
• Que el usuario entienda que realizó la tarea correctamente
• Que el usuario utilice la búsqueda de la aplicación

Resultados:

Lo que funcionó:

👉Iniciar sesión / registrarse no presentó problemas para ningún usuario
👉El proceso de reserva es intuitivo y fácil de realizar
👉5 de 5 usuarios lograron reservar con éxito

Lo que NO funcionó:

👉La barra de búsqueda pasa desapercibida a primera vista de los usuarios. Tienden a fijar la mirada en la información del partido y luego bajar al sector de “Dónde verlos”
👉El botón de filtros no se encuentra a simple vista
👉La información de partidos del día confundió a los usuarios, creyendo que era una forma de filtrar establecimientos

Conclusiones:

A partir de los resultados obtenidos de las pruebas de usabilidad, podemos concluir que la funcionalidad principal del prototipo desarrollado (reservar en bar/restaurante) se ejecuta sin mayores inconvenientes. Por lo que los wireframes destinados exclusivamente a esta función, no necesitan ningún cambio significativo.

Sin embargo, la función de búsqueda presentó ciertas complicaciones a los usuarios. En primer lugar, la barra de búsqueda en el HOME no llama la atención, los usuarios pasan la vista de largo y en una segunda mirada la encuentran. Una vez dentro de la búsqueda, el ícono de filtros también generó ciertas complicaciones, algunos usuarios no lograron encontrarlo a simple vista.

Dentro del HOME, además del inconveniente con la barra de búsqueda, el apartado informativo sobre los partidos de la fecha generó confusión, los usuarios intentaron utilizarlo como forma de búsqueda, tocando sobre un partido y esperando que los lleve a una lista de establecimientos donde se emitiera ese partido.

Y por último, el sector de lugares sugeridos llamó más la atención de los usuarios que la búsqueda. Qué en sí no es un problema significativo, siempre y cuando la barra de búsqueda sea visible en una mirada rápida. 

Wireframes

En media con modificaciones

A partir de las conclusiones obtenidas en la prueba de usabilidad, se rediseñaron los wireframes. Teniendo en cuenta las dificultades de los usuarios para encontrar la barra de búsqueda y el ícono de filtros en una primera mirada, se les otorgó una mayor jerarquía a los mismos.

En cuanto al apartado informativo sobre los partidos de la fecha, se le otorgó a esta sección la funcionalidad esperada por los usuarios.

UI kit

Colores

Tipografía

Iconografía

Botones

Top bar

Bottom navigation

Campos de texto

Cards

Wireframes en alta

Gracias por leer!