伴（bàn）随着移动设备的更新换代，H5开发技术也更加成熟（shú），让移动端的H5页（yè）面可以实现各种华丽的视觉效果，即使是比较消耗性能的3D动画也能顺（shùn）畅展现。下面，qy千亿和蓝橙互动就给大家分享一个3D全景动（dòng）画（huà）H5案（àn）例。

案例：live the journey

品牌（pái）：Evian

1、创意定位

这是法国Evian为依云矿泉水品（pǐn）牌进行宣（xuān）传而（ér）推出（chū）的H5案例，通过扫描限（xiàn）量版的（de）瓶（píng）子，可以体验（yàn）插画版的依云（yún）15年（nián）净化之旅，查（chá）看依云（yún）矿（kuàng）泉水产（chǎn）地，法国阿尔卑（bēi）斯山（shān）的3D故事。

2、内容体验

进（jìn）入H5页面，首先是提示（shì）界面，提示（shì）调大声音，点击开始体验按钮，进入（rù）主KV页面；主KV页面是（shì）以阿尔卑斯山为（wéi）背景，手机端时用户横向（xiàng）可以滑动屏（píng）幕，一（yī）共4个可以点（diǎn）击的按钮，3个蓝色和1个粉色按钮。粉色按钮进入的是明信片页面，可以选择3种明信（xìn）片图案（àn），写上接收人和发件（jiàn）人（rén）。蓝色的按（àn）钮，分别进入3个（gè）不同（tóng）关（guān）于阿尔卑斯山（shān）的3D动（dòng）画，包（bāo）括穿越森（sēn）林、俯（fǔ）视阿尔（ěr）卑斯山脉和穿（chuān）越到（dào）地下（xià）查看水源。点击其（qí）中一个蓝（lán）色按钮，长按浏（liú）览3D动（dòng）画完毕，可以进入下一个动（dòng）画（huà）。浏览（lǎn）动（dòng）画的过程中，可移动手机更换视频角度，观看不（bú）同（tóng）方（fāng）向的（de）风景，也可以松开按（àn）钮，停留观望（wàng）。3个3D动画都（dōu）观（guān）看完毕后（hòu），会有观看完毕（bì）提醒（xǐng），提示用户分享页面。

3、设（shè）计策划（huá）

3D渲染，手（shǒu）绘画面；依云矿泉水的水源（yuán）地是阿尔（ěr）卑斯山深（shēn）处、冰川砂层天（tiān）然（rán）过滤，所以构成元素阿尔卑斯山，深林等。

这（zhè）个H5案例采（cǎi）用（yòng）的是响（xiǎng）应式页面，无论PC端还是移动端都（dōu）可以访问，通过3D全景动画向用户展示品（pǐn）牌故事和产品特（tè）点，相比于（yú）传统的视频类H5，3D全景（jǐng）动画拥有更好的交互（hù）性，能时刻吸引用户（hù）注意力，提升营销效果。