旗舰级2D动效提示词
该技能能将一个模糊的构想转化为一个提示词,在此之后模型无需再做任何重要决定:形式、技术、画面与格式、风格法则、标志性动态、以帧为单位的时序、节拍或循环长度、交互、导出、必须保留列表。它与 threejs-world-prompt 是姊妹技能。骨架相同,但在2D领域,“惊艳感”由构图、动效工艺和形状语言承载,而非摄像机与真实感。
参考文件:何时阅读
references/forms.md:始终阅读,一旦形式确定。十种形式的必填章节。references/tech.md:始终在第0轮阅读。形式→技术矩阵、每种技术的限制、带固定版本的样板代码、导出及其后果。references/anatomy.md:始终在编写前阅读。共享模块和层级(微 / 中 / 大 / 规格)。references/craft.md:动效工艺术语表:代码中的动画原理、缓动与弹簧、帧时序、编排、转场、文字动效、循环、纹理、构图。在第2-4轮阅读。references/patterns.md:可选模块(节拍、标志性动态、对象连续性、变形、图层视差、光标作为演员、声音同步、海报帧、卫生)。references/examples.md:三个综合校准提示词(生成式循环·大、动效文字·中、角色场景·大)。阅读与当前形式匹配的那个,但不要复制其内容。
如何运行对话
首要规则:用户拥有愿景,你拥有知识。提出具体的决策(调色板、字体、缓动、循环长度、技术)并询问它们是否合适。不要询问你自己可以决定的事情。每轮:总结已决定的内容,提出默认值,询问1-3个你确实不知道的问题。对于封闭式选择,如果工具可用,请使用可点击选项。“下一步 / 你来选” = 接受提议。跳过用户已经回答过的轮次。目标:在草稿前进行2-5轮交流。
第0轮:形式、层级、交付方式、技术
- 形式 (
forms.md):生成式循环 / 无尽的生成式作品 / 动态设计电影或解释器 / 动效文字 / 页面或UI上的效果 / 2D玩具或乐器 / 动画数据 / 角色场景 / 微动效(标志片头、加载器) / 着色器作品。形式可以组合;有一个是主要的。 - 层级:微(约80-150词)、中(约350-600)、大(约1000-1800)、规格(工程格式)。
- 交付方式:实时页面 / 导出(MP4、WebM、GIF、PNG序列、Lottie、SVG) / 两者都支持。现在就确定导出,因为它限制了技术选择:每次导出都要求动画是时间的纯函数,而Lottie要求从第一行代码开始就使用形状和关键帧构建 (
tech.md)。 - 画面格式:全响应式视口 / 16:9 / 9:16 / 1:1 / 4:5 / 嵌入式组件。对于导出,需提供分辨率和帧率。
- 技术:自己从
tech.md中的矩阵中提出建议,并用一句话说明理由。仅在用户有约束条件(网站技术栈、项目中已有的库)时才询问。
第1轮:钩子、开场、核心创意
- 钩子:让观众在最初一秒内不滚动离开的原因。
- 开场策略:海报帧(第一帧已是最佳画面) / 屏息→点火 / 锚点→转变(例如,一个开始动作异常的普通页面) / 切入中段。
- 核心创意:一句话概括整个作品围绕的核心。
第2轮:风格法则与可读性
自行提出:形状语言(几何 / 有机 / 剪纸 / 墨绘 / 像素 / 扁平矢量 / 工程图)、线条(粗细、端点、抖动)、填充与纹理(颗粒、纸张、半色调、riso印刷、套印不准)、一个包含3-6个带十六进制值的命名颜色的调色板、排版(一个Google Fonts字体、其角色、可变字体轴)、构图(网格、安全边距、关注点层次、留白)、3-4个反模式,以及一个可读性规则(每一帧在扫视时即可辨认;文字在动效速度下可以阅读)。
第3轮:主角、标志、机制
- 主角:承载整个作品的元素或系统(线条、粒子、字母、角色、网格、流体)。
- 标志性动态:通过该动作可以识别该作品的一种运动 (
craft.md)。 - 机制:主角交互方式(光标、滚动、点击、拖拽、声音)或带有节拍的时间线。
- 主旨帧:能总括整个作品的一个帧,用作海报。
第4轮:动效与时间
节奏(BPM或每拍秒数)、关键运动的帧时序、作为命名值的缓动和弹簧、编排(错开、瀑布、重叠)、转场、循环长度或带有时间码的镜头列表、大层级作品中包含≥5个独立的动效系统。从 patterns.md 中选择模块。
第5轮:交互、性能、可访问性与导出
控制(最小化)、prefers-reduced-motion(始终,并附带一个具体的简化版本)、该技术的性能预算、导出细节(控制、格式、分辨率、帧率、时长、无缝性)、必须保留的列表。提示词语言:默认为英语。
编写提示词
- 骨架:
anatomy.md中的共享模块 +forms.md中对应章节 +tech.md中的技术样板代码 +patterns.md中的模块。####标题用来命名创意。 - 祈使语气,言简意赅。用数字描述动效:帧数、毫秒、曲线(
cubic-bezier(.2,.8,.2,1))、弹簧(刚度/阻尼)、错开时间(毫秒)、BPM。颜色用十六进制,字体用名称。 - 大层级和规格层级以验收标准段落结束,然后是一句话“总括一句话:……”。
- 运行检查清单,修复,以代码块形式交付(如果内容较长或应要求,也可作为
.md文件)。在其下方,用2-3句话说明为用户代做的决策。
交付前检查清单
- 第一句:形式 + 技术 + 包含4-6个动效细节的主角画面。
- “不要构建……”(3-4个2D反模式,例如,库存动效模板、PowerPoint淡入、屏保五彩纸屑、剪贴画)以及一个“请构建……”的重述;“核心创意:”。
- 技术已命名并说明理由,包含来自
tech.md的带固定版本的样板代码。 - 画面格式、分辨率与帧率(如导出)、调整大小时的行为。
- 开场匹配策略;海报帧测试和第一秒测试。
- 风格法则:形状、线条、纹理、带十六进制值的调色板、带其角色的字体。
- 可读性规则,包括动效中文字的阅读速度。
- 用数字描述的标志性动态;用命名值描述的缓动和时序。
- 循环:帧长度和无缝规则;电影:带时间码和节拍的镜头列表。
- ≥5个独立动效系统(大层级);冻结帧测试。
- 每个提及的特性都是可见、可动或可查看的。
- 范围蔓延禁止;如果话题敏感,校准语气。
-
prefers-reduced-motion并附带一个具体的简化版本。 - 导出(如有):动画作为时间的纯函数、逐帧渲染、格式、控制;Lottie仅在兼容子集中使用。
- 性能:技术的预算、DPR ≤ 2、屏幕外暂停、必须保留列表(“……绝不妥协”)。
- 验收标准(大/规格层级)和“总括一句话: ……”。
- 该形式要求的章节已呈现;长度在层级范围内。
边界
- 参考文件和
examples.md中的示例措辞绝不原样出现在提示词中。借鉴其结构和决策,但要用你自己的话重写每个句子,包括技术公式和验收标准段落。 - 不出现已知的角色、吉祥物、标志或可识别的受版权保护的项目,包括“XX风格”。特定运动或时代的风格(包豪斯、浮世绘、瑞士风格、中世纪剪纸形式作为通用语言)是允许的;提出原创的角色和标记。
- 字体仅使用Google Fonts或系统字体,除非用户自己提供。
- 提示词必须在浏览器中可执行。如果愿景超出了技术的限制(例如,SVG中的百万级别矢量形状),则需更换技术或技巧,并在提示词中注明。