地理地图视频(TikTok,德语)
用户是 TikTok 创作者。每个视频都完全在代码中使用 HyperFrames 构建(先阅读 hyperframes 技能:渲染合约、check、snapshot、render)。
语言:始终使用德语 - 脚本、旁白、字幕、标签、对用户的回复。
流程(当用户说出主题时,无需追问)
- 每个容器一次:
bash ~/.claude/skills/geo-karten-video/scripts/setup.sh(瓦片、图标、字体、本地 GSAP、边界、Piper 语音。网络:仅 npm、PyPI 和 GitHub 开放。 Esri/NASA-GIBS/HuggingFace/jsdelivr 被屏蔽,因此需要此处的变通方案。) - 项目:
bash scripts/projekt.sh <slug>->/home/user/videos/<slug> - 脚本(
skript.txt,每行 = 一个节拍/句子)。时长:30 秒约 65-70 个词,60-75 秒约 150-170 个词。 数字需为语音拼写出来,显示时使用{}:sechsundvierzig{46}。缩写需拼写完整(Lkw -> Laster)。 仅在有可靠来源时使用事实;估计值使用“约”/“大约”以及思维实验时的虚拟语气。 - 旁白 + 单词时间:
python3 scripts/voice.py skript.txt assets/audio --speed 1.05->voice.wav(48 kHz,-15 LUFS)+words.json。如果用户有自己录制的音频,则使用该音频 (然后通过npx hyperframes transcribe --model small --language de获取单词时间,如果模型可访问)。 - 地图:
python3 scripts/map.py assets/map --bbox lon0,lon1,lat0,lat1 --laender DEU,... --staedte "Berlin:13.40,52.52;..."(地区/联邦州:--admin1 "Bayern;Sachsen-Anhalt")。图像边长保持约 <=5000 像素。 - 图标:
python3 scripts/icons.py --suche "oil"和python3 scripts/icons.py assets/icons name=HEX ... - 构建场景 - 模板:
templates/beispiel-keiner-arbeitet/(index.html、karte.html、skript.txt)。 字幕:python3 scripts/captions.py assets/audio/words.json compositions/untertitel.html --duration <s> npx hyperframes check --json->npx hyperframes snapshot --at ... -o snap(每次调用最多约 6 个时间点, 否则进程将被终止)-> 查看图像 -> 修正。- 后台渲染:
npx hyperframes render -o renders/<slug>.mp4 -q delivery -w 2 --quiet(run_in_background)。之后使用 ffprobe 检查,查看联系表,将文件发送给用户。
风格(从 3 个参考视频分析得出 - 严格按此构建)
格式: 1080x1920,30 fps,30-75 秒。无片头,无标志,第 0 帧已经是钩子(着色国家 + 人物/图标)。
地图 = 舞台,一个连续的摄像机移动。 卫星图像,海洋为深青色,陆地自然绿色/米色。
几乎没有硬切:摄像机在节拍之间缩放/平移(0.8 秒 power2.inOut),其间缓慢漂移。
摄像机 = 一个包装器 #k-cam(transform-origin 0 0),目标通过 cam(px, py, scale) -> 将地图像素定位到屏幕中心(540, 900)。
所有依附于地点的元素(图标、标签、国家)都位于摄像机包装器内的地图像素坐标系中。
大数字和“TAG 1”标签位于屏幕空间。
国家作为 SVG 路径:区域半透明(fill-opacity ~0.66,卫星纹理透出),
浅色边框(约 2.5 px),阴影 drop-shadow(0 10px 10px rgba(0,0,0,.45))。颜色通过 GSAP 在 CSS fill 属性上动画(非 attr,CSS 优先于属性)。每个国家的固定颜色:
德国 #2f5bea(皇家蓝),土耳其/俄罗斯/伊朗 #e02424(红色),乌克兰 #e5a82e(黄橙色),
美国 #5aa9ff(浅蓝色),强调区域 #a8d82a(青柠色),政党/区域高亮 #f2a41c(橙色)。
颜色变化用于叙事(例如,发生事故时蓝色 -> 灰色 -> 红色)。
国家名称: 手写字体 Kalam 700,白色,倾斜(-8 到 -14 度),大号,阴影,通常被裁切。
人物/人: 抠图 PNG(由用户提供,因为无图像生成功能)或 OpenMoji 图形,
始终带有白色贴纸边框 + 阴影(类 .st:
drop-shadow(3px 0 0 #fff) drop-shadow(-3px 0 0 #fff) drop-shadow(0 3px 0 #fff) drop-shadow(0 -3px 0 #fff) drop-shadow(5px 9px 7px rgba(0,0,0,.45)))。
他们站立在自己的国家上,以弹出方式进入(back.out(2.2),0.45 秒)并以收缩方式退出(0.22 秒 power3.in)。
图标: 扁平风格,带有粗深色轮廓(OpenMoji):加油站、油桶、金钱、爆炸、船只、旗帜、投票箱…… 数量 = 许多小图标分布在城市上方,错开 40-70 毫秒出现。
数字: Montserrat Black,白色,巨大(170-230 px),硬阴影,位于图像上方(top ~240 px),
向上计数(1.0 秒 power2.out)。日期/天标签 96 px。
字幕: 每次显示一个词,大写,Montserrat Black 约 68 px,白色带深色阴影,
居中于 y ~1400(如参考视频,下三分之一处),每个词有轻微弹出效果。由 captions.py 生成。
引用来源: 标题/文档截图作为倾斜飞入的“纸条”;偶尔使用 B-Roll 照片(2-3 秒),然后返回地图。
音效: 旁白是时钟。音效使用节制(assets/sfx):重要贴纸时弹出声,摄像机移动时风声,
叉号/停止时错误声,转折点时重击低音。仅当用户提供文件时使用音乐(此处无音乐访问权限)。
戏剧结构
- 钩子 0-3 秒:提问或突发新闻 + 人脸/国家立即可见。
- 背景:具体数字/日期/来源。
- 逐步升级(天 1 / 天 3 / 天 7 或 事件 -> 反应 -> 后果),每 1-3 秒出现一个新元素。
- 转折点/回报(数字翻转,国家变色,抖动 + 冲击)。
- 结尾:拉远镜头 + 向观众提出开放性问题(评论)。无演职员表。
技术陷阱(已验证)
- GSAP 需本地加载(
assets/vendor/gsap.min.js),CDN 被屏蔽。 - 包含多个时间点的
snapshot会被终止 -> 以约 6 个为一组执行。 - 使用
-w 2渲染(大地图图像 + 滤镜需要 RAM)。 - Piper 语音听起来很合成(16 kHz)- 向用户提供自己的录音或 ElevenLabs 文件;
然后替换
voice.wav并重新确定单词时间。 - 图片来源标注小字显示在右上角:“Bild: NASA Blue Marble”。
- 容器是临时的:完成后立即将视频发送给用户;技能/项目仅在推送到 Git 仓库时持久保存。