欸?这就是让图文普通变高级的「邪修」玩法吗?
明明是一样的SVG排版效果,为什么人家的看着那么高级?
万物皆可「邪修」,排版也不例外。
很多普普通通的SVG效果,稍稍在设计或创意上花点儿心思,立马就不一样了。
今天就给大家分享4个「邪修」排版的案例,使用 iPaiban Pro 编辑器即可实现,一起看下。
一
自动滚动
*素材来自MOCO官方《过渡季穿搭方案,不止PLAN B》
以往我们印象中的自动滚动,大多是类似的图片进行滚动,这些效果平平无奇的。
但「邪修」一下,将滚动图设计的大小不一,给人一种前后空间感,这种独特的设计,让原本二维的屏幕,瞬间有了三维般的立体感。
想要实现同款效果可以在编辑器(SVG.iPaiban.com)搜索使用:
组件:自动-向左滚动条
编号:10888(组件)
二
长按淡入,松手淡出
通常情况下,长按淡入松手淡出切换图片可能只是简单的静态图展示。
然而,爱马仕却独辟蹊径,长按后是不断以中心切换的动图,看起来相当酷炫。
想要实现同款效果可以在编辑器(SVG.iPaiban.com)搜索使用:
组件:长按-长按淡入,松手淡出
编号:10026(组件)
三
长按悬停手机
OPPO这个效果看着很有意思,但其实它和我们在春节常用的一个交互是相同的,这就是长按切换松手停止的新年签:
OPPO每一张开合不同角度的手机图片相当于上方新年签中的大学名称图片。
为了让图片切换得尽可能地顺滑流畅,这些手机图片都是背景透明的PNG格式,切换时间也需要尽可能得小,比如0.02s。而背景可以使用零高图片组件添加。
想要实现同款效果可以在编辑器(SVG.iPaiban.com)搜索使用:
组件:祈福签-长按轮播,松手停止
编号:10134(组件)
组件:零高图片
编号:10224(组件)
四
自动轮播
自动轮播展示产品,大多中规中矩。
而 MaxMara将背景图精心设计成台阶样式,轮播的模特图背景是半透明的,就有了空间感,仿佛一位位模特穿着服装从T台走过。
想要实现同款效果可以在编辑器(SVG.iPaiban.com)搜索使用:
组件:自动-轮播Banner
编号:10207(组件)
组件:零高图片
编号:10224(组件)
你还见过哪些化普通效果为高级的「邪修」排版案例?留言区分享一下。
























