主要观点总结
本文分享了B端学员作业改版思路，以复杂表盘页布局调整为例，探讨了信息设计的探索与检索在B端和C端产品的不同应用。文章介绍了信息探索与检索对于用户接受信息的被动与主动性的区别，强调了B端产品设计应以信息检索为目标，提出了界面改版的原则和要点，包括内容的组织和规划、权重的对比、观看顺序的满足以及组件间距的调整等。同时，也提到了表格、表单页面的设计也需遵循同样的思路。
关键观点总结
关键观点1: 主题和内容概述
文章主要围绕B端学员作业的改版思路展开，以复杂表盘页布局调整为例，探讨了信息设计的探索与检索在产品设计中的应用。
关键观点2: 信息探索与检索的区别
文章强调了信息探索和信息检索在用户接受信息过程中的区别，以及它们在B端和C端产品设计中的不同应用。
关键观点3: B端产品设计的原则
文章指出B端产品设计应以信息检索为目标，提出了界面改版应遵循的原则和要点，包括内容的组织、规划，权重的对比，观看顺序的满足等。
关键观点4: 组件间距的调整
文章强调了组件间距在界面设计中的重要性和调整方法，提出了一些实用的设计建议。
关键观点5: 其他B端页面设计的适用性
文章最后提到表格、表单页面的设计也需遵循同样的思路，以满足信息检索的目标。
正文
今天的主题是 B 端的学员作业解析，关于复杂表盘页布局调整的思路，也是比较有代表性的问题之一，下面做个简单的改版思路分享。
关于检索和探索
在该案例中，采用了上下的布局模式，上方导航下方内容。虽然不是最常见的左右布局，但上下布局也并不少见，而这种布局模式下最容易产生问题。最直观的问题就是内容区域变大了，没有了左右布局中导航的占位，多出了 200-300px 的空间。内容一多理论上代表了可视区域更大，而更大就代表更好吗？当然不是。在这个案例中，放置了很多组件填满画布的内容，但如果认真查看的话，就会发现内容是混乱的，信息是缺乏组织的，我们很难确定视线应该聚焦到哪里。这么做是有问题的，但这么设计复杂表盘页面的同学有不少，这必然是受到了我们日常访问的常规网站设计版式的误导。PC 网页的设计中，有一种设计方向叫门户设计，即早期门户类网站应用的设计逻辑，在网页中填充大量的模块、信息，让用户每次进入可以看到满目琳琅的内容。这么做的原因，一方面是网站包含的内容的确太多了，需要露出的位置，比如腾讯、新浪、搜狐这些大型门户。另一方面，就是希望用大量的信息来诱导用户观看，注意力被劫持越久，那么可以产生的收益也就越大，比如 hao123、360导航等。但在 B 端的管理系统中，提供的内容、信息多，是为了让用户沉迷、强行延长他们使用时长的吗？显然不是。所以这里就要理解一个关键的知识点 —— 信息设计的探索与检索。信息的探索很检索虽然都是动词，但对于用户来说，是指他们接受信息的过程是被动还是主动的。比如你虽然会主动打开小红书、抖音等产品，但除非你要去搜索特定内容，不然算法你会看到什么信息，点开什么详情是不确定的。算法要做的就是推测你喜欢的东西实施“诱导”，让你开始连续往后看“刷”起来，即主动的去被动获取信息。这就是探索的过程，通过获取未知的信息来刺激多巴胺的分泌对大脑形成“奖励”。多巴胺被称为“探索的驱动力”，是用户沉迷信息流的原因。而产品、设计师，就是挖掘用户的这种缺陷去设计对应的信息流，让用户上瘾。但这是 C 端的叙事逻辑，而 B 端产品的用户，使用软件的查看信息的过程是完全主动的。你在钉钉、飞书里发送信息、添加会议、创建任务，都有明确的目标，即使有时候是同事发来消息你要被动回复，你打开这个软件的目标依旧是明确的，那就是去回复别人消息，而不是打开钉钉乱逛有个提示让你去给别人发条消息有惊喜……既然打开产品的目标是主动的，那么产品内部呈现的信息、内容，对用户来说就是用于 —— 检索，即找到的自己想要看到、操作的内容。既然是面向检索，信息的展示就必须要符合用户查看内容的习惯、顺序，所以在框架的布置上，就必然要和探索型页面区分开来，并不是页面放的内容越多、信息越密集、上下滚动的距离越短就越好。所以接下来，我们就要遵循这个原则，完成对界面框架进行重新调整。
界面改版说明
要符合信息检索的设计，就要关注两个知识点，顺序和权重。顺序比较好理解，越重要的内容肯定摆在越前/上面，且浏览的顺序要相对固定、单一。而权重，则是内容强弱的对比，重要的信息要更突出更易于发现。要满足这种要求，那么页面的内容组织就不能像之前一样让组件无序堆叠，而要提前规划空间的应用。我们先将内容区域划分成左右两个区域，左侧是核心区域较大，右侧是辅助区域较小，形成权重的对比。在组件排序过程中，一定要站在用户或业务的角度思考它们的合理性。同时不管在作品集项目还是真实项目中，我们都可以发挥一定的主观能动性，去考虑组件的增删。比如右侧辅助区域中，如果只有一个日程显然是不够的，所以可以增加功能的快速入口、近期通知之类项目中有的信息做高度的平衡。顺着这个思路，把内容进行简单的填充和优化，就可以完成一个新的版本，大家可以进行前后的对比，是不是看起来比原来更有序、舒适。
到这一步还没结束，因为并不是只要把组件按逻辑排列完，那么框架就是完美的，这里还有个非常值得讨论的地方，就是组件之间的 —— 间距。如果在一个表盘页面中，组件都作为独立卡片且数量众多，那么意味着组件之间的间距（即水槽 gutter）也越多。虽然这些水槽可以发挥很重要的内容隔离作用，但它们的数量超出一定界限，就会让界面产生很强的割裂感、碎片感。所以，我们要再根据内容的关联性，尽可能将一些组件合并成一个卡片，这样能更好的提升组件的联系性和整体的视觉效果。下面我们再对比下合并和未合并的版本，看看是不是整体视觉体验得到了提升：
结尾
以满足检索的目标去设计是B端界面设计中的重要认识，除了表盘页外，表格、表单页面也遵循相同的思路。以它为出发点才能避免设计中要无脑紧凑的误区。以上就是本次分享的相关内容，可以再回看我们过去的其它表盘页改版案例：B端设计 | 表盘界面的多种方案设计思路
目前新一期的B端产品设计课程已经在预约中~
