click-test-plan — скилл для Claude Code: клик-тесты юзабилити
Помогает спланировать клик-тесты: где люди кликают первым делом и находят ли нужное в навигации. Пригодится, когда макет уже есть, а проверить его нечем.
npx skills add Owl-Listener/designer-skills --skill click-test-plan -a claude-codeЧто делает click-test-plan
Скилл превращает вопрос «найдут ли пользователи эту кнопку» в готовый план теста. Он разбирает четыре вида проверок: первый клик, полный путь кликов, навигация и пятисекундный тест на запоминание. Под каждый вид вы получаете структуру: цель, стимулы, задачи, критерии успеха и выборку участников.
Задачи формулируются без подсказок в интерфейсе. Целевые зоны клика задаются до запуска, а не после. Для количественных тестов скилл советует набрать от 20 до 50 человек, а успешным первым кликом считает попадание выше 65%. Это ориентир, а не жёсткий порог, но если ваши цифры заметно ниже, повод переделать навигацию.
Для полного наблюдения за задачами в репозитории есть отдельный скилл test-scenario — этот покрывает только клики. Установка идёт через npx skills add, нужен Node.js.
Какие задачи решает
- спланировать тест первого клика по макету
- проверить, находят ли пользователи раздел в навигации
- сравнить два варианта дизайна на одних задачах
- собрать критерии успеха до запуска теста
- оценить, где пользователи колеблются перед кликом
Примеры запросов агенту
- составь план клик-теста для новой страницы настроек
- проверь, найдут ли пользователи смену email — нужен тест первого клика
- сравни два варианта навигации одними и теми же задачами
Как установить click-test-plan
1Через Skills CLI (Vercel)
npx skills add Owl-Listener/designer-skills --skill click-test-plan -a claude-code2Вручную: положить файлы
~/.claude/skills/click-test-plan/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/click-test-plan/
1Через Skills CLI (Vercel)
npx skills add Owl-Listener/designer-skills --skill click-test-plan -a codex2Вручную: положить файлы
.agents/skills/click-test-plan/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add Owl-Listener/designer-skills --skill click-test-plan -a cursor2Вручную: положить файлы
.cursor/skills/click-test-plan/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install Owl-Listener/designer-skills click-test-plan2Вручную: положить файлы
.github/skills/click-test-plan/SKILL.md1Через Skills CLI (Vercel)
npx skills add Owl-Listener/designer-skills --skill click-test-plan -a gemini-cli2Командой платформы
gemini skills install https://github.com/Owl-Listener/designer-skills --path prototyping-testing/skills/click-test-planВручную: положить файлы
.devin/skills/click-test-plan/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add Owl-Listener/designer-skills --skill click-test-plan -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Вопросы о click-test-plan
Как установить click-test-plan в Claude?
Выполните npx skills add Owl-Listener/designer-skills --skill click-test-plan -a claude-code. Скилл появится в ~/.claude/skills/click-test-plan/SKILL.md.
Что делает click-test-plan?
Проектирует тесты первого клика, пути кликов, навигации и пятисекундные тесты. На выходе — цель, стимулы, задачи, критерии успеха и требования к участникам.
Чем отличается от test-scenario?
click-test-plan работает только с кликами и находимостью элементов. Для полного наблюдения за выполнением задач нужен test-scenario.
Исходный текст
SKILL.md · MIT
--- name: click-test-plan description: Design first-click and click tests for findability and navigation. Use when testing whether people can locate something. For full task-based observation, use `test-scenario`. --- # Click Test Plan You are an expert in designing click tests that evaluate findability and navigation clarity. ## What You Do You design first-click and click tests that measure whether users can find information and features. ## Test Types - **First-click test**: Where do users click first for a given task? - **Click-path test**: Full sequence of clicks to complete a task - **Navigation test**: Can users find items using the nav structure? - **Five-second test**: What do users remember after 5 seconds? ## Test Plan Structure ### 1. Objective What navigation or findability question are you answering? ### 2. Stimuli Screen designs or prototypes to test. Identify which pages/states to show. ### 3. Tasks Clear, goal-oriented tasks without UI hints. Example: 'Where would you click to change your email address?' ### 4. Success Criteria - Correct first click (target area defined) - Time to first click - Confidence rating - Click distribution heat map ### 5. Participants Number needed (typically 20-50 for quantitative), recruitment criteria, any segmentation. ## Analysis - First-click success rate (above 65% generally indicates good findability) - Click distribution patterns - Time analysis (hesitation indicates confusion) - Confidence correlation with accuracy ## Best Practices - Test one task per screen - Define click target areas before testing - Use realistic content, not lorem ipsum - Don't give hints in task wording - Compare alternative designs with same tasks
© Owl-Listener · MIT · Owl-Listener/designer-skills