design-playful-app-icons README

The project's README from github.com/chunkithwang/design-playful-app-icons. As one markdown file: README.md.

Design Playful App Icons

English version: README.en.md

一个公开、纯文本的 Agent Skill，用于设计、生成、改进和评审大胆、有趣、适合上架的 App Icon。

它不携带参考图片，也不依赖特定艺术家、工作室或现有 App。Skill 通过可量化的构图规则、四套视觉配方、紧凑配色和小尺寸评审流程，让不同 Agent 获得相对稳定且原创的输出。

30 秒开始

npx skills add https://github.com/chunkithwang/design-playful-app-icons \
  --skill design-playful-app-icons

安装后直接对 Agent 说：

用 $design-playful-app-icons 为一个专注计时器设计 3 个 App Icon 方向，并继续完善最强的一个。

也可以尝试：

为我的记账 App 设计一个不使用文字、在 32 px 下仍然清晰的图标。
把这个图标改成更有性格的软 3D 方向，但保留原来的产品隐喻。
评审我提供的 App Icon，并给出可以直接用于重新生成的修改提示词。
为最终方案补充 iOS 和 Android 的生产交付规格。

能做什么

四套视觉路线

路线 特征 适合场景
Flat outlined mascot 扁平色块、清晰描边、强表情 轻工具、社区、教育、生活方式
Soft 3D object-character 柔和体积、圆润材质、统一光源 效率、健康、消费级 AI 产品
Gradient silhouette mascot 大轮廓、受控渐变、极少细节 音乐、创作、情绪与娱乐产品
Minimal dimensional glyph 几何符号、克制空间感、无角色依赖 专业工具、开发者产品、生产力 App

每次任务只选择一条路线，不把四套风格混在同一个图标里。

安装

方式一：使用 Skills CLI（推荐）

npx skills add https://github.com/chunkithwang/design-playful-app-icons \
  --skill design-playful-app-icons

需要安装到用户级目录时：

npx skills add https://github.com/chunkithwang/design-playful-app-icons \
  --skill design-playful-app-icons \
  --global

方式二：直接交给 Agent 安装

把下面这段话发给有 shell 权限的 Codex、Claude Code、Cursor 或其他 Agent：

帮我安装 design-playful-app-icons。请运行：
npx skills add https://github.com/chunkithwang/design-playful-app-icons --skill design-playful-app-icons
安装完成后，确认 SKILL.md、agents/openai.yaml 和 references/ 都已安装，并告诉我实际安装位置。

方式三：使用 Codex 内置安装器

只使用 Codex，或本机不方便运行 Node.js 时，可以使用：

python3 ~/.codex/skills/.system/skill-installer/scripts/install-skill-from-github.py \
  --repo chunkithwang/design-playful-app-icons \
  --path skills/design-playful-app-icons \
  --method git

Codex 会在下一轮对话中发现新安装的 Skill。

更新

更新项目级安装：

npx skills update design-playful-app-icons

更新用户级安装：

npx skills update design-playful-app-icons --global

使用流程

  1. 把产品需求压缩为 物体 + 动作 + 情绪。
  2. 选择一套视觉路线并创建 3 个不同概念。
  3. 按产品含义、轮廓和原创性评分，选出最强方向。
  4. 明确几何、构图、表情、配色、材质、光线和负面约束。
  5. 生成图标，或在没有图像工具时交付完整提示词与构造规范。
  6. 在 1024、180、60 和 32 px 下评审，只修正最弱维度。
  7. 交付最终图标或提示词、配色、生产说明与质量报告。

平台支持

平台 说明
Codex 支持完整工作流；图像工具可用时可直接生成和迭代
Claude Code / Cursor 支持概念、提示词、评审和交付流程；实际生成能力取决于所接入的图像工具
其他 Agent 需要能够安装并读取标准 Agent Skills

目录结构

skills/design-playful-app-icons/
|-- SKILL.md
|-- agents/
|   `-- openai.yaml
`-- references/
    |-- design-recipes.md
    |-- evaluation.md
    `-- style-profile.yaml

其中：

design-playful-app-icons (chunkithwang/design-playful-app-icons)

Searching Database…

518 ·GitHub
Design-playful-app-icons
What is this?A public, plain-text Agent Skill that helps an AI agent design, generate, improve and review bold, playful app icons that are ready for store release. It uses no reference images and does not copy specific artists, studios or apps.
Is it software I install and run?No, it is a set of instruction files rather than an app. SKILL.md holds the core workflow, originality rules and delivery format, style-profile.yaml holds the visual parameters, design-recipes.md holds the four visual routes and prompt recipes, and evaluation.md holds the scoring and small-size checks.
Do I need Node.js or an image tool?Node.js is needed only for the Skills CLI route; the Codex built-in installer is the alternative when running Node.js is inconvenient. Generating the icon image itself needs a separate image tool, otherwise you get prompts and specs instead.
Does it always produce the icon image itself?Not necessarily. Without an image tool it stops at a complete prompt and construction spec that you can run in your own generator.
Which agents does it work with?Codex supports the full workflow, including direct generation and iteration when an image tool is available. Claude Code and Cursor get the concept, prompt, review and delivery steps, but actual image generation depends on the image tool you connect. Other agents must support standard Agent Skills.
Is there an English version of the docs?Yes. Alongside the Chinese README, the repository includes README.en.md, which is the English version of the documentation.
How does it keep the concepts from looking alike?It asks for three directions that differ in metaphor or silhouette, not just colour. It then scores them on product meaning, silhouette and originality and keeps the strongest one.
Which visual route fits which kind of app?Flat mascot suits light tools, community, education and lifestyle apps. Soft 3D suits efficiency, health and consumer AI. Gradient silhouette suits music, creative and entertainment products. Minimal glyph suits professional, developer and productivity apps.
What are similar projects?appllama-skills, taste-skill, photo-abstract-editorial, handraw-style, holo-card-studio, evondevKit, oil-ui, ai-design-skills
Which topics is it in?bilingual, ui-design, icons, creative-tools, codex-skill, yaml, claude-skills, image-generation, design, prompt-engineering, mobile-app, cursor
Creator
chunkithwang
Size
<0.1 MB
Stars
518
Updated
CommitAug 06
Age
3mo
Commits · 90 Days