Game UI Design Workflow — скилл

Game UI Design Workflow, скиллы для Cursor, задают правила согласования игровых экранов и передачи графики в движок.

  • 430 ★ репозитория
  • Последний коммит
  • MIT
Скилл

Расширенный доступ

Почему такой уровень

  • Агент пишет проектные документы и графические файлы, запускает локальные скрипты обработки изображений.
Все причины и проверки

guiguiyan930-source/game-ui-design-workflow

Установка

Работает в

В терминале, через SkillFoxx CLI

npx skillfoxx add skills/game-ui-design-workflow

Определит агенты на машине, покажет уровень доступа и зафиксирует версию.

Другие способы установки

Доступ и проверки

Как мы проверяем

Расширенный доступИнструмент запускает код или ходит в сеть, а внешние данные только читает.

  • Агент пишет проектные документы и графические файлы, запускает локальные скрипты обработки изображений.

Это чужой код. Посмотрите файлы в репозитории перед установкой.

Что делает

Game UI Design Workflow, набор скиллов для Cursor, описывает этапы создания игровых интерфейсов, от требований до графических ресурсов. Агент фиксирует действия игрока, согласует с пользователем визуальное направление и переносит принятые решения на остальные экраны. Каждый экран утверждают до разбора на компоненты. Для этого разбора есть скрипты нарезки изображений и сборки атласа. Они проверяют размеры PNG и SVG, а также прозрачность. Агент заносит материалы, состояния и источники в реестр и связывает страницу с ее компонентами, чтобы разработчик получил комплект с описанием.

Для кого. Дизайнерам игровых интерфейсов, которым нужно развить один утвержденный экран в согласованный комплект для движка.

Подходит, если

  • До отрисовки макетов геймдизайнер фиксирует требования и действия игрока.
  • Главный экран уже утвержден; дизайнер переносит его стиль на магазин, уровни и боевой интерфейс.
  • Разработчик ждет прозрачные изображения из утвержденного макета вместе с описанием ресурсов.
  • Перед передачей графики команда сверяет размеры файлов и прозрачность фона.

Не подходит, если

  • Вы ожидаете готовый клиент игры с реализованной игровой логикой.
  • Задача касается проектирования серверного API без интерфейсов и графики.
  • Команда хочет выпускать все финальные изображения без промежуточного согласования.

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

Подготовь требования и карту экранов для карточной игры по этим референсам. Остановись до генерации изображений и покажи вопросы для согласования.

Ограничения

Процесс рассчитан на Cursor Agent; основная документация и примеры вызова написаны по-китайски. Без доступного агенту генератора изображений макеты остаются в статусе `pending-generation`, то есть ожидают генерации. Пользователь согласует каждый экран до нарезки, поэтому на этом этапе работу придется остановить до ответа. Скрипты готовят ресурсы для Godot, Unity и Cocos. Команда сама подключает их к игровой логике: готового клиента игры в наборе нет.

Как отключить. Уберите установленные каталоги скиллов из настроек Cursor. Сохраните проектные документы и ресурсы перед изменением структуры рабочего каталога.

Частые вопросы

Можно ли вызвать только один этап?

Да. Скиллы этапов работают отдельно. Перед изменением прочитайте существующие требования и визуальные правила проекта.

Что произойдет без генератора изображений?

Агент сохранит промпты и отметит ресурсы как ожидающие генерации. Подключите инструмент изображений и продолжите этот этап.

Перезапишет ли установка существующие скиллы?

По умолчанию нет. Для осознанного обновления есть `--force`; перед ним сравните свои изменения с новой версией.

Где сохраняются принятые решения?

В `specs/<project>/` и документах визуальных правил. Перед новым этапом агент должен прочитать их, чтобы сохранить согласованный стиль.

Можно ли получить отдельные изображения из спрайт-листа?

Да. Для нарезки есть отдельный скилл и скрипт. После обработки проверьте прозрачные PNG и их запись в манифесте.

Обсуждение

Вопросов и отзывов пока нет.

Скиллы

Четыре скилла для Codex на каждый этап дизайна продукта: от разбора экрана до сравнения визуальных направлений.

СкиллМинимальный доступ250Звезды репозитория

Скиллы для дизайн-инженеров: быстрая чистка интерфейса, доступность, метаданные и производительность анимаций

СкиллМинимальный доступ11 тыс.Звезды репозитория

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

СкиллМинимальный доступ137Звезды репозитория

Скилл о мелких деталях интерфейса: анимации, типографика, иконки, тени, скругления, оптическое выравнивание и области нажатия

СкиллМинимальный доступ4 тыс.Звезды репозитория15Установок через CLI и агентов

Два скилла по UI и UX учат агента дизайн-решениям: выбор дорожки, токены, рецепты компонентов и защита от шаблонного вида.

СкиллМинимальный доступ177Звезды репозитория

Скилл запрещает агенту типовой интерфейс с плавающими карточками, градиентами и стеклом и задает обычные размеры, радиусы и тени как у Linear

СкиллМинимальный доступ2,7 тыс.Звезды репозитория

Коротко о README

Проектные требования хранятся в `specs/<project>/`, визуальные решения — в отдельных документах. Перед работой над конкретным этапом агент читает эти документы, поэтому к готовому проекту можно вернуться с середины процесса.

Бейдж для README

Исходный SKILL.md

---
name: game-ui-workflow
description: Orchestrates an end-to-end game UI workflow from game design (GDD), PRD, and UI interaction logic through design specification, screen-system extension, page image generation, component breakdown, sprite-sheet splitting, PNG ZIP packaging, atlas packing, engine JSON handoff, asset registration, and validation. Use when users ask to build, extend, visualize, split, or deliver a coherent multi-screen game UI project rather than one isolated artifact.
---

# 游戏 UI 总控工作流

把对话需求转换成可复现的 UI 项目。项目事实必须写入 `specs/<project-id>/`;不要仅保留在对话中。

## 快速路由

根据请求选择最小充分路径:

- 游戏策划、PRD、交互逻辑、生图前需求 → `game-ui-product-design`
- 规范、设计系统、统一风格 → `game-ui-specification`
- 页面清单、功能扩展、玩家旅程 → `game-ui-extension`
- 完整单页、原型视觉、页面生图 → `game-ui-page-generator`
- 透明组件、切图、素材拆解 → `game-ui-component-breakdown`
- 雪碧图、单元素 PNG、切片打包 → `game-ui-sprite-sheet-splitter`
- Atlas、9-slice、Godot / Unity / Cocos JSON → `game-ui-asset-pipeline`
- 完整项目或多阶段交付 → 按本工作流依次编排

用户明确要求单阶段时,不强迫执行完整流程;但要读取已有契约。
生图前若 `gdd.md` / `prd.md` / `interaction.md` 缺失或仍为 draft,必须先执行生成第一步:`game-ui-product-design`。

## 分步操作指引

当用户按完整生成链路工作时,**第一步必须是策划与 PRD**,使用以下检查点:

1. **策划与 PRD(生成第一步)**:调用 `game-ui-product-design`,完成并批准 `gdd.md`、`prd.md`、`interaction.md`;未批准前不得进入后续生图步骤。
2. 原型生成视觉:用一个基准页面验证构图和信息层级,保存为未批准版本。
3. UI 风格切换:保持页面结构不变生成风格候选;用户选定后再批准样式契约和基准页。
4. UI 延展:先输出屏幕地图并等待范围确认,再按批次逐页生成。
5. UI 组件拆解:只拆已批准页面,每个组件和状态单独交付。
6. 雪碧图拆分打包:把组件合图切成单元素透明 PNG,生成 manifest 和 ZIP。
7. Atlas 与引擎交付:语义命名、确认 9-slice、打包 Atlas 并生成引擎 JSON。

每一步开始时简要说明:

- 当前步骤和目标
- 将读取的输入
- 将产生或修改的文件

Сообщить о проблеме