为产品赋能--互动性三维产品摄像机视角研究方案
我们为ND互动性三维教育产品sandboxFX进行了视角优化的探索,并总结一套简单的设计方法,希望能够改观三维环境下的视角表现。
纵观较为成熟的游戏(3D)行业,我们会惊喜的发现除了越来越多的技术加持让游戏更真实,更具个性之外,对于视角的打磨已经趋近于电影级别,且极其讲究与游戏剧情、游戏人物、场景与玩家的互动性。

“战神4”视角改为第三人称过肩,一刀未剪的视角设计,沉浸感、代入感十足

"sky光遇",对于视角的把控让每一帧都可以作为壁纸

以“守望先锋”为例的第一视角同样引入其他视角切换来提高可玩性
众多游戏厂商对于游戏视角的打磨已经炉火纯青的现代,是否有哪些设计技巧可以被其他互联网产品借用,这正是我们的出发点。
什么是互动三维产品?
简单来说,用户与三维场景或模型相互动,并能产生反馈得到某种结果的产品。
从场景功能来说可分为以下几种:
1.游戏、娱乐类
2.场景搭建、放置类如“酷家乐”这样的装修设计产品
3.专业软件如C4D、MAYA这样的专业产品
4.以漫游为主的纯浏览产品,如“场景漫游”
5.依靠头戴或技术的体验类产品,如VR\AR产品
6.其他含互动的三维产品
而我们ND的“sandbox”应该从属于第二类,且面向教学,通过多面的互动涵盖多类互动体验,从而其视角的设计也无法单纯归类于某一类型。
关于视角
视角一词在不同语境中有着不同的含义,我们常见的诸如“新闻视角”“物理视角”“相机视角”“显示器视角”等。
我们今天要谈论的是引子游戏和影视行业中的“视角”一词。
通常指的是,借用虚拟的摄像机观察世界和物体的角度。
从逻辑关系可以分为:
1.第一人称视角
2.第二人称视角
3.第三人称视角
4.上帝视角(一般为全局视角)
5.微观视角等
重点我们来看一下第一人称和第三人称这两个最常用的视角构成。
第一人称视角
相信游戏玩家对这个名词并不陌生,它模拟(替代)人眼的功能,在3D世界内有着极强的沉浸感和代入感。
第一人称有着极强的代入感,尤其适用于身临其境的游戏和产品,有着极强的情感共鸣。

上图:第一人称视角可以身临其境,体验更纯粹的紧张刺激和代入感。但容易眩晕。

上图:在漫游类产品中尤其适合。
第三人称视角
大部分游戏采用此视角,我们像一个观察者一样观察着3D世界里发生的故事。
第三人称视角有着易操作、视野范围大,且能够自由操控的情况,一般会配备各类视角保护机制保证最佳视野。

上图:第三人称视角也会锁定一定的主体(一般为游戏主角或主模型)防止视野丢失。

上图:以“赛车游戏为例”,第一视角的游戏或产品往往允许视角的切换,以满足用户需求。
Orbit和Firstperson摄像机的打法
sketchfab对于模型、场景的展示有两种视角方式。Orbit和firstperson。且默认为orbit模式。firstperson即为第一人称视角摄像机,而orbit摄像机则可理解为带轴心和目标的轨道摄像机机制的第三人称摄像机。而它们的操作方式,使用反馈均不相同。
我们通过下边两个例子来感受一下区别。
Firstperson 第一人称摄像机

在sketchfab中,firstperson摄像机可与键盘“WASD”“上下左右”配合增强漫游感。

上图:摄像机无目标,完全自由 上图:firstperson打法下的视野
Orbit 目标轨道摄像机

在sketchfab中,利用鼠标完成较为常规的操作,无难度。满足观察

上图:锁定某目标,保证视野完整性。 上图:Orbit打法下的视野

关于防碰撞、穿插解决优化配置
摄像机视角与遮挡物、碰撞的处理等,在游戏行业已经非常娴熟。在大热的游戏中我们常能看到此解决方案。
摄像机防止碰撞

上图:摄像机与墙壁有一定距离,防止碰撞 上图:摄像机轨道永远不允许穿墙的设置
这里引入一个大神的blog,unity中如何解决穿墙和碰撞问题。这个大神的画风有点可爱。。
详情请点击:https://blog.csdn.net/Terrell21/article/details/82982902

摄像机穿插、遮挡解决方案
市面上的解决方案大概可以分为以下四种:
此文引自clog大神bolg,详情点击:https://blog.csdn.net/puppet_master/article/details/73478905
1.物体大范围遮挡主体时遮挡物直接消失(透明),大部分产品会使用此方式

2.摄像机开启近端剪切遮挡物溶解直接消失,此方案能够削弱违和感的同时又很炫酷

3.主体被某物体遮挡时,遮挡物变半透明,也是常用的手段之一

4.遮挡物不变情况下,被遮挡物体高亮,此方案常用在竞技类,或RPG游戏中以便得知周围情况。

综上可见,对于视角的各种保护机制已经非常详尽,其解决方案也近乎完整。在技术加持下这些完全可以得到良性的解决。
关于视角保护机制
为了确保全互动3D环境下的构图完整性,以及视角的灵活性,对于视角的保护同样非常重要!
锁角:限制移动、旋转范围
锁角,顾名思义,就是为了确保构图以及潜在BUG的出现,限制活动范围。常用在艺术类产品及互动场景中。部分游戏也有此体现

上图:sketchfab中关于视角的约束增强其艺术感染力,同时又规避了视角出现BUG的情况。
固定摄像机
固定摄像机,不允许旋转移动,此方案常用在上帝视角的游戏中,在我们的“sandboxFX”中可以用在全局观察模式。

上图:上帝视角有一种掌控全局的感觉,较为适合观察和判断
视角修复机制
针对较为自由的相机,出现BUG时会进行一定的修复,此方案广泛应用于一些视觉效果超高的游戏和产品中。

上图:当我的视角出现问题或构图不佳时,会在一定时间之后自动归位到最恰当的构图。
关于视角优化的发展趋势
我们走查了大部分互动性产品和游戏解决方案,大概有以下几个趋势:
1.摄像机的打法更加灵活,且配合不同的保护修复机制,越来越接近电影级别的感受。
2.复杂性的互动产品会更注重多视角的切换来满足产品的多元性和用户需求。
3.行业性解决方案正在融合到不同相关行业。在视角设计方向,游戏与软件、产品、甚至WEB的区别已经日渐缩小。
4.互动性3D产品正在迅速增长,这来源于5G及WEBgl技术的迭代更新。越来越多产品注重视角的优化打磨。
5.第三人称视角(orbit)明显高于第一人称视角的应用,其比例几乎超过10:1。
6.利用视角的优化来提升构图的美感是一个不错的选择。
“SANDBOX FX”的解决方案
我们来看下当下沙盘sandboxFX遇到的问题:

可以看出几乎涵盖了所有令人发指的错误... ...
sandboxFX作为一个讲究互动,同时允许观察和漫游的多互动功能的产品,非常典型的体现出了视角做不好,体验非常糟的真理。
结合上述的分析,我们制定了一套简单的解决方案。
摄像机控制规则优化
A.首先必须允许摄像机切换视角,来满足用户“创作”or“观察”需求,方便控制。
B.在此基础之上,我们需要对摄像机的打法规则进行约束:
1.全局观察使用Orbit
2.单独观察某物体使用Orbit,且目标锁定在被观察物体
3.创作环境及物件时,使用Orbit。
4.漫游及观察细微环境时使用First Person.

上图:摄像机变更为orbit之后的优化修复后的对比
进行碰撞、穿插的问题解决
A.当摄像机穿插模型时:
1.穿插物体进行半透明处理
2.遮挡物体直接消失
3.遇见大型建筑物时使用溶解方案
B.当摄像机碰撞墙体、地面等模型时:
1.建立碰撞检测机制,不允许穿墙,优化运动机制
2.与地面设定距离,消除贴地飞行的尴尬情景

上图:通过碰撞规则的引入,能够解决上左图的尴尬。
引入BUG保护机制
A.视角出现BUG、构图不完整时进行锁角
B.当漫游过程中,视角出现不完美(构图不好看)情况,进行自动修复

当视角不完美(过低)时,两秒后归位到合适视角
结语:可直接搬走的视角解决方案
经过探索我们发现,此解决方案适用于绝大多数互动类型3D产品,且能够复用,几乎是一个完整的解决方案技巧。希望能够在此类设计中,解决你的一些疑问。
1.对于互动类3D场景最直接优化
1.1 基于行业大环境沉淀的方式方法,提升效果明显毋庸置疑
1.2 具有较多可复用可使用的设计代码,节省工作成本
2.个性化设计仍存在设计控件
2.1 不同的产品类型对于互动要求而变化的视角解决方案,均可以通过不同的设计探索完成
2.2 UED可着重在“透明度多少为佳”“视野锁角为多少范围”“什么时机切换摄像机规则”等细节完成个性化设计
3.复用性强
3.1 研究资料与方式方法可沉淀至3D组件库、规范库、控件库
3.2 解决方案可直接复用于众多相关产品,甚至游戏类目
---------------------------------------------------------------------------
资料来源:
部分clog研究结论请查阅正文
游戏资料来源“战神4”“sky光遇”“Tilmornings lights”“狂野飞车”“上古战纪”等
sketch fab:https://sketchfab.com/
sandboxFX官网 : http://sandboxfx.101.com/
谢谢观赏。








![[作品集]我来商越的前三个月](https://img.zcool.cn/community/031bjvwfjerjcjrtheut0wm3232.png?k=cab89dcab2e66cb9b8034bc8fd72f2cf&t=6a1c5b00&x-oss-process=image/resize,m_fill,w_520,h_390,limit_1/auto-orient,1/sharpen,100/quality,q_80)






































































