Con el avance digital y el crecimiento del e-commerce, los consumidores están cambiando sus hábitos de compra, prefiriendo hacerlas online y recibir sus productos en casa. Las aplicaciones de supermercados se han vuelto esenciales en la industria de alimentos y consumo masivo.
Con el avance digital y el crecimiento del e-commerce, los consumidores están cambiando sus hábitos de compra, prefiriendo hacerlas online y recibir sus productos en casa. Las aplicaciones de supermercados se han vuelto esenciales en la industria de alimentos y consumo masivo.
Problema
Problema
La aplicación actual de Carrefour se enfoca en mejorar la experiencia en tienda, pero no permite realizar pedidos online. Esto deja sin cubrir la creciente demanda de clientes que buscan la comodidad de comprar desde casa.
La aplicación actual de Carrefour se enfoca en mejorar la experiencia en tienda, pero no permite realizar pedidos online. Esto deja sin cubrir la creciente demanda de clientes que buscan la comodidad de comprar desde casa.
Solución
Solución
Este proyecto busca desarrollar una app de Carrefour que brinde una experiencia de compra online completa donde los usuarios puedan hacer sus compras desde su celular, alineada con las necesidades actuales del usuario digital.
Este proyecto busca desarrollar una app de Carrefour que brinde una experiencia de compra online completa donde los usuarios puedan hacer sus compras desde su celular, alineada con las necesidades actuales del usuario digital.
Benchmarking
Para comprender mejor nuestra posición frente a la competencia, analizamos reseñas de usuarios de las aplicaciones de supermercado más reconocidas a través de la App Store y Google Play. Esto nos permitió identificar sus puntos fuertes y áreas de mejora desde la perspectiva del cliente.
La navegación es poco intuitiva y requiere varios pasos para encontrar productos específicos.
Día Online ofrece descuentos y beneficios exclusivos para sus clientes online.
A continuación, resumimos los hallazgos clave de cada competidor basados en nuestro research:
La navegación es poco intuitiva y requiere varios pasos para encontrar productos específicos.
Día Online ofrece descuentos y beneficios exclusivos para sus clientes online.
Mala disponibilidad
Usuarios frustrados
La plataforma es lenta y a menudo presenta errores durante el proceso de compra.
Coto tiene una amplia cobertura de entrega en varias localidades, lo que lo hace accesible para muchos usuarios en diferentes zonas.
A continuación, resumimos los hallazgos clave de cada competidor basados en nuestro research:
¡Hace click!
La navegación es poco intuitiva y requiere varios pasos para encontrar productos específicos.
Día Online ofrece descuentos y beneficios exclusivos para sus clientes online.
Mala disponibilidad
Usuarios frustrados
La plataforma es lenta y a menudo presenta errores durante el proceso de compra.
Coto tiene una amplia cobertura de entrega en varias localidades, lo que lo hace accesible para muchos usuarios en diferentes zonas.
A continuación, resumimos los hallazgos clave de cada competidor basados en nuestro research:
¡Hace click!
Proceso de diseño
Tomé la decisión de utilizar el Design Thinking como proceso de diseño, ya que me veo familiarizado con la iteración y la idea de ir y volver a distintas etapas del proceso cuando lo requiera
Empatizar
Empatizar
Nuestra primera actividad en el proceso de empatizar fue ponernos en contacto con los usuarios que hacen las compras de supermercado en sus respectivos hogares.
Entrevistas de usuarios
Entrevistas a usuarios
3 hombres y 3 mujeres
18-23 años
23-35 años
35+ años
Edades de participantes
Participantes que habían hecho sus compras virtuales
30 MINS
Duración de las entrevistas
¿Que nos dijeron los usuarios?
¿Qué nos dijeron los usuarios?
Transcribimos las entrevistas y recogimos las citas que nos brindaban los insights más valiosos.
Notamos que el tiempo, el dinero y la experiencia eran pilares fundamentales en las entrevistas, y sabíamos que ibamos a tener que responder a estas necesidades en el futuro.
“A veces uno se sorprende con lo que puede salir un changuito y si haces esa compra, queres que salga bien. Quizás no te asegura eso algo online hoy en día.”
“A veces uno se sorprende con lo que puede salir un changuito y si haces esa compra, queres que salga bien. Quizás no te asegura eso algo online hoy en día.”
“A veces uno se sorprende con lo que puede salir un changuito y si haces esa compra, querés que salga bien. Quizás no te asegura eso algo online hoy en día.”
“Me parece que lo mejor es que brinden un soporte.”
“Me parece que lo mejor es que brinden un soporte.”
“Mejorar la logística y a la coordinación de la entrega, del envío.”
“Mejorar la logística y a la coordinación de la entrega, del envío.”
“Mi mamá se fija muchísimo en los precios”
“Mi mamá se fija muchísimo en los precios”
“Me cuesta mucho llevar los gastos y esas cosas.”
“Me cuesta mucho llevar los gastos y esas cosas.”
“Depende de donde te quede el supermercado gastas nafta, eso es una gran contra.”
“Depende de donde te quede el supermercado gastas nafta, eso es una gran contra.”
“Hoy en día es ir por la opción más rentable para cada familia”
“Hoy en día es ir por la opción más rentable para cada familia”
“Mis papás hacían pedidos y no había nadie en casa para recibirlo.. muchas veces tuvimos lío en la coordinación de quién recibe el pedido”
“Mis papás hacían pedidos y no había nadie en casa para recibirlo.. muchas veces tuvimos lío en la coordinación de quién recibe el pedido”
“Muchas veces nos ha pasado que quizás llegaban abollados.. Me acuerdo que nos vinieron bolsas de arroz rotas”
“Muchas veces nos ha pasado que quizás llegaban abollados.. Me acuerdo que nos vinieron bolsas de arroz rotas”
Notamos que el tiempo, el dinero y la experiencia eran pilares fundamentales en las entrevistas, y sabíamos que ibamos a tener que responder a estas necesidades en el futuro.
Clustering
El siguiente paso fue encontrar patrones y tendencias dentro de las citas para así dividirlas en categorías.
Hábitos
"Me importa mas la calidad que el precio"
“Me cuesta mucho llevar los gastos y esas cosas.”
"Si voy y toco los duraznos o las peras y si están hechas una piedra, ni compro"
"No siempre voy necesariamente al que tengo más cerca, sino por donde ando"
“Una vez por semana solemos tener que ir porque a veces consumimos mucho”
Delivery
“Mejorar la logística y la coordinación de la entrega, del envío.”
“Mis papás hacían pedidos y no había nadie en casa para recibirlo.. muchas veces tuvimos lío en la coordinación de quién recibe el pedido”
“Te lo traen a tu casa y creo que es un proceso más rápido.”
"Muchas veces nos ha pasado que quizás llegaban abollados.. Me acuerdo que nos vinieron bolsas de arroz rotas"
Experiencia
“Odio comerme una fila larga de personas para comprar.”
"Lo que tiene también de desventaja la compra online es que capaz te dicen que llega en un momento específico y vos tenes que si o si estar en tu casa"
"Tuve una muy mala experiencia con la pagina web de Carrefour entonces no me quiero ni imaginar lo que debe ser la aplicación"
“El estacionar, entrar, buscar, hacer la cola para la caja, y volver toma mucho tiempo”
Decidimos categorizarlas en hábitos, delivery y experiencia porque vimos que dentro de estas categorías existen insights accionables que pueden aportar un gran valor en la etapa de prototipado para justificar nuestras decisiones de diseño.
Conclusiones: Empatía
Conclusiones: Empatía
Estamos satisfechos con el proceso de la etapa de empatizar, ya que logramos obtener insights que reflejan los puntos de dolor y las necesidades del usuario, lo que constituye una base fundamental para las siguientes fases del diseño.
Estamos satisfechos con el proceso de la etapa de empatizar, ya que logramos obtener insights que reflejan los puntos de dolor y las necesidades del usuario, lo que constituye una base fundamental para las siguientes fases del diseño.
User Personas
Una vez que terminamos con las entrevistas, realizamos un total de 2 User Personas y sus POV's a través del clustering.
Ambas User Personas intentan agrupar las diferentes necesidades, frustraciones y hábitos que existen en las personas que entrevistamos.
"Como madre con problemas economicos necesito hacer mis compras de una manera eficiente porque necesito optimizar al máximo cada peso que gasto"
"Como un padre trabajador necesito un proceso intuitivo y ágil porque no tengo el tiempo suficiente"
"Como madre con problemas economicos necesito hacer mis compras de una manera eficiente porque necesito optimizar al máximo cada peso que gasto"
"Como un padre trabajador necesito un proceso intuitivo y ágil porque no tengo el tiempo suficiente"
Empatía: Conclusiones
Estamos satisfechos con el proceso de la etapa de empatizar, ya que logramos obtener insights que reflejan los puntos de dolor y las necesidades del usuario, lo que constituye una base fundamental para las siguientes fases del diseño.
Ambas User Personas intentan agrupar las diferentes necesidades, frustraciones y hábitos que existen en las personas que entrevistamos.
"Como madre con problemas economicos necesito hacer mis compras de una manera eficiente porque necesito optimizar al máximo cada peso que gasto"
"Como un padre trabajador necesito un proceso intuitivo y ágil porque no tengo el tiempo suficiente"
Definir
Definir
En la etapa de definir vamos a profundizar sobre el problema haciendo testeos de usabilidad morderados con participantes y con las 10 heurísticas de Jakob Nielsen.
Pruebas de usabilidad
Decidimos comenzar a evaluar a la aplicación actual de Carrefour, y para ello realizamos una prueba de usabilidad a cada uno de los 6 participantes.
Hipótesis: Creemos que los usuarios van a poder realizar las tareas que se encuentran dentro de la aplicación con facilidad, mientras que las tareas que redireccionan al usuario a la web van a tener una complejidad significante para los usuarios.
Objetivo: Revelar cualquier defecto en el flujo de las tareas principales de los usuarios en la aplicación de Carrefour.
Las tareas que le dimos a los usuarios:
Tarea #1
Contexto: "Recién te descargaste la app y necesitas crearte una cuenta."
Tarea: "Crea tu cuenta"
AVG. Duración
6m y 45s
No terminó
33%
Tarea #2
Contexto: "Estás haciendo la fila del supermercado un día de la semana y querés fijarte a través de la aplicación si hay algún descuento disponible con una de tus tarjetas mi Carrefour."
Tarea: "Fijarse los descuentos de la app"
AVG. Duración
2m
No terminó
0%
Tarea #3
Contexto: "Estás finalizando tus compras y querés mostrarle al empleado el código QR de uno de los cupones que ofrece la aplicación de Mi Carrefour."
Tarea: "Utilizar un cupón"
AVG. Duración
50s
No terminó
0%
Tarea #4
Contexto: "Estás en tu casa y quieres encontrar la sucursal de Carrefour más cercana a través de la aplicación."
Tarea: "Encontrar la dirección de la sucursal más cercana."
AVG. Duración
45s
No terminó
0%
Tarea #5
Contexto: "Tuviste un inconveniente durante el uso de la app y decidiste que querés dejar un comentario, un poco de feedback sobre tu problema. "
Tarea: "Dejar un comentario sobre la app desde la app"
AVG. Duración
45s
No terminó
0%
Tarea #6
Contexto: "Estás en el Carrefour de Tortuguitas y necesitas saber el precio de un ítem que estas viendo en el supermercado."
Tarea: "Que la app acceda a la camara"
AVG. Duración
1m
No terminó
0%
Tarea #7
Contexto: " Estás en tu casa y decidís desde la aplicación comprar las cosas esenciales que te faltan como 2 litros de leche, 2 potes de crema, 2 panes de manteca y 2 botellas de Coca Cola."
Tarea: "Que la app acceda a la camara"
AVG. Duración
6m
No terminó
20%
Tarea #8
Contexto: "Te hackearon tu mail y debido a tu preocupación por la situación ahora queres cambiar el mail de tu cuenta."
Tarea: "Editar la información de tu perfil"
AVG. Duración
1m 20s
No terminó
20%
Tarea #1
Contexto: "Recién te descargaste la app y necesitas crearte una cuenta."
Tarea: "Crea tu cuenta"
AVG. Duración
6m y 45s
No terminó
33%
Tarea #2
Contexto: "Estás haciendo la fila del supermercado un día de la semana y querés fijarte a través de la aplicación si hay algún descuento disponible con una de tus tarjetas mi Carrefour."
Tarea: "Fijarse los descuentos de la app"
AVG. Duración
2m
No terminó
0%
Tarea #3
Contexto: "Estás finalizando tus compras y querés mostrarle al empleado el código QR de uno de los cupones que ofrece la aplicación de Mi Carrefour."
Tarea: "Utilizar un cupón"
AVG. Duración
50s
No terminó
0%
Tarea #4
Contexto: "Estás en tu casa y quieres encontrar la sucursal de Carrefour más cercana a través de la aplicación."
Tarea: "Encontrar la dirección de la sucursal más cercana."
AVG. Duración
45s
No terminó
0%
Tarea #5
Contexto: "Tuviste un inconveniente durante el uso de la app y decidiste que querés dejar un comentario, un poco de feedback sobre tu problema. "
Tarea: "Dejar un comentario sobre la app desde la app"
AVG. Duración
45s
No terminó
0%
Tarea #6
Contexto: "Estás en el Carrefour de Tortuguitas y necesitas saber el precio de un ítem que estas viendo en el supermercado."
Tarea: "Que la app acceda a la camara"
AVG. Duración
1m
No terminó
0%
Tarea #7
Contexto: " Estás en tu casa un lunes después de trabajar/estudiar (vivís en Belgrano), no tenes tiempo ni ganas de ir al supermercado entonces decidís desde la aplicación comprar las cosas esenciales que te faltan como 2 litros de leche, 2 potes de crema, 2 panes de manteca y 2 botellas de Coca Cola."
Tarea: "Que la app acceda a la camara"
AVG. Duración
6m
No terminó
20%
Tarea #8
Contexto: "Te hackearon tu mail y debido a tu preocupación por la situación ahora queres cambiar el mail de tu cuenta."
Tarea: "Editar la información de tu perfil"
AVG. Duración
1m 20s
No terminó
20%
¿Cual fue el feedback?
¿Cuál fue el feedback?
"Crearme una cuenta me llevó mucho tiempo."
"Hacer la compra del producto no fue fácil."
"Registrarme fue muy frustrante."
"Debería estar todo concentrado en la app."
"Loguearse. No por lo complicada sino porque provoca fastidio."
En base a esta prueba de usabilidad podemos destacar las innumerables fricciones que se le presentan al usuario al realizar las tareas principales de la aplicación. Tareas como la creación de la cuenta tardan en promedio 6 minutos y 45, lo que es suficiente como para que el usuario se frustre y Carrefour pierda a un potencial cliente.
En base a esta prueba de usabilidad podemos destacar las innumerables fricciones que se le presentan al usuario al realizar las tareas principales de la aplicación. Tareas como la creación de la cuenta tardan en promedio 6 minutos y 45, lo que es suficiente como para que el usuario se frustre y Carrefour pierda a un potencial cliente, lo cual se ve reflejado en el feedback, en donde los participantes expresaron su frustración.
¿La app ofrece una experiencia de usuario óptima?
Utilizamos las 10 heurísticas de Jakob Nielsen para evaluar la experiencia del usuario en la navegación de la app actual:
Coincidencia entre sistema y mundo real
1
Los iconos no son del todo reconocibles, aunque cada uno tiene un texto debajo que deja claro la funcionalidad del botón.
El icono de "Preguntas frecuentes" no es habitual.
Visibilidad y estado de sistema
0
La app le da feedback al usuario sobre sus acciones dentro de la app.
Mensaje de éxito una vez que se manda una consulta.
Control y libertad del usuario
3
El usuario puede salir de todos los estados, pero cabe destacar que el usuario es re dirigido a la página web de carrefour sin su consentimiento.
Flechas en la parte superior izquierda para volver atrás de cualquier pantalla.
Consistencia y estándares
3
Existe un estilo y diseño consistente entre las pantallas de la app, pero cuando se integra la app con el sitio web surgen problemas de inconsistencia.
2 flechas para atrás en la parte superior izquierda, confundiendo al usuario.
Prevención de errores
1
En varias funcionalidades de la app, la misma le comunica al usuario de posibles errores.
Mensaje que indica que si el usuario ya canjeo un cupón, no lo puede utilizar una segunda vez.
Mostrar en lugar de recordar
1
Aunque no existe un historial para cupones, la app intenta de ayudar al usuario en diferentes acciones.
2 ejemplos que ayudan al usuario a reducir su carga cognitiva en su navegación.
Flexibilidad y eficiencia de uso
3
La eficiencia del proceso de compra no es ideal, el usuario debe iniciar sesión 2 veces, en la app y web.
Si el usuario se equivoca 5 veces en su contraseña el flujo se retrasa por 1 hora, afectando su proceso.
Diseño estético y minimalista
2
El diseño en la app es simple, pero existen elementos en la app y la web donde no son del todo legibles.
Imágenes promocionales con texto pequeño.
Ayudar a reconocer y recuperarse de errores
3
La app no avisa con frecuencia los errores del usuario, y cuando lo hace, lo hace de una manera confusa.
¿Producto sin disponibilidad y/o vuelvo a seleccionar la forma de entrega?
Ayuda y documentación
1
Existen 2 métodos de comunicarse con la app a través del soporte y consultas, y también hay un documento de "Preguntas frecuentes"
"Preguntas Frecuentes" es un documento sin índice ni categorías, aumentando la carga cognitiva.
Coincidencia entre sistema y mundo real
1
Los iconos no son del todo reconocibles, aunque cada uno tiene un texto debajo que deja claro la funcionalidad del botón.
El icono de "Preguntas frecuentes" no es habitual.
Visibilidad y estado de sistema
0
La app le da feedback al usuario sobre sus acciones dentro de la app.
Mensaje de éxito una vez que se manda una consulta.
Control y libertad del usuario
3
El usuario puede salir de todos los estados, pero cabe destacar que el usuario es re dirigido a la página web de carrefour sin su consentimiento.
Flechas en la parte superior izquierda para volver atrás de cualquier pantalla.
Consistencia y estándares
3
Existe un estilo y diseño consistente entre las pantallas de la app, pero cuando se integra la app con el sitio web surgen problemas de inconsistencia.
2 flechas para atrás en la parte superior izquierda, confundiendo al usuario.
Prevención de errores
1
En varias funcionalidades de la app, la misma le comunica al usuario de posibles errores.
Mensaje que indica que si el usuario ya canjeo un cupón, no lo puede utilizar una segunda vez.
Mostrar en lugar de recordar
1
Aunque no existe un historial para cupones, la app intenta de ayudar al usuario en diferentes acciones.
2 ejemplos que ayudan al usuario a reducir su carga cognitiva en su navegación.
Flexibilidad y eficiencia de uso
3
La eficiencia del proceso de compra no es ideal, el usuario debe iniciar sesión 2 veces, en la app y web.
Si el usuario se equivoca 5 veces en su contraseña el flujo se retrasa por 1 hora, afectando su proceso.
Diseño estético y minimalista
2
El diseño en la app es simple, pero existen elementos en la app y la web donde no son del todo legibles.
Imágenes promocionales con texto pequeño.
Ayudar a reconocer y recuperarse de errores
3
La app no avisa con frecuencia los errores del usuario, y cuando lo hace, lo hace de una manera confusa.
¿Producto sin disponibilidad y/o vuelvo a seleccionar la forma de entrega?
Ayuda y documentación
1
Existen 2 métodos de comunicarse con la app a través del soporte y consultas, y también hay un documento de "Preguntas frecuentes"
"Preguntas Frecuentes" es un documento sin índice ni categorías, aumentando la carga cognitiva.
Resulta que hay varios aspectos de la app que se pueden mejorar para establecer una navegación fluida y accesible para todos los usuarios, esto se relaciona con las experiencias frustrantes que tuvieron los entrevistados, ya que la app no cumple con la mayoría de principios de accesibilidad y experiencia de usuario según Nielsen.
Problem Statement
Para hacer el problema más útil y práctico, optamos por formular tres problem statements basados en nuestras protopersonas, utilizando la metodología How Might We…?
Preferencias del usuario
¿Como podríamos garantizar que el estado de las verduras y carnes sea de la preferencia del usuario?
Navegación fluida
¿Como podríamos construir una interfaz que sea intuitiva para que la puedan navegar usuarios de todas las edades?
Aumentar ahorro
¿Como podríamos optimizar el proceso de hacer compras para ahorrar tiempo y dinero?
Navegación fluida
¿Como podríamos construir una interfaz que sea intuitiva para que la puedan navegar usuarios de todas las edades?
Aumentar ahorro
¿Como podríamos optimizar el proceso de hacer compras para ahorrar tiempo y dinero?
Preferencias del usuario
¿Como podríamos garantizar que el estado de las verduras y carnes sea de la preferencia del usuario?
Conclusiones: Definir
Conclusiones: Definir
Definir: Conclusiones
Logramos capturar varios puntos de mejoras con los cuales trabajar gracias a las diferentes métricas que obtuvimos con las pruebas y el feedback cualitativo, creo que logramos obtener problemas bien definidos y accionables.
Logramos capturar varios puntos de mejoras con los cuales trabajar gracias a las diferentes métricas que obtuvimos con las pruebas y el feedback cualitativo, creo que logramos obtener problemas bien definidos y accionables.
Ideación: Conclusiones
Pudimos validar de una manera profunda la arquitectura de la información tendiendo en cuenta los insights que obtuvimos de los diferentes participantes, lo que nos aporta una base esencial para seguir avanzando en el proceso.
Idear
En la etapa de ideación, nos enfocamos en generar ideas para resolver el problema que definimos. Acá creamos el flujo de tareas de usuario y la arquitectura de información, organizando cómo navegan los usuarios por la aplicación.
User Task Flow
Decidimos plasmar el Task Flow para darnos una idea de los posibles puntos de fricción en el proceso de compra.
Arquitectura de la información
Arquitectura de la información
Es importante evaluar la arquitectura de la información para dejar en evidencia errores profundos en la navegación del usuario, para ello hacemos uso de Card Sorting la cual nos brinda la matriz de similitud y un dendrograma para finalmente armar el sitemap ideal.
Card Sorting
Hicimos un Card Sorting con los 6 entrevistados para evaluar la arquitectura de la información.
El card sorting no nos aportó insights muy valiosos, pero entendimos que funcionalidades incluir en la página de "Perfil".
Matriz de similitud
El dendrograma nuevamente nos ayuda a construir las funcionalidades incluidas en la página del perfil del usuario y al mismo tiempo nos ayudó a afrontar la granularidad de la arquitectura de la información, tomando la decisión de agrupar "Promociones", "Producto favorito del mes" y los cupones todo en una misma página llamada "Cupones".
El card sorting no nos aportó insights muy valiosos, pero entendimos que funcionalidades incluir en la página de "Perfil".
Dendrograma
El dendrograma nuevamente nos ayuda a construir las funcionalidades incluidas en la página del perfil del usuario y al mismo tiempo nos ayudó a afrontar la granularidad de la arquitectura de la información, tomando la decisión de agrupar "Promociones", "Producto favorito del mes" y los cupones todo en una misma página llamada "Cupones".
En base a los resultados del dendrograma y la matriz de similitud, nos imaginamos que el sitemap quedaría así:
Decidimos dividir el sitemap entre funcionalidades y pantallas para expandir nuestras ideas de lo que pensabamos que era correcto poner en cada pantalla en base a la información que obteníamos de los usuarios.
Conclusiones: Idear
Conclusiones: Idear
Pudimos validar de una manera profunda la arquitectura de la información tendiendo en cuenta los insights que obtuvimos de los diferentes participantes, lo que nos aporta una base esencial para seguir avanzando en el proceso.
Pudimos validar de una manera profunda la arquitectura de la información tendiendo en cuenta los insights que obtuvimos de los diferentes participantes, lo que nos aporta una base esencial para seguir avanzando en el proceso.
Prototipar
En la etapa de prototipado, transformamos las ideas en algo tangible. Creamos prototipos de baja y alta fidelidad, como también un UI KIT en el cual incluimos la paleta de colores, tipografía y espaciado para dar vida al diseño. Acá es donde el producto empieza a tomar forma.
En la etapa de prototipado, transformamos las ideas en algo tangible. Creamos prototipos de baja, mediana y alta fidelidad, como también un UI KIT en el cual incluimos la paleta de colores, tipografía y espaciado para dar vida al diseño. Acá es donde el producto empieza a tomar forma.
Crazy Eight (Baja fidelidad)
En el principio del proceso de la etapa de prototipado decidimos hacer un crazy eight con nuestras excelentes habilidades ilustrativas… Esto nos ayudó a poder iterar de manera rápida, haciendo Brain Storming de las diferentes pantallas y funcionalidades que nos gustaría ver en nuestro prototipo, algo así como fallar rápido y barato.
Mediana fidelidad
Desarrollamos el primer prototipo en media para darnos una idea de lo que queríamos que sea el producto final.
Tuvimos que ser muy creativos ya que la aplicación original de Carrefour no tiene un proceso de compra integrado en la app.
Alta fidelidad
El prototipo en alta es donde aplicamos el diseño estético gracias al UI Kit, utilizando los distintos colores, tipografías y componentes necesarios.
Prototipo en alta
Pantalla de inicio
Detalle de producto
¡Pedido confirmado!
Perfil
Soporte
Detalle de compra
Mis Listas
Nueva lista
Tu Carrito
Cupones
Perfil - Tus tarjetas
Estado de tu pedido
Pantalla de inicio
Detalle de producto
¡Pedido confirmado!
Perfil
Soporte
Detalle de compra
Mis Listas
Nueva lista
Tu Carrito
Cupones
Perfil - Tus tarjetas
Estado de tu pedido
El producto final ofrece una navegación híbrida, donde el usuario puede navegar con scroll horizontal y vertical, formando una experiencia del usuario ágil.
El enfoque esta en incrementar la interacción con el usuario de una manera intuitiva y dinámica.
Interacciones
Pantalla de producto
Pantalla de inicio
Como vemos en el vídeo, el diseño está orientado a que el usuario tenga una experiencia interactiva, de manera que el usuario pueda, en la misma página del producto, guardar el producto con un like, compartirlo con su familia o amigos, ¡incluso interactuar con la comunidad a través de reseñas!
Como vemos en el vídeo, el diseño está orientado a que el usuario tenga una experiencia interactiva, de manera que el usuario pueda, en la misma página del producto, guardar el producto con un like, compartirlo con su familia o amigos, ¡incluso interactuar con la comunidad a través de reseñas!
Pantalla de producto
Como mencioné previamente, el enfoque en la pantalla de inicio es que el usuario pueda navegar de una manera que mejore su experiencia de usuario, a través de categorías nombradas, escaneando el contenido de la pantalla inicial de una manera rápida y eficiente.
Al mismo tiempo, incorporamos patrocinadores, como por ejemplo Bimbo, para generar una nueva fuente de ingresos para la app, a través de posicionamiento y exposición de marca, una decisión de diseño que aporta valor económico para la empresa.
Como mencioné previamente, el enfoque en la pantalla de inicio es que el usuario pueda navegar de una manera que mejore su experiencia de usuario, a través de categorías nombradas, escaneando el contenido de la pantalla inicial de una manera rápida y eficiente.
Al mismo tiempo, incorporamos patrocinadores, como por ejemplo Bimbo, para generar una nueva fuente de ingresos para la app, a través de posicionamiento y exposición de marca, una decisión de diseño que aporta valor económico para la empresa.
UI KIT
Paleta de colores
Tipografía
Ejemplo de paleta y espaciado
Ejemplo de paleta y espaciado
Estos ejemplos los hicimos como guías que pueden utilizar los desarrolladores para entender el uso de los colores y espaciados en las diferentes pantallas de los prototipos.
Ejemplo evolución de componentes
Ejemplo evolución de componentes
Conclusiones: Prototipo
Conclusiones: Prototipo
Hubo un enfoque muy grande en iterar constantemente en esta etapa más que en ningún otra, creímos que era de alta prioridad la experiencia del usuario en nuestros prototipos, intentando responder a todas las necesidades de los usuarios.
Hubo un enfoque muy grande en iterar constantemente en esta etapa más que en ningún otra, creímos que era de alta prioridad la experiencia del usuario en nuestros prototipos, intentando responder a todas las necesidades de los usuarios.
Testeo
En la etapa de testeo, ponemos el prototipo en manos de los usuarios para ver cómo interactúan con él. Realizamos pruebas de usabilidad una vez más y obtenemos feedback valioso, lo que nos ayuda a identificar mejoras y pulir detalles para asegurar una experiencia fluida y satisfactoria en el usuario.
Pruebas de usabilidad 2.0
Objetivo: Revelar cualquier defecto en el flujo de las tareas principales de los usuarios en el prototipo
Hipótesis: Creemos que los usuarios van a tardar menos en completar sus tareas que el primer testeo.
Hipótesis: Creemos que los usuarios van a tardar menos en completar sus tareas que el primer testeo.
Resultado:
Tarea #1
Contexto: Estás haciendo tus compras online y querés ver los detalles de un producto y luego agregarlo a tu carrito.
Tarea: "Agregá un producto a tu carrito desde el detalle del producto."
Direct Success
90.0%
No terminó
0%
AVG. Duration
19.9s
Misclick rate
29.7%
Tarea #2
Contexto: Ya incorporaste en tu carrito todos los productos que necesitabas, ahora querés ir a pagar los ítems del carrito.
Tarea: "Realiza el pago de los productos de tu carrito."
Direct Success
90.0%
No terminó
0%
AVG. Duration
15.4s
Misclick rate
5.9%
Tarea #3
Contexto: ¡Genial! Realizaste tu pedido y ahora te encuentras en la página de "Estado de tu pedido", pero no recordás si agregaste una pizza en el pedido que acabas de hacer.
Tarea: "Busca la manera de verificar si en tu pedido hubo una pizza."
Direct Success
90.0%
No terminó
0%
AVG. Duration
5.3s
Misclick rate
0%
Tarea #4
Contexto: Acabas de realizar tu pedido y te diste cuenta de que te cobraron más dinero de lo que decía al confirmar la compra, qué harías?
Tarea: "Utiliza los recursos de la app para poder resolver el problema que tenés."
Direct Success
55.6%
No terminó
0%
AVG. Duration
29.8s
Misclick rate
36.7%
Tarea #5
Contexto: Creaste una lista la semana pasada que se llama "Carnes y pescado", buscala y agrega la lista a tu carrito.
Tarea: "Agregá la lista a tu carrito."
Direct Success
100%
No terminó
0%
AVG. Duration
10.7s
Misclick rate
6.9%
Tarea #6
Contexto: Ahora tenés ganas de agregar una 2da tarjeta de crédito a tu cuenta, ¿Cómo lo harías?
Tarea: "Agregá una 2da tarjeta de crédito a tu cuenta."
Direct Success
88.9%
No terminó
0%
AVG. Duration
7.6s
Misclick rate
0%
Tarea #7
Contexto: Te contaron que podes usar promociones que tiene la app para obtener descuentos en los supermercados Carrefour, ¿Donde irías para activar esta promoción?
Tarea: "Activá un código de descuento."
Direct Success
77.8%
No terminó
0%
AVG. Duration
11.9s
Misclick rate
18.4%
Tarea #1
Contexto: Estás haciendo tus compras online y querés ver los detalles de un producto y luego agregarlo a tu carrito.
Tarea: "Agregá un producto a tu carrito desde el detalle del producto."
Direct Success
90.0%
No terminó
0%
AVG. Duration
19.9s
Misclick rate
29.7%
Tarea #2
Contexto: Ya incorporaste en tu carrito todos los productos que necesitabas, ahora querés ir a pagar los ítems del carrito.
Tarea: "Realiza el pago de los productos de tu carrito."
Direct Success
90.0%
No terminó
0%
AVG. Duration
15.4s
Misclick rate
5.9%
Tarea #3
Contexto: ¡Genial! Realizaste tu pedido y ahora te encuentras en la página de "Estado de tu pedido", pero no recordás si agregaste una pizza en el pedido que acabas de hacer.
Tarea: "Busca la manera de verificar si en tu pedido hubo una pizza."
Direct Success
100%
No terminó
0%
AVG. Duration
5.3s
Misclick rate
0%
Tarea #4
Contexto: Acabas de realizar tu pedido y te diste cuenta de que te cobraron más dinero de lo que decía al confirmar la compra, qué harías?
Tarea: "Utiliza los recursos de la app para poder resolver el problema que tenés."
Direct Success
55.6%
No terminó
0%
AVG. Duration
29.8s
Misclick rate
36.7%
Tarea #5
Contexto: Creaste una lista la semana pasada que se llama "Carnes y pescado", buscala y agrega la lista a tu carrito.
Tarea: "Agregá la lista a tu carrito."
Direct Success
100%
No terminó
0%
AVG. Duration
10.7s
Misclick rate
6.9%
Tarea #6
Contexto: Ahora tenés ganas de agregar una 2da tarjeta de crédito a tu cuenta, ¿Cómo lo harías?
Tarea: "Agregá una 2da tarjeta de crédito a tu cuenta."
Direct Success
88.9%
No terminó
0%
AVG. Duration
7.6s
Misclick rate
0%
Tarea #7
Contexto: Te contaron que podes usar promociones que tiene la app para obtener descuentos en los supermercados Carrefour, ¿Donde irías para activar esta promoción?
Tarea: "Activá un código de descuento."
Direct Success
77.8%
No terminó
0%
AVG. Duration
11.9s
Misclick rate
18.4%
Conclusiones: Testeo
Conclusiones: Testeo
Nuestra conclusión del testeo es que esta etapa nunca se va a cerrar, y que nos va a permitir mantener una relación con el usuario y evaluar sus experiencias en la app. Por otro lado, se puede ver que los resultados mejoraron a lo que era la app anterior.
Nuestra conclusión del testeo es que esta etapa nunca se va a cerrar, y que nos va a permitir mantener una relación con el usuario y evaluar sus experiencias en la app. Por otro lado, se puede ver que los resultados mejoraron a lo que era la app anterior.
Feedback final
"Incluye funcionalidades interesantes, complejas pero que suman mucho a la aplicación. Habría que encontrar la forma de explicarlas para que cualquiera las pueda aprovechar."
"El prototipo es muy intuitivo con colores coherentes a la marca"
"La navegación es completa y se puede completar el flujo principal con facilidad."