iSVG

奔跑吧新一季即将到来，嘉宾闪亮登场。通过 perspective 的 CSS 裸眼 3D 布局，人物以极具真实感的视角张力依次罗列在云雾缭绕的新街区，随着滑动而产生差速变化。内部融合了精彩的伪音频视频 SVG 混合交互，让综艺推广更具亲和力。

基于 CSS 混合模式实现滚动页面时下方的进度条同步效果，本质为利用一个长斜边遮罩在滚动时不断增加露出底边部分，这也是 GL 老师的一款独特交互模型发明，巧思而实用。

将精美的金色纹理固定在底层作为背景，在顶层覆盖上镂空的龙图腾造型，随着读者上滑屏幕，镂空之处出现不断填色的交互效果，原本隐藏起来的图腾幻化为一条姿态舒展的霸气金龙！设计师的想象力 max！

从自然来，到自然去。这篇基于裸眼 3D 布局的产品广告设计，将文案、近景、远景分层差速布局，感官优雅的同时更营造了大自然的空间体验感。

由语图工作室发明的滑动式标签抽拉，可以承载更丰富的内部嵌套互动功能，本作即展示了多个视频号布局的多层结构。

E2.COOL 黑科技编辑器「挤压伸长」的精彩应用。这种长度相对有限的挤压伸长其实能更体现该组件的巧妙特性。

看似音频播放，实则为一个暗藏的不可见视频运行，通过 SVG 组合了文案的浮现，完成了音画同步效果，可以基于编辑器「切换图片-伪音频视频」实现。

基于 SVG 能力以图片缩放衔接多图滑动，力量感十足的弹性动画简洁而大气，是产品橱窗展示的巧妙设计。