Скиллы Мэна То для дизайна и игр
Agent Skills
Библиотека скиллов для выразительных лендингов, анимаций, WebGL и браузерных игр на Three.js с демо и промптами
- 7 117 ★ репозитория
- Последний коммит
- MIT
Расширенный доступ
Почему такой уровень
- Некоторые скиллы запускают скрипты захвата страниц и записи видео
- Отдельные скиллы обращаются к внешним API вроде ElevenLabs
Установка
- Работает в
В терминале, через SkillFoxx CLI
npx skillfoxx add skills/mengto-skillsОпределит агенты на машине, покажет уровень доступа и зафиксирует версию.
Другие способы установки
Доступ и проверки
Как мы проверяемРасширенный доступИнструмент запускает код или ходит в сеть, а внешние данные только читает.
- Некоторые скиллы запускают скрипты захвата страниц и записи видео
- Отдельные скиллы обращаются к внешним API вроде ElevenLabs
Это чужой код. Посмотрите файлы в репозитории перед установкой.
Что делает
Библиотека дизайнера Мэна То собрана из портативных папок со SKILL.md, справочниками, скриптами и демо на чистом HTML. Самый большой раздел посвящен веб-дизайну: лендинги и страницы тарифов, анимация на скролле с GSAP и Lenis, эффекты WebGL, CSS-приемы и десятки готовых визуальных стилей. Раздел про игры описывает архитектуру браузерных игр на Three.js: уровни, бой, врагов, инвентарь, эффекты, оптимизацию и тестирование. Отдельные рабочие скиллы превращают видеозапись сайта в подробный промпт, снимают страницу целиком, разбирают HTML на промпты для отдельных взаимодействий и ищут приметы шаблонного ИИ-дизайна.
Для кого. Для дизайнеров и фронтендеров, которые делают промо-сайты с богатой анимацией или браузерные игры с помощью агента.
Подходит, если
- Нужен лендинг с проработанным визуальным стилем и анимацией
- Нужно повторить понравившийся эффект с другого сайта по видео или HTML
- Нужно собрать браузерную игру на Three.js с понятной архитектурой
Не подходит, если
- Нужен сдержанный рабочий интерфейс, а не промо-сайт
- Нужна автоматическая установка одной командой: README ее не описывает
Пример запроса к агенту
Используй скилл landing-page и сверстай лендинг для сервиса бронирования в стиле clean-minimal-beige-light-modeОграничения
В README нет команды установки: скиллы нужно копировать в каталог агента или подключать как контекст вручную. Часть рабочих скиллов заточена под Codex и личные сценарии автора, например черновики постов в X. Некоторые скиллы опираются на платные сервисы вроде ElevenLabs и Aura.
Как отключить. Удалите скопированные папки скиллов из каталога скиллов агента или ссылки на них из CLAUDE.md и правил Cursor.
Частые вопросы
С каких скиллов начать?
Автор советует связку для веб-дизайна: video-to-superprompt, html-to-interaction-prompts, stitched-full-page-capture и daily-ui-inspiration-capture.
Есть ли примеры результата?
Да, у визуальных скиллов есть демо на HTML и файл с промптами для повтора, общий список в DEMOS.md.
Обсуждение
Вопросов и отзывов пока нет.
Похожие
СкиллыРеестр устанавливаемых дизайн-скиллов: готовые файлы SKILL.md и DESIGN.md с токенами, правилами компонентов и доступностью под разные стили
Скиллы для дизайн-инженеров: быстрая чистка интерфейса, доступность, метаданные и производительность анимаций
Скиллы против шаблонных интерфейсов: сетка, типографика, анимация и отступы, плюс генерация референсов для веба и мобильных
Скилл дизайна интерфейсов, презентаций и графики для кодинг-агентов: черновики на холсте через CLI superdesign
Десять справочных скиллов по Three.js: сцена, геометрия, материалы, свет, шейдеры, анимация и постобработка
AI Design Skills
landing-page-design
Скилл сборки лендинга с нуля: вопросы на входе, структура страницы, конверсионные тексты и строгая визуальная система
Коротко о README
README описывает назначение библиотеки, четыре стартовых скилла для веб-дизайна и то, как подключать папки в Codex, Claude Code и Cursor. Изложены принципы автора, структура папки скилла с демо и справочниками и обзор разделов: рабочие процессы, медиа, UI, разработка игр и веб-дизайн. Есть порядок добавления новых скиллов. Лицензия MIT.
Бейдж для README
Исходный SKILL.md
--- name: article-prompts-to-skills description: Convert an article, tutorial, or prompt pack into focused reusable AgentSkills, one independent capability per skill, with portable instructions, example prompts, working demos, preview screenshots, validation, gallery updates, and a narrow commit. Use when the user asks to turn an article's prompts, tutorial sections, design patterns, interactions, or workflow ideas into complete skills rather than leaving them as prose. --- # Article Prompts to Skills Turn source prompts into small, demonstrable capability packages. Preserve the useful behavior, not the source page's brand or layout. ## 1. Inspect Before Extracting 1. Read the repository instructions and the complete source article. 2. Run `git status --short`; preserve unrelated work. 3. Inventory every explicit prompt, heading, example, asset, and acceptance criterion. 4. Search existing `SKILL.md` files for overlapping capabilities before creating folders. 5. If the source is raw HTML and the prompts do not exist yet, use `$html-to-interaction-prompts` first, then return here. Do not infer a family of skills from a title alone. Trace each proposed skill to source evidence. ## 2. Build an Extraction Ledger Create a working table before editing files: | Source prompt | Reusable capability | Keep | Remove | Skill name | Demo proof | | --- | --- | --- | --- | --- | --- | Apply these boundaries: - Create one skill per independently reusable behavior. - Merge steps only when separating them would make either step unusable. - Update an existing skill when its contract already covers the capability. - Skip decorative or editorial fragments that do not create a repeatable method. - Name skills after the outcome or mechanism, never after the source article.