使用 AI 一键生成品牌全套视觉设计与 UI 资产

解决品牌冷启动时设计资源匮乏的痛点：通过集成 Gemini AI 脚本，快速生成包含 Logo、视觉识别系统、社交媒体素材及 UI 图标在内的全套商业设计资产。

为什么需要这个技能

在产品开发初期，开发者或创业者往往缺乏专业的 UI/UX 设计师来构建品牌形象。手动制作 Logo 或在不同平台适配 Banner 尺寸极其耗时且低效。

ckm:design 提供了一套标准化的设计工作流，将品牌心理学、工业设计标准与 AI 生成能力结合。它不仅能生成图像，还能输出可直接用于前端开发的 SVG 代码和 HTML 演示文稿，确保设计资产在技术实现上具备高度的可行性。

适用场景

• 品牌冷启动：需要快速生成 Logo 及全套企业视觉识别系统（CIP）样机。
• 营销素材制作：为 Facebook、X、Instagram 等多平台快速适配不同尺寸的 Banner 和社交图片。
• UI 资产构建：生成一套风格统一的 SVG 图标集，并定义设计令牌（Design Tokens）。
• 路演演示：利用 HTML 和 Chart.js 快速构建具有现代感的 Pitch Deck 演示文稿。

核心工作流

1. 品牌与 Logo 生成

通过 search.py 检索行业风格，然后调用 generate.py 生成白底 Logo。

# 搜索科技创业公司现代风格
python3 ~/.claude/skills/design/scripts/logo/search.py "tech startup modern" --design-brief -p "BrandName"

# 执行 AI 生成
python3 ~/.claude/skills/design/scripts/logo/generate.py --brand "TechFlow" --style minimalist --industry tech

2. 企业识别系统 (CIP) 样机

基于已生成的 Logo，快速扩展至名片、信纸等 50 多种交付物。

# 生成咨询行业名片样机
python3 ~/.claude/skills/design/scripts/cip/generate.py --brand "TopGroup" --logo /path/to/logo.png --deliverable "business card" --industry "consulting"

3. SVG 图标集开发

利用 Gemini 3.1 Pro 生成纯文本 SVG 代码，无需图像 API 即可获得矢量图。

# 生成线性风格的设置齿轮图标
python3 ~/.claude/skills/design/scripts/icon/generate.py --prompt "settings gear" --style outlined

4. 社交媒体素材流水线

采用 HTML/CSS → 截图 的方案，确保像素级精准控制。

• 分析 构思 HTML 渲染 Chrome DevTools 截图导出 视觉校验。

下载和安装

下载 ckm:design 中文版 Skill ZIP

解压后将目录放入你的 AI 工具 skills 文件夹，配置 Gemini API Key 后即可使用：

export GEMINI_API_KEY="your-key"
pip install google-genai pillow

你可能还需要

暂无推荐