万字总结！B端产品设计基础思维与方法

本文作者从 2015 年开始进入 B 类品打造，前后几年时进了业内容探索，从概念品提出，到品收千以上，从品 1.0 两三个功能到后续迭代三十个功能平台品，沉淀了些个观与经验，在此分享出来与大家讨论交流，希望能与大家有更多讨论。

B 端产品新定义

1. B 端产品与工具产品的差异性

“Word、PPT、PS 等软件是 B 端产品吗?”

这个问题困扰我很久，以往 B 端品定义大部分是“企业提供服务品”，上列软件，既可以为企业服务，时也完全可以为个使用，那么它们算是 B 端品吗？如不是，那么什么是 B 端品？

如果对一个行没有精准的定位，那么在产设计过程中，做预判与差异是非困难，于是开始进行了定义的思考。

“To B”产品大概从 2016 开始兴起，在此之前大部服企业的线上产品被称为“后”产品，2015 年前后，钉钉等移动公软件开始火热，行业中开始兴起“To C”产品对应的“To B”产品类别。至此，为企业提供服的产品开始称为 B 端产品。但经历了年发展以后，发现这个定义是存在模糊的，有些工产品既可为个人服，也可以为企业服。

B 端界应该与企业目标与发展趋势相匹配，我人认 ToB 产品，清晰的义应该针对“企业”的特性提取与界出，“企业”标准界如下描述的：“企业一般指以盈利目的，运用各种产素（土、劳动力、资本、技企业家能），向市场提供商品或服务，实行自主营、自负盈亏、独立核算的法人或其他社会济组织。”

其中，目标是以盈为目的，境与对象是市场，手段是运用各种要素。

所以我们基于这个目可以抽离出来，企业是必须要追求盈利，并会不断临市场竞争，也需要不断拓展企业本身品或服务体系，以在竞争站稳，最终这些发展都将带来企业数变多、部变多、职责变多情况，所以最终会呈现出个具备晰组织形态结。

我们是否支持组织形态，来判断一个产是否为 ToB 产，会更的清晰，例如：Office 套件中，个人使时，是工具，而购企版后，具备了户数量的分配、权限的分配等功，那么就是一个 ToB 产。

△ ToB 产界定标准分析框架

“备组织形”，这个定义的实际作用主要为以下点：

能清晰预判 ToB 产品的基础功能

例如，权限、角色、部门等相关功能都是基础内容，需要提前开始建立，并且尽早考虑组件化、组织化。

为预判产品业发展提供基础逻辑

例如，基于业行业状，核心功能有哪些是必须要做的，哪些是以后可能需要做的衍生功能，哪些是未来可能作的第三方功能。

为建立业关性提供预见性

例如，建立产品框架功能关流程，能预判出哪些业可能会产生关，提前建立组件、模计形式。

能为用户研究体系构建析基础，提供有效的析结果

例如，不同职责关注息不同，决策者重数据统计，管理者关注权限数据安全，执行者关注业问题解决的效率。并且组织形下，不同部门的用户也对功能有着较大差异的述求。

△ 组织形示例

设计价值

1. 视觉设计价值

“为么要投入那么多资源开发数据界面，甚至制作 3D 效果？”

这个话题可以引导出视觉计在 B 端的核心价值之一，B 类产品中的视觉计价值，是一个备受讨论的话题：

一方面认 B 类产品中视觉设的价发挥较弱，不能 C 类产品中一样，可以与运营深度结合，流，同时由于 B 端产品设内较，使用时偏重效率主，也较难感化设方面发挥出高价。另一方面认，B 类产品中视觉设的难度不比 C 类的小，其中设规范、设体系、系统化设方面，由于产品级的问题，都相对会复杂很多。

而我个人认为，B 端产品的视设计价值，核心应该分为两大方面：

是针对决策输出的内容，目的是引流与现企业示例，打造光效应

例数据大屏、数字化效果演示模块，块是吸引决策者的核心内容，以理为引流的设计，方面的设计效果以直接影响老板的购买决策，潜在现出 B 类产品供应企业对产品质量、业务理、内容设计的能力，能让产品快速产生光效应，引导老板等决策产生购买意愿。

针对执行输出的内容，目的是降低认成，提高使用效率，同时也降低设计研成

例管理模块、权系模块、流程审批与具任务执行模块等，针对执行的内容，细分到业务场中，我们以理为在设计一个工具，而工具强“清晰、高效”，所以整视的价值在引导用户快速使用方面是具备重要价值的。

再，B 类品存在业务模块多、内容量级大情况，所以视觉设计在组件化、模块化、复用性都能降低内部设计耗时，有新品构时研发耗时，这也是视觉设计价值部分。

总的来说，B 类产中，视觉设计值要在引流与降本两方面，体现在点：

• 引流，即引导决策者品生良好影响；
• 降低认知成本，强执行层客户的使效率；
• 降低队内部计研发成本。

△ 展大屏效示例 – 搞定决策者，体现出品质量，打造环效应

2. 交互设计价值

相而言，B 端品交互设计价值更加观。

一方面可明显的为户解决务问题的效率做值；另一方面预判产发展，可为产避免成本迭代。

进行长期框架制定上，可以尽力为产品在未来功能大幅增长后，提供依旧可用的框架，并且功能入认知成本低，且易于寻找，这可以为产品在长期发展中节大量的迭代成本。一个发展了 2 年以上的 B 端产品，在 2.0 或 3.0 的版本下可能迭代一次需要研发投入 1~3 个月的间，同产品需求梳理计研究落地也可能都要投入 1~3 个月，甚至以上。这对产品在竞品赛跑的过程中是极为不利的，一个适应业发展的交互框架，可以好的解决这个问题。

第三方面的价对企业内言的，主降本增效。利用中台思维，建立基础控件、业务组件、模块组件内，提高产品研发与制化项目的效率，降低研发本，提升其他企业提供服务的效率，可以极好的提高产品的服务满意度。

总结而言，互设计在 B 类产品的价值在降与长期口碑两方面，主要现以下三个方向：

• 提高客户解决业务问题的效率；
• 降低产品迭代成，为产品在竞争赛道中赢得有地位；
• 降低企业内部定制化研发成本，为创新提供更多时。

△ 千牛商家后台 – 针对实际使用，提高效率，建立良好的框架与组件内，让产品走的稳、远、

设计难点与解决思路

1. 难点 1 – 用户研究

“C 端用研方法为何在 B 端推进阻碍重重?”，这也是在 B 类产品计经常讨论的一个问题。

由于 B 端产品企业所提供的服务产品，企业本身部分都其专属的行业特性，并且这些行业差异性非常之，例如医疗与流、教育与企业服务，这些行业中的用户本身专业性、活习惯、社会关系、消费偏好都存不同。

同时每个行业的业术语、技术背也不同，还存在着信息需要密等状况，对做用户研究带来巨大阻碍。么从什么角度来做 B 端用户研究更加快速准确？里分享我们常用的方式，总的方向倾向使用定类的测试与现象观察分析类的思。

我们观看下 B 类与 C 类用户区：

从上图我们可以看到，C 类品受众大部分是具备质性，而大部分 C 类品策略也是优先吸引类群。虽然他们不地、不年龄，有明显共喜好、习惯或述求。而 B 类场景，我们经常可以看到白发管理者与刚毕业年轻在交流。企业客户，除了在个企业共事是明显共性，年龄、习惯、消费平基本都存在异性，我们从观察法度来尝试进 B 端用户特性研究。

中要是从本与习惯两个维来分析，进而得户习惯与偏好，具体思路如：

对习惯的研究，可以称为“认知惯性”的研究，大部人在一个陌生环中，面临选择，通常倾向选择日常生活环相似的色彩、相似的行为顺序、相似的语言语调。这是人类本能中的一个倾向，多情况下，会选择更备安全的方向，通常熟悉的内容环能为提供较为安全的觉。

我们通过观察用户的企业环境、活环境、该群体共同关注的消费品领域，还该群体对共同关注消费品的认知，都能提取出非常重的认知习惯信息，从这些信息中，我们可以观察出用户对事的认知特性，基础分析逻辑如下：

△ 基于实践的意识形过程

我们以一个比典型的案例来看，在政企行业的议中，座位的等级是非常清晰明确的，并且流程极其规范。所以在很政企类产品中，流程化、标准化是必要的，追求高效。

并这类群信息正确性与安全性是常看，在安全与效率，遵循基本准则是安全、符合标准是第位，此时设计品时，体验关注在于如何构个安全体系与标准流程，完成后再去追求高效便捷易用性指标。

如果违背了全标准的规则，一味的 C 类产的体验视角推，是容易受阻的。而在满足全标准的条件，再追求效捷，甚至情感，是更好的一个产迭代顺序，更利于产被客户接受并营更好的务口碑。

△ 政企行的会议示例（图片来自络）

△ 政务务软件 – 延续了政务体系中的认知惯性，强调清晰、明确（图片来自络）

在 B 类产品中，每个行业重的指标非常不同。每个行业都应该要先建立指标体系指标优先，再进行产品计规划迭代会更加容易。

例如 G 端（服务政府产品）类的，一先遵循安全标准，再追求易用性。智能硬件行业中，理平台追求高效便捷，安全问题也很重，但由于安全相关问题不多，所以会将效率指标的高。那么如何研究行业的业务特征，并且制化指标与系统化思维也 B 类产品的重问题，这 B 类产品的第二难点 – 研究业务，接下我们就探讨一下业务研究的方法。

2. 难点 2 – 业务研究方法

“这行业的典型特性什么？”，相信这问题每一 B 类系统的设师与产品理面都会呈出。面提到 B 类产品一很重的目标系统提升效率服务，这提升效率的对象什么，需清晰的界。

大部分 B 类产品决的问题，是企业中的老问题、老流程，通数字化的形式，提高以往下沟通、对接、、审批等节的效率问题，以提高决业务问题的效率，降低人力成，甚至决以前人力投量太大而导致无法决的问题。

了解业务场景与核心内容，有以下两核心：

收以往在线下解决问题路径与

进书类文档、与沟节与交付内容梳理，输出核心目标、关键节、体流程、呈现形四内容。

收以往使用平台系统与专业工具

由于我们针业大部分已经存在几十年甚至上百年，所以他们也具备了些旧线上系统与应专业工具，深入研究这些工具构架、流程、核心界元素是常有效，研究完成后，需要输出业务平台与专业工具框架布局、常见流程、特色功能、必备功能等内容。

通过这两种方向的容收集与分析，可帮助大梳一些要容：

• 业务核心目标
• 务标准流程
• 业关关系
• 专业词汇
• 以往操习惯
• 工具认知级

我们以表的形式进行梳理，更加直观地得出结果，给出一个大致的示例：

在业务，通常就是对以往业务的流程、产品进行优化，以达到提升效率的目的。同时，为验证优化的结果是有明显用的，也就要求建立出具的量化指标，接下来我们看何基业务建立量化指标系。

立量化指标法：过业务研究了解了关键发力后，需要优化效进量化指标立。于量化指标，可以分为内、两个。内，指是品本身而言，这个，衡量效率与认知成本是核心指标。

由于 B 类产邀请客户参与实际测试的机会较、门槛较，由于大分数据隐私问题无法采埋点的形式收集数据。

所以在户实际沟通前，进行一轮效率测是困难，但却必须的。针对效率计算方式先拆解出一个用户剥离的方式，直通过计算步骤、使用频率、功能使用者的决策响力这三个要素进行测算，可以使用以下公式：

效率优先级 = 骤 x 功能使用频率 x 用户数 x 使用员的决策影响力

（注：使用成的决策能力在业务来看，大部分是老板一、管理人二，执行三）

△ 计示例（数据者 lili）

于使用效率而言，单独计算步骤本身不能代表实使用效率。

虽然有了这分效率计算维，但最终必须要实际户配合测试才得有效结果，这个结果的目的是测试易性相容，例如错误率、易性、有效性等等，基本逻辑是与定性测试相同。

由于实测用户的机会贵，并且还有 B 类用户真实的实操者可能对业述求不同，习惯也不同，所以基于的测结果或者收集的建议会有大偏差。为了保证测结果的有效性，可以邀请行业中的三种性人群进行测，可以得出更好更全面的测结果。

业专家

对业通，如果行业内有相关比赛，尽量邀请排名靠前的专家，可以提供前瞻性的建议，并且可以提供提高业效率的体思路，对行业中的人群认知也能提供基础息。

日常业执行者

每日都会进行日常的业理，可以提供对业的惯性理解认知习惯。

老板管理层人员

多是产品或定制化产品的审核者，不经常执行业，所以对业的体建议可能会有所误导，这点需要注。但对产品未来规划，还有竞品的对比情况非常清晰，可以好地反馈出目前计的水准。

这三角色能提供的信息特性如下：

后，再基于三种不同角色的用户去建立细化的化指标，即可完，例如：

日常业务执行者

关注效率，指标效率与认知，得出的结果数据测试的结果。

理层人员

关注结果与规划，指标与认知相关、数据密度相关，条件也可以加入净推荐（NPS）的指标。针对理层，得出的多性指标，结果分数。

业务专家

关注效率，并能提供创新性的思维与指导。指标效率与认知，好再加入性维度，与竞品对比分析，得出的结果数据内与分数。

在完整业务，并建立初步的指标，通常需要思考产品框架何搭建、功能何组合的问题，目的是希望能搭建一个不错的框架，让产品面避免框架方面的大修改，降低团的研成，同时也能更的应对功能集成述求，同时证产品验与效果不降低。为决个问题，我们以使用“系统化思”。

应用系统化思维，搭稳定容品框架。“这个品功能常多，能不改不要改”，类似情况在 B 类品迭代时经常见到。B 类品迭代逻辑，大多都是由单功能价值服务到平台价值服务发展。这与 B 类品制造企业，从小规模起家到大规模后具备客户群体基础，有常强关联。

B 类产随着企的发展与增长，需要停的添功，为制 B 类产的企寻的发展方向，抵御场竞争，构建有的壁垒。

由此，B 类产品在较长间内都会不停的增加新功能，并且会经常出现三种常见情况：

• 集成他产的功；
• 提供被其产品集成；
• 型客户提供制化产品，自己打造一基础产品的标准平台。

这三种情况都味着产品会其企业密切作，并且身也需要不停地增加功能。

部分 B 类产品的主功能 3 或 4 ，衍功能 10 多，甚至 20 多。发展 2~3 后的 B 类产品，迭本异常高昂，产品内部保证一致性也非常不易，后还需集其他企业的功能，客户提供一致的体验。

为决一问题，中台、组件等思开始应用兴，它们是为决功能太、管理不易、整太慢的问题。

而解决业务发展与内容调效率问题，主要也有三思路：

• 面业务情况，构建高包容产品框架；
• 立高用性基础控件与组件，有高频操作框架认知（例如确认与关闭按钮位等），成品提供规范与标准，时能快速组件、色进统调；
• 建立务组件，并深入优务组件性与易性，快速搭建定制产。

B 类品框架搭，可以从 OS 系统迭代逻辑吸取很好经验。OS 系统也临需要立用户习惯认知，并大量接纳各类 APP 或软件制作商来制作各业软件，时要保证品致性。

OS 系统从 Windows98 开始，已经迭代了 20 多年，建立起了非错的框架与接口逻辑，并且 OS 是供基础功为，例如我们的大分是件夹、Doc 栏一系列他的本编辑、绘图等功，经使第方企供的软件。

可以以下图来对比 OS  B 类产品的发展情况：

设计创新方向

1. 视觉设计创新

B 端视觉设计创新是个新兴探索，为大部分品都追求简洁高效，所以大部分认为视觉难以发力，创新也较难。其实在 B 类业，视觉创新是常要个部分，并核心决策者决策影响常大。

视觉创有个方向：

在数据可视方向的创

这方面的创都是针对核心决策者的创，目的是产的实际值更直观，通数据可视的形式呈现，并且体现 B 类企的产研发设计水平，购者放心，同时营光环效应。

△ 数据可视效果创示例 – 体现质量与效果 – 针对核心决策者

在具体务容方向的创

针对 B 类产务特性非多，基于务需要优的视觉容，例如图片展示样式、大小。

同核心业中的重点素视觉优化对提高产品使用效率有直价值的，这个方向在工产品中较为常见，例如 Teambition 采用的卡片任甘图形式关的方式，相对以往多个工切换，要直观方便多。

基于业组件的创新 – 提高效率降低认知负担 – 针对实操人员，考虑流程可视化、入清晰性、操作负担等维度

在核心业的重点素上创新

基于核心业后，还需要再进行细，针对核心的组件进行创新，目的也在于提高解决业问题的效率，通常通过降低认知负担或提高操作便捷性、息阅读便捷性来达成。

依旧以 Teambition 案例，任务分配的场景下，行了任务卡片的创新，这创新源于对任务责任人的表达形式、任务到提醒信息的信息阅读便捷性行了创新。

△ 重点元素优化 – 降低认知负担并提高效率 – 针对实操人员，考虑动效、小、图形语义维度

2. 交互设计创新

交互方向的创新，围绕对团队内部的研发设效率、对客户的业务问题效率两方面行的，致三方向：

基于框架发展的创新

这创新的难度，需对业务深入的了解，能对行业发展与业务述求的发展准确的预判性（这预判好的源面提到的专家与决策者用户），基于准确的预判，深入了解业务下游产品的述求与功能聚合性后，能建立起一稳的、具备包性且清晰的框架。

例，钉钉在基微信左中右结构下，进行更内容集合、工工具的框架创新。为建立更强的扩展，在“工”中采用 web 的标签形式，便进行功能切换操。

基于核业务的组件创新

具体从产品中，抽离出具备共性的内，这些组件业务流程中处于核环节的高频组件，组件的优化对产品解决业务操作效率明显的价，这样的组件投入资源行创新具备核价与竞争力。

依旧以钉钉为例，待办项是工中常用的一种提醒工具，对待办项组件的建立、查看与提醒流程的组件搭建，既以有效决办效率问题，也以减少产研团设计开的成。

同样对核业务的元素行创新

这创新主围绕提高效率行的创新，通常需先找到核业务中高频的交互元素，然后行交互形式、交互动效、内操作形式的创新。这方向公的产品中较少见到精准效的创新，我们以外的邮箱具 Spark 例，日常作中，邮件沟通都较式且重的内。但由于每人的事务较多，时概览完邮件信息后，希望稍晚处理，所以需稍后处理的标记，SparkMail 的基于这高频行，移动端与 PC 端都行捷的交互优化，移动端采用右滑标记，Mac 端采用右滑或右键标记的方式。

3. 技术效果创新

术效果创新，同也是围绕产品价值体现的，其中核心创新为个方向：一个是针对决策者的效果创新，另一个是针对实际产品效率的创新。

针对决策者的创新 -Web3D 智慧大屏效果创新

这类创新需要视觉计密切作，视觉效果数据息的呈现是重点。现在通常使用的有种基础术，一种是 web 直结的 3D 效果，这类大部使用 Threejs 的逻辑进行显示，体案例可以在 ThreeJS 官网进行查。

基于这类技，内也推出了简洁化的服务，例如 ThingJS，这类网站家只需拖动模型就可以出效果，发也比较便于使用，但效果部分只能到中水准，对电脑的性能消耗也较。

类创新建议使用在大型项目的数据视化界面，同时建议为置项，针对设备能不高的客户，及时隐藏该功能，避免能影响带来使用效率的降低。里我们以谷歌与 Threejs 合的验为展示案例：

还有一种效果创新，是针对在大屏展示的项目中的，目前大部分基 Unity 进行开，对显卡能的要求比高，建议只在演示项目与展厅中使用。

这类创新也常依赖视觉效，其开发流程与游戏开发较为类似，需要名 TA（技术美术）进 Shader 效制作，大部分用于园区、城市级、复杂楼宇效数据可视化展示。

更全面的案例了解可看潘洛斯团队与腾讯大数据可视项目组这篇总结：

这两技术效，针场景都可进不选择，大演示场景，需要体现技术数据结，使用 Unity 进创新效最佳。普使用展示数据可视化，可以采用 Web3D。如 3D 内容没有述求，可以进图标可视化内容创新。

前端效创新 – 针实使用者

由于 B 类品，品要解决大量认知问题与效率问题，前端效创新样也是围绕这两个维度进。表层效技术创新，以降低用户认知为目标，提高用户使用效率，例如些图片相关品，图片剪裁、拖动、放大等效创新。

还有一些是为产载速创，例如大量的列表、树结构等，这类控件的载速非影响户解决务问题，而进行越多的创就越好。这方面作者是行，只将通注的发来与大分享。

AntDesign 队的一些新内容发布，网址如下：

• 组件容： https://ant.design/docs/react/introduce-cn
• 图表内容： https://antv.vision/zh

工程化创新 – 面对的是团内部的稳定与效率

工程化在前端开中研究的太，者从设计师的角度也无法带给大家深的读，但以以此为引子，为大家扩展一思路。

基本目标是解决品问题后，查找相关问题精准度与速度，而设计经常遇到原度问题也可以用工程化思维解决，尽量将前端与设计最终效、设计组件、设计灵活性关系加强，是解决品质量稳定提升个有效思路。

上半分就到这里了，后面分具体方法、具体呈现结果的一些简单示例为要容，梳好后继续分享给大，期待与大的交流。