Catevering — Diseño de producto. UI/UX Case Study
🇺🇸🇬🇧 First. Do you want read this article in English? Check it here.
Catevering
Compara, elige y reserva el mejor catering para tu empresa. Catevering es un “directorio” de caterings de las principales ciudades de España, donde puedes ver y comparar precios, servicios y tipos de comida y elegir el que mejor te funcione para tu empresa o evento. Catevering es una startup española, acelerada por Demium Startups.
Reto
El reto fue hacer que Catevering destacara sobre las demás haciendo foco en la función solicitar un catering para tu evento de forma rápida y legible. Mostrando la capacidad creativa y digital de un sector tradicional y analógico.
Herramientas:
- ✐ Papel y lápiz > Ideas, palabras, wireframes de baja densidad.
- 💠 Overflow > Creación de flujo de pantallas.
- 💎 Sketch > Wireframes de alta fidelidad y mockups
- 🖥 Flinto > Prototipado animado.
- 📂 Zeplin > Entrega a desarrollo.
Competidores
Para comenzar mi investigación, comencé a mirar a algunos competidores o plataformas similares, analizando UI, UX, flujo de usuarios, AI y características clave. No voy a entrar en detalles sin embargo, ya que quiero mantener el foco en la investigación que se ha hecho en Catevering.
El principal competidor donde nos basamos es Caterwings.
Nos encontramos con un servicio minimalista, limpio y claro, que ofrece referencia gráfica del trabajo que hace (imagen de catering central)
Muestra la principal acción en la zona “hero” del producto, la acción de “Realizar un pedido”, con los datos (KPIs) principales para los clientes como número de platos servidos, vendedores, satisfacción, etc.
Dicho esto vamos a plantear este servicio en nuestro mercado.
Proceso
Como todo proceso de UX/UI empezamos con la investigación siguiendo las cinco fases de la metodología Design Thinking: Empatizar, definir, idear, prototipar y testar.
Escenarios
Dentro de los múltiples escenarios que podríamos manejar en la creación del nuevo producto, existen 3 casos clave que deberíamos tener en cuenta para su proceso de creación.
En este caso planteamos que el caso más acertado para desarrollar el nuevo producto es el escenario dos.
El cliente no sabe lo que quiere, pero sabe cuando lo quiere, y sabe cuanto le cuesta (o lo que se quiere gastar).
Mantenemos esta hipótesis porque creemos que es el planteamiento más acertado para el caso de Catevering Online, hay que tener en cuenta que Catevering también vende bastante vía telefónica.
Los otros escenarios no debemos de obviarlos, simplemente trasladar el mejor escenario en el producto.
Personas
Sacando ese escenario, obtenemos una serie de perfiles (personas) como potenciales clientes del servicio de Catevering
Diseño actual
El diseño actual de Catevering está desarrollado internamente por el equipo de Catevering.
Este diseño tiene diferentes problemas a nivel producto y UX, tales como:
- Fuente simple, falta de personalidad.
- Densidad de información en el menú
- Diferentes CTAs activos
- Tipos de menú en el 3 scroll.
Problemas
He recibido buenos consejos de los comentarios de los usuarios que no han puesto de relieve cuestiones relevantes sobre la usabilidad o las funcionalidades.
He clasificado las quejas en 4 categorías:
- Propuesta valor
- ¿Qué puedo pedir?
- Proceso más personalizado
- Proceso de compra
Soluciones
Empezamos a contemplar diferentes opciones y soluciones para estos problemas, empezamos con el proceso de wireframing.
Prototipo
Pasamos al UI, debemos definir la personalidad e identidad del producto y la marca, sin olvidarnos de lo más importante:
El diseño tiene que ser funcional.
Lo primero será buscar inspiración. Para ello construimos un Moodboard en base a nuestros atributos de marca, donde empezamos a definir colores, formas, texturas, tipografía, iconografía…
Nuestros atributos: Comparar, Comida, Reservar, Calidad.
Con el moodboard pasamos a montar la estructura de colores y tipografía, con los colores era algo impuesto de la empresa (Catevering) con la tipografía tuvimos más libertad.
Una vez planteado escenarios, personas, wireframes, moodboard, colores y tipografía, pasamos al prototipo de alta fidelidad, manteniendo la estructura arriba citada.
Buscamos ofrecer algo más moderno, creativo y que abra el apetito.
Obviamente dentro de todo el proceso hemos tenido en cuenta el diseño creativo del apartado mobile. Así de como todas las subsecciones, módulos o diferentes páginas de todo el producto.
Podéis ver más imágenes y detalles del proyecto en nuestro Behance.
https://www.behance.net/gallery/73884465/Catevering-Online-catering-sales-platform
Os dejamos algunas imágenes más de nuevo producto.
Catevering espera lanzar su plataforma al público en general en Febrero-Marzo 2019. Estaremos atentos del nuevo producto, sus comentarios, métricas y procesos.
Puedes visitar Catevering en: www.catevering.com
¿Te ha gustado el post?
¡Dale claps! puedes darle hasta 50 veces al clap, y que mucha más gente encuentre y conozca este post, y claro… no te olvides de compartir el post con amigos o compañeros que les interese el diseño de productos.