title: “VibeCoding可粘贴话术工作法——六种体裁卡合并（动效/加载/颜色/状态机/菜单）” tags: [vibe coding, UI设计, AI编程, prompt工程, 工作流]
30秒讲会
Vibe coding 里最关键的动词不是”写代码”，而是把”我要什么效果”提前写成 AI 能执行的封闭句子。库里 6 张同族卡实锤了一个规律：给 AI 传一个形容词（“做个加载动画""好看点的动效”）= 无效指令；传一句成品话术（术语+场景+行为+恢复）= 一次生成到位。话术体裁有三种变体：物理白话（动效：像弹簧一样让位）、术语选型（加载：Skeleton 不是 Spinner）、封闭集表格（四列话术表/菜单六句，人按术语检索、AI 按话术执行）。 要紧的是：话术的本质是提前关闭 AI 的自由发挥维度——位置、控件、触发、反馈、恢复，每写死一样，AI 就少一个瞎编的地方。
怎么用
第一步·按你要解决的问题选成员卡（成品句子都在卡里）
| 要对 AI 说清… | 用哪张 | 句式骨架 |
|---|---|---|
| 动效质感（要”像活的”） | 卡片/方法/10-12-十种交互动画白话描述词 + VibeCoding八个高级动效描述词 | 物理行为：扩散/弹簧/惯性/涟漪 + 数值参数 |
| 等待状态（要”等得不焦”） | 卡片/方法/10-12-七种加载动效怎么说 | 术语选型：7 种各配一个场景 |
| 颜色一致性（要”页页同调”） | 卡片/方法/10-12-项目颜色职责体系 | 五组色×六角色映射表，语义色钉死不换 |
| AI 产品状态机（要”AI 的动静态”） | 20_知识卡/可复用方法/10-06-AI原生交互术语四列话术表 | 术语|效果|话术|场景 四列表 |
| 后台导航（要”找得到”） | 卡片/方法/10-12-后台菜单按病因选交互 | 位置+控件+触发+反馈+恢复 五要素 |
第二步·遇到上面没有的新领域，自造话术表（元方法）
{任何专业规范} → 写成四列 {术语 | 人话效果 | 机器可执行描述 | 适用场景} → 每条描述检查五要素是否齐全（缺”恢复行为”AI 就不会做收起动画，缺”状态反馈”就不会做高亮）。
第三步·通用验收清单（6 张卡里 AI 最常漏的细节，改前端页面时逐条对）：跟手（手停动画停）／清空后恢复原序／同级节点不撒谎／面板”项间移动不收”／持久化到用户配置而非 localStorage。
AI扩展（本节为AI补，非源内容）
- 三变体是同一件事的三个解：动效卡关”物理行为”维度、加载卡关”术语混淆”维度、表格卡关”检索与执行分离”维度——合起来是一条 Agent 工程原则：给 LLM 的指令里，封闭集永远优于开放描述。这与你 SKILL 里”脚本只做确定性取数、判断归 Agent”是同构的——话术表就是给 AI 的”确定性取数层”。
置信度：高（原则层） - 可预测延伸：此体裁大概率可复制到摄影参数沟通（“焦段+光线+机位+情绪”四列）、文案 brief（“钩子+结构+人设+禁忌”）——若你哪天要教 AI 拍照选片，先搭话术表再喂例子。
置信度：低（推测，未验证） - 簇的统计画像：6 样本跨 2026-08~10，覆盖 5 个子域——话术体裁的”子域扩张速度”本身就是需求信号：每月都有新子域被作者”翻译”成话术表，说明 AI 生成 UI 的沟通缺口仍未闭合。
置信度：中
何时不成立
- 全部话术出自中文短视频作者的个人归纳，非行业标准：跨团队/跨产品复用前先对齐叫法
- 话术=效果描述，不是实现规格（无组件库映射/断点/无障碍）——生产级仍需会读代码修代码，纯”鹦鹉式” vibe coding 在验收环节会卡死
- 单页小工具不需要颜色职责体系（overkill，原卡已标）；菜单六式仅限后台
- 合并卡数据修正记录：原颜色卡写”收藏 138 > 点赞 239（倒挂 0.58）“数学不通——实为赞>藏、不倒挂，本卡按订正入表；该误标暴露”倒挂”标签在簇内被滥用，引用簇内卡时数据以本表为准
给你（只有你能填）
- 本周阅读反馈：只读上面”30秒讲会”，回一个字——行 / 卡在××
- 若你近期要改 wiki 站或某个后台：直接用”怎么用”第三步的验收清单过一遍 AI 的产出
📺 西瓜同学🍉/SpicyTater/子康兄/敲代码的小虾米/Eric的AI星球/叨叨AI（六源合并卡），抖音 · 主源视频 · 库内 2026-09-15-AI编程设计：8个动效设计让App和小程序交互质感拉满V