К основному содержанию
команда

screenshot-analyzer — команда для Claude Code

Разбирает скриншоты интерфейса через параллельных субагентов и формирует готовый список задач на разработку в Markdown-файл.

Установить в Claude Code · Через claude-code-templates Все способы и платформы ↓
npx claude-code-templates@latest --command utilities/screenshot-analyzer
Открыть на GitHub

Что делает screenshot-analyzer

Пайплайн запускается в пять этапов. Сначала команда запрашивает путь к файлам и контекст: для чего нужен анализ и какое приложение изучается. Затем через инструмент Task параллельно стартуют три агента. Первый разбирает UI-компоненты и сетку, второй фиксирует сценарии взаимодействия и интерактивные элементы, а третий выделяет бизнес-сущности и логику предметной области.

После этого подключаются ещё два агента. Синтезатор объединяет найденные данные, убирает повторы и строит иерархический список задач. Следом ревьюер сверяет получившийся план с исходной картинкой и ищет пропущенные функции.

Итоговый отчёт пишется в папку docs/plans/ с именем формата YYYY-MM-DD-<product>-features.md. Без инструмента Task команда работать не сможет, потому что именно он отвечает за вызов субагентов.

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

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

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

  • /screenshot-analyzer ./screenshots/dashboard.png
  • /screenshot-analyzer разбери мобильный экран оформления заказа из ./mockups/checkout.png
  • /screenshot-analyzer

Как установить screenshot-analyzer

1Через claude-code-templates

npx claude-code-templates@latest --command utilities/screenshot-analyzer

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

.claude/commands/screenshot-analyzer.md

Вызов — /screenshot-analyzer. Для всех проектов — ~/.claude/commands/

Вопросы о screenshot-analyzer

Как установить screenshot-analyzer в Claude Code?

Выполните в терминале команду npx claude-code-templates@latest --command utilities/screenshot-analyzer. Также можно вручную поместить файл команды по пути .claude/commands/screenshot-analyzer.md.

Что делает команда screenshot-analyzer?

Она передаёт снимок экрана трём субагентам для одновременного анализа дизайна, сценариев и бизнес-логики. Затем синтезатор и ревьюер сводят данные в общий список требований.

Куда сохраняются результаты работы?

Итоговый список задач записывается в файл docs/plans/YYYY-MM-DD-<product>-features.md. Если папка docs/plans отсутствует в проекте, команда создаст её автоматически.

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

screenshot-analyzer.md · MIT
---
description: "Analyze product screenshots to extract features and generate development task lists."
argument-hint: Screenshot path or description
allowed-tools: Read, Write, Grep, Glob, TodoWrite, Task
---

# Screenshot Analysis Command

This command uses a multi-agent pipeline for comprehensive screenshot analysis.

## Phase 1: Discovery

**Goal**: Understand what screenshots to analyze

Initial request: $ARGUMENTS

**Actions**:
1. If no screenshot path provided, ask user:
   - What screenshots do you want me to analyze?
   - What product/app are these from?
   - Is this for competitive analysis or internal product planning?
2. Read and verify the screenshot files exist
3. Confirm scope with user (single screen, full app, specific feature)

---

## Phase 2: Multi-Agent Analysis

For each screenshot, launch THREE analysis agents IN PARALLEL using Task tool:

### Parallel Agent Calls

Launch all three in a SINGLE message with multiple Task tool calls:

**Task 1: UI Analysis**
- subagent_type: "general-purpose"
- prompt: Include screenshot path, ask for UI components, layout, design patterns analysis in JSON format

**Task 2: Interaction Analysis**
- subagent_type: "general-purpose"
- prompt: Include screenshot path, ask for user flows, clickable elements, state transitions in JSON format

**Task 3: Business Analysis**
- subagent_type: "general-purpose"
- prompt: Include screenshot path, ask for business functions, data entities, domain logic in JSON format

Each agent should:
1. Read the screenshot using the Read tool
2. Analyze according to their specialty
3. Return structured JSON analysis

---

## Phase 3: Synthesis

After parallel analyses complete, launch synthesizer agent:

**Task 4: Synthesis**
- subagent_type: "general-purpose"
- prompt: Provide all three analysis results, ask to combine into unified task list

The synthesizer should:
1. Cross-reference all analyses
2. Deduplicate features
3. Generate hierarchical task list
4. Output markdown format

---

## Phase 4: Review

Launch reviewer agent to validate:

**Task 5: Review**
- subagent_type: "general-purpose"
- prompt: Provide screenshot path and synthesized task list, ask for completeness review

The reviewer should:
1. Compare against original screenshot
2. Check for missing features
3. Validate task quality
4. Suggest corrections if needed

---

## Phase 5: Output

1. Write final task list to `docs/plans/YYYY-MM-DD-<product>-features.md`
2. Create the docs/plans directory if it doesn't exist
3. Present summary to user with:
   - Total modules identified
   - Total features extracted
   - Total tasks generated
   - Link to output file

---

## Example Parallel Analysis Call

When you reach Phase 2, your response should include THREE Task tool calls like:

```
[Task 1: UI Analysis for screenshot.png]
[Task 2: Interaction Analysis for screenshot.png]
[Task 3: Business Analysis for screenshot.png]
```

All launched simultaneously for maximum efficiency.

© davila7 · MIT · davila7/claude-code-templates

Похожие слэш-команды

Все слэш-команды по теме «Настройка агента: память, контекст, субагенты» →

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

Весь набор →
powershell-windows Определяет правила надёжных скриптов PowerShell под Windows: обязательные скобки для командлетов, отказ от Unicode и глубину JSON. Спасает от типичных синтаксических ошибок. 169установок geo-fundamentals Скилл помогает готовить контент к цитированию в ответах ИИ и проверять страницы GEO-аудитом. Пригодится, если вы работаете над видимостью материалов в AI-поиске. 168установок voidbeast-gpt41enhanced Автономный субагент для фулстек-разработки: сам выбирает режим работы, исследует код и доводит задачу до конца. 166установок javascript-mastery Справочник по механике JavaScript для Claude Code. Помогает разбирать тонкости типов, замыкания, асинхронный код и контекст this. 165установок backend-to-frontend-handoff-docs Скилл собирает API-хендофф-документ для фронтенд-разработчиков: эндпоинты, DTO, валидация и граничные случаи в одном markdown-файле. 164установок aws-serverless Скилл помогает проектировать AWS-приложения на Lambda с API Gateway, DynamoDB и обработкой событий через SQS. Пригодится для настройки серверных функций и их развёртывания через SAM. 163установок change-logger Хук пишет каждое изменение файла в CSV: время, инструмент, путь, действие и детали. Пригодится, когда готовишь демо и нужно показать, что именно агент трогал. 163установок add-property-based-testing Команда анализирует код и добавляет тесты на свойства: ищет инварианты, подбирает фреймворк и создаёт генераторы данных. Вызывайте её, когда примеров тестов недостаточно. 163установок

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

Компании, которые помогают держать аналитику открытой