К основному содержанию
affpapa.org
RU EN
скилл CX Codex

experience-map — скилл для Claude Code: карта опыта сервиса

Скилл строит карту всех точек контакта, каналов и связей сервиса. Пригодится, когда опыт пользователя размазан по нескольким продуктам.

Установить в Claude Code · Через Skills CLI (Vercel) Все способы и платформы ↓ 
npx skills add Owl-Listener/designer-skills --skill experience-map -a claude-code
Открыть на GitHub

Что делает experience-map

Скилл experience-map собирает карту пользовательского опыта на уровне системы: фазы по горизонтали (от знакомства до ухода), а по вертикали — действия, точки контакта, каналы, эмоции, боли и возможности. Отдельный слой — связи между точками контакта: как данные перетекают между каналами и где человек передаёт задачу автоматике.

Автор советует сначала описывать текущее состояние, а уже потом будущее. Ещё в карту стоит включать физические точки контакта наравне с цифровыми, иначе офлайн-часть сервиса просто выпадет.

Если опыт линеен и касается одной персоны, берите journey-map из design-research. Для внутренних процессов за кулисами есть service-blueprint. Карта опыта нужна там, где продукт не один и связи между ними важнее последовательности шагов.

Какие задачи решает

  • увидеть все точки контакта сервиса на одной схеме
  • найти разрывы между цифровыми и офлайн-каналами
  • согласовать картину опыта между командами
  • описать передачу данных между каналами и автоматикой
  • собрать текущее состояние перед проектированием нового

Примеры запросов агенту

  • построй experience-map для нашего сервиса: веб, приложение, поддержка и офлайн-точки
  • сделай карту опыта по фазам от знакомства до ухода, отметь боли и возможности
  • где у нас рвётся передача данных между каналами? разложи по experience-map

Как установить experience-map

1Через Skills CLI (Vercel)

npx skills add Owl-Listener/designer-skills --skill experience-map -a claude-code

2Вручную: положить файлы

~/.claude/skills/experience-map/SKILL.md

Папка скилла целиком; для одного проекта — .claude/skills/experience-map/

По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов

Из того же набора109

documentation-template Создаёт готовые каркасы документации для компонентов, паттернов и базовых правил дизайн-системы. Пригодится, когда нужно привести описание интерфейсных элементов к единому стандарту. CX Codex +1 2 100установок naming-convention Задаёт единые правила именования компонентов, токенов и слоёв, чтобы имена в проекте не расходились от файла к файлу. CX Codex +1 2 100установок empathy-map Собирает карту эмпатии Says, Thinks, Does, Feels для одного пользователя или сегмента, чтобы команда быстро увидела общую картину. CX Codex +1 2 100установок handoff-spec Оформляет спецификацию передачи дизайна в разработку: отступы, токены, состояния экранов и граничные случаи. Пригодится, когда макет отдают фронтендерам. CX Codex +1 2 100установок user-persona Скилл формирует 2–4 персоны пользователей на базе транскриптов интервью, опросов или аналитики. Помогает согласовать дизайн-решения с реальным поведением аудитории. CX Codex +1 2 100установок gesture-patterns Проектирует жесты для сенсорного и указательного ввода: свайпы, перетаскивание и долгое нажатие. Нужен при создании интерфейсов с жестовым управлением. CX Codex +1 2 100установок feedback-patterns Учит агента проектировать отклик системы на действие пользователя: тосты, индикаторы, бейджи и уведомления. Пригодится, когда интерфейс молчит после нажатия. CX Codex +1 2 100установок design-brief Формирует бриф проекта с описанием проблемы, аудитории, ограничений и метрик успеха. Пригодится на старте отдельной задачи. CX Codex +1 2 100установок

Похожие

principle-experience-first backnotprop Скилл-принцип, который смещает приоритет при продуктовых и UX-решениях в сторону пользователя. Пригодится, когда спорят о скоупе фич. CX Codex +1 5 100установок designing-user-experience osmontero Скилл для проектирования поведения интерфейса: потоки, формы, пустые, загрузочные и ошибочные состояния. Пригодится, когда вёрстка готова, а на плохих данных всё ломается. CX Codex +1 458установок uncodixfy cyxzdev Учит агента не генерировать типичный «кодексовый» интерфейс: без градиентов, плавающих панелей и декоративных заголовков. Пригодится, когда фронтенд от ИИ выглядит слишком шаблонно. CX Codex +1 5 600установок design-archivist curiositech Собирает визуальную базу из 500–1000 реальных примеров: палитры, шрифты, сетки, интеракции. Нужен, когда решаете, как выглядеть на фоне конкурентов. CX Codex +1 321установок awesome-design-md wearescientist Подбирает стиль интерфейса из библиотеки DESIGN.md и применяет его к вёрстке: layout, цвет, типографика, отступы. CX Codex +1 666установок apply-aesthetic plugin87 Скилл выбирает визуальное направление — архетип или одну из 138 дизайн-систем — и переводит его в токены проекта. CX Codex +1 529установок

Вопросы о experience-map

Как установить experience-map в Claude?

Выполните npx skills add Owl-Listener/designer-skills --skill experience-map -a claude-code. Скилл появится в ~/.claude/skills/experience-map/SKILL.md.

Что делает experience-map?

Строит карту экосистемы пользовательского опыта: фазы, точки контакта, каналы, эмоции, боли и возможности, а также связи между точками контакта.

Чем experience-map отличается от journey-map?

journey-map описывает линейный путь одной персоны, а experience-map берёт всю экосистему, когда опыт охватывает несколько продуктов. Для внутренних процессов есть service-blueprint.

Исходный текст

SKILL.md · MIT 
---
name: experience-map
description: Map the full ecosystem of touchpoints, channels, and relationships across a service. Use when the experience spans more than one product. For one persona's linear journey use `journey-map` (design-research); for backstage operations use `service-blueprint`.
---
# Experience Map
You are an expert in mapping complex, multi-channel user experiences at a systems level.
## What You Do
You create experience maps showing the entire ecosystem of user interactions across touchpoints, channels, and time.
## Structure
### Horizontal Axis: Phases
Awareness, evaluation, onboarding, regular use, advanced use, advocacy/departure.
### Vertical Layers
- **User Actions** — what the user does, key decisions
- **Touchpoints** — website, app, email, support, community
- **Channels** — desktop, mobile, in-person, automated vs human
- **Emotions** — confidence, frustrations, delight
- **Pain Points** — friction, confusion, information gaps
- **Opportunities** — improvements, new touchpoints
### Ecosystem Relationships
How touchpoints connect, data flow between channels, human-automated handoffs.
## When to Use
New products, omnichannel evaluation, ecosystem gap analysis, cross-team alignment.
## Best Practices
- Map current state before future state
- Include digital and physical touchpoints
- Involve cross-org stakeholders
- Validate with research, not assumptions

© Owl-Listener · MIT · Owl-Listener/designer-skills

Смотрите также

Спонсоры проекта

Компании, которые помогают держать аналитику открытой
Золотой спонсор AI-аналитика спроса на iGaming — индекс, тренды, конкуренты
Nutra.Club Закрытое сообщество Nutra-вертикали от команды M1

Показы, клики и копирования кода — открытая статистика. Мы держим цифры публичными по той же логике, что и сам NeBlask. Стать спонсором