优设专访！阿里 2684 亿的数据大屏，是如何设计出来的？

△ 双11大屏合集视频

优设：

双 11 什么时候开始有数据大屏？这些年有哪些变化？

虹贝：

09 年第一次办天猫双 11，谁也不会想到它最终会成为一个具有全民情绪的社会节日。随着天猫双 11 渐渐变成一个社会现象，有一天逍遥子有了一个想法，公开双 11 的成交总额（GMV，Gross Merchandise Volume），让双 11 变得公开透明。因此在 2011 年的时候首次用投影的方式，第一次通过媒体对所有人开放，那时候总共才 2 组数据（一个是飞来飞去的城市交易图，另一个是飞来飞去的物流运送图），总共才五六个维度。到了 2013 年，我们整体的硬件升级成为今天我们看到的 LED 巨屏，成为了媒体中心的主角。

每一年的双 11 数据大屏都是一个缩影，简而言之就是把那一年做的事情用直观的可视化表达出来了。

从电商到新零售，再到经济体的大协同，你去看这些年的双 11 数据大屏，就相当于看了一段阿里的发展历史，这是比纪录片更真实可靠的存在，因为数据记录了一切：城市中交易热度的扩大，银发族的父母的购买力超过了我们，还有每年节节攀升的 GMV...

回到设计，我们除了硬件设备（屏幕）越来越大，我们所面对的数据量和业务也是呈现指数化增长，我们团队（阿里数据之美）是从 2016 年开始着手做双 11 数据大屏的，我们从电商交易，到线上线下，在到今天我们需要表现出所有经济体的业务，每年我们自身也不断在面对各种挑战：对集团业务的理解、对消费者的理解、要有家国情怀，还要有数据分析师的能力。

我一直说，数据大屏的设计，并非是传统意义上的设计师或产品经理就能完成的。它需要将艺术家、科学家与企业家的能力集于一身，需要拥有对动态数据的把握能力、对产业经济与供应链的结构方法、对社会议题的捕捉与构造，以及宏观的视野和细致入微的匠人用心。

优设：

今年的双 11 大屏设计有什么不同和创新点吗？

虹贝：

会有，而且每年都不同。只要社会在发展、阿里在进步，大屏就会升级。概括的说有两个点。

第一，是传播方式的拓展。在保留传统媒体直播数据大屏的情况下，我们考虑到了新媒体的传播方式，以往大屏的传播方式都是网站、报纸，但随着抖音、快手这样的传播方式兴起，我们考虑到了更多互动传播的场景：竖屏，更方便手机进行传播的大屏，相信这也是未来的趋势。

第二，是我们第一次尝试用可视化的方式来展现中国互联网弯道超车的景象。这种形式即追溯了历史的变化：中国从传统商贸，到互联网电商，再到 5G 时代的数字经济，一步一步实现了弯道超车，同时我们用一种物理的方式去调动新媒体中心现场的情绪。通常设计师在设计范围、情绪等场景时，首选通常是带有节日符号的装饰性元素。而这次双 11 大屏我们，让观众带入第一人称视角，跟随赛道的弯道，来感受心脏的失重感，以此来调动情绪的跌宕起伏。这点在媒体传播途径广受欢迎。

△ 2019 双 11 定格视频

优设：

为什么说双 11 数据大屏是一台凝聚情绪的超级机器？

虹贝：
我们把双 11 数据大屏分为两个层次来看，一个是「凝聚情绪」，另外一个是「超级机器」。

凝聚情绪一直是双 11 数据大屏最重要的功能。这是由双 11 大屏现场在整个双 11 体系中的核心位置决定的。

对于消费者来说，就如同所有购物节一样，双 11 具有狂欢节的性质，而双 11 数据现场就像是狂欢节最核心的广场一样，所有的气氛都凝聚在这里，全球几千家媒体也在这向外播报，全世界的眼睛都盯着数据大屏上不断跳动的数字，因而数据大屏就仿佛这个欢乐广场上最重要的花车与烟火，它是所有气氛的核心。

在节日之中，气氛等于投资，情绪就等于一笔笔的收入。我们制造了节日的气氛，让无数的中小企业与小商家把欢乐、优质的商品带给所有人，我们是为了几百万家企业与商家来服务的。但每一个企业与商家也同时在制造气氛，因为他们要为自己的几千几万个粉丝和消费者来服务，这就像一个「超级机器」。

因而这些气氛就像一张星状的网，从我们这里散开到每个商家，再从无数的商家那里散开到每个消费者那里。因此我们要把这些情绪凝聚起来，转换成更好、更热烈的气氛，以此再将当天的气氛推升到更高的水平、更细致的市场动态分析、更全面的人群喜好、更完善的产品优势，这样企业与商家才能有进一步的释放自己能力的可能性，更自由、更主动、更有效的带动他们的决策与判断，而不是像传统商场里的商家与一般促销活动那样被人为的吸血。

优设：

数据大屏的设计流程是怎样的？是如何与上下游进行协作的？

虹贝：

双 11 数据大屏，是整个阿里经济体协作的结果，整个项目参与者超过 150 人。参与的角色包括 UED、产品经理、PR、品牌、算法、技术、测试、BI 分析师、IT、行政、法务等等诸多角色，大屏震撼人心的视觉效果正是这些角色的共同努力。从设计的角度来说，最紧密合作的角色是 PR、产品经理和可视化技术团队。

设计大致分为三个阶段：

首先，做规划。我们需要知道战略和业务的重点。
在大屏设计开始之前，设计师需要和 PR、产品经理一起收集需求、划重点，把内容、案例、数据简明扼要的整理出来，输出的形式通常是EXCEL 表格和 PPT。在这一步，设计师需要能做到大屏内容的主次、数据的量级心中有数。

其次，将业务转换成图形。这是一个至关重要的阶段，将最终决定大屏呈现的品质。

设计师开始进入工作状态。设计分工包含场景设计和可视化设计 2 类，分别承担着框架结构、故事脚本、符号图形抽象、数据图形的工作与艺术化、风格化渲染的工作。两者工作为串联模式。

最后，协同开发上线。可视化技术工程师是我们最后一道壁垒。

无论我们采用什么样的技术手段（Webgl、UE4、Unity3D…)都需要工程师与设计师之间的紧密合作。小到城市光源点的确定，大到处理大量地理相关数据和高精模型、数据智能化的生成 19 个城市的渲染图，设计师与工程师之间都需要在一套语言体系下进行沟通。我经常遇到设计师来问我，为什么设计稿和最终实现的效果差异很大，我想这就是答案。

优设：

这次的赛道设计很有意思，能说说背后的设计过程吗？

虹贝：

赛道这个想法期初来源两个关键词：「弯道超车」和「商业奥林匹克」。赛道的背后是我们正在经历的新商业文明。新商业文明这个词最早是马老师根据供需变化的提出来的，后来我看乌麦尔•哈克写的《新商业文明-从利润到价值》这本书之后，我决定将今年双 11 的核心理念定位：新商业文明是中国的弯道超车。

设计上，赛道贯穿 3 个场景：大航海时代、互联网时代、数字经济时代。这是一个商业发展的历史，也是我们都在经历的过程。在互联网时代和数字经济时代的场景中，我们都增加了「弯道超车」的特效。这些场景都和双 11 的 GMV 进行了结合，来进一步带动情绪。每个场景都抽象出了对应的符号和要素，比如数字经济时代，我们将 5G、云计算、IOT 等意向用天猫精灵、含光芯片、云网络等符号来表达。

除了媒体中心大屏的赛道，我们在互动屏上也有赛道的运用：用数据来生产赛道。极坐标来表现双 11 的分时数据，在连接成一个赛道的平面图，用于场馆外的互动与抖音等新媒体的传播。这个用数据生成的赛道很有意思，非常像格式塔心理学的「鸭兔图」，是一个技术和艺术的巧合。

优设：

这次双 11 数据，体现了哪些值得关注的趋势？

虹贝：

我感觉整个世界都变了。从去年李佳琦走红和口红的销量越来越大，数据就在暗示我们的社会的供需关系已经发生了变化。

人（消费者）的变化带动了货和场的变化。新商业文明讲述的是以消费者为核心的供需变化，让我们从新消费的角度来看我们的数据，

双 11 期间小镇青年买走了最多的大型健身器材，95 后热衷于各种潮玩盲盒，精致生活的男孩子购买素颜霜。14 亿的中国人口、巨大的地域差异与文化差异意味着，每一种类型的消费人群都是海量的，都拥有现有经济理论所无法囊括的巨大潜力。小镇青年、银发一族、95 后作为新消费崛起的代表族群，正悄悄改变着社会的消费结构。通过数据我们清晰看到：族群的喜好千差万别，数字化的新消费使得商家能针对消费者需求创造新供给。

另外，双 11 结束之后我看到 CBN Data 的一篇题为《猫狗的消费力终于超过了人类幼崽》文章，双 11 实时数据大屏显示，今年最受欢迎的进口商品第一名是猫主粮，超过了进口消费碎钞机「婴幼儿奶粉」，另外，两个宠物食品品牌也跻身最受欢迎进口品牌榜前五。

同时更多的国际新锐商品也渐渐走入我们的视野，「足不出户，买遍全球」已成为中国消费者进口消费升级的一种新的消费方式。

优设：

工作中有哪些值得分享的故事？

虹贝：

大屏光鲜的背后太多不为人知的故事，却又不知从何说起。在此我更想说一些能帮到大家的事例。

一个，是关于大屏与普通屏幕在感官上是有巨大区别的。大屏从字面意义上来理解，首先是绝对尺寸上的巨大。以 2019 年双 11 媒体大屏为例，它的物理尺寸达到了 21*5.5 m，几乎达到一个篮球场的长度。在 5m 范围内去观看它，可以形成极大的视野包裹。那么如果观者在 1 公里之外去观看，它是否还是大屏？在此又涉及到另一个概念——视角。视角= arctan (屏幕尺寸/距离)，人离大屏越远，人眼与大屏的视角越小，如果大屏与观者形成的视角小于 30°，大屏的体感则不复存在，因此屏幕与观众还需形成极大的视角覆盖。

另一个，是关于地理位置信息的准确性，在地图边界、展示形式上需要花费大量的沟通时间。如今大屏设计以地图作为载体很常见，双 11 数据大屏也大篇幅的使用了 2D/3D 的地理位置作为载体。《地图管理条例》为了加强地图管理，维护国家主权、安全和利益，要求「地图在登载前应依法送审，不得在地图上标注涉密信息或者违反我国民族政策及政治主张的内容」。设计师与技术同学需要有提前量，提前完成相关审核信息，以保证大屏最后上线的效果。

我想，无论什么样的数据大屏，团队合作都逃不出两个关键词，「协同」与「共生」，项目的成功依赖于每一个成员不计成本的付出。双 11，我们需要协同整个经济体的伙伴，共同促成大屏的上线，展现给世界。每一环、每一个人都是环环相扣，相互依赖的。或许，这就是「因为相信，所以看见」的真谛。

数据大屏，对于阿里的每个人都是非常神圣的存在。

△ 双11幕后视频

双11大屏设计团队介绍：

设计团队来自于阿里的核心数据部门，阿里数据技术及产品部——数据之美团队。他们已经负责了第 4 年的双 11 数据大屏设计任务，从北京、深圳、上海再到杭州，双 11 媒体中心在哪，双 11 他们就在哪。

虹贝，2019 年双 11 数据大屏设计 PM

加入阿里 4 年，也负责了4 年双 11 数据大屏的设计任务，来自阿里数据技术及产品部-数据之美团队，数据可视化大屏与数据智能业务设计负责人，有丰富的数据可视化领域和数据产品设计的行业经验，现主要负责项目包括双 11 大屏、9号馆政务大屏、商业知识图谱、数据智能平台等可视化项目和数据产品。

往期双11专访合辑：