Communitygithub.com

苹果设计:发布会风格产品影片

制作苹果风格的发布会产品影片:在Three.js中构建并打光真实3D产品,利用节拍进行大胆剪辑、巨型动态字体、带标注的切换镜头、配色或饰面展示、结尾卡片,以及用代码创作并与画面同步的原创配乐。渲染为带音频的1080p MP4。

苹果设计:发布会风格产品影片 是什么?

该AI技能用于生成30-35秒的苹果发布会风格产品宣传片。它包含两个基础影片模版:'oto'(色彩鲜明、动感活泼,适合消费类电子产品)和'vela'(电影级暗调、金属质感,适合高端硬件)。技能的核心机制是纯函数式帧渲染——每一帧都是时间t的纯函数,不支持`Date.now`、CSS动画或帧间状态,因此能实现帧级精确渲染。工作流程包括:先根据用户提供的产品信息制定节拍表(8-11个镜头,按音乐节拍排列),然后在Three.js中建模产品(使用`MeshPhysicalMaterial`材质,支持清漆、光泽和金属质感),编辑`music.py`用numpy创作配乐(含底鼓时间戳和包络线),最后通过无头Chrome逐帧渲染并编码为MP4。它还支持自定义配色/饰面、动态排版、标注切换镜头和产品专属镜头。

兼容平台✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/aronovdaniel14-cmd/apple-design/tree/HEAD

在你喜欢的 AI 中提问

打开一个已预加载此 Agent Skill 的新对话。

文档

Apple Design:发布会风格影片

此技能可制作30-35秒的苹果发布会风格产品影片。随技能附带两部已完成影片,每部新影片均以其中一部为基础:

影片风格适用场景
films/oto流行风格。 纯色色块随节拍切换,巨大白色文字,产品随低音弹跳,120 BPM浩室音乐。消费电子、音箱、耳机、玩具,任何有趣或色彩丰富的产品。
films/vela电影风格。 黑色舞台、影棚金属质感、辉光、缓慢镜头移动、光束与投影世界、爆炸视图,100 BPM配乐。高端硬件、相机、可穿戴设备,任何“工程感”产品。

渲染后打开任一文件夹中的 out/sheet.jpg 或直接阅读 film.js 以查看所有镜头。references/film-recipe.md 解释了影片的构成方式并列出可复用的镜头模式。在编写新影片前请先阅读它。

影片工作原理

  • films/<name>/index.html 设置字体和排版样式。
  • films/<name>/film.js 使用Three.js基本几何体构建产品,并定义 SHOTS,即 { a, b, f(t, p) } 时间范围列表。renderAt(t) 会重置场景并调用该秒对应的镜头。每一帧都是 t 的纯函数:不使用 Date.now、CSS动画或帧间状态。这使帧级精确渲染成为可能。
  • films/<name>/music.py 使用numpy创作配乐并输出 out/score.wav。Oto版本还会写入 env.json(底鼓时间和每帧低音包络),使产品和音圈能跟随实际音轨做出反应。
  • render.mjs 提供文件夹服务、在无头Chrome中使用GPU渲染帧,并编码为MP4。

新影片工作流程

  1. 简报。 获取产品名称、产品定位及一个令人惊喜的特点、3-5个真实参数(带单位的数字)、颜色或饰面、标语和发布语(如“2027年上市”)。如果用户只提供粗略想法,请编造得体的具体信息并说明。最多只问一个问题。
  2. 选择基础影片(流行风格选Oto,电影风格选Vela)并复制:cp -r films/oto films/<name>(小写,无空格)。删除复制后的 out/ 文件夹和 env.json。
  3. 先编写节拍表。 选择BPM(100-124)。在小节网格上安排8-11个镜头(120 BPM时一小节为2秒,因此镜头长度为2、4或8秒),并标注每个镜头的屏幕文字。遵循结构设计中的弧线:开场 → 高潮 → 名称 → 功能 → 内部结构 → 关键数字 → 配色/饰面展示 → 静默 → 结尾卡片。仅在用户要求审核时才以表格形式展示;否则继续。
  4. 在 film.js 中建模产品,替换 makeOto / makeDevice。使用车削轮廓、球体、圆环和圆角矩形构建,材质用 MeshPhysicalMaterial(清漆、光泽、金属质感),并添加画布纹理用于格栅、屏幕和标签。提供 pose(...) 或 setFinish(...) 函数供镜头调用。参见结构设计中的建模部分。
  5. 重写镜头和文字:SHOTS、CAPS、标签、配色/饰面名称、结尾卡片。确保剪辑落在节拍边界上。复用已有辅助函数(showWord、showRings、drawField、panels、cam、切换镜头支架、标引线)。
  6. 编辑复制的 music.py 创作音乐:设置BPM、调式或和弦列表,以及编曲模块,使每个部分与其镜头匹配(揭示时重击、切换镜头时分解、结尾卡片前静默)。如果影片使用 env.json,保留 kick_times 和包络导出。
  7. 检查静帧,然后渲染(在技能文件夹中运行):
    python3 films/<name>/music.py
    node render.mjs <name> sheet            # 8帧 → films/<name>/out/sheet.jpg
    node render.mjs <name> stills 4.2,9,17  # 任意精确秒数
    node render.mjs <name> final            # → <Name>_Launch_Film.mp4 含音乐
    
    查看静帧缩略图。在全渲染前修正任何裁剪、重叠、偏离中心或不可读的问题。final 以60 fps渲染34秒大约需要3-8分钟;使用 final 30 可快速得到草稿。
  8. 交付。 提供最终MP4和静帧缩略图的路径,逐行列出每个镜头,并给出具体调整建议(文案、颜色、时间、音乐)。

一次性设置

cd ~/.claude/skills/apple-design && npm install
python3 -m pip install numpy scipy      # 或使用虚拟环境

需要安装Google Chrome和ffmpeg。如果Chrome安装在非标准路径,请设置 CHROME_PATH。

质量标准

  • 每个剪辑和每个文字都必须落在音轨的节拍网格上。检查 a/b 时间与BPM的对齐。
  • 每个镜头只传达一个核心想法。字幕≤7个词,巨型文字1个词。
  • 产品光照足够表现其形体:主光、轮廓光、柔和接触阴影、金属上的环境反射。
  • 至少有一个只有该产品才能拥有的专属镜头(Oto的切换镜头和“声音越大抬得越高”,Vela的墙壁、桌面和天花板)。
  • 结尾卡片包含产品名称、一个标语和发布语,然后在最后一个音符上淡出。
  • 每次最终渲染前都要查看静帧缩略图。

使用限制

“苹果风格”仅指视觉风格。不得使用苹果的标识、产品名称、商标、SF Pro字体或真实苹果素材。本技能使用的字体为Inter和Inter Tight。仅在用户要求创作概念性内容时编造产品名称和规格,并标注为概念作品。

相关技能