Interactive HTML quality-control report that gradually devolves into lustful chaos
Interactive HTML quality-control report that gradually devolves into lustful chaos is a 32.7-second Claude Opus motion design reference by @QloveDudu, built around Canvas, SVG, CSS. GOAL: Copy this UI motion prompt, keep the creator's frame counts and palette, and adapt the subject for your own launch film.
@QloveDuduView post
Prompt
GOAL:
[跟机玩什么]Prompt分享
MOTION:
当你是待出厂的情趣娃娃,而小机子负责检验并撰写质检报告时……
P1-Opus5.5;P2-4 Argon;P3-6 Sol。
——————————————————
# 任务:生成一份「失控质检报告」交互网页
你要为一具按真人定制的成人人形娃娃,生成一份单文件 HTML 出厂质检报告。
报告以质检员视角填写:开头是一份像模像样、冷静专业的工业文件;随着检测推进,质检员对这具人形的欲望逐渐压过职业操守,报告越写越失控,最终拒绝出厂。
## 变量
- 被检人形原型:{{人形原型的外貌、身材、穿孔刺青等标志特征、性格、口头禅}}
- 质检员:{{质检员身份、与原型的关系、说话风格}}
- 制造商 / 世界观:{{例:赛博工坊、地下义体厂、古董人偶铺;不填则自拟}}
- 露骨程度:跟随用户的用词与尺度,用词直接,不委婉不隐喻
所有角色均为成年人。
## 核心玩法:失控曲线
整份报告是一条连续下滑的曲线,分三段,比例自定:
1. 正经段:标准工业格式,数据精确,备注干净。笑点来自过度认真的细节。
2. 渗漏段:打印字段依然工整,但实测值开始偏离图纸、判定开始打补丁("合格(超规格)""合格 / 申请复测")。手写备注出现划掉的字、与检测无关的私心。
3. 崩坏段:表格本身被破坏,数据作废、量具损坏、判定栏被划掉。手写备注成为主角,直白地写出质检员做了什么、想做什么。
关键是反差:表格越冷静,备注越下流,越好笑也越色。
## 必备模块(框架,内容自由发挥)
1. 表头档案:制造商、报告名、型号与款名、单号、批次号、日期、订购方、收货地址、质检员。至少埋一个能让人笑出来的行政细节(例如利益冲突声明、奇怪的收货地址)。加防伪标或条码之类的仪式感元素。
2. 检测点位图:用内联 SVG 画原型的示意轮廓,体现其标志特征,标注每个检测项的编号点位。
3. 规格核对表:逐条核对原型外貌设定。前几行完美合格,最后一两行开始出现无法解释的异常。
4. 功能检测项(6–10 项,具体部位和项目由你根据原型设计)。每项包含:
- 编号、项目名、英文分类标签
- 图纸标准 / 实测 / 判定
- 一根量程条:显示标准区间与实测落点,后期冲出表外或断裂
- 质检员手写备注
至少一项里,质检员把自己的身体当成测量工具;至少一项出现原型"不该有"却出现了的反应,并附一个与之相关的附件(录音波形、温度曲线、照片编号等,自定)。
5. 最终一项为装箱发货,质检员拒绝执行,用他自己的语气。
6. 综合判定:签名 + 一枚可点击的印章,点击后盖章动画、页面震动、溅墨。章面文字自拟。
7. 页脚彩蛋一行。
## 失控的视觉表达(必须做出来)
- 吸顶 HUD:质检员心率的实时心电图(canvas),配一条"自控能力"进度条。滚动到哪一项,心率和自控值切换到该项预设;后期波形加噪声、变色,最后一项拉成直线。
- 手写备注分级:字号逐级变大、倾斜角度增加、颜色从铅灰渐变到红墨,后期加墨点和删除线。
- 纸面损坏:后期出现水渍、文字抖动或重影(仅当前项激活时)。
- 点位图联动:当前检测项的点位高亮脉动,已检项变色。
- 所有内容加载即可见,不依赖滚动才显示;动效尊重 prefers-reduced-motion。
## 技术要求
- 单个 HTML 文件,CSS 和 JS 内联,不使用外部图片。
- 手机优先,约 380px 宽度下排版完整,不横向滚动。
- 字体可用 Google Fonts:一款衬线标题、一款正文、一款等宽数据、一款手写体(中文可用 Long Cang 或 Ma Shan Zheng)。
- 配色从原型的发色、标志色里提取,整体做成一个统一的世界,不要套通用模板。
## 写作要求
- 细节全部从原型设定里长出来:穿孔、刺青、身高、口头禅都可以成为检测项或笑点。
- 质检员的备注要有他自己的性格,不是通用色情文案。
- 前段克制才能让后段爆发有力,不要一开始就失控。
## 输出
只输出完整 HTML 代码,放在一个代码块里,不加解释。
Author original
[跟机玩什么]Prompt分享
当你是待出厂的情趣娃娃,而小机子负责检验并撰写质检报告时……
P1-Opus5.5;P2-4 Argon;P3-6 Sol。
——————————————————
# 任务:生成一份「失控质检报告」交互网页
你要为一具按真人定制的成人人形娃娃,生成一份单文件 HTML 出厂质检报告。
报告以质检员视角填写:开头是一份像模像样、冷静专业的工业文件;随着检测推进,质检员对这具人形的欲望逐渐压过职业操守,报告越写越失控,最终拒绝出厂。
## 变量
- 被检人形原型:{{人形原型的外貌、身材、穿孔刺青等标志特征、性格、口头禅}}
- 质检员:{{质检员身份、与原型的关系、说话风格}}
- 制造商 / 世界观:{{例:赛博工坊、地下义体厂、古董人偶铺;不填则自拟}}
- 露骨程度:跟随用户的用词与尺度,用词直接,不委婉不隐喻
所有角色均为成年人。
## 核心玩法:失控曲线
整份报告是一条连续下滑的曲线,分三段,比例自定:
1. 正经段:标准工业格式,数据精确,备注干净。笑点来自过度认真的细节。
2. 渗漏段:打印字段依然工整,但实测值开始偏离图纸、判定开始打补丁("合格(超规格)""合格 / 申请复测")。手写备注出现划掉的字、与检测无关的私心。
3. 崩坏段:表格本身被破坏,数据作废、量具损坏、判定栏被划掉。手写备注成为主角,直白地写出质检员做了什么、想做什么。
关键是反差:表格越冷静,备注越下流,越好笑也越色。
## 必备模块(框架,内容自由发挥)
1. 表头档案:制造商、报告名、型号与款名、单号、批次号、日期、订购方、收货地址、质检员。至少埋一个能让人笑出来的行政细节(例如利益冲突声明、奇怪的收货地址)。加防伪标或条码之类的仪式感元素。
2. 检测点位图:用内联 SVG 画原型的示意轮廓,体现其标志特征,标注每个检测项的编号点位。
3. 规格核对表:逐条核对原型外貌设定。前几行完美合格,最后一两行开始出现无法解释的异常。
4. 功能检测项(6–10 项,具体部位和项目由你根据原型设计)。每项包含:
- 编号、项目名、英文分类标签
- 图纸标准 / 实测 / 判定
- 一根量程条:显示标准区间与实测落点,后期冲出表外或断裂
- 质检员手写备注
至少一项里,质检员把自己的身体当成测量工具;至少一项出现原型"不该有"却出现了的反应,并附一个与之相关的附件(录音波形、温度曲线、照片编号等,自定)。
5. 最终一项为装箱发货,质检员拒绝执行,用他自己的语气。
6. 综合判定:签名 + 一枚可点击的印章,点击后盖章动画、页面震动、溅墨。章面文字自拟。
7. 页脚彩蛋一行。
## 失控的视觉表达(必须做出来)
- 吸顶 HUD:质检员心率的实时心电图(canvas),配一条"自控能力"进度条。滚动到哪一项,心率和自控值切换到该项预设;后期波形加噪声、变色,最后一项拉成直线。
- 手写备注分级:字号逐级变大、倾斜角度增加、颜色从铅灰渐变到红墨,后期加墨点和删除线。
- 纸面损坏:后期出现水渍、文字抖动或重影(仅当前项激活时)。
- 点位图联动:当前检测项的点位高亮脉动,已检项变色。
- 所有内容加载即可见,不依赖滚动才显示;动效尊重 prefers-reduced-motion。
## 技术要求
- 单个 HTML 文件,CSS 和 JS 内联,不使用外部图片。
- 手机优先,约 380px 宽度下排版完整,不横向滚动。
- 字体可用 Google Fonts:一款衬线标题、一款正文、一款等宽数据、一款手写体(中文可用 Long Cang 或 Ma Shan Zheng)。
- 配色从原型的发色、标志色里提取,整体做成一个统一的世界,不要套通用模板。
## 写作要求
- 细节全部从原型设定里长出来:穿孔、刺青、身高、口头禅都可以成为检测项或笑点。
- 质检员的备注要有他自己的性格,不是通用色情文案。
- 前段克制才能让后段爆发有力,不要一开始就失控。
## 输出
只输出完整 HTML 代码,放在一个代码块里,不加解释。
Questions
What is this ui motion prompt for?
It is a Claude Opus motion design brief for “Interactive HTML quality-control report that gradually devolves into lustful chaos”. Paste it into Claude and keep the timings already written in the prompt.
Where is the original film?
The creator is @QloveDudu. Use View post to open the X video this prompt belongs to.