toB和toC 的交互界面有什么系统性的差异？

toB和toC 的交互界面有什么系统性的差异？

在专业的交互设计师来回答你的问题之前，先从产品角度试着进行一下分析

（之前没有系统地整理过，因此就着你的问题边回顾边整理，希望有所帮助）

本答案分为4个部分

其中第0点是不涉及交互界面具体分析的，而是从产品的用户画像、场景及心智先行分析（大约占50%的篇幅）

若不想细看可以直接跳过～～

只是在思考此类产品设计类问题的时候，我通常会先从用户和需求角度来打开思路，所以也一并附文于下

B端用户和C端用户，显而易见是完全不同类型的用户，但是要说他们的具体区别，却不在人口统计学特征上。脱离企业工作场景，每个B端用户同时也是一个正常的C端用户，也都满足五层需求层次理论。

那么他们的差异主要在哪里呢？

我们说的C端用户，通常指的是具备完整自然人格的普通互联网用户，他们因为与生存、生活相关的需求而来到你的产品，代表的是产品使用场景下任何可能的需求——包括那些看起来不合理的需求。

而B端用户是有着特定角色的一群人，可能是某公司的某个或某几个职位，他们拥有共同的业绩指标，为了同样的有限的目的来使用你的产品，他们代表的是企业目标分解下来的具体、局限性的需求。

讨论完“人设”上的差异，我们再来看看C端用户和B端用户场景上有哪些不同

聊完外在的一些因素之后，我们最后来说一下用户使用产品的内在影响因素：用户心智

C端用户和B端用户心智差异，具体可以表现在

————————————道与术的分割线————————————

用了大概一半的篇幅，说了设计思路上的差异，那么具体到实践层面，我也分享一些经历过的case总结吧

C端和B端产品第一眼能看出的区别，就是整体风格上的大不同

具体来讲，除了色调属于视觉需要考虑的（C端偏向暖色调、丰富色系、充满情感；B端偏向冷色调、色系单一、“黑”白分明），页面的结构和页面之间的交互都需要先确定一个整体的画风

如：

这些都会融合到具体的交互设计规则中，变成具体到每一个功能、控件、页面切换等的设计准则

选定了正确的产品风格之后，才可以进行具体的界面交互设计

第二眼，我们来看具体的界面结构

多看一些C端产品，特别是用户体量较大的、功能较多的产品界面，初看会有混乱感（这就是我每次打开手淘都迫不及待点开搜索框的原因），但是好的C端产品，是能够让各个不同形状、风格甚至色调的模块达到和谐共处的平衡感的。而B端的界面结构则追求绝对的秩序感，同一个纬度的功能一定是并排放在一起的，而且功能分类维度最好不超过2种（就是业务绩效那些事儿，分出太多的维度说明你归纳锻炼的很差哦）

这里指的混乱，是照顾到C端用户角色多样、行为路径多样而必要的设计，有icon、有文字、有图片、有视频动图，结合好了就像一首交响乐曲，而单一的设计风格会让人觉得枯燥，甚至“密集恐惧”，所以C端产品需要有更多的创造性思维，而B端，就收起你的花花肠子吧。

（请叫我造词小天后～～～～～当当当～～）

（正经脸）

C端用户在使用产品时，视觉是游移的，思维是发散的，因此在页面结构上，焦点的摆放需要参考视觉热力图，预测用户的视觉焦点比重，再根据比重高低平铺各个内容或功能区块

不过，目前通过瞳孔监测，准确预知视觉热力还是科研阶段，并没有广泛运用，因此，有很多焦点分析会用点击热力图作为参考。

当然，点击热力和产品本身内容高度相关。而研究产品热力图，主要是为了判断自身产品目前的主要内容放置是否合理，是否出现低频功能放在了视觉中心，而出现了“焦点偏移”

因此，C端产品的页面结构，好比扁平化管理的公司：

而B端产品设计时，要限制用户的注意力游移和发散，因此整个页面结构，通常都是用树状结构的层级来体现的，就好比公司分各个部门，各部门下面各个小组。举个不恰当的例子，假如用B端产品的界面结构来设计一个云音乐产品，大概会是这样的页面结构

C端产品线之间的界限是模糊的，还是上面云音乐的例子吧，同样是推荐，歌曲、歌单、电台、话题不同业务形态都能够满足用户“看点什么、听点什么”打发时间的需求，因此他们通过“猜”用户的实际需求，从需求角度串起了各个产品线

就好像，你逛手淘首页，你感觉都是在推荐商品嘛，你能区分出其实一个首页就包含了十几条不同逻辑的产品线嘛？

而B端产品线，在做界面时就有清晰的隔离：是交易相关的，就在交易模块内；是财务做账的，就在财务模块内等等。主要的原因是企业内角色本身的界限相对清晰，需求明确且差异大，不同角色要快速找到属于他的趴～，才能高效处理事务

C端产品的内容展示上，通常会留有扩展性的暗示：

种种令人发指的粘住我不让走的阴险设计，就是为了让用户感受到，本产品宝宝还有无限可能，还有很多你不知道的东西在等你。

想起前面的用户心智了嘛，C端用户对于“意外惊喜”是乐此不疲的，你要告诉我，不好意思，本宝宝只能帮你到这儿了，啥也没有了，作为用户的你，是不是会凭空生出一种被堵住了的绝望感？

而B端产品就不能这么玩了，同样是心智问题，B端用户要carry全场，掌控全局，你给我出搜索结果，你也要告诉我一共有多少条，我是来寻找最优解的，你不能让我感觉自己逛也逛不完，这时候，是不是又会凭空生出一种看不到结局的绝望感？

定好了产品设计的风格，界面结构的分布排列、页面嵌套等逻辑之后，剩下的交互，就要落到细节实处了

那么我们就废话少说，来看看有哪些实用小细节

C端产品可以选择运用更多的模块形状，只要能够互相协调

B端则需要选择尽量稳定的形状：如 矩形、方形、直线（懒得举例啦）

C端用户“好色”，能放图片的尽量不用文字描述

B端用户希望看到的图片除了“产品实物图”、“用户头像”之外，可能就只需要一点icon了吧

如果C端产品定位是活泼、可爱类型的，不妨设计一些动态的图片或交互过场，点缀之外也能增加产品流畅性

B端：算了吧，浪费页面加载速度（当然非常重要的提醒和广告还是可以应用的，但是注意节制）

模块、图片的尺寸大小，是设计感和内容丰富度之间的平衡，C端用户可以视情况运用大尺寸图片营造氛围和格调，B端的话，能看清楚就行了，氛围是什么谁在意

C端产品的描述语言要亲切、口语化，如果产品定位有性格成分，文案要和产品的性格、用户的情绪相适应，甚至可以尝试很多艺术表达，例：你所访问的页面，迷失在了森林深处。。。

而B端产品的描述语言，着重在表达清楚，去掉修辞，直接了当说明问题所在（当然偶尔卖个萌也不是不可以的）

非必要情况下，不要让C端用户填写表单，能选的用选，能分步获取的信息分布来，应试教育影响了我们十几年，看到表单结构的输入，你不想砸电脑摔手机么？

B端用户，权衡一下表单和选项之间的操作复杂度，在需要集中获得大量信息的场景下，自由填写表单不失为一个好办法

弹出式的提醒，在C端场景下，本身就是打断用户行为，是不友好的，因此提醒要做到节制，口吻要亲和、循循善诱，可以运用页面内提示（小红字标错）、顶部Toast、HUD等不同强弱的交互方式进行提醒

B端场景下，则需要关注提醒的触达效果，特别是面对可能的错误时，一定要明确提醒并且获得“确认”反馈

所谓完成态，指的是当用户点击了保存、提交后，页面内容进入了一个完成的状态，C端因为较少涉及到直接数据的操作，更多是顺着流程往下推进，因此完成态的预览可以弱化，下一个场景可以马上登场

而B端用户，特别是涉及多个数据填入、或者关键性流程节点的提交，通常可以对完成态进行预览，以确认信息的准确性，提前更改错误

沉浸式体验最近两年在产品设计领域内大火，就是为了对抗C端用户的注意力分散、容易跳失的问题。具体的设计风格，可以参考抖音（抖音5分钟，人间2小时，够不够沉浸），还有阅读一类的app，而电商app是沉浸式体验的重灾区，当然人家追求的是流量价值最大化，不必追求绝对的沉浸。

具体而言，沉浸式体验就是让你把关注点全部放到当前内容本身，而忘记了我是谁，我在哪，我要干什么。

那么，追求效率的B端用户，适合沉浸式体验设计么？

最后说到面包屑导航，这个PC时代的产物，在移动屏幕上已经消失了（还有哪里有活化石说出来让我看看！）

B端产品很多仍旧立足于PC端，因此这个设计还是很常用的，结合B端产品树状结构的层级能起到很好的导航作用，千万不要漏掉哦？

C端产品嘛，看具体业务场景，论坛类型的（偏树状结构）还是运用的很广泛的，但是电商类型、媒体类型的，说实话我觉得已经没什么用了，不说用户对你的每个分类节点是否都有普遍认知，推荐算法已经广泛应用了这么多年了，谁还关心商品和内容的层层分类啊？

——————————正文完毕分割线————————

本来以为都是经验之谈，随便写写的，结果前前后后写了3天才完成，图片找的不多，可读性有待加强，因为我好想马上去写一篇新的文章了。。。所以先这么结了吧～

如果真的有人愿意看，回头我再完善起来～

么么哒