《横着看的SVG交互图文案例合集》

原创 收藏 评论
举报 2024-01-24


手机竖屏看图文看倦了?


那么,请把图文横过来制作,开启全新的视觉体验!


今天为大家整理精选了8篇把手机横过来看的图文,分别来自央视新闻、新华社、故宫博物院、西门子家电、石头科技roborock、起亚Kia 、GQ实验室、CharlesKeithOfficial,方便大家参考准备相关的推文。

01

央视新闻

《月圆࿐潮起࿐美绝࿐》

▲GIF演示

点此查看原文

「点击月亮」开始移动,伴随月亮移动轨迹「右滑」查看钱塘江图,点击图中的触发点沉浸式观潮,借此邀请大家中秋一起观潮。

交互对应编辑器组件/组合


02

故宫博物院

《钉!您有一条来自故宫博物院的新消息》

1.gif

▲GIF演示

点此查看原文

点击故宫博物院的吉祥物「雨燕」和钉钉的吉祥物「钉三多」,跟随他们的轨迹了解故宫博物院和钉钉签署的战略合作协议,共同打造数字化专属办公平台以及数字故宫 。

交互对应编辑器组件/组合


03

西门子家电

《前方高能,一大波亲戚来袭(内有红包雨)》

2.gif

▲GIF演示

点此查看原文

西门子家电巧妙利用「SVG轨迹」移动效果,通过春节串门的背景让男主将几种家庭关系一一串联起来,进门后点击红包抽大奖,借此宣传有家的地方就有西门子家电。

交互对应编辑器组件/组合

04

石头科技roborock

《去冒险,开启你的 2023 好运 TU 签!》

▲GIF演示

点此查看原文

点击开启寻签环游记,「滑动」控制兔子移动,点击扫走烦恼获得TU签碎片,借此吸引大家下载TU签同款表情包。

交互对应编辑器组件/组合


05

起亚Kia

《真的不打算出街?别宅了!》

3.gif

▲GIF演示

点此查看原文

点击起亚汽车模拟汽车行进,借此宣传起亚新K3汽车和春日好礼,吸引更多客户预约试驾。

交互对应编辑器组件/组合


06

GQ实验室

《原片秒变艺术创作,配方表全公开》

▲GIF演示

点此查看原文

GQ实验室通过「三层上滑」模拟青年人走过一天内的24小时,借此向大家宣传MINI汽车的精神。

交互对应编辑器组件/组合


07

CharlesKeithOfficial

《牛了个牛》

7.gif

▲GIF演示

点此查看原文

通过「点击切换GIF+展开」的交互形式模拟进入牧场,根据引导进行游戏,借此展示牧场物语系列产品,吸引大家参与抖音921好物节。

交互对应编辑器组件/组合

组合:点击切换GIF动图+展开(有触发区)

编号:10075(组合)

08

新华社

《杭州→宁波→温州→湖州→绍兴→金华》

▲GIF演示

点此查看原文

「上滑」查看亚“韵”Citywalk指南,点击查看杭州、宁波、温州、绍兴、金华等城市的介绍,吸引大家关注亚运会。

交互对应编辑器组件/组合

组合:上滑组合

编号:11400(组合)

组件:点击-悬浮弹窗(无限次弹出,不同关闭位置)

编号:11118(组件)


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

    评论

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

    评论

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

    推荐评论

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

    全部评论(0条)