一键还原苹果、宝马和GQ图文,制作同款效果超方便啦!

原创 收藏 评论
举报 2022-07-01

好的SVG交互图文,一定是交互和设计的巧妙结合。有时候不知道图片怎么做的,你也就制作不出同款效果。

比如Apple《换 iPhone 12 的理由,一个个展开说。》这篇,点击下拉的效果是如何与切分的素材结合的?

1656664304866.gif

比如宝马中国《马上有礼》这篇,开头的双层前景左滑效果,左滑图片,你会看到一只老虎驾驶着汽车向前疾驰,很是有趣,这个素材是怎么做的?

1656664380918.gif

再比如GQ实验室《JDM又是什么流行的缩写梗啊?》这篇,使用了点击弹出图片的效果,但首先吸引眼球的还是刚打开时的一段动画,这段动画色彩丰富但依然清晰流畅,是怎么做到的?

▲GIF演示

想要弄清上面的问题,最简单直接的方法就是下载原文的素材看一看。

还有一个一举两得的方法,那就是去「品牌时光机」SVG案例库搜一搜,如果恰好这个案例支持一键还原,你不仅能看到素材长啥样,还能知道使用了什么组件的交互效果。

该功能只有编辑器高级版会员才可以完全使用,如果没有高级会员,也可以查看相关组件,同样非常方便。

目前Apple宝马中国GQ实验室等品牌都有部分案例支持一键还原啦,整个案例库支持一键还原的案例总数达6000多,陆续会有更多品牌和案例加入进来。

Apple支持一键还原的图文:

宝马中国支持一键还原的图文:

GQ实验室支持一键还原的图文:

上面的图文都已下载完整的素材包,你想要哪个品牌的素材包可以添加下方微信,回复关键词【相应品牌名+素材包】领取。

▲长按扫码

下面再给大家说说如何快速知道一个品牌有哪些案例支持一键还原,以及一键还原怎么用吧!

第1步:登录

在谷歌浏览器网址栏输入网址 brandtime.cn 登录SVG案例库。

或者在登录 iPaiban Pro 编辑器(x.iPaiban.com)的状态下,点击页面右上方「案例库」即可登录,无需重复注册。



第2步:搜索

点击选择品牌搜索方式,输入品牌名关键词,然后点击搜索。



第3步:条件筛选

在搜索结果中,在条件筛选中选择「支持一键还原」,那么剩下的案例都是支持一键还原的。



第4步:还原并编辑

找到想要的案例后,点击卡片进入案例详情页,在案例详情页面点击「一键还原草稿」,便跳转到了 iPaiban Pro 编辑器,此时你会发现刚才的案例被编辑器完全还原了。



在编辑器中,你可以清晰的看到每个交互效果使用了哪个组件/组合设置了怎样的参数以及素材是如何切分的

接下来在编辑器中你只需删除不要的部分保留想要的内容,然后替换自己的素材即可。当然你还可以选择其他组件/组合继续进行创作编辑。

第5步:导入公众号后台

点击右侧「预览草稿」可随时预览效果,效果满意后继续点击「导入微信后台」就能开始导到公众号了。

导入时使用 iPaiban Pro 小助手更方便哦,最新v2.0版本的小助手还支持一键打包下载图文图片素材,非常方便,安装教程戳:《iPaiban Pro小助手v2.0来啦!》



制作SVG交互图文认准 iPaiban Pro 黑科技编辑器,网址:x.iPaiban.com,复制网址在 PC 端 Chrome(谷歌)浏览器打开,即可开始注册并使用。

6月15日-17日期间,所有非会员用户可领取3天企业标准版会员体验权,以及22个常用必备组件的大礼包(1年)。随礼包附赠千元优惠券,每单最高立降500元。

另外之前只要在我们这儿有任意的付款,都可以直接联系客服申请3天高级版试用,然后用编辑器账号登录案例库就可以完全体验一键还原功能,申请截止时间是6月18日。



● SVG 黑科技交互排版????????

·

本文系作者授权数英发表,内容为作者独立观点,不代表数英立场。
转载请在文章开头和结尾显眼处标注:作者、出处和链接。不按规范转载侵权必究。
本文系作者授权数英发表,内容为作者独立观点,不代表数英立场。
未经授权严禁转载,授权事宜请联系作者本人,侵权必究。
本内容为作者独立观点,不代表数英立场。
本文禁止转载,侵权必究。
本文系数英原创,未经允许不得转载。
授权事宜请至数英微信公众号(ID: digitaling) 后台授权,侵权必究。

    评论

    文明发言,无意义评论将很快被删除,异常行为可能被禁言
    DIGITALING
    登录后参与评论

    评论

    文明发言,无意义评论将很快被删除,异常行为可能被禁言
    800

    推荐评论

    暂无评论哦,快来评论一下吧!

    全部评论(0条)