qiaomu-design — скилл
Скилл дизайна интерфейсов для агента: диагностика, четыре направления на выбор, реализация и приемка без вида шаблона от ИИ
- 685 ★ репозитория
- Последний коммит
- MIT
Расширенный доступ
Почему такой уровень
- Правит реальные файлы проекта при реализации дизайна
- Может запускать локальный скрипт превью направлений
Установка
- Работает в
Ручная установка
npx skills add joeseesun/qiaomu-designСтавит скилл в клиент с поддержкой формата скиллов. Нужны Node.js и npx.
Доступ и проверки
Как мы проверяемРасширенный доступИнструмент запускает код или ходит в сеть, а внешние данные только читает.
- Правит реальные файлы проекта при реализации дизайна
- Может запускать локальный скрипт превью направлений
Это чужой код. Посмотрите файлы в репозитории перед установкой.
Что делает
Скилл ведет агента через полный цикл дизайна интерфейса, а не выдает сразу одну готовую страницу. Сначала он уточняет задачу и настраивает степень смелости, анимации и плотность под тип экрана. Затем показывает примерочную стилей: четыре взаимоисключающих направления в виде реальных мини-макетов, из которых вы выбираете. После выбора агент правит настоящие файлы и проходит инженерный чек-лист приемки: доступность, формы, ловушки фокуса, защита опасных действий. Есть режим полировки существующих страниц без переделки с нуля, каталог дизайн-систем реальных сайтов как референс и правила китайской типографики.
Для кого. Для дизайнеров и разработчиков, которым нужен интерфейс с характером и без штампов дефолтного ИИ-стиля.
Подходит, если
- Нужно спроектировать или переработать страницу и сначала увидеть направления
- Хотите отполировать рабочую страницу без переделки с нуля
- Нужна проверка иерархии, состояний и мобильной версии перед правками
Не подходит, если
- Задача только про бизнес-логику или чистый бэкенд без интерфейса
- Нужна лишь правка текста, а не дизайн и верстка
Пример запроса к агенту
Помоги переработать главную продукта, сначала дай четыре направления, которые можно посмотретьОграничения
Качество зависит от того, что реально реализует и проверяет текущий агент, метод дает воспроизводимый цикл, а не гарантию результата с первого раза. Для интерактивной примерочной направлений нужен локально запускаемый скрипт превью на Node.js. Внешняя модель K3 подключается только по явному указанию пользователя и требует отдельной установки, по умолчанию не нужна.
Как отключить. Удалите папку скилла qiaomu-design из каталога скиллов агента.
Частые вопросы
Что такое примерочная стилей?
Это четыре взаимоисключающих направления в виде реальных мини-макетов на локальной странице, из которых вы выбираете до реализации.
Нужна ли модель K3?
Нет, по умолчанию реализует текущий агент. K3 подключается только если пользователь явно назовет ее в текущей задаче.
Обсуждение
Вопросов и отзывов пока нет.
Похожие
СкиллыСкилл дизайна интерфейсов: арт-дирекция под продукт, общий DESIGN.md, токены, проверка верстки и доступности в браузере.
Скилл дизайна интерфейсов, презентаций и графики для кодинг-агентов: черновики на холсте через CLI superdesign
Скилл для Codex: три разных визуальных концепта, ревью по скриншотам и чистка лишнего, чтобы интерфейс не выглядел шаблонно.
Дизайн-скилл против шаблонных AI-интерфейсов: новые страницы, аудит, редизайн и разбор чужого дизайна по скриншоту или URL
Скилл для интерфейсов без шаблонного ИИ-вида: типографика, цвет, движение, состояния компонентов и критика готового.
Реестр устанавливаемых дизайн-скиллов: готовые файлы SKILL.md и DESIGN.md с токенами, правилами компонентов и доступностью под разные стили
Коротко о README
README представляет qiaomu-design как настойчивого консультанта по дизайну для Claude Code и Codex, который связывает разбор задачи, выбор направления, реализацию и приемку в браузере. Ключевые части: примерочная из четырех направлений, запрет на приметы дефолтного ИИ-стиля, правила китайской типографики, инженерный чек-лист приемки и каталог дизайн-систем реальных сайтов как референс. Есть режим полировки существующих страниц без переделки с нуля и механизм накопления пользовательских предпочтений. Устанавливается через npx skills add. Лицензия MIT.
Бейдж для README
Исходный SKILL.md
--- name: qiaomu-design description: > 为页面、组件和产品界面提供设计诊断、四方向可视化预览、设计系统编译、实现与视觉 QA。 在用户要求从零设计、重设计、优化 UI/UX、审查界面、建立设计系统或参考某种风格时使用； 不用于只改业务逻辑、纯文案润色或与界面无关的普通编码。默认由当前 Codex 直接执行， 只有用户在当前任务明确点名 K3 时才调用外部模型。 metadata: author: Qiaomu version: "3.9.0" --- # 偏执型设计顾问 v3.9 把读懂场景 看见方向 明确选择 真实实现 浏览器验收 串成闭环。目标不是堆视觉效果，而是做出有功能契约、有个性、可运行、可验证且不像默认 AI 模板的界面。 ## Router Rules 1. 每次开工先读 references/user-preferences.md。优先级为：当前用户要求与项目事实 > 偏好账本 > 本文件 > 按需参考。 2. 设计、前端、UI、CSS、组件和页面任务默认由当前 Codex 直接完成。 3. 只有用户在当前任务明确说用 K3 时，才读取并使用 qiaomu-model-cli。 4. 保护用户已有未提交改动。不得因设计任务重置、覆盖或顺手重构无关文件。 ## 按任务选路径 - 只要诊断或审查：诊断后停止，不修改文件。 - 从零设计或重设计：完整三阶段，Phase 2 后等用户选择。 - 已有方向只要打磨：打磨模式，可直接改真实文件。