Rediseño App Diloo

Informe UX - Proyecto de rediseĂąo Taller de Juegos Interactivos Milagros Denisse Herrera Mautino - Claudia Andrea Romero Herrera

Breakup letter

Querido Diloo, Intenté mantener una linda relación contigo, te brinde muchas oportunidades pero cada vez que llegaba el momento de pedirte algo, tú me respondías mucho tiempo después, pese a que mi emoción se había desvanecido un poco decidía seguir los siguientes pasos. Sumado a eso, al terminar todo el proceso recién me enteraba que el costo para que llegues a mí era mucho y no estabas en todos los lugares que decías, lo cual era muy tedioso.

Espero que todo lo dicho en esta carta lo tomes de la mejor manera, y en un futuro podamos volver a intentarlo.

Hasta pronto, Denisse&Andrea.

Introducciรณn

Informe de resultados El objetivo de este informe de resultados, es dar a conocer la situación actual de Diloo (una app con muchas opciones increíbles, en distintos rubros), y qué problemas presenta, qué mejoras desea encontrar el usuario para tener una experiencia más rápida y eficaz y de esta manera mejorar la calidad de la marca. Asimismo, se han realizado pruebas con usuario para comprobar si esta propuesta cumple con las expectativas del público objetivo.

Investigaciรณn del caso

Antecedentes UI

Antecedentes UI - Actualizaciรณn

Puntos problemáticos del viaje Inicio • Iconos confuso para el inicio de sesión.

Pedidos No se pueden eliminar los chats con las órdenes cerradas y en proceso.

Cuenta Chat • Se debe esperar una respuesta por parte de Diloo o la empresa encargada. No responden a tiempo, es lento y hace la experiencia más tediosa.

En las categorías • Los iconos son confusos y en algunos casos invisibles. El usuario tiene que suponer que son opciones a elegir.

• Los botones de “agregar” y “confirmar” se encuentran en gris y confunden al usuario si debe hacer algo más para que no figure como desactivado.

• La tipografía no es legible cuando está encima de las imágenes de cada empresa.

• No muestran foto del producto o servicio a a adquirir.

• Confirmas tu compra pero luego en el chat debes re-confirmar.

• Al terminar de escoger tu pedido se abre un chat en el cual re-confirmas tu compra y recién te informan el precio del delivery.

• El uso del chat para confirmar el pedido lo vuelve lento y tedioso. La respuesta de los pedidos mediante el chat no es inmediata.

• Se desconoce la disponibilidad del producto y el tiempo de llegada.

Usuarios

Necesidades del usuario: - Realizar un pedido de forma rรกpida, fรกcil y segura.

- Conocer los establecimientos asociados al aplicativo.

- Respuesta automรกtica luego de realizar el pedido - Saber la disponibilidad de lo pedido y el precio del delivery.

- Ver las fotos de cada producto que adquieren.

- Poder observar y editar los datos con los que me registre

Historias

No quiero tener que re-confirmar mi pedido mediante el chat.

Prefiero ingresar mi dirección y agregar alguna al inicio y no tener que escribirla en cada pedido.

Necesito saber desde un inicio el precio del delivery y stock del producto mientras realizo mi pedido.

El uso del chat me parece tedioso e innecesario.

Quiero ver fotos para saber como será mi pedido y detalles sobre él.

Me gustaría realizar filtros para saber en qué establecimientos puedo encontrar lo que busco.

Necesito saber el precio del delivery y stock del producto mientras realizo el pedido.

Quisiera observar en la misma app las promociones que envían al correo registrado.

Arquetipo

Amalia Carrillo 21 años Arquitectura Amalia tiene 21 años y vive en el distrito de San Borja. Actualmente está cursando el último ciclo de la carrera de Arquitectura, y además está realizando sus prácticas. Es una persona organizada que le gusta leer, escuchar música, ver series y reunirse con sus amigos.

Debido a que no dispone de mucho tiempo busca herramientas que le permitan poder realizar varias actividades como pedir comida para su familia y mascota, hacer envíos, comprar víveres, lavar el carro de sus padres e incluso pedir servicios para su hogar, sin la necesidad de salir de su casa o llamar. Amalia busca ser una gran profesional y a la vez tener tiempo para divertirse y relajarse junto a su familia y amigos.

Arquitectura de informaciรณn

¿Qué podemos mejorar?

Pese a que el usuario confirma su pedido, debe si o si abrir el chat para reconfimar su pedido.

No es necesario el chat para confirmar el pedido.

No existe un botón de búsqueda para filtrar la información y favoritos del usuario.

Habilitar esta función para facilitar y hacer más rápida la búsqueda.

El usuario desconoce el costo del delivery hasta no reconfirmar su pedido por chat.

El usuario debe de escribir su dirección al reconfirmar sus pedido.

Antes de confirmar el pedido debería aparecer el costo del delivery.

Al registrarse, el usuario deberá ingresar una dirección, la cual podrá ser editada cuando complete su pedido.

No existen banner de promociones dentro de la app.

Agregar slides de promociones en el inicio de la app.

SOLUCIÓN Se propone un nuevo diseño para la app, donde el usuario tenga una experiencia más rápida y eficaz en todas las categorías. Asimismo, agregar botones de búsqueda y slides de promociones. Como también, añadir lista de favoritos del usuario. Por último, retirar pasos innecesarios como el chat, que resta tiempo al usuario.

El proceso de compra debe ser más ordenado y corto.

Macroproblemas • • • • •

El chat, paso innecesario durante el proceso.

Carece de fotografías de los productos, lo cual no motiva a la compra de los mismos.

Existen faltas ortográficas dentro de la app.

El texto es muy pequeño y se pierde sobre las imágenes. No es legible.

Confusión al señalar las opciones de “adicionales”, el usuario debe adivinar si es una opción o no, porque no indica el área a seleccionar.

•

El uso del color gris en los botones de “Agregar” y “Confirmar” parecen indicar que están desactivados, o que falta marcar alguna opción para que se activen.

• • •

Solo en algunos establecimientos, presenta el carrito de compras en color rosa.

No todos los afiliados presentan fotos.

El motor de búsqueda presenta problemas en cuanto a funcionamiento.

Viaje de usuario actual

!

Amalia observa la pantalla principal con todas las categorías.

Amalia tiene la posibilidad de escoger entre Restaurantes, Postres, Courier, Tambo, Listo!, Vivanda, Gastronómica / Orgánica, Bidones de agua, Alimento para mascotas, Flores, Lavado de autos, Helpers y Asistente personal / Diloo!

$

Amalia abre el app

% "

Amalia podrá escoger que producto/servicio desea, la cantidad y añadirlo a su carrito de compra.

Amalia tiene que registrarse, poner nombre y apellido, celular y correo electrónico. Luego tiene que esperar el código que le envía la app a través de un mensaje de texto

#

Amalia al ingresar a una categoría observará la lista de afiliados pertenecientes a ella o escribir el nombre de alguna que conozca.

&

'

Amalia tiene la posibilidad de escoger características del producto/servicio pedido, e incluso añadir instrucciones especiales.

Después de ello podrá confirmar su pedido, Ingresará la dirección, departamento, distrito, referencia, el método de pago y tipo de comprobante. Además la descripción del pedido, precio y la posibilidad de añadir algún comentario al pedido.

Amalia tiene que reconfirmar su pedido a través del chat y recién conocerá el precio del delivery, y tiempo de entrega.

(

Amalia esperará su pedido después de un largo proceso.

)

ยกNuestra propuesta!

Principales puntos de mejora ANTES Dentro del botón “Chat” se encuentra el Registro e Inicio de Sesión.

Este paso confunde al usuario, ya que no llega a registrarse hasta no hacer el pedido, y corta el proceso de compra; puesto que al descargar al app, lo primero que aparece son las categorías.

DESPUÉS Descargar la app y luego ingresar los datos para registro e inicio de sesión.

El registro e inicio de sesión es inmediatamente después de que el usuario descarga la APP. Así puede realizar su compra con total normalidad sin que se corte el proceso.

Principales puntos de mejora ANTES

Los botones principales eran: - Inicio - Pedidos - Cuenta - Chat

Inicio: se encontraban las categorías, sin motor de búsqueda.

Pedidos: Se conservan los chats no se pueden eliminar.

Cuenta: No permite editar la cuenta.

Chat: Iniciar sesión o registrarse.

DESPUÉS Los botones principales eran: - Inicio - Explorar - Pedidos - Cuenta

Inicio: Banners promocionales, lo más cercano y lo más popular.

Explorar: Cuenta con dos secciones: Categorías, se mantienen las mismas, y Buscar, que permitirá filtrar resultados rápidos.

Pedidos: Se registran los pedidos anteriores y próximos.

Permite la calificación de los afiliados.

Cuenta: Se muestra más detallado, con mayor información y permite la edición de datos. Se añade métodos de pago y direcciones.

Principales puntos de mejora ANTES

DESPUÉS

El usuario debe realizar extensos pasos para finalizar la compra y confirmar su pedido

Se juntaron pasos para reducir el proceso.

Se eliminaron pasos innecesarios para el usuario.

Todo el proceso es confuso. Cuando el usuario confirma su compra, se abre un chat en el que debe reconfirmar el pedido por los costos de delivery y tiempo de entrega.

Muchos usuarios, cancelan el pedido por este paso tedioso.

El proceso es ordenado y simple.

El usuario confirma su pedido, conociendo el costo de delivery y tiempo de entrega.

Se eliminĂł el chat, por ser un paso innecesario para el usuario.

Propuesta funcional

Nuestra propuesta

!

Amalia se registra ingresando su nombre y apellido, celular, correo y dirección. Además recibirá un mensaje de texto con un código a su número para verificar su cuenta.

'

Amalia abre el app

Amalia tiene la posibilidad de observar banners promocionales, lo más cercano, lo popular.

$ "

Amalia podrá escoger que producto/servicio desea, la cantidad, las características instrucciones especiales requeridas y añadirlo a su carrito de compra.

Amalia confirmará su pedido e ingresará el método de pago. Y el aplicativo le informará el tiempo de entrega

#

Además, puede ingresar a “explorar” donde se encuentran todas las categorías y la opción de búsqueda para una rápida filtración de resultados.

Amalia esperará su pedido.

%

&

Amalia entrará a “ver el carrito” ubicado en la parte inferior, donde podrá ver la descripción del pedido, precio total y dirección.

Wireframes

Los wireframes destacan por la gran presencia de fotografĂ­as de los productos. Se muestra mĂĄs organizado y de fĂĄcil uso.

ยกPropuesta visual!

RediseĂąo

All Screen

Prototipo

Pruebas con usuarios

Perfil de usuario Jóvenes universitarios y/o trabajadores de 18 a 24 años que suelen pedir por apps de delivery’s ya que no disponen de mucho tiempo para realizar la compra en una tienda física o no desean llamar para pedir el servicio requerido.

Presentaciรณn de los resultados de las pruebas: Consideraban la app amigable.

100 %

Calificar el establecimiento al finalizar el pedido.

33 %

Recomendaron que los iconos sean mรกs grandes.

50 % 50 %

Uso de imรกgenes de los productos genera confianza.

Descuentos

17 % 83%

Paleta de color

17 % 66%

100 %

83%

Conclusiones

Conclusión de los resultados: •

Al mostrar más fotografías de los productos y servicios generan más confianza en el usuario y mayor interés para realizar la compra.

•

Ingresar la dirección al registrarse agiliza el proceso al pedir y además permite a la app filtrar los establecimientos más cercanos y populares, además te brinda la posibilidad de agregar más direcciones.

•

La implementación de banners promocionales incentiva la compra dentro de la app y que la recomienden. Además de conocer los descuentos dentro de ella.

• •

Conocer el precio total al final del pedido agiliza la decisión en la compra.

Consideran un plus que se pueda visualizar el mapa.