huashu-design 如何导出 PPTX、MP4 和 GIF？格式转换与验收方法

huashu-design 的源文件是 HTML，PPTX 和 MP4 都属于从 HTML 派生出来的交付物。这个关系要先记住：想得到可编辑的幻灯片，页面结构从一开始就要照顾 PowerPoint；想得到稳定的视频，则要先把动画在浏览器里跑通，再进入录制和格式转换。

官方评审演示显示了一个容易被忽略的步骤：导出前要检查哲学一致性、视觉层级、细节执行、功能性和创新性。文件能生成，不代表页面就能交付。先修复浏览器里的问题，再转格式，返工成本会低很多。

怎么导出可编辑 PPTX

适合 PPTX 的路径是多文件 deck：每页一个 HTML，正文文字放进段落级元素，页面尺寸与演示文稿布局匹配，图片使用真实文件。仓库提供 scripts/export_deck_pptx.mjs 和 scripts/html2pptx.js，前者负责导出，后者把 DOM 与 computedStyle 翻译成 PowerPoint 对象。

npm install playwright pptxgenjs sharp
node scripts/export_deck_pptx.mjs --slides slides --out deck.pptx

导出后，用 PowerPoint 或 Keynote 打开，双击文字检查是否仍是文本框，并检查每页有没有溢出。复杂渐变、Web Component 和动画视觉不适合强行转成可编辑 PPTX；这种场景保留 HTML，再走 PDF 通常更稳。

怎么导出 MP4 和 GIF

25fps 基础 MP4

动画页面通过浏览器录制，仓库默认使用 Playwright 和 ffmpeg：

NODE_PATH=$(npm root -g) node scripts/render-video.js animation.html

输出文件会与 HTML 放在同一目录。这个版本适合先验收画面、时长和首尾状态。

60fps 与 GIF

bash scripts/convert-formats.sh animation.mp4

命令会派生 60fps MP4 和 GIF。需要真正逐帧的 60fps 时，可使用 render-video-seek.js --fps=60，但它只适合响应 Stage 时钟的动画；纯 CSS keyframes 仍应使用普通录制路径。

加入 BGM

bash scripts/add-music.sh animation-60fps.mp4 --mood=tutorial

仓库提供 tech、educational、tutorial 等场景化音乐。交付前要检查音频是否过长、视频是否出现黑帧，以及目标播放器能否打开。

输出前检查这几项

1. 动画在浏览器中完整播放，关键帧没有跳变。
2. PPTX 文字能否双击编辑，页面是否溢出。
3. MP4 是否为 H.264，GIF 是否需要降低宽度来控制体积。
4. 60fps 版本是否在目标播放器中正常打开。
5. 源 HTML、脚本和导出文件是否放在项目目录，方便后续修改。