design-game by opusgamelabs/game-creator
npx skills add https://github.com/opusgamelabs/game-creator --skill design-game对现有游戏进行 UI/UX 设计优化,以提升视觉效果、氛围和游戏手感。无需设计经验——此命令会分析您的游戏并应用经过验证的视觉模式。
分析位于 $ARGUMENTS 的游戏(如果未提供路径,则分析当前目录)。
首先,加载 game-designer 技能以获取完整的设计词汇和模式。
package.json 以识别游戏引擎src/core/Constants.js 以获取当前调色板和配置src/core/EventBus.js 以了解现有事件为每个区域评分 1-5 分,并以表格形式呈现:
| 区域 | 分数 | 备注 |
|---|
广告位招租
在这里展示您的产品或服务
触达数万 AI 开发者,精准高效
| 背景与氛围 | ||
| 调色板 | ||
| 动画与补间 | ||
| 粒子效果 | ||
| 屏幕过渡 | ||
| 排版 | ||
| 游戏手感 / 爽快感 | ||
| 游戏结束 | ||
| 表情使用 | 如果存在个性化角色,则根据表情对游戏事件的反应性进行评分。如果表情从不变化,则评 1 分。 |
然后列出按视觉影响力排名的前几项改进,并用通俗易懂的英语描述每项改进的作用(例如,“添加天空渐变,使背景看起来像真实的天空,而不是单一颜色”)。
询问用户希望实施哪些改进,或者如果用户同意,则实施所有改进。遵循 game-designer 技能模式:
Constants.js 中npm run build 以确认没有错误/design-game examples/asteroid-dodge
结果:审计视觉效果 → 评分:背景 2/5,粒子 1/5,排版 3/5 → 添加天空渐变背景、星星视差、小行星被摧毁时的爆炸粒子、击中时的屏幕抖动、平滑的场景过渡。所有值都在 Constants.js 中。
原因: 每帧的粒子发射器或渐变填充过多。解决方法: 限制活动粒子数量(池化和重用)。使用缓存的渐变纹理,而不是每帧重新创建。
原因: 使用了硬编码的像素位置,而不是使用 PX 缩放因子。解决方法: 所有位置和大小都应使用 Constants.js 中与 PX 相关的值。
告诉用户:
您的游戏现在看起来好多了!接下来,运行
/game-creator:add-audio来添加芯片音乐背景音乐和复古音效——全部程序化生成,无需音频文件。流程进度:
/make-game→/design-game→/add-audio→/qa-game→/review-game
每周安装量
115
代码仓库
GitHub 星标数
26
首次出现
2026年2月21日
安全审计
安装于
claude-code91
opencode67
gemini-cli65
github-copilot65
amp65
codex65
Run a UI/UX design pass on an existing game to improve visuals, atmosphere, and game feel. No design experience needed — this command analyzes your game and applies proven visual patterns.
Analyze the game at $ARGUMENTS (or the current directory if no path given).
First, load the game-designer skill to get the full design vocabulary and patterns.
package.json to identify the enginesrc/core/Constants.js for the current color palette and configsrc/core/EventBus.js for existing eventsScore each area 1-5 and present as a table:
| Area | Score | Notes |
|---|---|---|
| Background & Atmosphere | ||
| Color Palette | ||
| Animations & Tweens | ||
| Particle Effects | ||
| Screen Transitions | ||
| Typography | ||
| Game Feel / Juice | ||
| Game Over | ||
| Expression Usage | If personality characters exist, score how reactively expressions change to game events. Score 1 if expressions never change. |
Then list the top improvements ranked by visual impact, with a plain-English description of what each one does (e.g., "Add a sky gradient so the background looks like a real sky instead of a flat color").
Ask the user which improvements they want, or implement all if they say so. Follow the game-designer skill patterns:
Constants.jsnpm run build to confirm no errors/design-game examples/asteroid-dodge
Result: Audits visuals → scores Background 2/5, Particles 1/5, Typography 3/5 → adds sky gradient background, star parallax, explosion particles on asteroid destroy, screen shake on hit, smooth scene transitions. All values in Constants.js.
Cause: Too many particle emitters or gradient fills per frame. Fix: Limit active particles (pool and reuse). Use cached gradient textures instead of recreating per-frame.
Cause: Hardcoded pixel positions instead of using PX scale factor. Fix: All positions and sizes should use Constants.js PX-relative values.
Tell the user:
Your game looks much better now! Next, run
/game-creator:add-audioto add chiptune background music and retro sound effects — all procedurally generated, no audio files needed.Pipeline progress:
/make-game→/design-game→/add-audio→/qa-game→/review-game
Weekly Installs
115
Repository
GitHub Stars
26
First Seen
Feb 21, 2026
Security Audits
Gen Agent Trust HubPassSocketPassSnykPass
Installed on
claude-code91
opencode67
gemini-cli65
github-copilot65
amp65
codex65
shadcn/ui 框架:React 组件库与 UI 设计系统,Tailwind CSS 最佳实践
69,400 周安装