啊？原来自动轮播这么有高级感了！
图片自动轮播的排版效果，现在很常见，之前的文章《单层、双层、差速、回溯……》给大家展示过8种常用的轮播效果。
在常见的轮播效果基础上，有想法的品牌们，已经开始变着法玩了。
今天教大家一个操作简单但很显高级的玩法。
我们先来看两个效果：
*素材来自SUPOR苏泊尔《100台双胆电炖盅免费送…》
组件：自动-轮播Banner
编号：10207（组件）
组件：遮罩
编号：10829（组件）
*素材来自Brioni布里奥尼《你的“ICONS”之选》
组件：自动-轮播Banner
编号：10207（组件）
组件：遮罩
编号：10829（组件）
只是在常见的轮播图片上加了一张前景图，排版就有了层次感。
带有超链接或小程序的轮播图上，加一张引导点击的固定前景图，就不用在每张轮播图上设计点击提示了：
*素材来自lululemon《礼赠清单完成度99%》
组件：自动-轮播Banner(小程序)
编号：10210（组件）
组件：遮罩
编号：10829（组件）
如果追求简单，固定前景图也可以只是一张超链接或小程序的角标图片：
*素材来自ZARA《“型”走的城市男孩》
组件：自动-图片差速轮播(向左、小程序)
编号：11627（组件）
组件：遮罩
编号：10829（组件）
当给轮播图同时加上背景图和前景图，更是让人眼前一亮：
*素材来自Bose《双11压轴攻略，Bose已为你准备好！》
组件：自动-图片缩放差速轮播(向左)
编号：11827（组件）
组件：遮罩
编号：10829（组件）
*素材来自Bose《双11压轴攻略，Bose已为你准备好！》
组件：自动-图片缩放差速轮播(向左)
编号：11827（组件）
组件：遮罩
编号：10829（组件）
Ps：上方缩小进入和放大进入的两个轮播效果为同一个组件制作，喜欢这个组件的话，点击下方小程序卡片参与活动可免费获取。
如何给自动轮播添加前景图？其实只需一个「遮罩」组件，以最后一个效果为例，一起看下详细的制作教程吧。
详细教程：
工具：iPaiban Pro 黑科技编辑器，网址：SVG.iPaiban.com
组件：自动-图片缩放差速轮播(向左)
编号：11827（组件）
第1步：选择自动轮播组件
登录 iPaiban Pro 编辑器后，点击编辑器左侧「组件」按钮，在「自动」-「Banner/轮播」分类中找到「自动-图片缩放差速轮播(向左)」组件，或者直接搜索组件编号11827，点击选择。
第2步：上传图片素材
在页面右侧，点击「换图」按钮上传背景图，点击「+」号上传轮播图。所有图片尺寸保持一致，宽度不可超过1080像素。
第3步：调整动画参数
在上传图片的下面，滑动滑杆分别调整轮播图片尺寸初始倍数、每张图片停留时间和每次轮播切换时间。
其中当轮播图片尺寸初始倍数大于1时，轮播图片为缩小进入；当轮播图片尺寸初始倍数小于1时，轮播图片为放大进入。
点击右侧「预览草稿」可随时预览效果，根据效果进行调整。
第4步：选择遮罩组件
在左侧「组件」中搜索组件编号10829，找到「遮罩」组件，点击选择。
接着在右侧点击「换图」按钮上传一张遮罩图，尺寸和前面的轮播图保持一致，此时这张图片就会覆盖在轮播图上方，成为轮播图的前景图。
第5步：导入公众号后台
预览效果满意后点击「同步至微信后台」就可以了。
使用同步功能不用频繁在编辑器和微信后台切换，同步成功后可以立即扫描二维码预览在公众号的效果。
如需局部导入可参考：《iPaiban Pro小助手安装和使用教程》
转载请在文章开头和结尾显眼处标注：作者、出处和链接。不按规范转载侵权必究。
未经授权严禁转载，授权事宜请联系作者本人，侵权必究。
本文禁止转载，侵权必究。
授权事宜请至数英微信公众号(ID: digitaling) 后台授权，侵权必究。
评论
评论
推荐评论
暂无评论哦，快来评论一下吧！
全部评论（0条）