早在通信技术的 3G 时代，我们的技术人员就发现图片、视频存在加载缓慢等问题，虽然有几张图片能使网站看起来更加好看，但是那时大多数的网站还是以文字为主，在行业里也没有将 UI 设计师单独划为一个岗位的说法。直到到了 4G 时代，网速以及智能手机的普及使得我们可以做更多事情，例如较为流畅地进行直播、玩游戏、看视频等操作，同时 UI 等与美学设计相关的职位也进入到各个行业中，因为制作者逐渐发现好的设计方式往往能够留住更多的用户。这也是用户需求不断提升的体现。

可以看到，我们的网站从显示文字，再过渡到显示图片、视频、游戏等，再如今已经过渡到虚拟现实世界，浏览器在不断地支持更多的展现方式。例如，你不满足于 2D 游戏在网页上带来的体验，想开发一款 3D 游戏增加用户的视觉体验，那么 WebGL 技术的诞生便可以支持 Web 开发人员借助系统 GPU 的能力，在浏览器中展示各种 3D 场景和模型。如下图所示，是用 WebGL 编写的魔方，你可以对它进行拖拽交互完成方块的旋转 (点击 rubikscube ，进行访问)。

我们从这个魔方可以看到，搭建这样的一个模型，首先要画出点、线和面，形成一个正方体。然后，对它进行上色，添加视角的转动等等。

除了搭建简单的几何体，你还可根据业务复杂程度绘制更加复杂的模型。我们再来看一个场景，下图是一个水族馆场景，里面游动着数量很多的鱼类（ 点击 aquarium ，进行访问）。

为了加速 Web 3D 应用的开发，ThreeJS 这样便利的类库迅速被人们接受。ThreeJS 是 Github 上的开源项目。通常在 WebGL 中，如果你要通过矩阵变换坐标，将三维坐标转变为屏幕上的二维坐标，是要自己去完成的。而在 ThreeJS 中，它能帮我们自动计算矩阵，将三维坐标转换为二维坐标，这就简化了很多复杂的工作。再例如，WebGL 学习到深入阶段，需要掌握 Javascript 和 GLSL 两种语言才能进行着色器的开发。但是，使用 ThreeJS 显然可以跳过这些难懂的底层知识。

本课程将带领你入门 Three.js 的使用，然后编写一些实战项目进行巩固强化。

• 实现地月环绕

• 实现粒子特效

先学课程

• 了解蓝桥云课的基本操作，推荐学习 新手入门指南

课程信息

• 学习周期：课程有效期 2 个月，2 个月后无法进行在线实验，但可查看文档内容。高级会员有效期内可一直学习，到期后课程失效，且无法查看文档。部分云主机实验环境因成本较高，存在开启次数限制。关于课程退款等相关注意事项说明，请阅读 用户付费协议。
• 版权说明：课程内容为蓝桥云课原创或蓝桥云课在原作者授权下制作。未经书面同意，擅自爬取、转载和再分发课程内容，均将受到严肃追责。
• 企业团报：企业购买，请点击 企业用户咨询。