PeopleSpheres是一款集成所有HR模块于一体的软件平台，帮助HR从同一平台管理整个公司的人力资源，同时简化员工和管理者之间的沟通和工作流程。

从2018年初在这家创业公司实习，重新设计网站和产品功能，到后来作为自由设计师一直协助产品的设计开发。一年多以来，公司经历了战略调整，logo更换，产品升级等等，终于这款兼具Web App和手机App的产品已经逐渐成熟，是时候做一个关于HR平台的软件UX设计案例分析。

这款产品侧重于功能型，所以文章主要介绍设计和开发过程中的方法。产品界面只使用基础颜色，便于客户根据自己公司的品牌做个性化调整，所以不会在视觉方面喧宾夺主。

本文会着重介绍以下六个方面的一些成果和经验总结：用户需求研究、功能设计、基于角色的权限设计、体验优化、用户学习系统和设计系统。

文中选用的内容均为产品可对外公开的功能，部分更深入的功能界面和设计流程并不在文中列出。文章中所有图片版权归PeopleSpheres公司所有，未经允许，严禁商业用途使用。

「00 - 从简单的介绍开始」

如上文所述，PeopleSpheres是一款集成所有HR模块于一体的软件平台，管理者可以根据自己公司的需求添加不同的HR模块。通过一个中央数据库来实现通知、自助服务、报告系统、管理系统等的自动化和中心化。

平台提供Web App和功能精简化的手机App。

产品设计过程中，公司的CEO，开发部门，营销部门均有参与。经历了市场调研、需求分析、用户采访、功能分类等的前期准备，中期的用户流程设计，组件系统设计等，现在的产品每三、四个月为一周期，不断迭代更新，优化用户体验。

「01 - 用户需求研究 」

我们的产品的主要市场在法国，也在欧洲其他地区和美国占有小的份额。经过市场部门大量资料的收集和数据分析，我们得到令人惊讶的结果：

由于资源的分散和功能的不集中，虽然市场中的HR软件已经远远供大于求，依然不能在根本上解决公司的管理效率问题。大多数公司都在使用很多不同的软件，但数据分散，工作效率低下，HR的工作量也因此超负荷。这时候，一款连接可以连接所有HR工具的中心化平台尤为重要。

基于现有客户，为了更好地了解他们的动力和困难，我有幸参加了2018年6月的用户研讨会。一天的时间内，用户们被分成8人一小组来探讨他们目前的问题，并在引导下提出解决方案，进行总结。

我们从研讨会中总结了很多用户的痛点和期望，如下图所示：

「 02 - 功能设计 」

>> 2.1 将用户需求转化为功能

了解用户需求后，最重要的一步就是将需求转化为实实在在的功能。

例:

→ HR总监想要”让员工更积极，沟通更顺利“，

    转换后："聊天系统(Chat & Chatbot)", "新闻管理(News Management)", "想法箱(Idea Box)"等等；

→ HR助手想要”减少重复的信息录入“，

    转换后：”自动工作流程(Workflow)“, "表单批量管理(Form Mass Edit)", "任务分配(Assignment)";

→ 管理者想要”简化团队管理“，

    转换后："团队管理系统(Team Management)", "自动生成报告(Reporting)";

→ 员工想要”简化行政处理流程“，

    转换后："自助服务(Self-service)", "自助打卡(Time tracking)", "聊天系统(Chat)".

当然，不同的功能拥有不同的管理和信息权限。HR的管理权限显然高于管理者，管理者高于员工。根据公司具体的情况，个性化的权限系统也会根据这些功能而被构建。

>> 2.2 功能框架

在信息结构方面，我们使用了分页&窗口部件(Pagination & Grid Widget)的系统，所有重要的功能通过窗口部件显示在分页上。

用户也可以根据自己的需要添加或删除部件，达到完全个性化的用户界面。这种系统也保证了不同角色界面之间设计和代码的一致性。

在界面方面，分页&窗口部件系统也满足了一下的几点优势：

→ 模拟手机和电脑桌面，减少了学习成本

→ 用户可以根据自己的需求调整在每个页面的Widget

→  Responsive Widget系统，有利于保持手机App和Web App的一致性

「 03 - 基于角色的权限设计 」

>> 3.1 角色

大范围来说，一个基于角色的权限系统 (Role-Based Access Control, RBAD) 有以下几种管理角色：

→ 超级管理员(Super Admin)：掌管企业软件全部权限；

→ 普通管理员(Admin)：管理范围为特定组织部门或子公司；

→ 业务角色(Business Role)：有其特定的业务权限，是软件中必须自带的基本业务角色，在不同企业之间通常没有太大的差别；

→ 组织管理(Organizational Role)：权限范围仅限于自身所处的组织，例如在组织A的不能访问组织B的资料。

>> 3.2 权限

在为角色设置权限时一般考虑以下因素：

 → 准入权限：进入权限、时间限制、设备限制、地理位置限制等；

→ 使用权限：增加、删除、修改、查看、其他附加功能；

→ 数据权限：包扩数据的创建人和数据流通过程中所涉及的各类角色的权限。

在这里就暂不列出项目的详细角色权限设计了，但分享一个角色权限设计的表格，希望有所帮助。

「 04 - 体验优化 」

我们从用户目的出发，改进功能流程图来优化体验。从用户目的出发可以帮助我们了解用户在实际应用过程中的困难，达成目的的过程是否合理、是否过于复杂等等。我们可以列出很多用户目的的实例：

- Manager想要对员工进行年度绩效测评

- Manager想要访问某员工的完整信息

- HR想要购买一个用于管理会议的HR模块在系统中

- HR想要发表一条仅部分用户可见的新闻

- 员工想要向他的上级提交一个假期请求

- 员工想要询问HR为何没有收到他的培训证书

在检查功能流程是否合理时，个人总结出了以下的准则：

利用这个准则，下面一个体验优化的实例：

→ 用户目的：HR想要购买一个用于管理会议的HR模块(Module)在系统中

原功能流程图如下：

原来的版本只有一个功能入口，易发现性不强。并且在确认信息(Confirm information)之后，如果自己无法独立完成初始化过程，不能及时求助客服。

为了解决这些问题，我们加入了从搜索栏直接进入添加Module的选项，并且在完成信息确认后可以直接联系客户，这就基本涵盖了用户流程中的所有可能性。

下面的15s操作动效就显示了修改后的交互过程。

「 05 - 用户学习系统 」

Onboarding Guide就是帮助新用户学习软件的一个过程。根据用户目的和角色的不同，学习过程也各不相同。我们分别设计了手机端和Web端的学习系统。

以员工身份Web端Onboarding Guide为例：

完整版本可以查看以下链接

→ https://yifan-ding.com/psps-onboarding.pdf

总结起来，一个合格的onboarding process的dos and don'ts如下：

「 06 - 设计系统 」

对于B端软件的设计系统Design System，从原子结构的图标和颜色，到分子结构的输入框的类型、状态、反馈等，再到Pattern结构的列表、窗口、模态等等。

我个人认为做产品组件设计最重要的两点就是：

 → 要让如何重复使用设计组件的规则一目了解；

→  要列出动态元素（按钮、表单、图标、鼠标、链接等）的各类状态 (active/inactive/focus/click...).

下面列出了产品的组件设计系统的一部分：

首次做职业B端软件设计，有很多地方有待提高，也总结了以下一些经验。

- 前期的准备一定要充足，保证对市场、用户和使用背景有很深的体会；

- 测试同类产品，从中搜集灵感，帮助对功能的理解；

- 使用二到三个月的Design Sprint, 每阶段都要进行功能流程的检查，体验的优化和最终的用户测试；

- 对于产品的权限和办公自动化设计，一定要做好相应的功能流程图，将相应的人员和功能列清楚；

- 做B端软件，工程量巨大，一定要做好设计软件(Sketch)的组件同步，设置自己的Symbol库，做好Auto layout工作可以节省大量时间。

Powered by Froala Editor