iSVG

基于开源共享精神的SVG交互图文搜索引擎·无偿使用·公益助力疫情下数字经济复苏

都市型录,摩登上场|无限选择+伸长动画|ECCO爱步

无限选择架构与伸长动画的复合,进而产生无限选择式伸长的进阶效果,使得页面信息的逻辑感进一步提升,让多样鞋品的浏览体验更具条理性。

🧡 痘 你 玩 🧡|连续点击切换-伸长|局部气候调查组

SVG 在线挤痘痘!本期科普图文一方面生动具象普及了痘痘的医学知识,在阅读体验层面以点击切换引导用户亲自操作,更以一组快感十足的长按交互模拟了按到底才能挤出「成果」的恶心感,将 SVG 的交互趣味推向巅峰。

「龙井·芝士糯糯」,还你|自动动画|HEYTEA喜茶

禅意感的置景缓缓变化,随后衔接灵动的网友评论滚动,这样的自动 SVG 动画表现恰到好处,清晰度体验极佳。

奈雪×姆明|过快乐宝宝节,送姆明限定周边|视差滑动|奈雪的茶

可爱温暖的姆明来啦!奈雪本期联名推广,采用视差 3D 和伸长图文复合,开场以单屏开启阅读,进入姆明的立体多彩世界,故事感十足。在场景的结尾继续点击,也可以切换进入完整的商详长图了解产品和周边信息,行文逻辑一气呵成,视觉沉浸感极佳。

福利解密局|小宝这场生日会玩到next level了|消消乐|宝矿力水特FansClub

本作中呈现的「消消乐」小游戏,连续点击两个相同的答案即可消除,巧妙融合了品牌元素与趣味玩法。目前该效果可以通过 E2.COOL 黑科技编辑器(https://www.e2.cool/)的UGC组件「消消乐」实现。

猫的花色原理,这里都说明白了|小游戏|局部气候调查组

局部气候又一脑洞大开的作品,以「猫猫上色工厂」为主题科普猫的花色原理。本作混搭了多款精妙的交互小组件,如「连续GIF控制器」呈现多次喷色效果,「幸运抽签-长按式」实现自定义调色,宛如神来之笔,寓教于乐,乐趣十足。

入职茅台,你会成为怎样的茅台大师?|答题|小茅i茅台

多段伸长答题+进阶式可保存海报结构,抽丝剥茧般引导用户解锁人才培养理念,在趣味答题互动中传递出企业价值观。

点击这里!『 1 』起出发|描线动画|清华大学经济管理学院

经管学院的 41 周年庆以动画为笔,通过点击控制的逐步伸长、渐现动画和描线动画,讲各方各面的成就娓娓道来,勾勒出发展脉络。

CoolSITE360 提供 UI/UX 支持  Copyright © 2013-2025 iSVG
投稿/定制/培训:微信公众号、小红书「iSVG」

沪ICP备2022011523号