白鹭时代首席布道师张鑫磊:Egret Web3D、WebVR探索之路

企业动态

         2016年3月7-9日,由全球移动游戏联盟主办的第五届全球移动游戏大会GMGC2016在国家会议中心盛大举行,作为亚太地区最具影响力的游戏行业盛会,此次大会以“Game2.0:创新不止·忠于玩家”为主题,包括腾讯、百度、阿里、谷歌、中手游、京东、蓝港互动等在内的来自全球移动游戏及泛娱乐产业的开发商、运营商、制作商、平台商、硬件厂商、大众玩家以及相关政府机构和国际产业组织齐聚一堂,共话移动游戏及泛娱乐产业的热点议题。8日上午,GMGC2016开发者训练营(Developers Camp)开幕。来自白鹭时代首席布道师张鑫磊进行了主题为“Egret Web3D、WebVR探索之路”的演讲。

  以下是课程内容实录:

  张鑫磊:很高兴今天有这么一个机会跟大家分享一下关于Web3D、WebVR的内容,想跟大家聊一聊白鹭时代从2D到3D,以及到VR,这个产品的过程和我们的思路。

  我们的第一款产品是我们的Egret Engine,在2014年3月份我们开始决定做这么一款产品,我们在想,我们不仅仅要做一个基于程序的库,我们不断扩充产品线。这是我们整个产品的发展历程。我们在2014年5月份发布第一个测试版本,那个时候我们邀请了100位开发者对我们的产品进行第一轮的测试适用,进行反馈。7月份是神经猫,2015年才是真正的版本。这么一个游戏引擎,这么复杂的技术产品,为什么能够从3月份到8月份,短短五六个月的时间能够做到3.0版本,我们每两周都会更新,修复BUG。我们历经了40多个版本迭代,与此同时,发展过程中我们不断扩充产品线,这个产品线扩展历程是根据用户需求进行设计的。比如在神经猫火了之后很多游戏公司觉得H5游戏应该是未来的发展方向。所以探索主动研究在H5设备中研究重度游戏,当时卡牌类游戏非常火暴,这个时候对于技术需求来说,卡牌游戏中最大优点是UI界面编辑,完成一个卡牌游戏。所以我们在2014年底发布了另外一款UI编辑器,现在已经升级为IDE工具。对于性能来说,2014年我们发现对于移动H5游戏渲染来说是很大的瓶颈,于是我们推出了基于H5移动端的加速器,解决性能的问题。去年开始,新的iPhone手机等等,在渲染性能上已经不是太大的问题。所以我们为了支持其他的游戏引擎进行加速。这是我们的发展历程。

  到目前为止,我们的产品线一共有10多款产品,如果你要制造一款游戏,我们在引擎方面有Egret Engine进行支撑,还有动画工具,值得一提的是,我们上周五恰巧发布了DragonBones的全新版本,导出的格式我们支持五种格式。这是关于我们的产品结构。我们想切入到H53D领域,我们的结论是,这个事情可以做,但可能不被大家接受。国外有个非常权威的统计网站,统计全球移动智能设备当中对于Web GL的支持率,普及率只达到了13.4%,我们在2014年做的时候可能全球只有一半的手机,或者不到一半的手机才能打开这个内容。2014年10月份情况好一些了,达到48.9%。2015年10月份,最新的统计,普及率达到84.4%,意味着什么呢?通过一个非常严谨的数据告诉大家,未来基于WebGL技术,没有兼容问题,不会出现黑屏等问题。所以在去年年底我们发布了第一版本的Egret3D。

  下面跟大家聊一聊3D设计过程中有哪些功能点。这是一个实时渲染的Demo,图里有几个选项,动态修改F1赛车模型,这是简单的Demo。

  说到高级API,两年多时间我们积累大量的2D游戏开发者,他们对于2D游戏引擎使用非常熟悉,但他们绝大部分没有接触过3D,甚至很多开发者以前是做网页前端的,把一个3D模型放到一个3D场景当中,进行实时渲染,这是关于API的设计。我们还做了3DMAX输出插件,将所有格式统一成一种格式,保证预览效果是完全一致的。

  下面是关于灯光的特性,HDR的支持可以将所有3D场景颜色调的更加鲜亮,通过HDR高级动态渲染,可以让绿色变得更加鲜艳,太阳更加明亮,使整个场景变得不一样。你可以自己创建和控制你的顶点,这都是我们允许你进行修改操作的。TBN高光法线功能,允许我们在凹凸不平的页面上突出阴暗面,我们通过TBN高光法线照射之后,让明暗效果对比更加强烈。泛光,环境光效果。GPU灯光烘培,这些功能在我们能够看到的一些高级的3D引擎里实际上都是常用的功能,现在我们已经把它全部在我们的H5当中实现,这是渲染方面。很多人喜欢这样做,在渲染好的画面中喜欢加滤镜功能,包括后期材质、抗锯齿、融合、景深,我们先渲染一个画面,再加上后期特效,这是关于后期特效的支持。

  另外一个是延迟渲染,很多开发者在尝试使用我们的3D,问的最多的是这个东西性能怎么样,会不会跑不起来。其实我们有延迟渲染支持,什么意思呢?如果没有延迟渲染支持,按照以前传统的正向渲染,在一个场景里,如果放1000个小球,然后放八盏灯光,每一帧的渲染需要计算八千次运算,我们可以变成1008次,降低我们的CPU和GPU使用的百分比。根据这个测试大家也可以在我们的EDN上检测工具,看看实时预览效果。Three.js这个库体积一共有420K,对于移动端加载来说比较慢,而我们打包之后体积小了35%,但是我们近期看国外市场惊奇的发现,关于体积的问题根本不成问题,因为大家3G、4G手机上网流量都是免费的,但是我们不行,所以要保证体积最小。

  3D部分我们在2015年9、10月份内部就完成了第一个版本,当时我们内部做了Demo,除了3D游戏还有没有其他的可行性,已经有另外的同事对3D其他可行性进行预演。WebVR大家听起来比较新,其实2014年9月份Google已经起草了WebVR标准,从草案到真正的标准还需要很长时间,WebVR也需要很长时间。首先,对于支持VR的效果最重要的我们要有3D支持,我们要投入到WebVR研究当中,能够在Egret3D里实现WebVR的支持。

  当我们制作完一个3D场景,你只要启动一个叫VR View的东西,VR View计算形成VR成像,我们将一个完整3D场景拆成两个,然后投影到屏幕当中,现在的图像放到VR眼镜和设备当中就能看到效果。我们VR内容的成像也会发生一定程度的变化,保证看到虚拟现实的时候体验是最佳的。有了这个技术以后,大家可以在我们这里下载到相关的代码。说到VR不得不提到传统VR,针对传统VR有两点,第一是内容的技术门槛和成本非常高,现在我们要做一个VR内容,做一个完整的VR生态体系内容,其实面临的困难非常多,有很多开发者会3D,熟练3D,但是对VR没有太多深入研究。有一些非常牛的牛人对于VR有深入了解,但是对于渲染等性能不了解,所以成本非常高。第二点,VR内容大众化,这对于用户来说也是成本问题,如果一个普通用户,可能只是普通上半的打工族,他如果体验需要购买一个VR眼镜,还需要下载一个几十兆,甚至上百兆的APP,体验之后发现里面并没有什么比较令人新奇的电影或者好玩的游戏,这就是对于传统VR我们认为的两个点。相比之下,我们的WebVR通过比较轻量级的技术,降低我们的研发流程,降低你的进入门槛,这是对于我们简化研发流程简化研发成本的一个优势。第二个,推动VR内容的大众化,现在用户仅仅通过一个二维码打开手机,在微信,甚至新浪微博里就能体验这样的VR内容。

  关于VR的分享简单分享到这里,如果大家对于3D和VR有兴趣的话可以在会后讨论。白鹭一直在做非常领先的创新的事情,这些事情不仅创新,而且逼近我们团队能力的极限,我们希望通过这些创新帮助开发者更推进一步。谢谢大家。

 
责任编辑:市场部 来源: GMGC
相关推荐

2016-12-10 19:53:02

白鹭时代

2016-01-27 12:05:13

2016HTML5观点

2014-10-17 10:09:59

Html5手机游戏

2021-08-16 14:22:19

JetBrainsDevOps

2012-04-26 10:29:55

新浪云计算SAE

2011-12-12 16:13:54

开放平台

2016-05-17 14:13:28

TechWeb

2021-06-07 17:11:58

金融流程

2022-07-28 21:17:46

福布斯数字化Web3

2014-12-15 10:10:26

HTML5游戏引擎

2017-07-12 23:08:03

白鹭引擎

2017-06-29 14:29:46

互联网

2023-07-13 10:48:22

web 3DThree.jsBlender

2011-08-21 14:48:17

点心张磊

2015-10-20 17:06:52

2011-12-29 09:39:48

HTML 5

2015-02-11 13:42:09

腾讯X5Egret RuntiHTML5游戏

2022-10-21 07:33:01

2012-04-09 09:41:24

WEB架构师
点赞
收藏

51CTO技术栈公众号