← Todos los proyectos
ResearchArquitectura de informaciónB2B

MercaRancho: Rediseñando el enganche de una intranet B2B

Una intranet de la comunidad aliada de Nestlé con adopción casi nula: los mapas de calor mostraban que nadie hacía scroll.

Rol
UX/UI Designer (research y diseño en solitario)
Año
Proyecto de graduación · Ironhack
Equipo
Sola, con el fundador de MercaRancho como stakeholder
Duración
Duración: últimas 2 semanas del bootcamp
Resultado
Rediseño de home y flujos internos con scroll lateral
Pantalla final de Inicio — el contenido clave queda arriba del pliegue como respuesta al hallazgo de los mapas de calor.

Contexto

MercaRancho es una intranet que conecta a la comunidad de productores, proveedores, asesores y transportistas aliados de Nestlé. Este fue mi proyecto de graduación del bootcamp UX/UI de Ironhack, desarrollado en colaboración directa con el fundador de MercaRancho sobre un problema real de su negocio.

Planteamiento del problema

A pesar de ofrecer capacitaciones, directorio de comunidad, noticias y promociones exclusivas, la adopción era prácticamente nula. Los mapas de calor compartidos por el cliente mostraban que los usuarios no hacían scroll en absoluto en la página de inicio.

Mapas de calor — evidencia de que la interacción se concentraba arriba del pliegue.

Hipótesis: rediseñando el flujo de noticias y capacitaciones lograríamos que los usuarios navegaran de forma más fácil e intuitiva y accedieran a la información que las marcas aliadas ofrecían.

Audiencia y metodología de investigación

Entrevista con Elena, asesora de Nestlé. User Persona (Amado Membrillo, ganadero de 45 años, Querétaro). MoSCoW de priorización. How Might We: «¿Cómo podríamos hacer que los productores encuentren información útil y accedan de manera recurrente a CMR?»

User Persona — Amado Membrillo, productor ganadero.
Pregunta How Might We sobre cómo facilitar que los productores encuentren información útil en CMR
How Might We — pregunta que orientó la definición.
Priorización MoSCoW de noticias, videos, directorio y contenido para productores
MoSCoW — priorización del alcance del rediseño.

Mi rol y el equipo

Trabajé sola en research y diseño, con retroalimentación directa y continua del fundador de MercaRancho como stakeholder real.

El proceso en panorama general

  1. 01Discovery: entrevista con asesora Nestlé, revisión de mapas de calor del cliente.
  2. 02Definición: user persona, hipótesis, HMW.
  3. 03Priorización: MoSCoW.
  4. 04Análisis: user journey map documentando la frustración de un usuario nuevo explorando CMR.
    User Journey — tramo de caída emocional durante la exploración de CMR.
  5. 05Diseño: rediseñé la pantalla de inicio y páginas internas (como Capacitación) reemplazando el menú vertical por una estructura de scroll lateral — tanto entre secciones como dentro de cada categoría — respondiendo directamente al hallazgo de que los usuarios no bajaban en la página. Entregué un prototipo navegable, validado mediante heurísticas de Nielsen en lugar de pruebas de usabilidad con usuarios reales, por las limitaciones de tiempo del bootcamp.
    Flujo propuesto, validado con heurísticas de Nielsen.
    Pantalla de Capacitación — patrón de scroll horizontal por categoría.

Resultados

Por las limitaciones de tiempo del programa, no fue posible validar el rediseño con usuarios finales (agricultores/productores). El entregable se presentó directamente al fundador de MercaRancho y su equipo, quienes respondieron positivamente y expresaron la intención de implementarlo.

Conclusión

El reto más grande fue diseñar para un patrón de comportamiento (el no-scroll) sin poder confirmarlo directamente con los usuarios reales de la intranet; tuve que apoyarme de los mapas de calor de su sitio y de las heurísticas de Nielsen para validar mis decisiones dentro del tiempo del bootcamp. Si retomara este proyecto hoy, mi prioridad sería hablar directamente con los usuarios finales, en este caso los agricultores antes de cerrar el diseño, para confirmar con evidencia de primera mano que la estructura de scroll lateral realmente resuelve su forma de navegar, y no solo la mía.

Ver prototipo interactivo →

Se abre en una pestaña nueva en Figma.