移動端3D絢酷空間-VR 場景應(yīng)用 妙味課堂

show0p

移動端3D絢酷空間-VR 場景應(yīng)用 妙味課堂
價值：520 附帶課件

游客，如果您要查看本帖隱藏內(nèi)容請回復(fù)

課程介紹
絢麗的3D空間、強勁的音樂節(jié)奏；震撼的視覺表現(xiàn)、流暢的用戶操控……
這樣傲嬌的作品表現(xiàn)形式，在 2016 年微信朋友圈刮起一陣又一陣 H5 旋風(fēng)~~人們欣賞過后，不禁嘖嘖稱奇！這樣華麗麗的表現(xiàn)形式，讓人驚嘆之余更引發(fā)好奇：這是怎么做出來的？完全由前端去實現(xiàn)嗎？要怎么做呢？
來吧，跟著妙味講師的步伐一起吧，讓我們一步步揭開技術(shù)的迷團…

學(xué)習(xí)目標(biāo)

通過本次課程的學(xué)習(xí)，可以讓大家了解各類3D效果在移動端的實現(xiàn)原理，明白重力感應(yīng)的相關(guān)設(shè)置，滑屏，3D和重力感應(yīng)的相關(guān)配合，了解類VR場景如何實現(xiàn)

課程詳情

掌控腦洞大開的絢酷VR技能，學(xué)習(xí)酷炫的視覺表現(xiàn)手法，
盡在本期妙味遠程課：

妙味移動端實戰(zhàn)開發(fā)之：“淘寶造物節(jié)” 3D絢酷空間 VR 場景應(yīng)用！

部分案例截圖：

絢麗的3D空間、強勁的音樂節(jié)奏；
震撼的視覺表現(xiàn)、流暢的用戶操控……

這樣傲嬌的作品表現(xiàn)形式，在 2016 年微信朋友圈刮起一陣又一陣 H5 旋風(fēng)~~人們欣賞過后，不禁嘖嘖稱奇！這樣華麗麗的表現(xiàn)形式，讓人驚嘆之余更引發(fā)好奇：這是怎么做出來的？完全由前端去實現(xiàn)嗎？要怎么做呢？

來吧，跟著妙味講師的步伐一起吧，讓我們一步步揭開技術(shù)的迷團，探究前端實現(xiàn)的一切可能�。�！

學(xué)前基礎(chǔ)：掌握CSS定位、可以獨立做出JavaScript拖拽

課程大綱：

第一節(jié)：transform 基本方法講解

涉及知識點：

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

第二節(jié)：transform 獲取和運動

涉及知識點：

transform 獲取，matrix，封裝 transform 的獲取方法，自定義屬性，tween；

第三節(jié)：造物節(jié) loading 動畫制作

涉及知識點：

animation 動畫，3D 坐標(biāo)計算，animationend 事件，圖片 loading，加載進度監(jiān)控；

第四節(jié)：造物節(jié)內(nèi)容圓柱制作，加拖拽圓柱移動

涉及知識點：

正 N 邊形公式推算，3D 圓柱制作，內(nèi)圓柱的實現(xiàn)，移動端滑屏，滑屏圓柱移動；

第五節(jié)：完整版造物節(jié)整合重力加速的實現(xiàn)，類 VR 360° 全景制作

涉及知識點：

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

第六節(jié)：練習(xí)講解

涉及知識點：

重力感應(yīng)的 3D 照片球；

課程目錄
1移動端“淘寶造物節(jié)” 3D絢酷空間 VR 場景應(yīng)用
1_transform基本方法
2_transform3d相關(guān)應(yīng)用
3_3D家居圖上
4_3D家居圖下
5_animation講解
6_圖片預(yù)加載(造物節(jié)loading動畫)上
7_圖片預(yù)加載(造物節(jié)loading動畫)下
8_3d的圓柱制作
9_滑屏旋轉(zhuǎn)3d圓柱
10_3d云彩入場
11_漂浮層添加
12_陀螺儀旋轉(zhuǎn)圓柱上
13_陀螺儀旋轉(zhuǎn)圓柱下
14_利用陀螺儀制作VR場景

1900018250

祝資源共享吧越來越火！

lonelyboy568

移動端3D絢酷空間-VR 場景應(yīng)用 解各類3D效果在移動端的實現(xiàn)原理，明白重力感應(yīng)的相關(guān)設(shè)置，滑屏，3D和重力感應(yīng)的相關(guān)配合

qq45566393

我發(fā)現(xiàn)我一天也離不開資源共享吧了！

mohui66688

s

上善若水

酷空間-VR 場景應(yīng)

xiange

學(xué)習(xí)一下  

老三

祝資源共享吧越來越火！

heart4u

這個課程很好。

371366864

移動端3D絢酷空間-VR 場景應(yīng)用 解各類3D效果在移動端的實現(xiàn)原理，明白重力感應(yīng)的相關(guān)設(shè)置，滑屏，3D和重力感應(yīng)的相關(guān)配合