原文链接:https://mp.weixin.qq.com/s/AwmqgjsiJo-y7nM7V3z7jA

    1 引言

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

    2 产业互联网的设计本质

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

    「价值体验设计案例」滴滴云3.0之官网首页升级 · 语雀 - 图1

    2.1 目标对象

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

    2.2 竞争内核

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

    2.3 设计抓手

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

    2.4 价值聚焦

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

    2.5 设计本质

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

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

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

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

    「价值体验设计案例」滴滴云3.0之官网首页升级 · 语雀 - 图2

    4 滴滴云及涅 ****3.0

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

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

    「价值体验设计案例」滴滴云3.0之官网首页升级 · 语雀 - 图3

    4.1 涅 **** 设计调性

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

    「价值体验设计案例」滴滴云3.0之官网首页升级 · 语雀 - 图4

    5 滴滴云 3.0 官网首页升级

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

    「价值体验设计案例」滴滴云3.0之官网首页升级 · 语雀 - 图5

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

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

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

    「价值体验设计案例」滴滴云3.0之官网首页升级 · 语雀 - 图6

    • 从规模上看,官网用户大致分为:
    1. 潜在的大企业(大 B)客户,到访目的是搜寻、调研可靠的长期云服务;

    2. 潜在的小企业(小 B)客户,到访目的是搜寻低成本云服务;

    3. 潜在的行业个人从业者(B 属性 C),到访目的是搜寻廉价的 / 短期云服务或仅学习 / 测试;

    • 从身份上看,官网用户大致分为:
    1. 决策者,其本身就能决定是否购买产品 / 服务;

    2. 搜索者,带着目的收集、比对关键信息,供决策者参考;

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

    • 官网是接触潜在客户的最重要触达层,所以介绍产品及服务是最重要的 “产品层” 价值。

    • “云”作为产业互联网产品服务,基本不存在 “冲动性” 的客户消费行为,所以官网更多要承担“帮助客户快速收集、比对信息,最终促成购买”的 “决策层” 价值。

    • 由产业互联网服务的高成本特征决定,官网必须最大化透传品牌本身在行业知名度、业务稳定性等方面的优势,起到增强客户决心的 “信心层” 价值。

    5.3 滴滴云 3.0 官网设计目标

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

    5.4 页面布局及价值定义

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

    「价值体验设计案例」滴滴云3.0之官网首页升级 · 语雀 - 图7

    5.5 视觉语言及表达延展

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

    「价值体验设计案例」滴滴云3.0之官网首页升级 · 语雀 - 图8

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

    「价值体验设计案例」滴滴云3.0之官网首页升级 · 语雀 - 图9

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

    「价值体验设计案例」滴滴云3.0之官网首页升级 · 语雀 - 图10

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

    「价值体验设计案例」滴滴云3.0之官网首页升级 · 语雀 - 图11

    「价值体验设计案例」滴滴云3.0之官网首页升级 · 语雀 - 图12

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

    「价值体验设计案例」滴滴云3.0之官网首页升级 · 语雀 - 图13

    5.6 滴滴云 3.0 官网升级方案

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

    「价值体验设计案例」滴滴云3.0之官网首页升级 · 语雀 - 图14

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

    「价值体验设计案例」滴滴云3.0之官网首页升级 · 语雀 - 图15

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

    「价值体验设计案例」滴滴云3.0之官网首页升级 · 语雀 - 图16

    「价值体验设计案例」滴滴云3.0之官网首页升级 · 语雀 - 图17

    「价值体验设计案例」滴滴云3.0之官网首页升级 · 语雀 - 图18

    「价值体验设计案例」滴滴云3.0之官网首页升级 · 语雀 - 图19

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

    「价值体验设计案例」滴滴云3.0之官网首页升级 · 语雀 - 图20

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

    「价值体验设计案例」滴滴云3.0之官网首页升级 · 语雀 - 图21

    「价值体验设计案例」滴滴云3.0之官网首页升级 · 语雀 - 图22

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

    「价值体验设计案例」滴滴云3.0之官网首页升级 · 语雀 - 图23

    6 项目小结

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

    一家之言,不吝指正。
    https://www.yuque.com/books/share/f8b5478b-ae3f-4295-91d0-2ca47c9b7dba/hdnqed