3.4 KiB
3.4 KiB
交互指南 — QTE / Hotspot / Loop
QTE 快速反应事件
在视频播放到特定时间点时弹出按键提示,玩家在倒计时内按下指定按键。
"qte": {
"triggerTime": 1.0,
"prompt": "躲避飞来的石块!",
"promptKey": "right_door.qte.dodge",
"keys": ["ArrowLeft", "ArrowRight", "a", "d"],
"timeLimit": 3.0,
"successScene": "qte_success",
"failScene": "qte_fail",
"effects": {
"success": [{ "type": "add", "target": "courage", "value": 15 }],
"fail": [{ "type": "add", "target": "trust", "value": -20 }]
}
}
| 字段 | 说明 |
|---|---|
triggerTime |
触发时间(秒) |
prompt / promptKey |
提示文字 / i18n key |
keys |
有效按键(键盘 key 名,不区分大小写) |
timeLimit |
倒计时(秒) |
successScene / failScene |
成功/失败目标场景 |
effects |
成功/失败分别触发效果 |
注意: QTE 是模态交互。视频播放到 QTE 触发时暂停场景流程,QTE 期间视频结束事件被忽略。
可访问性: 玩家可在设置中开启"QTE 按键简化"(所有 QTE 统一为空格键)和"QTE 时限放宽 ×1.5"。
禁止跳过: QTE 场景建议设 "skippable": false,防止玩家跳过 QTE。
图片/视频热点(Hotspot)
在画面中划定可点击区域,玩家点击后触发分支。
图片热点
"investigation_site": {
"type": "image",
"imageUrl": "investigation_site/scene.jpg",
"contentSize": { "w": 1280, "h": 720 },
"hotspots": [
{
"id": "hs_desk",
"label": "查看书桌",
"labelKey": "investigation_site.hotspot.desk",
"targetScene": "desk_detail",
"x": 154, "y": 144, "width": 230, "height": 101
}
]
}
视频热点(按时间显隐)
"corridor": {
"videoUrl": "corridor/video.mp4",
"contentSize": { "w": 1280, "h": 720 },
"hotspots": [
{
"id": "hs_left",
"label": "走向左边通道",
"targetScene": "left_door",
"x": 26, "y": 216, "width": 384, "height": 324,
"showAt": 1.5
},
{
"id": "hs_right",
"label": "走向右边通道",
"targetScene": "alone_ending",
"x": 870, "y": 216, "width": 384, "height": 324,
"showAt": 5.0
}
]
}
| 字段 | 说明 |
|---|---|
showAt |
视频播放到此秒数后才显示热点(可选) |
hideAt |
视频播放到此秒数后隐藏热点(可选) |
conditions |
条件满足时才显示(可选) |
坐标系统
Hotspot 坐标使用绝对像素,基于 contentSize 指定的基准分辨率:
x, y— 左上角像素坐标width, height— 热点区域像素尺寸
引擎自动处理 object-fit: contain 的黑边偏移和屏幕缩放。
制作建议: 在 Photoshop 中测量坐标,直接写入 JSON。
循环等待(Loop)
视频播放到指定区间后自动循环,适合"等待玩家做决定"的桥段。
"stay": {
"videoUrl": "stay/loop.mp4",
"loopStart": 3.0,
"loopEnd": 6.0,
"choices": [
{ "text": "站起来离开", "targetScene": "alone_ending" }
]
}
- 视频 0-3s 正常播放(正文段)
- 到 3s 时循环开始,选项面板同时弹出
- 视频在 3.0-6.0s 之间反复播放,直到玩家做出选择
- BGM 不受循环影响(独立音频轨道)
视频制作技巧: 正文段和循环段合成为一个文件。循环段首尾画面应自然衔接。