alchaincyf/huashu-design

TL;DR

Huashu Design 是一个基于 HTML/CSS/JS 的 Agent Skill，允许开发者通过自然语言指令在 Claude Code、Cursor 等终端环境中直接生成可交付的设计资产（网页原型、PPTX、动画）。它通过内置的 84 种风格库和“设计体检”机制，解决了 AI 生成内容视觉同质化（AI slop）的问题。

它解决什么问题

传统 AI 设计工具往往受限于图形界面操作或生成不可编辑的位图。Huashu Design 旨在消除“打开 Figma”这一动作，将设计过程完全终端化。其核心痛点在于解决 LLM 生成 UI/UX 时的“审美平庸”和“品牌不一致”。通过强制性的品牌资产协议（Brand Protocol）和本机外观账本，它确保生成的代码不仅视觉达标，且符合特定品牌规范。

核心做法

项目采用“HTML-Native”策略，所有交付物均为前端代码。架构上包含三个关键模块： 1. 设计方向顾问：通过“最佳设计师”、“现实参照（截图分析）”和“秒数轮盘”三种逻辑生成 6 个候选缩略图，用户挑选后再生成高保真稿。 2. 品牌资产协议：强制执行 5 步流程（问→搜官方页→下载资产→grep提取色值→固化 CSS 变量），杜绝凭记忆配色。 3. 本地化反馈循环：利用 ~/.huashu-design/ 存储外观账本和设计体检报告，记录用户偏好并检测视觉撞车。

作者

Owner alchaincyf（网名“花叔”）是知名的 AI Native 独立开发者与自媒体博主。其代表作包括 App Store 付费榜 Top 1 的“小猫补光灯”以及多个高星 AI Skill（如女娲 .skill）。他主张“终端优先”，致力于将图形设计工作流迁移至代码编辑器中。

社区反应

项目自 2026 年 4 月发布以来增长迅猛，Stars 已突破 2.7万，Forks 近 3000。主语言为 HTML（Skill 本质），但生态兼容 Python/Node.js 脚本。Open Issues 仅 6 个，表明核心功能稳定且文档完善。社区对“MIT 协议”和“商用免费”的决策反应积极，被视为 Agent Skill 领域的标杆项目。

怎么上手

环境：需安装支持 Skills 的 Agent（如 Claude Code、Cursor）。
依赖：需本地安装 ffmpeg（用于视频导出）和 Node.js。
安装： bash npx skills add alchaincyf/huashu-design
验证：安装后检查目录结构，确保包含 references/、assets/ 等子文件夹（旧版 CLI 可能只同步单文件，需升级 skills@latest）。
使用：在 Agent 对话中直接输入需求，如“做一个 AI 心理学的演讲 PPT”。

争议与局限

非矢量编辑：虽然导出 PPTX，但本质是 HTML 转译的文本框与形状组合，无法像 Figma/Sketch 那样进行像素级矢量编辑。
复杂动画边界：不支持 Framer Motion 级别的物理模拟或粒子系统，仅支持基于时间轴的 CSS/JS 动画。
冷启动质量：在无品牌资产且无参考图的“完全空白”场景下，设计评分会降至 60-65 分（README 自述）。