飞书办理后盾设计优化思绪浅析

林宇轩

得多企业办公都会选择飞书，这离不开它优秀的产品功用和设计。本文作者对飞书的办理后盾设计提出了一些优化倡议，一同来看看吧。

间隔上一次发内容好像曾经一年多了，次要仍是平时不怎么写字。
这一年来我本人始终在走的是 b 端产品的交互设计标的目的，比来与组内的小火伴一同在学习飞书办理后盾的一些设计点，因而就想着趁这个时机，对飞书办理后盾中的一些页面做一些简略的设计剖析，以及参加本人的一些新设法进行设计优化，会有一些不太成熟之处，仍是请大家多多指教～
对于这次的飞书办理后盾设计优化，我会从一致交互构造与款式、以产品指标/用户指标为起点，缩短用户使用门路，晋升效力、以及调剂一些组件的地位和款式以便被用户更好的了解这三个角度登程，对一些页面进行优化剖析。
一、首页


【首页】分为四个卡片：企业信息简介、功用使用状况、权利数据和运用办理。
当用户在查看权利数据卡片时，用户的指标是但愿可以疾速理解以后云文档存储空间、短信/电话加急和邮箱存储空间这些数据的使用状况。
而咱们的产品指标是如何疏导用户发生降级版本的志愿，以及当用户有降级版本的志愿时可以疾速帮忙用户解答纳闷（怎么降级？降级之后会怎样？在哪里能够获取帮忙？（最佳是人工帮忙））
因而在此我优化了云文档存储空间、短信/电话加急和邮箱存储空间已用数据和总量数据的展现形式，使其更能直观看出已使用数据/总可用数据之间的比较瓜葛。而且调剂了提醒案牍，但愿能够更好的疏导用户去降级版本。


而且我调剂了侧边导航栏和顶部导航栏的款式，设计了全局搜寻的功用，情境是当办理后盾的内容愈来愈多，模块层级愈来愈深时，新增一个全局搜寻功用能够帮忙用户更快的找到本人需求的功用，节俭用户去查找的时间。
搜寻的规模限度在以后登录用户权限内的功用模块，搜寻后果显示模块的一级分类称号，点击可跳转该模块的页面。


二、成员与部门




【组织架构-成员与部门】分为成员与部门两个Tab。
在成员Tab中，用户经过部门维度去办理成员信息。
在左边的部门导航模块，我调剂了展开/收起按钮的地位，使其看下来不会显得很拥堵；而后针对拖动能够调剂部门程序的交互添加了提醒阐明，让用户能够更好地舆解操作办法。
原来这个模块里搜寻框在搜寻时可以搜寻到成员，而且搜寻成员的后果也是在导航模块展现，点击会关上一个抽屉弹窗显示成员详情，而后这个抽屉弹窗里又有一个查看详情，再次点击后才会进入成员详情页，就会感觉很奇怪。此处放搜寻框的话应该是限度只能搜寻部门。
而在右边表格内容模块，由于是成员残缺内容的展现，所以参加搜寻框的话搜寻成员，搜寻后果在下方表格中显示就很合乎页面模块的划分，点击能够间接进入残缺的成员详情页。
所以在右边的表格内容模块我也放了一个搜寻框， 搜寻前提是姓名、邮箱、手机号、用户ID，搜寻规模是一切部门（包孕子部门）的成员。
而且表格中的操作项只要在鼠标悬浮这一行时才会泛起，其余模块（角色办理）中表格中的操作列则是固定显示在最初一列，所以我对这里的表格进行了优化，新增了操作列，并对标题添加了底色强化其标题属性，与其余模块中表格的标题款式放弃统一。
我还尝试将表格中变卦部门的操作按钮放到部门与职务列中去显示，逻辑是当用户在表格中看到一集体的部门与职务时，下一步操作就多是去变卦部门。或者当用户在关上这个页面以前就想去变卦一集体的部门时，编纂按钮放在相干的部门与职务列也能更好的帮忙用户疾速找到此按钮。
以及我将批量操作按钮和分页器放到表格底部悬浮展现，这样用户在选择完数据后鼠标能够最短门路地挪动到批量操作按钮上；而且在页面地位上使得批量操作按钮区域独立出来，便利用户查找。
最初我从新调剂了不同形态的色彩语义，使其在后盾一切模块的表格中放弃统一。


此外在体验全部飞书后盾的体验中，我遇到了一种需求在多个模块页面之间往返切换的情境，所认为了优化切换模块页面的效力，我在页面面包屑的右边设计了固定书签的功用。


用户能够将以后模块的页面作为书签固定在页面面包屑右边，而后点击书签便可在多个模块页面中疾速跳转。这样用户就能按照本人的日常使用需求来固定本人罕用的几个模块页面，进步任务效力。
至多只会显示最新固定的 6 个模块书签，第 7 个模块书签将会掩盖第 1 个，以此类推。目的是为了避免用户固定太多书签致使这个功用变得臃肿。
三、角色办理


【组织架构-角色办理】使用的是一样的左边导航+右边表格办理的构造，所以优化思绪与【成员与部门】中放弃统一。
当初次进入角色办理模块时，会有解释甚么是角色，以及查看帮忙核心的入口。但在选择角色之后就隐没了，用户想要再次查看解释就需求点击其余模块之后再从新进入角色办理模块。因而我将查看帮忙核心的入口放到面包屑导航的右边显示，便利用户查找帮忙。
新增角色的按钮一直显示在最初一个角色上面；当左边角色导航栏中角色过量时，新增角色的按钮固定在页面底部显示，这样能够使鼠标挪动最短门路到按钮上。
四、单位办理


这个页面一开始进入的是导航页，会为用户引见单位是甚么，单位能做甚么，以及疏导用户去付费降级版本。
在这里我将新建单位换成为了分割客服降级套餐的按钮，由于我感觉与其让未降级用户在新建单位的流程中被打断，不如间接告知他只要降级才能够使用。
同时由于这个模块是付费使用，所以也需求打上增值版本的标签。
五、用户组办理


这个页面的构造仍然是左边导航 + 右边表格办理，与以前模块的款式放弃统一就好。
六、小结
这次剖析飞书办理后盾的内容对比简略，在后期肯定好页面构造和设计谋略后，之后的得多页面均可以复用构造，剩下的就是放弃一些细节的一致。
新增的一些小功用（全局搜寻、模块书签）也仅提供一个初步的设计思绪，欢送大家一同探讨～
本文由 @默月 原创公布于人人都是产品经理，未经作者许可，阻止转载。
题图来自Unsplash，基于CC0协定。
该文观念仅代表作者自己，人人都是产品经理平台仅提供信息存储空间办事。