
品牌官宣代言人、团队亮相、毕业生风采展示……人物介绍类的排版需求几乎每个运营都遇到过。
但最常见的问题是:一张照片配一段文字,太静态了。信息全部堆上去,用户扫一眼就划走,根本记不住谁是谁。
有没有一种方式,能让用户主动想看人物介绍?
试试中国华能这种创意效果——点击揭晓式排版,点击感受一下:
*素材来自中国华能今天,我们拍下了这些华能人的背影

组合:点击切换GIF+消失展开
编号:11775(组合)
组件:单层滑动-上滑
编号:10199(组件)
一开始,画面显示人物背影或剪影,营造悬念。用户忍不住点击,人物转身显出正面(GIF动图切换),随后内容自动展开,姓名、标签、故事、金句等依次呈现。
这种效果,可以通过i排版SVG编辑器的「点击切换GIF+消失展开」组合(编号:11775)实现。
下面一起看下详细排版教程。
详细教程:
工具:i排版SVG编辑器,网址:SVG.iPaiban.com
组合:点击切换GIF+消失展开
编号:11775(组合)
第1步:选择组合
登录i排版SVG编辑器后,点击编辑器右侧「组合」按钮,在「花样展开」-「切换图片+展开」分类中找到「点击切换GIF+消失展开」组合,或者直接在搜索框中搜索组合编号11775,点击选择。

第2步:进入组合编辑模式
点击「编辑组合」,进入组合编辑模式。

第3步:设置「展开前」内容
点击「展开前」区域,接着点击右侧两个「换图」按钮,分别上传单击前和单击后的图片。

注意单击前&后图的尺寸要求:每张静态图(PNG|JPEG)尺寸保持一致;动态图(GIF)比例与静态图保持一致。
第4步:设置「展开后」内容
「展开后」的内容支持嵌套各种组件,需要什么效果就在左侧「组件」分类中找到相应的组件拖动到组件位中,然后上传需要的素材即可。
添加组件位-拖动组件到组件位中-上传图片,每需要一个样式就按照这3步操作:

第5步:设置动画参数
点击右侧红色小三角符号,分别设置GIF动图播放时长(指展开前单击后GIF图片的播放时长)、播放后消失动画时长、展开时长。
展开高度一般无需调整,但当大家在手机上预览时,如果发现展开后有多余的空白或者没有展现出全部内容,这时候可以通过「加减展开高度」使其恰好展开。

第6步:导入公众号后台
内容编辑完毕后,点击左上角「保存并退出」退出组合编辑模式回到编辑器主页面。

继续点击最右侧「预览草稿」,效果满意后接着点击「同步至微信后台」就可以了。

使用同步功能不用频繁在编辑器和微信后台切换,同步成功后可以立即扫描二维码预览在公众号的效果。
如需局部导入可参考《iPaiban Pro小助手安装和使用教程》中导入功能的「导入代码」部分。
制作SVG交互图文认准i排版SVG编辑器,网址:SVG.iPaiban.com,复制网址在 PC 端谷歌浏览器打开,即可注册,编辑器所有组件/组合现已全部支持免费试用了。
新用户在「新手礼包」可领取3天企业标准版会员免费商用,以及22个常用必备组件的大礼包(1年)。随礼包附赠千元优惠券,每单最高立降500元。















