SuperAPI AI 工具集

render-photo-grid-card

设计与创作

查看项目

更新于 10-15 21:54

技能介绍

用途:从 config 渲染“照片网格促销卡”视频格式。其标志是固定页眉(品牌字标、大标题、副标题与功能标签)之下,一个持续滚动、非静态的 2 行网格,整段约 10 秒向左滚动,边缘用 CSS mask 渐隐。

主要能力:网格瓦片为混合媒体,包括在瓦片内播放的视频片段、品牌产品/照片静帧、大衬线百分比或折扣字块,以及深色代码(优惠码)或 CTA 瓦片。文本(字标、百分比、代码)为真实 DOM,不由 AI 渲染。渲染器本身免费且确定性,采用 Playwright 逐帧步进与 FFmpeg,无付费调用。

用法:执行 build_card.py --config config.json --out hyperframe.html,再执行 render.py --config config.json --html hyperframe.html --out master-silent.mp4,得到 1080x1920、滚动网格、确定性的成片,成本 $0。瓦片视频通过 FRAME-SWAP 而非 <video> 驱动:render.py 预先用 ffmpeg 将每个片段抽成 PNG 帧并预加载,再按输出帧逐帧替换 <img class="vidframe"> 的 src。原因是 Playwright 自带 Chromium 无法通过 file:// 解码 <video> H.264,会在 canplay 卡住;交给 ffmpeg 解码可脱离编解码器依赖且保持确定性。片段长度应超过成片(否则循环播放),细微的 setpts-slow 可呈现电影感。

适用场景:需要批量、可复现生成竖版促销卡短视频的流程。

限制与依赖:瓦片视频片段与音乐属于其他能力,分别来自 create-video-fal(对产品主图做 i2v,或从品牌自有广告素材抽取)和 create-music-elevenlabs;配置由模板配方(DB)提供。每行瓦片数等于网格列数 cols,而非瓦片总数,网格按行优先填充。此能力本身不包含付费输入。