为什么你做的东西一眼 AI?这 5 个开源工具,专治模板脸

你有没有发现，现在 AI 做出来的东西，越来越像同一个人做的。

不用看内容，翻到第三页就能认出来。渐变打底，标题居中加粗，几张圆角卡片一字排开，每张卡片头顶一个从免费图标库扒下来的小图标，有时候右下角还蹲着一个圆角的「立即了解」按钮。再往后翻，多半还有一页拿灰色方块冒充产品截图。

这种东西看多了会形成条件反射，看到类似的就想关掉。

我问了一下身边的人，发现很多人给 AI 提的要求是这样的，要高级一点，简约一点，有科技感。

这三个词在 AI 的脑子里对应的是同一套东西，就是它见过最多、最安全、最不会出错的那套模板。它不是在偷懒，它是在求稳。你越是说「高级」，它越往那个相同的模板里钻。

我得先替这些人说句话。我们大部分人都不是设计师，明天下午两点要交东西，今天晚上还得改数据。没有时间去研究什么风格流派，只想让这几十页内容别太丢人。

这种处境我太熟了。所以这五个工具，我挑的标准不是谁更厉害，是谁能在一个我们手里，把成品的质量下限抬起来。这五个工具涵盖了页面设计、设计方案、PPT制作以及示意图绘制。

这事儿我琢磨了挺久，后来干脆花了两天，把这条链上的开源项目从头到尾摸了一遍，摸出五个，一个比一个对症。

这五个分别解决的是五件不同的事。管住 AI 的手，让它先动脑再开始干，换掉它做 PPT 的底层，把它产出的东西榨干，最后再把最容易变丑的那块拼图补上。

我们一个一个来。（如果你只关心PPT，只需要看03和04即可）

01，先管住那只手，taste-skill

GitHub地址：https://github.com/Leonxlnx/taste-skill

第一个，也是最直接的，github上110k star，MIT 协议，叫 taste-skill。

它的定位一句话就能说清，专门拦着 Cursor、Claude Code、Codex 这些编码 agent，别再把页面做成模板货。

我看它仓库里放的四张成品图，看完就明白它跟别的不一样在哪。

这四张都在同一个示例目录里。一张是咖啡店首页，首屏不是库存照片，是一张手绘出来的店面，不是拍出来的那种。另一张是 techno 夜店的页面，它没给你放霓虹渐变，而是把活动日期排进了一张老档案照片里。还有一张把咖啡烘焙的四个阶段做成四张实拍，最后一张把常见问题做成一摞堆叠的索引卡，像有人随手放在桌上。

这四张图有个共同点，它们都不像 AI 做的。这就是它想干的事。

原理这块我拆了一下，它其实是三件事叠在一起。

第一件，它不信 AI 的自觉，只信规则。它先给你的生意归类，software、gaming、tech、product、service、place 六选一，然后像发牌一样，从配色库里发一套色，从字体库里发一组 Google Fonts 搭配，再从十一种测过的首屏布局里发一种给你。你不用再纠结「用哪个蓝」，它替你定了。

第二件，它逼着 AI 用真东西。真照片，来自维基共享资源的授权图，页脚会老老实实标来源。真品牌图标，本地解析成 SVG。真产品界面，不是拿色块糊一个假截图。这一条特别关键，AI 做的东西之所以假，很大一部分假在这些地方，它拿一个灰色方块冒充产品截图，拿一个渐变圆角冒充按钮。

第三件，它派人验收。交稿之前，它用无头 Chrome 把页面在 1440、1024、768、390 四个宽度各渲染一遍，逐条规则给你 PASS、WARN、FAIL。抓什么，抓空图、抓坏掉的 shader、抓对比度掉下去、抓两栏没对齐、抓占位文字没替换、抓编造出来的街道号。

来自于官网的v2版本的宣传视频

还有一个细节我特别喜欢，它对动效是有节制的。shader、滚动场景、鼠标跟随这些花活，只有 tech、gaming、software 三类页面才发，咖啡馆、酒店、商店、服务业，一个 WebGL 都不给。这条规则背后其实是个很懂事的判断，不是所有页面都需要炫，一家面包店的官网搞得像太空舱，那不叫高级，那叫错位。

怎么用，只需要你一行命令。

npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend"

需要 Node 22 以上，电脑里装好 Chrome 或者 Edge。不用 API key，不花钱。Claude Code 和 Codex 也能从插件市场装。作者还做了个桌面版叫 TasteCode，不想折腾命令行的可以直接下。

装完之后你就正常提需求，比如「做一个手冲咖啡工作室的官网」，它会自己走完归类、发牌、搭骨架、填内容、验收这一整套。

说真的，这个项目最让我服气的地方不是它做得多好看，是它敢给 AI 定死规矩。大部分人在用 AI 的时候是反过来的，指望它自由发挥，然后祈祷它发挥得好。它不信这套。

02，光管住手不够，还得让它动脑，ui-ux-pro-max

GitHub地址：https://github.com/nextlevelbuilder/ui-ux-pro-max-skill

taste-skill 有个前提，它假设你已经知道自己要什么风格，只是需要有人把执行标准卡住。

问题是有很多人连这个都不知道。

你跟他说做个瑜伽馆的预约页，他脑子里一片空白。

第二个项目就补这块，145k star，叫 ui-ux-pro-max-skill。它的 star 比 taste 还高，但在国内讨论度反而低一些，有点闷声干活的意思。

它跟 taste 的分工特别像装修。taste 是拿着验收标准天天蹲工地的监理，ui-ux-pro-max 是开工之前跟你坐在桌前聊风格的设计师。

它干的事是在 AI 动手写代码之前，先把一整套设计系统给你定下来。

原理是一个五路并行的检索加推理。你丢一个需求过去，它同时查五件事，产品类型对哪一类，风格库里有哪几种合适，配色库里有哪几套对味，落地页结构有哪几种能套，字体搭配有哪几组配得上。查完再过一遍推理引擎，用 BM25 给风格排优先级，按行业把不该用的东西过滤掉，最后走一遍 JSON 条件规则。

它 README 里直接把输出打了个样，我照着念一遍你就懂它有多具体。

需求是「给我的美容 SPA 做个落地页」。它给出的方案是这样的：

• 页面模式走 Hero-Centric 加 Social Proof，也就是首屏主打加社会证明，转化逻辑是先用情绪抓人，再用真实评价建立信任，最后才引导预约。风格定的是 Soft UI Evolution，关键词是柔和阴影、轻微层次、安抚感、高级感、有机形状。配色给到色值级别，主色 #E8B4B8 柔粉，辅色 #A8D5BA 鼠尾草绿，行动按钮 #D4AF37 金，背景 #FFF5F5 暖白，正文 #2D3436 炭黑。字体是 Cormorant Garamond 配 Montserrat。

最狠的是它有一栏叫 AVOID，明确写着要避开什么。高饱和霓虹色、生硬动画、暗色模式，还有一条，AI 紫粉渐变。

我当时就笑了一下。它等于把「AI 味」这三个字，翻译成了一条可以执行的禁令。

你想想看，一个开源项目，比很多设计师还懂怎么防 AI 味。。。

它背后的库有多厚，192 条行业推理规则，79 种可搜索的 UI 风格，192 套配色，74 组字体搭配，34 种落地页模式，119 条用户体验指南，25 种图表建议，22 种技术栈。这些东西不是拍脑袋写的，是一条条从真实项目里攒出来的行业经验。

怎么用

走命令行最稳

npm install -g ui-ux-pro-max-cli

然后进到你的项目目录，告诉它你用的是哪个 AI 工具。

uipro init --ai claude

后面的参数换成 cursor、windsurf、codex 都行。装完直接提需求，它会先吐方案再写代码。Claude Code 用户也可以走插件市场，两行命令的事。

它自带简体中文 README，不想啃英文的直接看中文那份。

到这里，网页这块基本解决了。但我猜你更关心的不是网页，是那个每周都要交、每次都被打回来的 PPT。

03，PPT 这块，得换个底层，ppt-master

GitHub地址：https://github.com/hugohe3/ppt-master

示例地址：https://hugohe3.github.io/ppt-master-examples/index.html

说到 AI 做 PPT，得先说说它的老路。

你搞清楚老路为什么不行，才知道这个项目为什么值得单独拎出来。

老路就两条。

一条是生成图片。

AI 把每一页当成一张海报画出来，画得确实漂亮，配色统一，排版讲究，但生成完你就抓瞎了。那不是 PPT，那是一摞图片。你想改一个错别字，得重新生成一整页。领导说把这页的数字换成上季度的，你只能重画。看着高级，用起来要命。

另一条是往模板里填字。

这倒是能改了，但模板本身就丑，填进去的字再多也救不回来。而且 AI 填的时候经常撑破版面，字溢出来，图片压住标题。

现在出来的第三条路就是 ppt-master 走的，74k star，直接给你一个真正的 PowerPoint 文件。

它的原理是构建 PowerPoint 的原生对象模型，不是画图，是造对象。

你生成出来的东西里，形状是原生的形状，连接线带着能拖动的调整手柄，图表是数据驱动的真图表，表格是真表格，文字、图片、填充、效果全都是 PowerPoint 认得的东西。你点任何一个元素，都能接着改。走模板那条路线的时候，它还能把真正的幻灯片母版和版式一起给你，不是一张假背景图冒充母版。

效果是什么样，它官方示例库可以直接下载 .pptx 打开看。三个例子跨度大得有点离谱。

一个是像素风的中国早餐图谱，用了 AI 精灵图、HUD 面板、Morph 转场、8-bit 音效提示。一个是 Transformer 那篇论文的技术蓝图，原生公式、示意图、备注、动画全都有。还有一个更狠，套着中国电信自己的年报模板，把 2025 年的业绩数据做进去，图表是原生导出的。

这三个能出现在同一个项目里，说明它不是只会做一种风格，是真的在往 PowerPoint 的能力边界上贴。

它还有个我很喜欢的点，先推理论证结构，再设计版式。不是拿到文字就开始往框里塞，是先想清楚这一页要证明什么，再决定用什么版式承载。这个顺序反了，做出来就是好看的废话。

怎么用，只需要三样东西。

装 Python 3.10 到 3.14，装一个能做事的 AI 工具，把你的材料丢进去。

git clone https://github.com/hugohe3/ppt-master.gitcd ppt-masterpip install -r requirements.txt ##安装依赖项

然后在 AI 对话框里说一句「用 ppt-master 把这份 PDF 做成答辩 PPT」，剩下的它自己跑。

它有三个承诺我觉得挺实在的。成本透明，项目本身免费，只花你自己的模型钱，不用再买什么 PPT 会员。数据留在本地，除了模型调用和你自己选择开启的搜索、生图、语音服务，整个流程都在你机器上跑。没有平台锁定，Claude、GPT、Gemini、Kimi 都能驱动它。

但我也得说它的实话，作者自己在 README 里写得很清楚，这不是许愿池。工具只管流程，模型决定上限。想低级模型出好活，那是做梦。

而且它生成的稿子不是一次到位，剩下的打磨本来就是你的活。它省掉的是最枯燥的那部分，不是全部。

作者是个财务出身的人，CPA、CPV、注册咨询工程师，天天审别人的 PPT，实在受不了 AI 生成的东西被压成图片改不了，才动手做的这个项目。这个动机挺打动我的，不是想做个炫技的东西，是被一个具体的小痛苦磨久了。

PPT 有了，但这事儿还没完。

04，一份内容，榨出四份，guizang-ppt-skill

GitHub地址：https://github.com/op7418/guizang-ppt-skill

第四个，是我觉得最会过日子的一个，29k star，作者是歸藏。

它做的是网页 PPT，单文件 HTML，横向左右翻页。但你真正该记住的不是这个形式，是它能一鱼多吃。

先说效果。

它内置两套视觉系统，风格差得特别远，是故意做得这么远的。

一套叫电子杂志 × 电子墨水，作者自己的形容是，像 Monocle 杂志贴上了代码。这套适合讲故事、讲观点、讲个人经历，带五套电子墨水配色，十种布局，封面、章节页、数据大字报、图文、图片网格、流程线、对比页都有。

另一套叫瑞士国际主义，网格至上，直角，发丝线，极致字号对比，配四套高饱和锚点色，二十二种锁定版式，封面、宣言页、关键指标塔、循环图、双栏对比、大图首屏、收尾宣言，每一版都卡死了，你只能在框里填内容，不能乱动。

顺便说一句，瑞士国际主义不是什么新潮的东西。它是上世纪五十年代那批瑞士设计师搞出来的，栅格系统、无衬线字体、大量留白、只讲事实不讲情绪，Helvetica 就是那批人留下来的东西。你现在看到的所有所谓高级感页面，往上追多半能追到这儿。归藏把它做成二十二种锁死的版式，等于把七十年前的设计纪律，重新打包了一遍，塞给 AI 用。

这两套的分工其实很清楚。你要讲一个故事，用第一套。你要讲一堆事实，用第二套。别反着来。

它还有个东西叫演讲者模式，双窗口，观众看到的是当前页，你看到的是当前页加下一页的预览，加演讲备注，加计时，还能自动翻页、激光笔、圈选，甚至现场电脑抽风了有个故障恢复。这个功能一般是要花钱的演示软件才有的，它塞在一个单文件 HTML 里。

真正让我觉得它会过日子的，是它能把同一套视觉规则延伸出去。同一份内容，除了 PPT，还能出公众号 21:9 头图、1:1 分享卡、小红书 3:4 图卡、视频号横版封面。你在做一个内容，它顺手把你全平台的图都配了。

原理这块，我想说说它为什么选 HTML 而不是 PPT 格式。

作者的理由有四条，我觉得每条都成立。

• HTML 和 CSS 是纯文本，Agent 能直接读、直接改、直接验证，不用去解析二进制。

• 表现力比 Markdown 高得多，能做精细定位、动画、交互、响应式。

• 交付特别轻，一个文件，浏览器打开就能讲，发微信也不会被压得稀烂。

• 好做质量控制，瑞士风那套可以用脚本校验版式、图片槽位、标题对齐、危险 SVG，还能用 Playwright 去量有没有超框、底部有没有多余空白、导航安全线有没有被压。

还有个小细节，按一下 B 键能把 WebGL 和 canvas 动画全关掉，退回静态模式。这个功能是给那些投影仪带不动、现场卡成幻灯片的老会议室的。

做过线下分享的人都懂这个有多重要。

怎么用，一行命令。

npx skills add https://github.com/op7418/guizang-ppt-skill --skill guizang-ppt-skill

也可以直接把这段话发给有权限的AI Agent：

帮我安装 guizang-ppt-skill。请把 https://github.com/op7418/guizang-ppt-skill 克隆到 ~/.claude/skills/guizang-ppt-skill,安装完成后检查 SKILL.md、assets/、references/ 是否存在。

已经安装过的话,用这段话更新:

帮我更新 guizang-ppt-skill。请进入 ~/.claude/skills/guizang-ppt-skill 执行 git pull,然后告诉我当前最新 commit。

装完直接说人话就行。

「帮我基于这篇文章做一份瑞士风 PPT，控制在 7 页左右，需要 2-3 张配图。」

它会先问你七个问题，风格、受众、时长、素材、需不需要配图、主题色、有没有硬性限制。问完再动手。这个流程有点像找了个靠谱的设计师，他不会上来就开干，先跟你把需求对齐。

但它也有明确的短板，作者自己写在 README 里的。大段表格数据不适合，培训课件不适合，信息密度不够，需要多人协作编辑也不适合，因为它是静态 HTML。

我喜欢这种把短板写在前面的项目。它知道自己不是万能的，反而更容易让人信。

对了，它的协议是 AGPL-3.0，自己用、学习、公司内部用都没问题，但如果你改造成对外提供的服务，开源义务比 MIT 严，商用之前记得看一眼。

05，最后一块拼图，Excalidraw

GitHub地址：https://github.com/excalidraw/excalidraw

讲到这，网页有了，设计系统有了，PPT 有了，封面卡片也有了。

但还有一个地方特别容易翻车，就是示意图。

你 PPT 里总有那么一两页，要画个流程、画个架构、画个知识结构。

大部分人这时候会打开那个大家都用的办公软件，拖几个方框，拉几根箭头，方框是标准的直角矩形，箭头是标准的实心三角，配色是默认的那几种。

画完之后整个 PPT 的气质一下就掉了，前面九页再精致，这一页一出场就像十年前的东西。

Excalidraw，135k star，MIT。

它就是个白板。打开网页就能画，不用注册，不用装。

效果上它有一个别的工具都没有的东西，手绘感。你画一条直线，它给你画出来的线是微微抖的，转角是圆钝的，填充是有笔触感的。这个效果不是滤镜，是它的渲染引擎在绘制的时候给每个点加了随机偏移，所以你看到的线像是有人拿着笔在上面走过一遍。

原理就这么简单，但效果很妙。因为它看起来像「随手画的」，所以它天然带着一种松弛感。塞进 PPT 里，看的人第一反应不是「这图做得真规整」，而是「这人真的想清楚了」。规整的流程图传达的是流程，手绘的示意图传达的是思考。这是两回事。

它还有几个实用的地方。无限画布，画多大都行。能导出 PNG 和 SVG，SVG 塞进 PPT 不糊。支持协作，一个链接甩给同学或同事就能一起改。有个素材库叫 library，可以把常用图形存起来复用。

怎么用，打开 excalidraw.com 就能画。要嵌到自己项目里，它也有 npm 包。

我在别人的论文和博客里见过不少它画的方法流程图，最大的感受是，画得糙一点反而更好看。那种故意留一点不对称、留一点手抖的线，比精修的矢量图更有说服力。

最后

这五个项目摆在一起，其实是一条完整的链条。

taste-skill 管住 AI 的手，不让它往模板里滑。ui-ux-pro-max 让 AI 先动脑，把风格和结构想清楚再动手。ppt-master 换掉底层，从生成图片改成生成真对象。guizang 把一份内容榨成四份，让产出的价值翻倍。Excalidraw 补上最后那块最容易变丑的拼图。

从网页到 PPT，从主体到配图，从做出来到改得动，每一环都有人在做，而且都做得挺认真。

但我写到最后想说点别的。

这五个工具，坦率的讲都在干同一件事，把「审美」这件原本靠天赋、靠经验、靠感觉的事，拆成一条条可以执行的规则，然后塞给 AI。

以前你要做一个好看的页面，得先看一百个网站，攒三年的眼力。现在它直接告诉你，主色用这个，辅色用那个，别碰紫粉渐变，首屏别放库存照片。

这个变化挺大的。

但我也得泼一盆冷水。规则能保证的只是下限，它保证你做出来的东西不难看，不土，不像 AI 生的。它保证不了上限。真正让人眼前一亮的东西，还是来自那个「我知道我要什么」的瞬间，那个瞬间没法外包。

工具给你的是标准，不是品味。

回到开头那个问题。为什么同样是 AI，有的人做出来一眼假，有的人做出来就好看。

差别不完全在工具，还在那句需求。

把「高级一点简约一点有科技感」换成「我要做一个像旧杂志内页那样的页面，米色底，衬线字，图片要黑白的」。

同一个模型，输出会完全不一样。

因为它终于知道你要什么了。

对，就是这个。