Skip to content

User Journey

A user journey maps the steps a user takes through a workflow, with a satisfaction score and the actors involved at every step. kymo's editor reads the Mermaid journey syntax.

This page works like a quickstart: as you scroll, the pane on the right shows the source and the preview for the section you're reading. Copy grabs the source; ▶ Open in editor loads it into editor.kymo.studio (pick mermaid in the diagram-type dropdown when starting from scratch).

The example on the right is Mermaid's working-day journey: a title, section headers to group the steps, and one task per line.

journey
    title My working day
    section Go to work
      Make tea: 5: Me
      Go upstairs: 3: Me
      Do work: 1: Me, Cat
    section Go home
      Go downstairs: 5: Me
      Sit down: 5: Me

▶ Try it in the editor

Rendered workday.mmd

Sections and tasks

A task line is Task name: <score>: <actors> — the score is 1 (worst) to 5 (best) and colours the face drawn at each step; the comma-separated actor list becomes the legend, and each actor gets a consistent colour across the diagram.

journey
    title Scores and actors
    section Checkout
      Add to cart: 5: Customer
      Pay: 2: Customer, Support

▶ Try it in the editor

Rendered tasks.mmd

Status. User journey previews on this page and in the editor use the Mermaid renderer; importing user journeys into kymo's own pipeline (native SVG/PNG/PDF rendering) is on the roadmap.

See also

  • Timeline — for events over calendar time rather than workflow steps.
  • Sequence Diagram — for the system-level message exchange behind a user flow.

Apache 2.0 Licensed