My Secret Rainbow

滴滴云3.0官网首页升级设计案例

1. 引言

过去20年，是用户体验的黄金岁月，UX作为一门职业，在专业深度和岗位细分上都获得了巨大的发展。伴随消费互联网的蓬勃发展，在大量成功商业案例的背书下，设计师们很好的证明了自己在 2C 领域的设计价值。但从2018年至今，正如马化腾等互联网大佬所言，互联网正从上半场转向下半场（从消费互联网向产业互联网转型）。伴随而来的是整个设计圈都要直面的挑战：如何快速完成异赛道的切换，在新的行业生态下重新定位，再次证明设计的价值。

2. 产业互联网的设计本质

文章伊始，我们从设计视角出发解读一下消费互联网和产业互联网的差异。

2.1 目标对象

• 消费互联网的设计对象是类似价值主张的个体集合，他们是拥有类似价值追求的同一个人群。比如从宏观上分析拼多多的用户，其本质都是对价格敏感度高、追求性价比的同一类人。
• 产业互联网的设计对象是在同一利益链上的群体集合，他们是在一个业务链路上，拥有各自独立利益追求的群体聚合，通常不是同一类人，我们在内部常用“一根绳上的各种虫”来隐喻。比如一个财务报销平台，会有“报销人”、“审核人”、“财务专员”和“财务经理”等独立角色参与，而这些群体对于易用性的评价标准是彼此独立、互不干扰的。

2.2 竞争内核

• 消费互联网的竞争内核主要在于功能的丰富性和体验的易用性，竞争时往往拼的是产品对于“人性善恶”的掌控度。
• 产业互联网则不然，很难想象某企业用户会为了些许“小便宜”，将搭建在云平台A上的服务，迁移到云平台B上。显然其竞争内核除了功能和易用性外，更考验品牌力、依赖性、服务力及行业口碑。

2.3 设计抓手

• 因为目标对象和竞争内核的不同，面向消费互联网的设计抓手通常是关键用户场景、核心用户痛点，甚至是着力于满足用户显性/隐性的情感诉求，这些也是UX最熟悉和擅长的设计切入点。
• 面向产业互联网的设计抓手则不然，除了用户场景和痛点，产业UX更需要关注在基于业务需要的多利益平衡。我们对内更直白的要求是：“面向产业互联网，设计要业务化“，强调UX必须要在通透业务的前提下，切实为业务创造“可衡量”的价值。这也是横亘在所有产业UX面前，必须跨越的门槛。

2.4 价值聚焦

• 消费互联网设计的价值聚焦于“主观的价值收益”。
• 产业互联网设计的价值聚焦于“客观的价值收益”，这里的“收益“必须是“客观可衡量”。

2.5 设计本质

• 消费互联网赛道上，设计的本质是“体验设计”。
• 产业互联网赛道上，设计的本质是“价值体验设计”。

3. 价值体验设计(Value eXperience Design)

由服务对象和服务形态决定，面向产业互联网的设计，其本质是基于规模化产品之上的服务设计。针对这一本质，产业互联网范畴的设计工作应当将核心聚焦在“价值体验”上。

价值体验设计（Value eXperience Design）是建立在充分理解客户的实际业务需要之上，强调同时为客户和用户创造切实“可衡量价值”的产业互联网设计方法。

4. 滴滴云及涅槃 3.0

源于长期对“价值体验设计”的思考和沉淀，我们在去年底启动了滴滴云 3.0涅槃专项（滴滴云整体体验升级），今天带来其中一个小案例：滴滴云官网首页升级。

首先，简单的介绍一下，滴滴云是基于滴滴出行的业务技术和经验积累，面向企业及开发者的多种云端服务的集合，在产品服务形态上以 IaaS 为核心，以 SaaS 为辅，是典型的产业互联网产品。下图是它的使命愿景简介。

4.1 涅槃设计调性

基于滴滴云自身定位、对国内云服务的行业认知及目标受众特征，我们在项目组内部，明确了涅槃的核心设计目标（此处省略1万字过程）：打造“高品质、高效率、彰显科技感”的“专业”云服务。

5.滴滴云3.0官网首页升级

下图是改版前的首页样式。作为一家深耕专业领域的技术型公司，业务团队负责人对于官网的价值缺乏明晰的“可衡量”标准，用大白话说就是“有啥用？”，显然在这种情况下，团队很难下决心投入资源进行升级。这也是产业互联网领域内，“设计价值”未被普遍认可的表现：缺乏专业信赖度。

所以在涅槃之初，我们针对“价值体验”进行了详细的业务解读和设计推演，并多次和资深行业专家勾兑，最终凭借“深度业务化”的设计提案成功说服了业务负责人，获得了证明自己“设计价值”的机会。于是，滴滴云官网首页也终于等来了它的“涅槃”时刻。

5.1 滴滴云官网的用户是谁？

以下是通过用户调研及大数据分析得到的结论：

• 从规模上看，官网用户大致分为：

1. 潜在的大企业（大B）客户，到访目的是搜寻、调研可靠的长期云服务；
2. 潜在的小企业（小B）客户，到访目的是搜寻低成本云服务；
3. 潜在的行业个人从业者（B属性C），到访目的是搜寻廉价的/短期云服务或仅学习/测试；

• 从身份上看，官网用户大致分为：

1. 决策者，其本身就能决定是否购买产品/服务；
2. 搜索者，带着目的收集、比对关键信息，供决策者参考；

5.2 滴滴云官网的核心价值？

• 官网是接触潜在客户的最重要触达层，所以介绍产品及服务是最重要的“产品层”价值。
• “云”作为产业互联网产品服务，基本不存在“冲动性”的客户消费行为，所以官网更多要承担“帮助客户快速收集、比对信息，最终促成购买”的“决策层”价值。
• 由产业互联网服务的高成本特征决定，官网必须最大化透传品牌本身在行业知名度、业务稳定性等方面的优势，起到增强客户决心的“信心层”价值。

5.3 滴滴云3.0官网设计目标

面向滴滴云官网的“价值体验”分析结论：一方面是要帮助用户高效的收集产品、服务信息，用以辅助决策。另一方面是要向用户传达滴滴云的品牌力，快速塑造“值得信赖”的用户心智。同时，由云行业特性决定，促成新到访用户“完成注册”，是官网关键的“门槛级”可衡量“价值”指标。

5.4 页面布局及价值定义

针对用户实际浏览动线，基于“核心价值专注化”的理念，我们在不改变内容的情况下，梳理了各板块在价值透传纬度的聚焦核心。

5.5 视觉语言及表达延展

针对“专业”这一设计调性的解读，我们最终选择“按轨迹行进的数据粒子”作为视觉表现的微观元素，利用“宏/微观视角下聚散演变过程中的动静形态”，预留出充足的创意空间。

色彩方面，在延续滴滴云传统品牌力的前提下，我们选择“极客蓝+专业蓝”作为升级后的色彩搭配，帮助品牌在追求“专业”的过程中，同时满足云行业客户对服务商在“底蕴深度”及“品质体量”方面的隐性要求。

为满足不同的业务诉求，我们对展示性/功能性图标做了区别化的设计定义。

对于插画/Banner系统，我们在设计表达手法方面做了“价值化”处理，兼顾了日常运营需求对“响应效率“的追求和官网本身对“视觉品质“的要求。

动效方面，我们在首页设计上保持了克制，仅通过恰当的节奏感变化，对用户进行弱打扰的视觉引导，在确保整体沉稳的“专业”调性基础上，增加些许“灵巧性”。

5.6 滴滴云3.0官网升级方案

下图是最终的滴滴云3.0官网升级方案：

从整体性上看，通过在深色背景色调上灵活穿插的“高亮”极客蓝，我们一方面着力刻画品牌在技术上的深度和在行业内的底蕴，另一方面也将科技感和未来感进行了恰当的视觉穿插，赋予品牌更鲜活的生命力。

从图形细节上看，我们利用粒子构成体量感差异明显的各种图形，在视觉感官上进行虚实变化处理，既表达了“专业性”，也兼顾了实际浏览体验中的透气性。

对于最“艰涩难懂”的解决方案模块，我们引入情景式的设计表现手法。在加强页面整体节奏感的同时，也尝试用最自然的方式将阅读者带入到对应的行业情景中，帮助用户更轻松的阅读，更快速的理解内容本身。

因为品牌规范要求，用户心声及专业背书模块的色彩比较斑驳，于是我们采用“去色”的方式进行了视觉降噪，并引入“可触发注释”的微交互，将隐性的品牌实力更直白的透传给客户，增强客户信心。

在页底的“行为激励”模块，我们利用主视觉元素的延展设计，给出了“多样性视觉纹理+可定制文案内容”的方案，兼顾了视觉效果和运营灵活性；

6. 项目小结

滴滴云3.0官网首页升级，是一个纯设计驱动的项目，升级过程中没有实质性的产品内容变动，上线后也没有运营造势。但其最核心的“用户注册转化率”较2019年同期提升了69%，超出了业务预期。通过这个项目，创造“可衡量价值”这一设计理念被证明能非常好的适用于“滴滴云”这样的产业互联网产品需要。我们将在之后的案例中，继续和大家深入探讨面向产业互联网的“价值体验设计（Value eXperience Design）”。

原文：https://mp.weixin.qq.com/s/dJBtJpy0BIImBbv52is3fw