今天17:30，B站直播
引擎产品总监 Jare、编辑器产品经理 Andy 和蟹老板、UI 设计师π大青，将带来 v3.6 编辑器功能更新专题分享 ，解读本次编辑器的全新变化！
大家好，我是麒麟子，断更了五个月的我，很高兴又和大家见面了。 这次「复出」的原因是——
「毁天灭地版」终于发布了。
v3.6 编辑器全面升级
虽然每一次发布，都会有配套的版本发布说明，列出版本中的新增特性和重要问题修复列表，但并不是所有朋友都有时间去细读这个说明，去研究每一个特性。
所以麒麟子想为某些引擎版本写一些分享内容， 挖掘版本中为开发者带来的效率、效果、性能方面的提升， 这也是引擎能为开发者们带来价值的基础三要素。 同时也希望通过这些分享，让来不及尝试新版本的朋友感受一下新版本的风采，给正在评估要不要入手新版本的朋友们提供一些参考。
3.6 版本是麒麟子特别期待的一个版本，因为它包含了太多 「刚需」 特性。这个版本麒麟子从 团队内测版 开始使用，持续跟进到 社区公测版、正式发布版 。
整体使用感受是： 满足中略微带着惊喜。
本文，就是大家一直想要的 Cocos Creator 3.6 新特性详解 1/3：编辑器篇 。 由于此次更新内容较多，后续麒麟子将开新文详解 渲染、性能优化 等方面内容。
3.6 版本新增了 如 编辑器内置的预览、渲染调试模式、动画可以嵌入触发轨道播放器、可视化多语言编辑器 等多项功能，接下来让我们细数 3.6 版本在编辑器上的主要提升 。
UI 视觉、交互体验改版
打开编辑器，首先感受到的就是：它不一样了！ 这里省略掉上百字的赞美之词，浓缩成一句：666！
主题风格
偏好设置里，去除了配色主题（Theme Color）选项，不能再更换主题了。
新版本的明暗度介于旧版本「creator」和「dark」两个主题色之间，看起来更轻松了。
标题栏和主题色一致（目前仅 Mac OSX 支持，Jare 悄悄对我说 Windows 平台会在后续版本中支持），区域之间的间隔采用了深色线条，显得更高端了。
场景视图区域
可以很明显地看到，许多功能从面板上改为了场景区域上的浮动按钮，这些浮动按钮会根据编辑模式变化，使开发者可以更聚焦于当前编辑的内容。
这一次的 UI 改版远不止这些， 更多的细节朋友们请打开 3.6 版本自行体验吧！如果想对此发表建议的朋友，可以移步官方论坛 3.6 版本 UI 公测贴 （ https://forum.cocos.org/t/topic/137758 ）。
编辑器预览
当 Cocos Creator 0.9 版本出来的时候，麒麟子就开始期待，期待着有一天，能在 Cocos Creator 编辑器中直接运行、调试游戏。
有了内置预览功能，开发游戏的时候就可以很直观地看到节点数据的变化；可以借助编辑器编辑的功能，修改对象信息；可以在节点树中看到动态创建的对象情况；可以在面板上测试我的各项 Shader 参数等等。
如上图所示，启动内置预览功能只需要两步：
将启动模式切换到 编辑器预览（Preview in Editor） 。
点击 红色箭头 所指的按钮，即可进入下图一样的界面。
为了照顾到各类项目需求，预览模式提供了以下实用功能：
停止运行时预览（红色箭头）： 点击后即可退出预览状态
调节预览帧率（蓝色箭头）： 可手工输入想要的帧率。这个功能非常有用，比如，你可以设置为 1，就可以逐帧检查动画状态。也可以设置为任意值，用于检查不同帧率下的游戏逻辑功能是否正常。
切换预览分辨率（绿色箭头）： 分辨率列表提供了主流的配置可供选择，也提供了自定义分辨率能力。
旋转方向（黄色箭头）： 可以切换横竖屏预览模式。
预览缩放（灰色箭头）： 可以缩放预览窗口大小。
自适应大小（白色箭头）： 点击后，预览窗口内容会自动撑满。
更多细节请移步至官方论坛 3.6 版本编辑器预览（GameView）公测帖 （ https://forum.cocos.org/t/topic/137529 ）。
渲染调试模式
经常做 3D 项目的朋友应该时常需要做一些检查阴影区域、检查 UV、检查法线、检查高光等操作。
Cocos Creator 3.6 版本中新增了 渲染调试（Rendering Debug View）模式 ，如下图所示：
目前该 特性 支持的列表如下：
公共信息：
基础颜色光照（Lighting With Base Color）
级联阴影染色（CSM Layer Coloration）
原始模型信息：
顶点颜色（Vertex Colors）
世界位置、法线、切线（World Posistions,Normals,Tangents）
前向面颜色（Front Face Coloration）
一套UV，二套UV，光照贴图UV（UV0,UV1,Light Map UV）
透视深度（Projection Depth Z）
线性深度（Linear Depth W）
原始材质数据：
世界空间像素法线、切线、副法线
基础颜色、漫反射颜色、高光颜色
透明度、金属度、粗糙度、高光强度
除此之外，还有一些光照结果数据、雾化因子等选项，就不一一列举了，看下图：
部分效果截图
3D 模型预览增强
Cocos Creator 3.6 增强了 3D 模型的预览效果，到目前为止，Cocos Creator 的资源管理器、资源预览窗口、Mesh 选择窗口均支持 3D 模型预览，在选择模型的时候终于不用猜了。
美中不足的是，材质预览依然还是下面这样子：
目前版本中，如果想要查看材质效果，只能先在资源管理器窗口中选中材质，在属性检查器面板中查看。
希望在后面的版本中可以像 3D 模型预览一样，在编辑器各个材质文件展示的地方实现材质预览效果。
可视化多语言编辑器
随着越来越多的开发者出海，多语言版本游戏的需求与日俱增。特别是从今年开始，麒麟子收到的关于 i18n 的反馈就明显增多。 直接使用 i18n 的问题在于，开发者需要自己设定多语言策略，策略一但有缺陷，就无法完全交由策划或者内容翻译团队来做。
对于一个团队来说，可能需要从头到尾做两个项目，才能积累出较为丰富的多语言版本经验。
没想到 Cocos Creator 3.6 竟然内置了一个 可视化的多语言编辑器 Localization Editor（L10n） ，按照引擎组的说法，它有以下几个优点：
全程无代码操作： 只需点点点即可完成全部流程操作，以后翻译的活可以转交给策划、商务或者渠道等，减轻技术大大们的工作压力
所见即所得： 可以随时预览，也可以各种语言之间来回切换
自动翻译： 可以接入外部翻译软件，点一点即可自动翻译
高度自动化： 例如，全自动一键扫描所需翻译内容、自动翻译、快速构建、智能匹配文件等等
可从 面板->本地化编辑器 菜单打开多语言面板，如下所示：
不要被看似复杂的界面吓到了，界面上大部分内容都是自动填充的。
只需要简单的三步，就能够完成一个项目的多语言配置：
收集内容： 通过自动化扫描方式获取所需翻译的文本、ts代码、scene、prefab、video、audio、image文件。
翻译内容： 通过人工翻译或者外部软件自动化翻译工具将内容进行翻译。
构建发布： 通过构建发布功能将指定的语言进行打包。
眼尖的朋友应该发现了，他还有一个自动翻译服务，想要了解更多操作，请参考官方论坛 L10n 公测贴 （ https://forum.cocos.org/t/topic/136913 ）。
动画编辑器增强
请看上面动图的特效部分，它由一个刀光和一个爆炸特效组成。当角色的挥砍动作播到某一帧的时候，刀光特效开始播放。当挥砍动作播放到打击帧的时候，会出现一个爆炸特效。
想要高效的在编辑器中制作出这类动作与特效完美吻合的效果，我们至少需要动画编辑器的两个功能：
允许动作触发特效或者其他动画。
实时预览，所见即所得，便于微调。
Cocos Creator 3.6 的动画编辑器，新增了 动画触发轨道 的功能，在触发轨道上可以播放一个或者多个其他现存动画的功能，并且能够控制其时长。 此功能可以使特效师在制作动画的时候，通过组合的方式实现更复杂的效果，并且能实时预览。 这将大大提高了特效师的工作效率。
特效师们，赶紧行动起来！
3D 模型导入器优化
几乎每一次的版本更新都会对模型导入器进行增强，在 Cocos Creator 3.5.1 的时候就已支持智能材质导入，如下图所示：
截止目前，支持的 DCC 材质如下表：
下图为 Maya 中的材质自动导入 Cocos 后的效果对比，可以看得出来，已非常接近：
在 3.6 版本中，导入器再次强化，主要更新如下：
新增 GLTF specualr-glossiness 支持。
新增 Blender principled bsdf 材质的 specular 通道支持。
新增 mixamo.com 模型材质导入支持。
增强 fbx surface phong 默认材质导入效果。
模型拆分由默认开启变为默认禁用。
材质效果提升是基本操作，就不过多讨论，麒麟子主要想说一下 mixamo 材质支持 和 模型拆分默认禁用 。
mixamo.com
mixamo 是 Adobe 的一个可以为人体模型智能绑定骨骼并使用动画的软件，它同时还提供了许多人物模型和常见动作库，可免费使用。如下图所示：
但 mixamo 导出的模型在导入 Cocos Creator 时，材质呈现差异较大，因此在 Cocos Creator 3.6 中做了修正。
很多朋友说不知道哪里找带动画的测试模型，mixamo 是一个不错的地方。
模型拆分默认禁用
由于 Uniform 的限制，当骨骼数量超过一定值后，无法一次性提交给显卡渲染，此时就需要做特殊处理。 常见的处理方法有两种：
拆分模型和骨骼，分批提交。
使用纹理传输骨骼动画数据。
在 Cocos Creator 3.6 版本之前，模型拆分功能默认是开启的。 默认开启的原因，简单来说就是： 当模型骨骼未超出 Uniform 限制时，直接使用 Uniform 传递骨骼动画数据的方式的性能会高于使用纹理传输骨骼动画数据。
引擎组大佬对这个情况的描述是：对于 CPU 版本的骨骼动画，使用的是 Uniform 进行骨骼数据传递，由于不同设备和图形驱动的 Uniform 上限不同，所以我们使用了最低限制的 iPhone6 WebGL 作为 Uniform 上限，确保没问题。如果模型的骨骼数量超出限制（大概是 26-30 个），就会进行模型拆分，拆分为不同的 sub model，相当于是不同 DrawCall，这样每个 DrawCall 的 Uniform 都不会超限。
许多朋友反馈说自己的一个人物模型会占用多个 DrawCall，主要原因就是这里被自动拆分了，但开发者并不知道。
那为什么 3.6 版本不需要拆分了呢？
3.6 版本中，对于非 GPU 版本，做了运行时动态的 Uniform 限制判断，只要满足条件就会使用 Uniform 传递，如果不满足就退化为 FloatTexture 或 RGBA Texture 来传递。
基本规则如下：
默认情况下不再拆分模型， 不对导入的模型数据做修改。
如果骨骼数量 未超过限制，直接使用 Uniform 传递。
如果骨骼数量 超过限制，则使用纹理传递。
使用纹理传递骨骼动画数据的方式需要在顶点着色器中访问纹理，这一特性最低支持为 OpenGL ES 3.0，WebGL 2.0 。
但依靠 GL 扩展，在仅支持 OpenGL ES 2.0 和 WebGL 1.0 设备上，几乎已达到 100% 的覆盖率，所以 无需担心兼容问题 。
目前保留此选项应该只是为了保持旧项目的兼容性，在适当的时候会考虑移除。
场景编辑功能增强
对于某些 3D 游戏来说，场景的制作效率往往决定了项目进度。
而 在场景编辑工作中，模型的摆放和模型位置的调节往往占了90%的工作量。 Cocos Creator 3.6 提供了以下三个提升场景编辑效率的功能：
表面吸附
表面吸附主要用来在一定范围内的物体表面移动，使物件可以精确的摆放在物体表面。
注：对于有碰撞体组件的物体，表面吸附会吸附在碰撞体表面，而对于没有碰撞体的物体，表面吸附会吸附在物体表面。
操作流程如下：
选中需要挪动的目标物体。
按下快捷键（Ctrl/Command + Shift），gizmo 出现拖动 ICON。
移动鼠标时，可以切换锚点到待移动的顶点。
鼠标左键点击拖动 ICON，移动。
移动时工具会自动检测里光标附近的带有碰撞体积的物体，如果没有，则吸附在表面。
移动完成后松开鼠标左键确认位置。
顶点吸附
顶点吸附的主要作用是更精准的通过一个物体上的顶点，与另一物体的某顶点对齐。
操作流程如下：
选中需要挪动的目标物体。
按住 v 键，gizmo 出现拖动 ICON。
移动鼠标时，可以切换锚点到待移动的顶点。
左键点击锚点，移动鼠标。
工具会根据根据光标位置，计算出当前待吸附的目标，并在目标各顶点间移动注意：只能吸附在有顶点的位置。
移动完成后松开鼠标左键确认位置。
多对象框选
多对象选择是场景编辑中频率很高的操作方式，但在没有多对象框选之前，如果我们要选择多个对象，需要精确知道对象节点，再通过复选节点的方式进行多选操作，很不直观。
有了多对象框选功能后，场景编辑更加灵活方便了，用户无需在层级管理器中寻找需要被多选的对象节点，全部覆盖在选择框中的对象会被选中，未全部覆盖的对象不会被选中。
操作流程如下所示：
小结一下
八年前，在经历了 4 款 3D 引擎和 5 个 3D 游戏项目的毒打后，麒麟子有感而发，写了一篇文章叫《游戏引擎不仅是代码，更多的是完善的工具》，当时想表达的心情就是： 生产效率是衡量一个引擎是否优秀的主要指标，不管是易用性、稳定性还是兼容性，最终都会折算到生产效率上。
Cocos Creator 从立项之初，就以 提升生产效率 为主要目标，这也是麒麟子第一眼就爱上 Cocos Creator，认为其值得长期投入精力的原因。
一路走来，从 Cocos Creator 最近的更新表现来看，麒麟子很庆幸自己入坑得早。但入坑晚的朋友也不要纠结，过去已经是过去， 目前你拥有的最早入坑时间就是现在， 想要就赶紧行动吧。
就最新的 3.6 版本来说，期待许久的 内置预览、渲染调试和 3D 模型预览增强 等特性别提有多甜了，能够提升不少开发的调试效率； 可视化多语言编辑器 和 动画编辑器增强 算是惊喜吧，在游戏出海和美术工具提升方面又迈出了一大步； 模型拆分功能默认禁用 虽然只是一个很小的细节，但却能解决大多数项目问题，希望以后这样的小优化越多越好。
由于篇幅有限，麒麟子不能将所有编辑器相关的优化都一一展示，更多内容就得靠朋友们自行挖掘啦。想了解更多 3.6 版本相关内容，欢迎关注麒麟子的个人公众号。
📢还没看够？ 今天17:30 锁定 Cocos B 站直播间， 引擎研发团队将 全面 介绍并实机演示 v3.6 编辑器重要更新内容！点击文末 【阅读原文】 或扫描下方二维码，马住直播间↓↓↓
直播间地址
http://live.bilibili.com/21811345
往期精彩