红包套红包,PayPal的红包套娃排版教程来了!

品牌时光机

发布于:2026-01-26

摘要:

图片

 




红包封面做好了,却不知道怎么给用户发?


春节给用户发红包封面,需要一点仪式感。之前早就给大家整理了丰富的案例可以参考一下:


《2026红包封面SVG交互图文案例合集》

《红包封面SVG交互图文案例合集》


有几个比较经典好用的效果,还给大家出了教程:


保时捷的这种点击拆红包展开排版,怎么做的?

点击下拉放烟花,知乎这篇春节图文怎么做?

发红包啦!直接的

过年了,教你制作一个红包雨展开效果!


今天再来一个,也是大家常问的,PayPal的从红包里领红包排版教学。


先看下效果:


图片

*素材来自PayPal贝宝官方“龙”重登场!PayPal China贝宝中国龙年限定红包封面来了!

组合:上滑组合

编号:11400(组合)

组件:红包封面-图片

编号:11137(组件)

向上滑动图片,祝福语从红包中拉出,最后出现领取红包封面的按钮提示,点击按钮即可领取红包封面。


可以看出,这个效果分为3层图片,背景层和前景层图片不动,中间层跟随手指向上滑动,并且中间层不是纯图片,还能嵌套其他交互效果。


下面一起看下排版教程吧。


详细教程:


工具:i排版SVG编辑器,网址:SVG.iPaiban.com

组合:上滑组合

编号:11400(组合)

组件:红包封面-图片

编号:11137(组件)


第1步:选择组合


登录i排版SVG编辑器后,点击编辑器左侧「组合」按钮,直接在搜索框中搜索「上滑组合」组合或者搜索组合编号11400,点击选择。


图片


第2步:进入组合编辑模式


点击「编辑组合」,进入组合编辑模式。


在组合编辑模式中,左侧为「滑动布局」设置区域,右侧根据需要还可选择上传遮罩图背景图

图片

第3步:上传遮罩图和背景图


遮罩图和背景图根据需要可传也可不传,本文案例这篇需要上传遮罩图和背景图,点击「换图」按钮分别上传即可。两张图片尺寸一致。


图片

第4步:设置滑动内容


「滑动内容」不局限于单纯的无缝图,还可以嵌套使用各种交互效果组件


需要什么效果就在左侧「组件」分类中找到相应的组件拖动到组件位中,然后上传需要的素材即可。


添加组件位-拖动组件到组件位中-上传图片,每需要一个样式就按照这3步操作:


图片

本文案例这篇主要用到了「全能无缝图」组件(编号:10028红包封面-图片」组件编号:11137)。


注意,上滑效果滑动范围的大小,由「滑动内容」中第1个组件的图片尺寸决定。所以我们需注意第1个组件的切图大小,另外步骤3中上传的背景图,尺寸最好与第1个组件的图片尺寸保持一致。


第5步:导入公众号后台

内容编辑完毕后,点击左上角「保存并退出」编辑模式来到首页。

图片

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

图片

使用同步功能无需频繁在编辑器和微信后台切换,同步成功后可以立即扫描二维码查看。

如需局部导入可参《iPaiban Pro小助手安装和使用教程》中导入功能的「导入代码」部分。



制作SVG交互图文认准i排版SVG编辑器,网址:SVG.iPaiban.com,复制网址在 PC 端谷歌浏览器打开,即可注册,编辑器所有组件/组合现已全部支持免费试用了。

新用户在「新手礼包」可领取3天企业标准版会员免费商用,以及22个常用必备组件的大礼包(1年)。随礼包附赠千元优惠券,每单最高立降500元。