相信不少朋友前段时间都刷到了人民日报这篇的推送,这是一篇关于中国航天梦的介绍,从古人追梦到03年的神五再到如今的神十五,每一步都来之不易,每一步都振奋人心。
点击图片·欣赏原文
除了内容让人热血沸腾,排版同样吸睛。有不少朋友在问,人民日报这篇文章是如何排版的。
大家可以在135svg编辑器上可以制作同款,0代码轻松制作!
01
打开svg编辑器
#在135编辑器左侧工具栏中找到135编辑器。
#或是直接复制下面的网站,粘贴到谷歌浏览器中打开。
02
选择组件
三儿说:很多人看到人民日报这篇会联想到之前GQ实验室那篇大火的《红了》,虽然他们本质上都是依次停顿式展开,但是还是有区别的,GQ是多图依次停顿式展开,简而言之就是内容都是由图片单一构成,而人民日报这篇后部分中插有一个双层竖向滑动,在停顿式展开中又有其他效果组件的嵌套,这是和《红了》的根本区别。
#若我们要制作GQ《红了》同款
可以选择多图依次停顿式展开 组件ID:243
#而制作人民日报这篇《飞天!从0米到400千米》同款
可以选择图文依次停顿式展开 组件ID:244
#注意:组件ID搜索要在svg编辑器中的搜索框搜索,在135编辑器内搜索无效哦。
03
添加素材
#该组件效果可以设置【自动展开】和【点击展开】大家根据自己的需求来;
【首屏展开图】就是指大家看到的第一部分的内容,例如人民日报这篇的首图就是这个👇
#点击【新增展开板块】,我们可以看见组件下方会出现一个【第一次】&【编辑展开内容】
#每个效果展开、停顿时间我们可以灵活设置,根据自己的需要调整;
一般展开内容我们就放一张图或是一个单独的效果,如下👇
#添加完第一张图后,继续点击【新增展开模板】添加第二部分,视频教学展示👇
04
添加后半段滑动素材
#这样我们就把前面自动展开图文的部门之后好了,那人民日后半段的滑动部分又是怎么制作的呢?
同样我们还是点击【新增展开模板】,【编辑展开内容】搜索组件ID:217,添加顶层图固定双层竖向滑动。
按照需求添加素材即可,完成后记得点右上角的【完成】;
后面我们又发现滑动到一部分【火箭】不动了,似乎双层滑动结束了,没错后面他们又嵌套了一个无缝长图,我们按照前部分添加素材操作即可。
这篇文章我们只需要用【图文依次停顿式展开】嵌套两个组件:一个无缝图(点击不可弹出)、一个顶层图固定双层竖向滑动就完成了这篇推文的制作。
三儿说:这正是【图文依次停顿式展开】组件的魅力,因为它可以再添加其他组件给我们文章有很大的可能性,我们可以嵌套轮播、点击换图、音频海报、视频、视频号等等,它能与很多组件组合,碰撞产生新的效果,虽说主体都是【依次停顿展开】但你能玩出很多新花样。