（接 i-TOP带你一口气看尽H5的套路：一镜到底创意H5案例合集 上篇）

二、场景穿梭-（画中画形式感）：

由大缩小或者由小放大，感觉是在一个空间里面，通过镜头的穿梭突显出所述事件。在立体空间中，不同的穿梭形式，也有其更为合适的技术融合。

Z轴穿梭式一镜到底不仅在空间维度上有了突破同时在技术融合上也有加分。

穿梭+场景

【穿越宇宙的邀请函】

尽情尽兴，天猫穿越宇宙给您发来邀请函！在这支刷屏爆款H5中内置了225张图片，通过处理，以2D图片的方式导入H5。画面逐步倒退，穿梭在这浩瀚的宇宙中，由近到远，能够纵观宇宙全貌，可谓尽兴之至！在这个虚拟的世界中，还巧妙的加入了镜像设计，增添了一种神奇色彩。(已下线）

场景穿梭+画中画

【二零一六年娱乐圈画传】

以古风插画的方式盘点每年的娱乐圈热点事件正是网易新闻的一贯传统。 王宝强休妻、马蓉宋喆婚外情、亦凡情海生波、霍建华林心如大婚生子、小李终得奥斯卡小金人等、超级丹掐臀风波、张樊反目斗演技、斯人已逝等十余大热点事件，如椽画笔 笔触传神、最后落幅的垂钓江叟叼烟看戏...恰如吃瓜群众我们一样~2333 交互体验：长按屏幕体验便利热点事件、松手即可欣赏静帧、细细品玩。画中画带来的穿梭感， 让娱乐圈画传尽显魅力。

看起来如此复杂的H5制作工期一定需要几个月吧 ?放下工作压力，现在就跟着小编一起“降降火”，寻找工作方法的新希望！iTOP定制H5编辑器，1个人1小时即可完成一镜到底创意H5，具体操作如下:

X轴运动案例：那年来到广州这座城

登陆iTOP官网，点击试用工具

注册登录后，点击单屏H5，适用故事性动画作品。

先做上传个长背景图，素材库里也有许多高颜值图片哦。

扩大拉满整个画布，让手机画面全屏。

点击图片右边的动作添加状态集，调整好整个动画的时间和移动位置就可以了。

比如这里我想往图片右边移动播放，我就在X轴上加负600就可以一镜到底整个画面了。

怎么添加动态人物？点击动图选择你想要的素材调整好大小，就可完成啦！

场景穿梭案例：国庆自家游

其实只需要准备好几张互相嵌套的平面图，一个普通人就能用这个iTOP定制H5编辑器工具做出来。比如下面这两张图——

通过i-TOP定制H5编辑器，将两张图片相同的位置贴合，将第一张图片缩小到第二张图合适的位置加一个结束动作时间点。

记得加一个消失的时间，就能完美地“衔接”成一镜到底的动画！

效果代表案例：一口气看尽职场套路

品牌主：汤臣倍健

采用画中画的展现职场中的老套路，串联起职场上的种种套路。中间夹杂着搞笑和幽默的风格。

这款案例也可以说是长屏切换的h5，动态效果是不断换图制作，最后背景则是PNG图片。整个案例搭配着搞笑的解说和很有节奏感的音乐特效，意境十足。

iTOP在H5制作的互动形式上选择十分丰富，除了一镜到底，还有多种形式等你来解锁！