案例教学 | 在微信公众号里「点击展开」围观全国各地的年夜饭!

上周直播分享给大家除夕交互图文,想学更多知识的同学们可以点击预约本周三直播——情人节案例分享。
点击预约下一期直播
????学更多知识????

今天这篇文字教程,
总结了之前直播的操作要点,
以好爸爸的案例为例:
点此查看原文案例:过了小年就到除夕!围观全国各地年夜饭“云直播”现场!

拆解
原文案例主要使用组合:点击消失+从头展开,嵌套搭配使用组件批量无缝图和点击-切换图片,实现围观“年夜饭”云直播,点击菜品沾好运的交互效果。 
????????查看交互演示????????

制作
1、添加组合:点击消失+从头展开(设置触发区域,宽屏)(10402),添加图片“1展开前”;

调整触发区域并隐藏;

2、添加组件批量无缝图(全能)(10009),添加图片“2-1、2-2展开后-无缝图”;

3、添加3个组件位,分别添加组件:点击-切换图片(10005),按顺序分别添加图片“3-1至5-2切换图”;

4、添加1个组件位,并添加组件:批量无缝图(全能)(10009),添加图片“6-1、6-2展开后-无缝图”即可;
5、点击右侧“预览草稿”,可初步预览草稿效果(以导入公众号后台预览效果为准)。

导入公众号后台
6、在iPaiban Pro编辑器后台完成SVG交互图文后,点击右侧“导入微信后台”→点击“复制”;

7、打开微信公众号后台新建图文,点击浏览器右上角iPaiban Pro 小助手图标→点击“导入代码”→粘贴代码→点击“清空导入”;

8、操作成功后,记得添加标题、封面和保存,最后发送到手机预览最终的效果。



转载请在文章开头和结尾显眼处标注:作者、出处和链接。不按规范转载侵权必究。
未经授权严禁转载,授权事宜请联系作者本人,侵权必究。
本文禁止转载,侵权必究。
授权事宜请至数英微信公众号(ID: digitaling) 后台授权,侵权必究。




评论
评论
推荐评论
暂无评论哦,快来评论一下吧!
全部评论(0条)