iSVG

CSS 滑动+SVG 触发，Vogue 本期的一图流融合了最顶尖的两种黑科技互动技术，无缝绘制了一条上海滩潮人众生相。本文 SVG 交互技术由我们 JZ 支持。

SVG 其实在前端领域中，常被用于数据可视化项目，但在新媒体领域尤其图文范畴内，鲜有得力大作。本月，我们 JZ 的赵阳主导了一篇 InfoGraphic 的互动式图文技术，将数据报告通过 SVG 交互动画可视化展现。

谷粒多在十一月通过一则典型的互动长卷发布新品奶昔，前期由 GL 测算了互动代码量，荒村完成开发工作，讲述了一只社畜奔忙上班的历程。

网易正在努力进入 SVG 交互图文领域。虽然目前技术、设计都还略显稚嫩，但本月的互图文依然有所进步。本作掷骰子的互动游戏十分出彩，尽管通篇主要牵涉的是动画，但骰子游戏的执行逻辑让图文变得妙趣横生。

长按-松开对应可见性的作品许久未见，而极客公园就采用了该互动模型，制作了一组前沿思考论坛的预热海报，交互部分由振铭操刀。

尽管我们一再强调，位图标签作为互动元素，会在不少机型上翻车——如过低版本安卓、刷机苹果等。但依然有不少定制互动图文的品牌主宁可放弃这类用户，强制使用位图进行互动。本作便是荒村苦口婆心劝阻甲方无效，而以位图方式实现的随机娃娃机交互。如果不考虑适配性问题，可以说位图在视觉呈现上确实比矢量图更精致，但我们依然不建议品牌在近阶段尝试位图互动。而如果确实有其必要，则一般会在背景图参数中预置一张 GIF，让无法看见前景互动的用户直接观看背景图的动态变化。

本作由 GL 操刀交互技术的具体实现，主要通过描摹动画，将一场科技大会的日常安排，以最黑科技的排版呈现了出来。

奔驰旗下各公众号的高级互动图文一般由 GL 或荒村负责开发执行，而这些作品往往讨巧在 Agency 提供的视觉设计质量出众，于是可将简单的代码动效展现出最佳的互动张力。本作是简单的 SVG 画布整体值变化，但结合下端的透明黑幕设计和高品质背景图，豪华感不言而喻。