135编辑器新上的自动轮播SVG效果

三儿带来两款创新轮播组件(ID:573 & 614),助力提升推文视觉表现。首款SVG实现顶图固定多图横向缩小移出轮播,适宜春日美景创作,通过虚实结合设计展现动画人物与背景景色。第二款扇形轮播组件支持图片跳转,适于展示产品或人物,如妇女节主题相册设计。

HELLO

轮播SVG

上新啦

嗨喽,宝子们,三儿来了,最近咱们SVG编辑器中上新了多款自动轮播组件,三儿挑选了其中两个高级感满满的效果推荐给大家,如果你想为你的推文增加点创意,那今天的内容可千万别错过~




1.效果展示



·



01
SVG组件介绍

这款SVG组件名称叫做顶图固定多图横向缩小移出式轮播,ID:573。

02
SVG用途

最近这段时间万物复苏,春意渐浓,正是大家做春日美景选题的好时机,但在推文中仅靠图片展示很难有新意,今年不妨与此款SVG效果结合做点创意。


比如可以像三儿一样,利用虚实结合的设计,在顶层图部分放上动画人物,背景图则添加景区、校园的春日景色图。




·
·


·
·
·


01
SVG组件介绍

这款SVG组件名称叫做扇形轮播-图片可跳转,ID:614。

02
SVG用途

此款SVG组件的背景是固定的,前景才有轮播效果,适合拿来展示产品或者人物。比如面对即将到来的妇女节,我们就可以将背景图设计成相册的样式,前景轮播图部分放入公司同事的照片,展示女性风采。



2.教程讲解


接下来三儿就简单的给大家讲解一下这两个效果是如何制作的~


第一款效果


首先三儿先给大家拆解一下制作思路,此款效果由两部分组成:顶层的动画人物和多张背景图。


注:以上图片均来自比格设计官网


公园露营宣传海报 (1).png

公园露营宣传海报.png

露营活动宣传海报.png

春天清新草地日签海报.png




图片设计部分思路:顶层图部分要做成PNG格式的图片,动画图则可以采用实景摄影图片,这些所有图片的宽高尺寸都需要保持一致。


接着就进入到咱们的SVG编辑器,在搜索框中输入ID:573。


按照要求,分别放入顶层图以及动画图。



再调整一下细节,比如滚动方向、动画时长和播放速度即可。




最后制作完成,点击右上角【同步】到公众号后台或【导出】到135编辑器页面。




第二款效果


第二款效果的制作思路同样为两部分:一张固定的背景图,多张轮播图。


妇女节照片宣传活动手机海报.png

妇女节照片宣传活动手机海报 (1).png

妇女节照片宣传活动手机海报 (2).png

妇女节照片宣传活动手机海报 (4).png


首先,轮播图部分需要制作成png格式的图片,背景图则设计一张固定的图片即可,所有图片的宽高尺寸需要保持一致。


接着来到SVG编辑器中,在搜索框中输入SVG组件ID:614,放入到编辑页面。



按要求添加图片到SVG组件中。


image.png


接着调整SVG组件细节部分,比如动画时长和移出方向。



最后制作完成,点击右上角【同步】到公众号后台或【导出】到135编辑器页面。





以上就是三儿分享的全部内容了

如果觉得还不错

记得给三儿点个赞+在看哦~


最后,三儿还给大家

带来了开工福利

现在购买会员

优惠多多

还在等什么

赶紧扫码领取吧




END




文章申明:本文章转载自互联网公开渠道,如有侵权请联系我们删除
文章评价
登录后可以评论
立即登录
分享到