Beautify GitHub README
Навык beautify-github-readme помогает улучшать главную страницу GitHub-репозитория и создавать связанные с проектом визуальные материалы. Источник прямо разделяет два режима работы: README mode для улучшения всего README и Asset-only mode для создания только запрошенных визуальных файлов. Если пользователь не уточнил границу задачи, сначала нужно спросить, требуется ли переработка всего README или только отдельный hero, заголовки секций, workflow, badge, diagram, motion graphic либо согласованный набор материалов. Режим Asset-only не даёт разрешения переписывать, переставлять или встраивать что-либо в README; вставка embed-snippet возможна только после отдельного согласия. Аудит без редактирования выполняется без принудительного выбора режима. В качестве визуальной основы навык предлагает Markdown как слой содержания, детерминированный SVG как систему компоновки и растровый материал как необязательный ингредиент. Для типографики, диаграмм, иконок, кода и геометрических сцен предпочтителен pure SVG: он лёгкий, масштабируемый и предсказуемый. Hybrid SVG composition предназначен для случая, когда нужен растровый предмет, но layout и типографика должны оставаться в SVG; итогом по умолчанию становится проверенный PNG или WebP, а SVG-компоновка и растровые слои сохраняются как редактируемые исходники. Анимация не включается автоматически: GIF допустим только после явного выбора, при этом статичный SVG остаётся редактируемым запасным вариантом. Для удалённых репозиториев нужно сначала посмотреть текущую страницу и ветку по умолчанию, а перед дизайном — README, дерево файлов, package metadata, скриншоты, примеры, токены и реальные результаты. Содержательная работа начинается с пяти коротких опор: аудитория, ценность в одном предложении, главное доказательство, первое успешное действие и визуальная тема. Нельзя придумывать adoption, benchmarks, compatibility, testimonials или возможности, которых нет в проекте; сильнее generic decoration работают реальные screenshots, outputs, diagrams и другие артефакты. В README mode полезный порядок строится от первого экрана с названием и понятной ценностью к доказательству, объяснению механизма, короткому workflow, установке и ограничениям. Пример должен появляться раньше длинного объяснения, а повторяющиеся обещания и внутренние детали, не помогающие пользователю начать, следует убрать. При подготовке SVG нужно учитывать GitHub-рендер: источник рекомендует viewBox шириной 1200, системный стек шрифтов и семантический alt-текст. Важные подписи должны оставаться читаемыми на ширине около 900 CSS-пикселей и в узком превью; если плотная схема теряет читаемость, её следует упростить или вынести детали в Markdown. Нельзя использовать scripts, foreignObject, remote fonts, существенную анимацию или CSS, который GitHub удаляет. Визуальный язык должен исходить из самого проекта, а не из повторяемого шаблона навыка. Перед передачей результата проверяются широкий и узкий layout, обрезанные тексты, отсутствующие assets, размер файлов, контраст светлой и тёмной темы и то, что README не изменился в Asset-only mode без отдельного разрешения.
Для чего подходит
- Редизайн README
- Создание SVG hero и секций
- Аудит структуры страницы репозитория
Установка
Сначала прочитайте SKILL.md и scripts в исходном репозитории. Затем выполните команду в каталоге проекта:
npx skills add https://github.com/oil-oil/beautify-github-readme/tree/main/skills/beautify-github-readme