3D 导演台

3D 导演台是基于 Three.js（@react-three/fiber + @react-three/drei）的 3D 场景编辑器，直接嵌入节点式创作画布中。你可以在三维空间里摆放角色模型与道具，调整灯光与相机角度，AI 自动生成灯光配置，一键截取镜头画面作为分镜参考图。

打开方式

3D 导演台有以下几种入口：

• 独立弹窗 — 从创作画布双击 DirectorStage 节点，或在漫剧编辑界面的 3D 导演台入口打开
• 画布节点 — 在创作画布中拖入「3D 导演台」节点，与其他节点串联成流水线
• 分镜辅助 — 在分镜编辑界面调用导演台，快速生成参考图

导演台弹窗默认占满 95% 视口宽度与 90% 视口高度，提供沉浸式的 3D 编辑空间。

场景组件

3D 导演台由以下组件构成：

组件	说明
Character	角色模型，支持从漫剧角色资产直接导入形象
Camera	相机视角，可调整位置、角度、焦距等参数
Prop	道具模型，用于丰富场景布置
SceneGround	地面，提供空间基准面
SceneLights	灯光系统，支持 AI 自动生成灯光配置
Skybox	天空盒，提供环境背景与氛围光照
Frame	画框，用于预览最终画面裁切区域

相机与导航

• 轨道相机 — 默认模式，围绕目标点旋转、缩放、平移
• WASD 漫游 — 第一人称视角，在场景中自由行走
• Gizmo 变换 — 选中任意组件后，使用平移/旋转/缩放工具精确调整
• 全景图查看 — 支持 360° 全景浏览模式

视图面板

导演台右侧提供多个视图面板：

• 镜头画廊（Shots Gallery） — 保存多个镜头预设，快速切换不同构图
• 大纲视图（Outliner） — 树状结构展示场景中所有对象层级
• 模型库（Model Library） — 浏览与导入内置/外部 3D 模型
• 属性面板 — 调整选中组件的变换、材质、灯光等详细参数

AI 灯光生成

点击「AI 生成灯光」按钮，AI 会基于当前场景描述、氛围标签、时间设定自动配置灯光方案：

• 自动推断主光、补光、轮廓光的位置与色温
• 支持「赛博朋克」「自然日光」「阴郁雨天」等风格预设
• 生成结果可手动微调，也可再次 AI 优化

💡 提示

AI 灯光生成需要先在场景中添加角色或道具，并填写场景的氛围描述。描述越具体，灯光效果越贴合预期。

保存与输出

• 保存场景快照 — 将当前场景完整状态（组件、位置、灯光、相机参数）保存到数据库，下次可完全恢复
• 生成预览图 — 一键渲染当前画面，生成 PNG 参考图，可直接用于分镜或画布节点
• 发送到画布 — 将预览图发送到创作画布，自动创建 ImageAsset 节点，串联后续处理流程

与画布联动

导演台作为画布节点使用时，支持以下工作流：

[角色资产] → [DirectorStage 节点] → [AI 灯光生成] → [渲染预览图] → [ImageAsset 节点] → [图片生成/编辑]

你可以在画布中将多个导演台节点串联，每个节点设置不同镜头角度，批量生成一组分镜参考图。

快捷键

快捷键	操作
W A S D	漫游模式下移动相机
Q / E	漫游模式下降低 / 升高相机
Tab	切换轨道相机与漫游模式
G	切换 Gizmo 为平移模式
R	切换 Gizmo 为旋转模式
S	切换 Gizmo 为缩放模式
F	聚焦选中对象
Ctrl + S	保存场景快照