艾克斯场景编辑器是什么？
艾克斯场景编辑器（原名 Spoke）是艾克斯虚拟空间内置的 3D 场景编辑器，支持在浏览器中通过拖拽操作创建虚拟空间场景。
┌─────────────────────────────────────────────────────────────┐
│ 工作流程 │
├─────────────────────────────────────────────────────────────┤
│ │
│ ┌──────────┐ ┌──────────┐ ┌──────────┐ │
│ │ 发现素材 │───→│ 搭建场景 │───→│ 发布分享 │ │
│ └──────────┘ └──────────┘ └──────────┘ │
│ │ │ │ │
│ ▼ ▼ ▼ │
│ • Sketchfab • 拖拽放置 • 一键发布 │
│ • Google Poly • 变换编辑 • Hubs 链接 │
│ • 本地上传 • 属性调整 • 邀请好友 │
│ │
└─────────────────────────────────────────────────────────────┘
核心功能
1. 发现 (Discover)
无需离开编辑器，就能搜索网络上的素材资源：
| 资源类型 |
来源 |
用途 |
| 3D 模型 |
Sketchfab、Google Poly、Kit 库 |
场景主体、装饰物 |
| 图片 |
Bing 图片搜索 |
海报、贴图、背景 |
| 视频 |
Tenor GIF、直接链接 |
动态展示、氛围 |
| 音频 |
Hubs 音效包 |
背景音乐、环境音 |
2. 创建 (Create)
基于浏览器的完整 3D 编辑能力：
- 可视化编辑：所见即所得的 3D 视图
- 层级管理：场景图层级结构清晰
- 组件化元素：35+ 种预设元素类型
- 实时预览：即时看到修改效果
- 撤销重做：完整的历史记录
3. 分享 (Share)
一键发布到 Hubs：
- 生成可分享的 Hubs 房间链接
- 支持房间权限设置
- 可随时更新场景并重新发布
编辑器架构
┌─────────────────────────────────────────────────────────────┐
│ 艾克斯场景编辑器架构 │
├─────────────────────────────────────────────────────────────┤
│ │
│ ┌─────────────────────────────────────────────────────┐ │
│ │ UI 层 (React) │ │
│ │ ┌─────────┐ ┌─────────┐ ┌─────────┐ ┌─────────┐ │ │
│ │ │ 视口 │ │ 层级 │ │ 属性 │ │ 资源 │ │ │
│ │ │ Viewport│ │Hierarchy│ │Properties│ │ Assets │ │ │
│ │ └─────────┘ └─────────┘ └─────────┘ └─────────┘ │ │
│ └─────────────────────────────────────────────────────┘ │
│ │ │
│ ┌─────────────────────────────────────────────────────┐ │
│ │ 编辑器核心 (Editor) │ │
│ │ • 场景管理 • 命令系统 • 导入导出 • 历史记录 │ │
│ └─────────────────────────────────────────────────────┘ │
│ │ │
│ ┌─────────────────────────────────────────────────────┐ │
│ │ 渲染层 (Three.js) │ │
│ │ • WebGL 渲染 • 光照计算 • 材质系统 │ │
│ └─────────────────────────────────────────────────────┘ │
│ │
└─────────────────────────────────────────────────────────────┘
支持的元素类型
场景编辑器提供 35+ 种场景元素，分为以下几类：
基础对象
| 元素 |
说明 |
| Group (组) |
将多个对象组合在一起管理 |
| Spawn Point (出生点) |
用户进入场景的位置 |
| Scene Preview Camera (场景预览相机) |
设置场景缩略图视角 |
3D 模型与媒体
| 元素 |
说明 |
| Model (模型) |
GLTF/GLB 格式的 3D 模型 |
| Image (图片) |
平面图片展示 |
| Video (视频) |
平面视频播放 |
| Kit Piece (套件组件) |
建筑套件等的预制件 |
灯光
| 元素 |
说明 |
| Ambient Light (环境光) |
均匀照亮整个场景 |
| Directional Light (定向光) |
模拟太阳光 |
| Point Light (点光源) |
从一点向四周发光 |
| Spot Light (聚光灯) |
锥形光束 |
| Hemisphere Light (半球光) |
天空/地面颜色渐变 |
交互与逻辑
| 元素 |
说明 |
| Trigger Volume (触发器) |
检测用户进入/离开区域 |
| Switch (开关) |
可切换状态的控制器 |
| Way Point (路径点) |
导航点/传送点 |
| Spawner (生成器) |
动态生成对象 |
| Media Frame (媒体框) |
固定媒体展示区域 |
音频
| 元素 |
说明 |
| Audio (音频源) |
播放背景音乐或音效 |
| Audio Zone (音频区域) |
空间化音频区域 |
| Audio Params (音频参数) |
全局音频设置 |
环境
| 元素 |
说明 |
| Skybox (天空盒) |
360° 环境背景 |
| Ground Plane (地面) |
无限延伸的地面 |
| Floor Plan (楼层平面) |
自动生成导航网格 |
| Simple Water (简单水面) |
基础水面效果 |
界面与特殊
| 元素 |
说明 |
| Link (链接) |
可点击的链接 Portal |
| Mirror (镜子) |
反射效果 |
| Troika Text (文字) |
3D 文字 |
| Web Frame (网页框) |
嵌入网页 |
| Shared Screen (共享屏幕) |
屏幕共享区域 |
| Empty Frame (空框) |
占位容器 |
| Inline View (内联视图) |
画中画视图 |
| Box Collider (盒碰撞体) |
碰撞检测 |
| Particle Emitter (粒子发射器) |
粒子效果 |
文件格式
场景编辑器项目文件 (.spoke)
场景编辑器使用 JSON 格式保存项目，包含：
- 场景版本信息
- 元素层级结构
- 元素属性数据
- 元数据（名称、描述等）
导出格式 (.glb)
发布时导出为 GLB 格式：
- 包含所有几何体、材质、纹理
- 携带
MOZ_hubs_components 扩展数据
- Hubs 客户端可直接加载
下一步