Design Buddy — AI skill for Claude Code
Design Buddy: visual production Agent Skills for brand design systems, GPT-image-2 images, diagrams, infographics, logos, slide decks, WeChat layouts and social images.
How to install Design Buddy
This entry records only its repository, not the path inside it, so there is no
exact command to give. Open zephyrwang6/draw-skill and copy the folder into
~/.claude/skills/, or the file into ~/.claude/agents/.
What Design Buddy does
Design Buddy: visual production Agent Skills for brand design systems, GPT-image-2 images, diagrams, infographics, logos, slide decks, WeChat layouts and social images.
Alternatives in AI
- Guizang Ppt Skill — AI-agent Skill for generating polished HTML slide decks: editorial magazine and Swiss layouts, image prompts 24.9k ★
- AI Research SKILLs — Visual Skills Pack for Obsidian: generate Canvas, Excalidraw, and Mermaid diagrams from text with Claude Code 5.7k ★
- Image Use — Use your ChatGPT subscription to generate images from the command line — no OPENAI_API_KEY, no gateway, no dae 373 ★
README
Design Buddy
design-buddy.skill
「你想做的下一张图,何必从空白画布开始」
公众号 / 小红书 / B站 / 知乎:空格的键盘 | wzfh520@gmail.com
Design Buddy 是一套给内容创作者、产品经理、独立开发者和设计协作者用的视觉生产 Skill 集合。
它帮你把文章、观点、产品逻辑、品牌概念、故事脚本和数据结构,转成封面、配图、信息图、逻辑图、架构图、Logo、故事板、幻灯片、公众号排版和社交媒体图片。
基于开放的 Agent Skills 协议,可在 Claude Code、Codex、Cursor、OpenClaw、Hermes Agent、CodeBuddy、Workbuddy、Gemini CLI、OpenCode 等兼容 runtime 中运行。
不是让 AI 随机画一张“看起来还行”的图。
是先判断内容要表达什么,再选择合适的视觉结构、画面比例、设计风格和输出格式:
- 文章应该配概念图、流程图,还是场景图
- 产品逻辑应该画架构图、旅程图,还是路线图
- 小红书内容应该拆成几页、用什么版式
- 公众号文章应该用什么排版风格、怎样复制到编辑器
- 一段故事应该切成哪些关键分镜
- 一个品牌应该生成哪些 Logo 方向,或参考哪套真实品牌设计规范
- 一份 Markdown 应该生成单张图、批量配图,还是整套幻灯片
- 一份 Markdown 应该怎样变成可分享海报
看效果 · 安装 · 它能做什么 · 使用方式 · 工作原理 · 诚实边界
效果示例
用户 ❯ 给这篇文章做一张公众号封面
助手 ❯ 已分析文章主题:AI 生产力系统 / 上下文管理 / 个人工作流
推荐封面方向:
1. conceptual + warm editorial:适合个人品牌文章
2. blueprint + technical schematic:适合方法论/系统感
3. flat-vector + high contrast:适合社交媒体传播
将生成 16:9 封面,并保留标题可读区。
再看内容可视化:
用户 ❯ 把这段产品逻辑画成一张图
助手 ❯ 已识别为“多角色协作流程”,建议使用泳道图。
结构:
- 用户输入需求
- Agent 判断任务类型
- 分支 Skill 执行
- 输出报告 / 图片 / HTML
- 用户反馈后迭代
将生成可截图分享的 HTML 图表。
再看社交媒体图片:
用户 ❯ 把这篇文章拆成小红书 6 页图
Related Skills
Huashu Slide Codex
Codex-only AI visual material production skill — slides + WeChat covers + Bilibili/YouTube thumbnails, powered
Huashu Slide Doubao
Doubao-only AI visual material production skill — slides + WeChat covers + Bilibili/YouTube thumbnails, powere
Deckmason
AI presentation skill for coding agents. Generate production-quality HTML slide decks with 31 curated themes,
Lectern
Visual drag-and-drop editor for AI-generated slide decks. Ask Claude, ChatGPT or any coding agent for a presen
AI Slop Detector
A Claude Code and Codex skill that audits websites, UI, decks, and writing for AI-slop patterns (generic layou
Humanize Presentations
Remove AI tells from slide decks without destroying the ones that were deliberate. An agent skill for de-slopp
Related Agents
Image Sourcer
Finds REAL, existing images on the web — stock photos, illustrations, icons, logos, textures — with correct li
Courseware Developer
Use this agent to build training and teaching materials — interactive HTML courseware slide decks, animated fl
Design Studio
Visual design — logos, UI mockups, brand identity, social graphics.