Jon CeronDiseñador de producto sénior
ES
Rol
Diseñador UX/UI, equipo de tres
Alcance
Diseño de la plataforma para México, Brasil y Latinoamérica: arquitectura de categorías, onboarding, búsqueda, páginas de receta, planificador y UI kit
El problema
Nestlé necesitaba una sola plataforma de recetas para muchos mercados de Latinoamérica. Un producto genérico no le quedaría a ninguno, y un producto por mercado no se podría mantener.
Mi rol
Diseñador UX/UI en un equipo de tres, bajo nuestro líder de diseño. Ganamos la plataforma en una licitación competitiva en diciembre de 2020. Presenté a los stakeholders de Nestlé y propuse la estructura del sitio, la página de receta y el punto de entrada de marca.
Qué decidí
Una base completa, donde cada mercado elige sus módulos, su navegación, su color y su idioma. Diez familias de categorías con una sola librería de imágenes.
Dónde está
En vivo en México, Brasil, Centroamérica, el Caribe y Sudamérica. Todo lo que diseñamos se implementó, excepto el carrito.
  • 4

    regiones

    México, Centroamérica, Latinoamérica, Brasil

  • 3

    idiomas

    Español, portugués, inglés

  • 15+

    países de Latinoamérica y el Caribe

  • 200+

    pantallas diseñadas por nuestro equipo de tres personas

    Desktop y mobile, tres archivos de mercado

Contexto y mi rol

Recetas Nestlé es la plataforma de recetas de Nestlé: recetas construidas alrededor de sus productos, recetarios, un planeador de comidas, búsqueda por ingrediente y clases de cocina. Nuestro equipo en AgileThought (hoy Motivus) diseñó la plataforma que funciona hoy, con sus fundamentos incluidos. F5 la construyó.

Nestlé quería que la gente llegara por las recetas y se fuera pensando en sus productos, porque cada receta usa uno. El público eran cocineros de casa en mercados muy distintos: Brasil trabaja en portugués, el Caribe en inglés, y el resto de Latinoamérica necesitaba un solo producto de Centroamérica al Cono Sur.

Diseñamos para tres perfiles: una abuela que ya sabe cocinar, jóvenes que viven solos y quieren platillos rápidos y aprender, y personas que conocen lo básico y quieren más. Los recetarios y Escuela del Sabor salieron del segundo.

Tres perfiles de usuario con su nivel de cocina y sus formas de entrar a la plataforma

Abrir imagen completa (se abre en una pestaña nueva)

Los tres perfiles para los que diseñamos. Los nombres y las ilustraciones son ficticios.

El problema

El encargo iba más allá de un catálogo de recetas: recetarios, recomendaciones de recetas para la semana y una forma de llevar los productos de Nestlé a la cocina de todos los días.

Diagrama que compara tres formas de servir a muchos mercados

Abrir imagen completa (se abre en una pestaña nueva)

Tres formas de servir a muchos mercados. Diseñamos la tercera.

Cómo lo abordé

Licitación y stakeholders. Mi líder armó la estrategia con ventas y yo diseñé el prototipo. El alcance vino del equipo global de Nestlé en Suiza y luego de los equipos de marca de México, Brasil, República Dominicana y Ecuador.

Benchmark. Para decidir qué preguntarle a la gente, revisamos el onboarding de nueve plataformas de recetas, entre ellas Thermomix, Kiwilimón y Allrecipes.

Benchmark del onboarding de nueve plataformas de recetas
Qué preguntan nueve plataformas de recetas durante el onboarding.

Un archivo base y luego archivos por mercado. Diseñamos la plataforma completa en un archivo base de Latinoamérica y luego la adaptamos para México y Brasil.

Flujo de usuario de invitado a usuario con sesión

Abrir imagen completa (se abre en una pestaña nueva)

Dónde la plataforma pide una cuenta y qué se abre después.

Decisiones clave

Una base, y cada mercado elige

Decidido
Una base completa de Latinoamérica con cada flujo y módulo. Cada mercado eligió sus módulos y su navegación y recibió su propio color: rosa mexicano para México, naranja para Latinoamérica y Centroamérica, azul cielo y portugués para Brasil, que además tuvo su propio encabezado y una barra de logotipos de marcas.
Descartado
Tres productos diseñados desde cero.
Por qué
Un producto genérico no le serviría a ningún mercado, y uno por mercado no se podría mantener.
Páginas de inicio de México, Latinoamérica y Brasil lado a lado

Abrir imagen completa (se abre en una pestaña nueva)

Una base, tres configuraciones de mercado.

Diez familias de categorías, una librería de imágenes

Decidido
En el mapa del sitio de México, «Todas las categorías» agrupa las recetas en diez familias: cotidianas, tipo de platillo, ocasiones especiales, por ingrediente, temporada, método de cocción, repostería, para niños, verduras y marcas. Una librería de imágenes las alimenta, con categorías exclusivas de cada mercado y una capa de marcas por país.
Descartado
Elegir una sola forma de explorar.
Por qué
La gente busca comida de todas esas maneras.
Mapa del sitio de México
Mapa del sitio de México: doce secciones, diez familias de categorías.
Librería de imágenes de categorías

Abrir imagen completa (se abre en una pestaña nueva)

La librería de imágenes de categorías, con categorías exclusivas de cada mercado.
Marcas por país
Capa de marcas por país.

Preguntar por qué se cocina

Decidido
El onboarding pregunta por qué cocinas (ocasiones especiales, reuniones, o salud y nutrición), junto al nivel de cocina, el tipo de dieta y de comidas, y luego ingredientes preferidos y alergias. Todo se puede editar después.
Por qué
La conclusión del benchmark fue combinar una opción de «ocasiones especiales» con metas que la gente comparte en otras plataformas: comer más sano, recetas rápidas, llevar una dieta. Eso se volvió una sola pregunta.
Conclusión del benchmark: por qué cocinas

Abrir imagen completa (se abre en una pestaña nueva)

Del benchmark a una pregunta: por qué cocinas.
Pasos del onboarding

Abrir imagen completa (se abre en una pestaña nueva)

Onboarding: perfil, ingredientes preferidos, alergias.

Un planeador que pregunta antes de planear

Decidido
Un flujo corto de preferencias (dieta, alergias, tipos de comida, duración del plan, exclusiones, nivel de cocina) y luego una semana de comidas del catálogo, con cualquier comida intercambiable. Lo diseñamos completo para móvil y desktop.
Por qué
Nestlé había pedido recomendaciones de recetas para la semana. El planeador y las preferencias de alergias fueron ideas de nuestro equipo, y Nestlé las aceptó.
Flujo del planeador en móvil

Abrir imagen completa (se abre en una pestaña nueva)

Planeador en móvil: preferencias, menú semanal, cambio de una comida.
Planeador en desktop
Planeador en desktop: el menú semanal.

La solución

Diagrama de árbol del mapa del sitio de México: 12 secciones y sus páginas

Abrir imagen completa (se abre en una pestaña nueva)

El mapa del sitio de México como diagrama. «Todas las categorías» contiene las diez familias.
  • Cuentas: inicio de sesión y registro con acceso social, recuperación de contraseña, onboarding y preferencias.
  • Inicio: versiones para invitados y con sesión iniciada, un carrusel de categorías y una fila personalizada.
  • Recetas: páginas de categoría y una página de receta con versiones, utensilios, una lista de pasos, calificaciones y comentarios.
  • Búsqueda: recetas y artículos del blog, que abre con las búsquedas recientes, y búsqueda por ingredientes: agrega lo que tienes, uno a la vez, y mira qué puedes cocinar.
  • Además: recetarios y listas, planeador, Escuela del Sabor, rincones de marca, comunidad y beneficios.

El registro funciona como un intercambio: la home de invitados lista lo que obtienes al registrarte, y la home con sesión iniciada reemplaza ese bloque con accesos directos.

Búsqueda y búsqueda por ingredientes

Abrir imagen completa (se abre en una pestaña nueva)

Inicio de búsqueda, búsqueda por ingredientes, resultados.
Home de invitado y con sesión iniciada en Brasil

Abrir imagen completa (se abre en una pestaña nueva)

Brasil: home de invitado (izquierda), home con sesión iniciada (derecha).
Página de receta
Página de receta: versiones, utensilios, ingredientes, lista de pasos.
Rincón de marca
Rincón de marca, México.
Escuela del Sabor
Escuela del Sabor: el lado de aprendizaje.

Entrega y estado

La entrega tomó seis meses después de la licitación. F5 construyó la plataforma y pidió cambios durante el desarrollo, que aplicamos. Todo lo que diseñamos se implementó, excepto el carrito.

Impacto

La plataforma funciona hoy en los sitios de recetas de Nestlé en México, Brasil, Centroamérica, el Caribe y Sudamérica.

Reflexión

Una base puede sostener muchos mercados, si los mercados eligen qué se flexibiliza. Dejé de preguntar «¿qué tan distinto debe ser cada mercado?» y empecé a preguntar «¿qué diferencias valen la pena mantener?»

Presentar en inglés cambió cómo trabajo. Presenté a Brasil y al equipo global en inglés, y aprendí a explicar decisiones, no solo a mostrar pantallas.