Навык Claude Code, который сканирует любую кодовую базу и генерирует самодостаточную HTML-карту путешествия, не требует ручной работы.

Вывод представляет собой NN/g комбинированную ** карту путешествия клиента + схему обслуживания** в одном HTML-файле, готовом для браузера. Откройте, аннотируйте, поделитесь. Ни сервера, ни шага сборки, ни зависимостей за пределами браузера.

Что он делает

Укажите на кодовую базу. Навык читает ваши маршруты, компоненты, вызовы API, шаблоны электронной почты и состояния ошибок, а затем думает как разработчик услуг: кто актеры, каковы их цели, что они делают и чувствуют в каждый момент?

Каждое выводимое значение помечено [Assumption], поэтому вы знаете, что нужно проверить с реальными пользователями. Строки Frontstage, Backstage и Support поставляются непосредственно из кода — названные компоненты, реальные вызовы API, фактические услуги.

##Установка

###Код Клода — через рынок плагинов

Обновить позже [[Т1]].

Навыки плагина размещаются по имени плагина, поэтому установка плагина вызывается как /journey-mapper:journey-mapper. Клод также забирает его автоматически, когда вы просите карту путешествия.

###Код Клода — инструкция

Journey Mapper

A Claude Code skill that scans any codebase and generates a self-contained HTML service-design journey map — no manual diagram work required.

The output is an NN/g combined customer journey map + service blueprint in a single browser-ready HTML file. Open it, annotate it, share it. No server, no build step, no dependencies beyond a browser.

---

What it does

Point it at a codebase. The skill reads your routes, components, API calls, email templates, and error states, then thinks like a service designer: who are the actors, what are their goals, what do they do and feel at each moment?

Every inferred value is flagged [Assumption] so you know what needs validating with real users. The Frontstage, Backstage, and Support rows are sourced directly from the code — named components, real API calls, actual services.

---

Install

Claude Code — via plugin marketplace

/plugin marketplace add joeyvansommeren/journey-mapper
/plugin install journey-mapper@journey-mapper

Update later with /plugin marketplace update.

Plugin skills are namespaced by plugin name, so a plugin install is invoked as /journey-mapper:journey-mapper. Claude also picks it up automatically when you ask for a journey map.

Claude Code — manual

git clone https://github.com/joeyvansommeren/journey-mapper
cp -r journey-mapper/skills/journey-mapper ~/.claude/skills/journey-mapper

A manual install is invoked as plain /journey-mapper. For a single project, copy it to .claude/skills/journey-mapper in that repo instead.

---

Other agents — Codex, Cursor, OpenCode, Gemini CLI, GitHub Copilot, Windsurf

These tools all read Agent Skills folders natively, and all of them look in the shared .agents/skills location. One copy covers every one of them:

git clone https://github.com/joeyvansommeren/journey-mapper
mkdir -p ~/.agents/skills
cp -r journey-mapper/skills/journey-mapper ~/.agents/skills/journey-mapper

For a single project, copy it to .agents/skills/journey-mapper in that repo instead. Keep REFERENCE.md and TEMPLATE.html next to SKILL.md — the skill refers to them by relative path.

Every tool also triggers the skill on its own when you ask for a journey map or service blueprint.

---

Continue.dev

Continue reads skill folders from its own directory rather than .agents/skills:

mkdir -p ~/.continue/skills