技术笔记

AI时代，你也能画出妙趣横生的成语漫画

一段提示词，十分钟画出一套水墨成语漫画。画蛇添足、掩耳盗铃、刻舟求剑……蔡志忠味道的荒诞图解。

img2threejs：扔进去一张图，直接变成可交互的 3D 模型

img2threejs Skill 把一张图直接变成可交互的 Three.js 3D 模型。大神作品惊艳，但实测还原度跟原图差距较大，适合结构清晰的平面产品图转 3D 展示。

Codex + 4 个 Skills：审美、动效、工程、测试一条龙

Taste Skill（审美）+ GSAP Skill（动效）+ Ponytail Skill（极简工程）+ Playwright MCP（自动测试），四大开源 Skills 组成 AI 前端工业化开发流水线。

uniapp 小程序开发规范 Skill：20 条红线 + 8 份详解文档

用 AI 写 uniapp 小程序最怕 10 个页面 10 种写法、变量乱起、颜色硬编码。这个 Skill 用 8 份规范文档（请求封装/Pinia/路由/性能/存储/埋点/组件通信/红线）+ 20 条红线规则约束 AI，先定规范再让 AI 干活。

GPT image2 生成的 UI 效果图，如何高质量做设计还原

用 GPT image2 生成 UI 效果图后，直接 AI coding 或 Figma make 都会因为插画/图标 SVG 没法还原而翻车。最省钱的工作流：GPT image2 出图并分层 → MasterGo AI 抠图 → Figma 手动合并插画。

GSAP 官方 AI Skills：让 Agent 学会正确使用网页动画引擎

GSAP 官方出品的 8 个 AI Skill，教 Agent 正确使用 GSAP——核心 API、Timeline、ScrollTrigger、插件、React/Vue、性能优化。Webflow 收购后所有原 Club 插件（SplitText/MorphSVG 等）全部免费。

design-dna：把任何网站的设计语言提取成可复用的 JSON

一个面向 AI 编程智能体的 Skill：从截图、图片或网址中提取视觉设计的三个维度（设计系统 token、设计风格、视觉特效），输出机器可读的 Design DNA JSON，让任何 Agent 都能据此稳定复现一致的设计。

给 AI 装上审美：同一句需求，三种方法，UI 差了三档

用 Claude Code + DeepSeek V4 Pro 做同一个个人主页，零约束、设计提示词、截图参考三种方法测下来，AI 做出的 UI 质感差了三档。截图能告诉 AI 大概长什么样，但守不住为什么好看。

110 套 UI 设计 Skills 合集：给 AI 做 UI 装一个设计外挂

ui-skills.com 把 UI 设计、前端体验、动效、可访问性、设计系统等能力整理成 110 套可直接给 AI Agent 调用的 Skill，解决了 AI 写 UI 功能能跑但质感不足的问题。

先生图，后生站：用 Images 2.0 + Codex 去掉网站的 AI 味

让 Images 2.0 管审美，让 Codex 管代码。先生图后生站，两套模型分工，比逼一个全能选手干所有活出来的效果好得多。