图片太多怎么摆有创意,用这个SVG创意排版技巧

胖友们大家好啊,我是三儿。今天又是一期干货教程噢,大家备好零食快乐水,来一起涨涨姿势吧。

image.png

很多胖友在排版的时候,会遇到有多张图片需要排版的情况,三儿一般会建议新手小白们先按最简单方式上下、左右平铺排列,这样最不容易出错。


这么说,难道还有高阶的玩法?先卖个关子,来看看三儿下面做的这个图片展示的案例吧。


(ps:旋转屏幕,横屏观看噢)



点击人物展开图片


·
·



怎么样,用SVG来展示这5张图片,是不是更有创意了!


这种图片展开,人物跟随移动的效果使用的是SVG编辑器的『点击展开同时上层物体移动-自定义触发』组合,展开内容中的图片数没有限制,想放几张就放几张!


想学吗?来看看三儿是怎么做出来的吧↓



使用教程



01 进入SVG编辑器


通过135编辑器左侧入口进入svg编辑器



或者直接在浏览器输入svg编辑器网址进入:

https://www.135editor.com/svgeditor/





02 添加素材


找到『点击展开同时上层物体移动-自定义触发』,点击将组合添加到中间的编辑区




03 添加图片


在编辑页面右侧点击『添加图片』按钮,为素材添加触发展开图和小元素图片




04 设置触发区域


鼠标拖动红色方框,为小元素图片设置触发热区的大小和所在位置。




05 展开动画设置


为展开的内容设置动画时长,数值越大,展开的时间越慢;数值越小,展开的时间越快




06 编辑展开内容


点击编辑器右侧『编辑展开内容』进入新的编辑页面,编辑展开内容



选择『批量无缝图(点击不可弹出)』或『无缝图(点击不可弹出)』素材,上传好图片即可




注意:

该效果展开内容只支持放不可弹出无缝图,除了小元素图片以外的底部所有背景图都需要宽度一致



展开内容编辑完成后,点击页面上方的『完成』按钮,返回主编辑页面




07 同步/导出


制作好的SVG文章可以通过使用『同步』或『导出』功能,保存到微信公众号平台(ps:不知道咋同步和导出的胖友,点击按钮,根据提示操作即可)


 


注意:

如使用导出代码功能,则需根据SVG效果的使用平台(135编辑器/微信后台),选择对应平台的代码进行复制,尽量不要直接粘贴代码,以免效果有误。




以上就是

『点击展开同时上层物体移动』的使用教程

除了这种图片展示方式

SVG编辑器里还有更多

酷炫又有创意的图片展示SVG


『点击放大换图展开』

『自动拼图分裂式换图展开』

『点击开门展开』

......


下一期你想看什么

欢迎在评论区留言呀~


·EN

本文素材仅供交流学习使用

 ■ ■ 

文章评价
登录后可以评论
立即登录
小三儿135主笔
一个酷爱钻研排版的小编!
共341篇文章
最近文章
更多
  • 国际志愿者服务公众号图文排版素材(社区志愿者宣传文案模版样式)
  • 全国宪法日法制科普宣传排版素材(普及宪法精神宣传文案模版)
  • 世界杯赛程比赛推文排版素材(公众号足球宣传文案模版样式)
  • 世界足球日微信公众号推文排版素材(足球运动文案宣传样式)
比格设计
热门工具
135编辑器
领先的在线图文编辑平台原创样式素材,一键套用
比格设计
受欢迎的在线作图网站,新媒体配图、手机海报应有尽有
管小助
企业营销、私域流量运营——站式营销管理平台
推荐文章
广告变现近「2000万」却志不在此! 剧情号“遇见她”目标直播带货
通过内容运营的三个阶段,让你掌握内容运营的核心
用户运营平台产品设计指南
浅谈用户运营中的用户分层
内容运营:戴上写作的六顶思考帽
5000字方法论:4个细节,决定私域能不能赚钱
一文详解:渠道投放工作需要的五种思维
一个案例说明白用户分析怎么用
22条视频,涨粉12.6万,一个女孩子在抖音靠洗车也能月入过万!
用户分群模型,这么建才有用
热门素材样式
运营导航
运营工具
分享到