iSVG

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

沉浸式体验 vivo X Flip 魔镜大外屏|无限选择器|OriginOS

本作采用无限选择器组件,使读者良好地体验到了不同配色下的屏幕样式。在滑动的第一屏内,再次嵌套吸附滑动达到小屏切换效果,且合理优化了两组滑动热区及顺序。

成年男女的520:好花|顶层填色滑动|GQ实验室

以物为花,将内容线索以花店为载体,趣味的插画环节后是此前 GQ 层在 crush 专题中应用过的顶层填色滑动,巧妙融合了鲜花美妆广告。

当AI带我坠入Gucci的百年平行宇宙|连续密码解锁+滑动|世界时装之苑ELLE

数字化与时尚设计的巧妙融合,结合了 label 选择、ChatGPT 会话等当下 AI 生成界面特性交互,构建了类似于连续密码解锁的滑动嵌套框架,也体现了开发者三千喵卓越的技术水平。

荣耀60 Pro|流光瞬间 匠心工艺|雪碧图+高速序列帧|荣耀手机

本作是雪碧图在SVG图文中的首次尝试,大量机型渲染的GIF均采用Sprite图的方式,不仅提高动图的清晰度,同时优化了图片的加载速度,将细节做至极致。

踏青指南 | 邂逅春日臻礼|层叠横向卡片|GRAFF格拉夫

Apple 层叠横向卡片的升级迭代,以卡片连续飞入飞出运行给用户以画面大观,随后重新聚合在画面中同位替换结构,支持后续展开交互,构思独到布局巧妙。

妳也一起,KO焦虑|位移效果+自主滑动|威尔胜Wilson

创造性地将滑动内容通过位移效果提前亮相展示,进一步诱导用户自主滑动查看细节。切换过程采用同位替换思路,无缝衔接的设计甚是巧妙。

这场穿越时空的“球赛”,你心动了吗?|画布伸长+双重触发无限选择器+ translate 密码交互|青春上海

这是一篇结合AICG生成的政务融媒体创新交互图文,以 2018 - 2023 的上海团市委民生工作为核心内容,基于穿越时空的视效设计和当下灌篮高手的热点引入,结合了包括 SVG 画布伸长结构、SVG 双重触发技术下无限选择器模型以及 SVG translate 密码交互技术等,完整构建了一篇从初始画面到时空长卷的交互图文设计,将各项工作内容突破相对枯燥的普通图文形式呈现。读者在互动中答题探索,强化记忆,更深刻体验我们的各大项目价值,最终通过密码解锁的环节升华到团代会的预热,交互逻辑完满连贯,画面设计一气呵成。

被绿到了。|点击切换或点击播放 GIF 特效|我要WhatYouNeed

以真人特写形象为主体连贯横版一图流设计是非常少见的 SVG 交互设计类型,因为这对画面取材修图和场景自然衔接的设计能力要求极高,且 SVG 的交互变化素材设计难度也比较大,尤其同一个人物的动作变化需要充分的前期策划安排。而 WYN 本文可谓精心筹备,以白象快闪香菜面馆为主题精心制作,采用点击切换或点击播放 GIF 特效等形式呈现人物镜头,效果一气呵成,让爱香菜和不爱香菜的读者都大为震撼,陷入深深的沉默中。

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

沪ICP备2022011523号