svg-redraw-comparison git:20260911.6a6fc04A

Immutable. This exact content is served forever at /api/v1/blob/283050b2dbe8be85.

---
name: svg-redraw-comparison
description: 用参考图制作高精度 SVG 临摹绘制过程视频，交付纯 SVG 网页、独立 SVG 和原图对照 MP4。禁止 Canvas、位图嵌入与外链，按构图、线稿、固有色、阴影、高光、细节重放；横图上下、竖图左右合成。
---

# 基于大模型的SVG临摹重绘

**完成条件：用户拿到对比视频、可播放 Demo 和完整 SVG。只完成 SVG 或网页不算任务完成。**

## 1. 固定输入与方式

实际读取用户本次参考图。只有用户未提供图片时，才使用本模板示例。先保存原件，再无损重编码并去元数据；核对解码像素和比例。使用用户指定的大模型；不可用时说明缺项，不冒称模型来源。

阅读[完整作者提示词](prompts/author-original.prompt.txt)和[工作步骤](references/workflow.md)。作者要求完整构图、比例、轮廓、色彩、线条、细节与图层；不能擅自改成简化风格稿。

## 2. 先完成静态重绘，再制作过程

优先让大模型以参考图为唯一视觉依据，编写原生 SVG 与自包含 HTML。SVG图层/元素使用语义化名称，保持viewBox比例。页面不含Canvas、image/img、Base64图片、外链、外部字体/框架/脚本；JS/CSS须内联。

逐项比较人物五官、姿态比例、服装细节、物件、背景、光影与遮挡。粗稿应继续修正，不把“视频能导出”当成临摹通过。不能用完成图整张淡入、隐藏原图、背景贴图或逐像素矩形网格绕过要求。

本次高精度示例使用轮廓矢量化辅助路径。沿用此方法时，按工作步骤提供该图专属区域标注，明确记录“连续色域轮廓矢量化”，不冒称大模型手工逐笔绘制。不要把示例区域坐标套用其他图片。量化色差不为零时不能称“完全1:1”。

## 3. 构建绘制流程

组织构图定位 → 线稿 → 固有色 → 阴影 → 高光 → 细节，并在末尾保留完整画面。各阶段按人物、服装、场景等实际区域推进，避免整图一次性出现。过程为绘制步骤重放，不是模型内部思考录屏。

Demo必须能播放、暂停、重置和拖动；提供 `window.replay.duration` 与 `window.replay.renderAt(seconds)`，同一时间点结果必须一致。若模型生成了SMIL或CSS动画，为它添加内联适配函数控制动画时间，不依赖实际播放速度。

本包辅助生成工具用于具备相应区域结构的轮廓SVG；其他SVG或完整HTML应按其真实结构适配，不能硬塞进示例构建器。

## 4. 导出真正的视频

按[导出步骤](references/workflow.md)运行 `export_video.cjs`：浏览器只截取原生SVG；FFmpeg另外读取干净参考PNG，横图上下、竖图左右合成。原图可以出现在对比视频中，不能嵌入纯SVG网页冒充重绘。

固定帧率、逐帧取时，不以录屏卡顿决定时长。导出失败只重做视频阶段，保留已完成SVG/HTML，不重新调用绘图模型。

## 5. 验收并交付

检查空白起点、线稿、上色、最终画面；原图面板保持固定，末尾完整图可看清。核对视频帧数、尺寸、帧率与完整解码，区分SVG色差和视频压缩损失。

交付 MP4、HTML、SVG 和参数/验证记录，给出可打开的文件位置。只有输出文件实际存在并通过检查才报告完成。保留真实方法及仍存在的偏差；用户只收到网页时，继续完成视频，不结束任务。