移动端3D绚酷空间-VR 场景应用 妙味课堂

show0p

移动端3D绚酷空间-VR 场景应用 妙味课堂
价值：520 附带课件

游客，如果您要查看本帖隐藏内容请回复

课程介绍
绚丽的3D空间、强劲的音乐节奏；震撼的视觉表现、流畅的用户操控……
这样傲娇的作品表现形式，在 2016 年微信朋友圈刮起一阵又一阵 H5 旋风~~人们欣赏过后，不禁啧啧称奇！这样华丽丽的表现形式，让人惊叹之余更引发好奇：这是怎么做出来的？完全由前端去实现吗？要怎么做呢？
来吧，跟着妙味讲师的步伐一起吧，让我们一步步揭开技术的迷团…

学习目标

通过本次课程的学习，可以让大家了解各类3D效果在移动端的实现原理，明白重力感应的相关设置，滑屏，3D和重力感应的相关配合，了解类VR场景如何实现

课程详情

掌控脑洞大开的绚酷VR技能，学习酷炫的视觉表现手法，
尽在本期妙味远程课：

妙味移动端实战开发之：“淘宝造物节” 3D绚酷空间 VR 场景应用！

部分案例截图：

绚丽的3D空间、强劲的音乐节奏；
震撼的视觉表现、流畅的用户操控……

这样傲娇的作品表现形式，在 2016 年微信朋友圈刮起一阵又一阵 H5 旋风~~人们欣赏过后，不禁啧啧称奇！这样华丽丽的表现形式，让人惊叹之余更引发好奇：这是怎么做出来的？完全由前端去实现吗？要怎么做呢？

来吧，跟着妙味讲师的步伐一起吧，让我们一步步揭开技术的迷团，探究前端实现的一切可能！！！

学前基础：掌握CSS定位、可以独立做出JavaScript拖拽

课程大纲：

第一节：transform 基本方法讲解

涉及知识点：

transform2D，transform3D，3D 硬件加速，rotate，translate，scale，skew，perspective，perspective-origin，transform-origin，transform-style，backface-visibility，IOS 下 3D 的 BUG 说明；

第二节：transform 获取和运动

涉及知识点：

transform 获取，matrix，封装 transform 的获取方法，自定义属性，tween；

第三节：造物节 loading 动画制作

涉及知识点：

animation 动画，3D 坐标计算，animationend 事件，图片 loading，加载进度监控；

第四节：造物节内容圆柱制作，加拖拽圆柱移动

涉及知识点：

正 N 边形公式推算，3D 圆柱制作，内圆柱的实现，移动端滑屏，滑屏圆柱移动；

第五节：完整版造物节整合重力加速的实现，类 VR 360° 全景制作

涉及知识点：

重力加速事件，重力减速兼容，利用重力加速配合3D制作全景场景；

第六节：练习讲解

涉及知识点：

重力感应的 3D 照片球；

课程目录
1移动端“淘宝造物节” 3D绚酷空间 VR 场景应用
1_transform基本方法
2_transform3d相关应用
3_3D家居图上
4_3D家居图下
5_animation讲解
6_图片预加载(造物节loading动画)上
7_图片预加载(造物节loading动画)下
8_3d的圆柱制作
9_滑屏旋转3d圆柱
10_3d云彩入场
11_漂浮层添加
12_陀螺仪旋转圆柱上
13_陀螺仪旋转圆柱下
14_利用陀螺仪制作VR场景

1900018250

祝资源共享吧越来越火！

lonelyboy568

移动端3D绚酷空间-VR 场景应用 解各类3D效果在移动端的实现原理，明白重力感应的相关设置，滑屏，3D和重力感应的相关配合

qq45566393

我发现我一天也离不开资源共享吧了！

mohui66688

s

上善若水

酷空间-VR 场景应

xiange

学习一下  

老三

祝资源共享吧越来越火！

heart4u

这个课程很好。

371366864

移动端3D绚酷空间-VR 场景应用 解各类3D效果在移动端的实现原理，明白重力感应的相关设置，滑屏，3D和重力感应的相关配合