🚶 Mermaid

Recorrido del usuario

Mira tu producto con los ojos de tus usuarios

¿Qué es un Recorrido del usuario?

Un recorrido del usuario mapea los pasos que sigue un usuario para lograr un objetivo, puntuados por satisfacción en cada paso. Revela al instante los puntos de fricción en el onboarding, el pago o las experiencias de soporte.

Los recorridos del usuario están hechos para la pared de una sala de taller más que para un documento de arquitectura: producto, soporte y diseño leen la misma imagen y discuten sobre la misma puntuación baja. Su valor es emocional, no técnico — un paso que funciona a la perfección puede puntuar dos igualmente. Su límite es que el diagrama recoge un único camino lineal con un número por paso. Las tasas de abandono y los canales viven en otro sitio.

Ejemplo en directo

Código Mermaid
journey
    title Checkout experience
    section Browse
      Find product: 5: Customer
      Compare options: 3: Customer
    section Purchase
      Add to cart: 4: Customer
      Enter payment: 2: Customer
      Confirm order: 5: Customer
Ejemplo en directo
Customer
Browse
Browse
Customer
Find product
Find product
Customer
Compare options
Compare options
Purchase
Purchase
Customer
Add to cart
Add to cart
Customer
Enter payment
Enter payment
Customer
Confirm order
Confirm order
Checkout experience

Cuándo usarlo

Mapear las experiencias de onboarding y de pago
Identificar los puntos de fricción con puntuaciones de satisfacción
Alinear a los equipos de producto y soporte sobre el recorrido real del usuario

Errores frecuentes

Un paso sin actor

Escribir Find product: 5 dibuja el paso pero no lo atribuye a nadie, así que desaparece de la leyenda de actores y la fila de caritas se ve incompleta. Cada paso necesita al menos un actor tras la puntuación.

Los nombres de actor deben coincidir

Customer y customer son dos actores distintos, cada uno con su color y su entrada en la leyenda. El diagrama se renderiza igualmente, así que el duplicado pasa desapercibido: copia el nombre en vez de reescribirlo en cada línea.

Los perfiles no son actores de paso

Enumerar Customer, Support en un mismo paso está bien: nombra a quién interviene ahí. Lo que se rompe es pasar dos perfiles por el mismo recorrido, porque la única línea de puntuación acaba promediando dos experiencias distintas. Dibuja un recorrido por perfil.

Sintaxis básica

.mmd
journey
    title My journey
    section Phase
      Step name: 5: Actor
  • journey title Checkout experience

    El título nombra el objetivo que persigue la persona usuaria. Un recorrido debe cubrir un objetivo para un solo perfil; un segundo perfil significa un segundo diagrama.

  • section Purchase

    Las secciones dividen el recorrido en fases — explorar, decidir, pagar, recibir — y se dibujan como una banda sobre los pasos que contienen, lo que agrupa también la línea de puntuación.

  • Enter payment: 2: Customer

    Un paso es texto, luego una puntuación de 0 a 5 y después los actores, todo separado por dos puntos. La puntuación fija la carita y la altura del punto.

  • %%{init: {"theme": "forest"}}%%

    Una directiva init en la primera línea cambia el tema, que es la única palanca de estilo que ofrece un recorrido: no hay color por paso ni por sección.

Preguntas sobre este diagrama

¿Qué significan las puntuaciones?

Cada paso recibe una puntuación de satisfacción de 0 a 5, mostrada como una carita. Las puntuaciones bajas señalan exactamente dónde sufren los usuarios — tu backlog de mejoras, visualizado.

¿Pueden aparecer varios actores en un mismo recorrido?

Sí — enumera varios actores después de la puntuación (p. ej. «Pago: 3: Cliente, Soporte») para mostrar quién participa en cada paso.

¿Cómo exporto un recorrido del usuario para una presentación de taller?

Exporta PNG a 2× o 4× para que las caritas sigan siendo legibles al proyectarlas, o SVG para un póster impreso. El código sigue siendo texto, así que el diagrama se actualiza entre dos sesiones en un par de minutos.

¿Puede un recorrido de Mermaid mostrar tasas de abandono o canales?

No. El único elemento cuantitativo es la puntuación de 0 a 5; no hay columnas para métricas, canales ni puntos de contacto. Guarda eso en una tabla junto al diagrama y deja que el recorrido lleve la forma emocional del camino.

¿Cómo muestro a un usuario que abandona a mitad de camino?

No puedes ramificar dentro de un recorrido: es un único camino lineal. Modela el abandono como un paso con puntuación baja, y dibuja las rutas alternativas en un diagrama de flujo al lado cuando lo que se discute sea la ramificación.

¿En qué se diferencia de un mapa de experiencia de cliente completo?

Un recorrido de Mermaid guarda tres cosas: pasos, actores y satisfacción. Un mapa de experiencia clásico añade canales, puntos de dolor, oportunidades y citas literales. Usa el diagrama como columna vertebral y pon el resto en el documento.

¿Recorrido del usuario u otro tipo de diagrama?

¿Recorrido del usuario o diagrama de flujo?

El diagrama de flujo muestra lo que el sistema permite: cada rama, cada camino de error. El recorrido muestra lo que hizo una persona concreta y cómo lo vivió. Discutir si un caso límite está cubierto es cosa del flujo; decidir qué arreglar primero, del recorrido.

¿Recorrido del usuario o línea de tiempo?

El recorrido se ordena por pasos; la línea de tiempo, por fechas. El recorrido se repite con cada usuario y lleva una puntuación; la línea de tiempo ocurrió una vez y no juzga. El onboarding es un recorrido; la historia de su rediseño, una línea de tiempo.

Crea tu Recorrido del usuario ahora

Descríbelo en lenguaje natural — la IA escribe el código Mermaid por ti.

Abrir Mermaid Studio