replica-diff — скилл для Claude Code: что делает и как установить
Оценивает готовность клона приложения к оригиналу: считает паритет функций по матрице и находит структурные отличия в вёрстке без учёта цветов.
npx skills add Jakeschincariol/replica-skill --skill replica-diff -a claude-codeЧто делает replica-diff
Скилл сопоставляет клон веб-приложения с исходным сервисом через два скрипта на стандартной библиотеке Python без сторонних пакетов. Скрипт parity.py разбирает таблицу replica/features.csv и рассчитывает общий балл: обязательные функции получают вес 3, важные — 2, второстепенные — 1, а частичные реализации дают половину веса. На выходе формируется список недостающих возможностей в порядке сборки.
Второй инструмент, imgdiff.py, анализирует скриншоты экранов (в разрешении 1440x900 для десктопа или 390x844 для мобильных). Он преобразует снимки в карты границ и сравнивает сетку блоков, игнорируя цвета оформления. Любая смена палитры не снижает оценку, если структура интерфейса и иерархия элементов сохранены. Для локальных регрессий клона доступен режим --mode pixel.
Итоговый отчёт сохраняется в файл replica/parity.md. Если пропущена хоть одна критическая функция с весом must или остался открытый баг S1, инструмент помечает проект как не готовый к релизу (not shippable). Для работы понадобятся только готовые скриншоты экранов и заполненная CSV-таблица.
Какие задачи решает
- рассчитать процент готовности функционала по матрице возможностей
- найти структурные сдвиги интерфейса без оглядки на новую цветовую схему
- составить список недостающих фич в порядке очерёдности разработки
- проверить проект на соответствие критериям готовности к релизу
Примеры запросов агенту
- Проверь паритет функций клона с оригиналом по таблице replica/features.csv
- Насколько мой клон сейчас близок к оригиналу и что ещё нужно сделать?
- Сравни скриншоты экранов в replica/screens и покажи различия в вёрстке
Как установить replica-diff
1Через Skills CLI (Vercel)
npx skills add Jakeschincariol/replica-skill --skill replica-diff -a claude-code2Вручную: положить файлы
~/.claude/skills/replica-diff/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/replica-diff/
1Через Skills CLI (Vercel)
npx skills add Jakeschincariol/replica-skill --skill replica-diff -a codex2Вручную: положить файлы
.agents/skills/replica-diff/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add Jakeschincariol/replica-skill --skill replica-diff -a cursor2Вручную: положить файлы
.cursor/skills/replica-diff/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install Jakeschincariol/replica-skill replica-diff2Вручную: положить файлы
.github/skills/replica-diff/SKILL.md1Через Skills CLI (Vercel)
npx skills add Jakeschincariol/replica-skill --skill replica-diff -a gemini-cli2Командой платформы
gemini skills install https://github.com/Jakeschincariol/replica-skill --path replica-diffВручную: положить файлы
.devin/skills/replica-diff/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add Jakeschincariol/replica-skill --skill replica-diff -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Из того же набора10
Похожие
Рядом в теме «Тесты и QA»
Всё по теме «Тесты и QA» →Вопросы о replica-diff
Как установить replica-diff в Claude Code?
Выполните команду npx skills add Jakeschincariol/replica-skill --skill replica-diff -a claude-code.
Что делает replica-diff?
Скилл рассчитывает балл паритета функционала между клоном и оригиналом, проверяет различия в макетах по скриншотам и формирует отчёт replica/parity.md.
Требуются ли для работы сторонние библиотеки Python?
Нет, скрипты parity.py и imgdiff.py написаны исключительно на стандартной библиотеке Python и не требуют установки пакетов через pip.
Исходный текст
SKILL.md · MIT
--- name: replica-diff description: >- Compares an app clone against the original: a feature parity score from the feature matrix (weighted by must, should, could) with the missing list in build order, plus a screenshot layout diff that ignores colour so a rebrand does not count against you. Two standard-library Python tools. Use when the user says "how close is my clone", "compare it to the original", "what's missing", "parity check", "diff the screens", "is it ready", or after /replica-test. --- # replica-diff Two tools in this folder, both standard-library Python, no installs: ```bash python3 parity.py replica/features.csv # feature parity + missing list python3 imgdiff.py replica/screens/S07.png replica/clone-screens/S07.png --out diff-S07.png python3 imgdiff.py a.png b.png --json > replica/diffs/S07.json # for parity.py --visual python3 parity.py replica/features.csv --visual replica/diffs/*.json --markdown > replica/parity.md ``` ## What parity means here **Parity means it does the same job, not that it looks the same.** The feature score is the number that matters: can a user do everything they could do in the original. The layout score checks structure (is the information in the same places, in the same hierarchy), because that is what makes a switcher feel at home. It deliberately ignores colour, because replica-brand changes every colour on purpose. Do not chase pixel parity with the original. Its exact look is its trade dress, and it changes before launch. ## Step 1: feature parity Make sure `replica/features.csv` is current: every row's `clone` column is `yes`, `partial` (with a note), `no`, or `skip` (with a reason). Then: ```bash python3 parity.py replica/features.csv ``` It weights must 3, should 2, could 1, counts partial as half, leaves out `skip` rows and rows you added that the original does not have, and prints: the score, must-haves done of total, each area weakest first, and the missing list in build order. Must-haves not done means not shippable, and it says so. ## Step 2: layout diff For each key screen, take two screenshots at the **same viewport** (1440x900 desktop, 390x844 mobile) in the **same state** (same data shape, same tab open, logged in the same way). The original's come from public pages or the user's own account, saved in `replica/screens/`. The clone's go in `replica/clone-screens/`. ```bash python3 imgdiff.py replica/screens/S07.png replica/clone-screens/S07.png --out replica/diffs/S07.png ``` Layout mode (default) turns both into edge maps, cuts them into a grid, and compares where things are, scoring only cells with something in them. It reports the score (matches 90+, close 75+, partly 50+, different), the regions that differ (in the original's pixel coordinates, biggest first), and a height difference if the clone's page is much longer or shorter. Retina and non-retina screenshots compare fine: both are scaled to the same width. `--mode pixel` is exact comparison. Use it for your own regressions (clone today against clone last week), not against the original. ## Step 3: behaviour diff Walk each flow in both apps and compare what the scores cannot see: clicks to finish the core flow, what happens on errors, what is remembered between visits, what emails arrive. Fewer clicks than the original is a win. Write each difference as: flow, original does, clone does, fix or keep. ## Step 4: the report `replica/parity.md`: overall score, feature score, layout score per screen, missing features in build order, behaviour differences, and a verdict: - **not shippable**: any must-have missing, or any open S1 bug - **shippable**: all must-haves done, feature score 80+, no open S1 or S2 - **better than the original**: shippable, plus fixes from replica-entrepreneur. This is the goal. A straight copy has no reason to exist. Give honest numbers. A clone at 62% is at 62%. ## Output `replica/parity.md`, the diff images, and the top five things to build next. Then `/replica-build` for the gaps, or `/replica-entrepreneur` if parity is there.
© Jakeschincariol · MIT · Jakeschincariol/replica-skill