一、前端设计和后端设计（后台系统）的区别

对于产品经理来说，平时的设计工作最主要是以下几种：

（1）APP设计；

（2）WEB设计；

（3）微信端设计；

（4）后台设计；

也可以分为：前端设计和后端设计。

其中前端设计包括：APP设计，WEB设计，微信端设计。其特点是面向群体一般比较繁杂，从功能上一般是展示数据，收集数据——传送到后端（用户操作数据，用户行为轨迹数据等等）。一般业务性和交互设计体验两者属于同等重要的地步——如果你的软件满足了用户的需求，但是丑得像陀翔，用户不买账；但是如果美得不可方物，但是没有切中用户的需求，用户也只能忍痛舍弃。而后端设计更加注重数据流转（数据来源，数据流向，以及在这个过程中对数据的处理）以及业务逻辑。对于用户体验方面倒是注重得比较少。所以可以看到，一般的后台系统视觉风格比较严谨，注重分类清晰。

后台系统的常见分类

后台系统按照开放度分类一般分为：开放式后台系统和非开放式后台系统。

第一种（开放式后台系统）常见的有：微信公众平台等等。

第二种的话，一般是有固定的用户（运维（运营+维护），甲方人员（比如说公司员工等等）），不面向大众。一般来说，用户是可预测的，

可控制的。

一般不会在界面上提供注册功能，后台系统用户的添加一般是拥有相关权限的管理员添加配置。

另外后台系统按照功能侧重点来分类的话，一般分为：

ERP系统，CRM系统等等。

后台系统的常见功能

后台系统千千万，但是核心还是以下几点：

（1）工作流

（2）权限管理

（3）操作流（增删改查传）

（1）工作流

工作流是指“在计算机中，工作流属于计算机支持的协同工作的一部分”。工作流主要解决的主要问题是：为了实现某个业务目标，利用计算机在多个参与者之间按某种预定规则自动传递文档，信息或者任务。

工作流在软件中应用最多的就是“审批”。审批设计首要就是弄清楚流程。流程涉及多少个人/部门？每一个人/部门都有哪些数据权限和操作权限？我之前做过一个政府项目的审批流程。不过出于工作机密原因，我就不拿这个案例做解释了。我们公司的OA系统有一个"办公审批"模块。其审批流程如下：（不同的办公审批流程是不一样的）

界面如下：

1、新建审批

2、我的申请

3、消息通知

我们在平时的工作中遇到最多的工作流的设计，就是审核设计。审核设计最重要的是弄清楚两点：

（1）流程是怎么样的？

（2）流程的每一个节点的数据权限和操作权限。

（2）权限管理

权限管理，一般指根据系统设置的安全规则或者安全策略。用户可以访问而且只能访问自己被授权的资源，不多不少。权限管理几乎 出现在任何系统里面，只要有用户和密码的系统。

权限管理常见的场景是角色访问控制。比如说，某公司新增了一个产品部员工，就需要赋予该员工权限。比如说，该员工有查看系统某模块数据的权限，但是没有操作的权限，操作的权限是属于部门经理的。

一般在工作中，权限管理分为两大类：

1、功能级权限管理（增删改查）

2、数据级权限管理（某数据，某类人能看到（比如说部门经理），某类人不能看到（比如说下属员工））

3、菜单权限管理

后台系统一般情况下有很多菜单，其中有很多模块。其中有些模块对于某个角色是可见的（比如说财务人员），有些模块对于某个角色不是可见的（比如说行政人员）。所以这部分也属于权限管理的一部分。

总结：

权限管理往复杂的讲，有很多内容，不过我们常见的权限管理如下图所示：

（3）操作流

其中操作流又分为系统内部操作和前后端互动。

系统内部操作的话，一般是系统基础数据配置和XX管理等等。XX管理一般功能比较丰富（新增内容，删除内容，修改内容，查询内容，导出内容等等）而系统基础数据配置相对来说比较简单，一般只有基础数据的选择配置，并不涉及到数据的增删查操作。

前后端互动的话，一般包括比如说，我们最常看到的微信公众号的文章，录入入口如下所示：

对于前后端互动这一块，在设计的时候一定要注意前后台匹配。最好是在画完原型之后，前后端原型一样一样的检查一下，比如说前端的正文是否在后台有相应的录入。同样，前端的输入内容，是不是显示在后台了。如果没有显示的话，原因是什么。

系统基础数据配置一般是配置系统的一些基础数据，比如说：积分，上传设置等等。

后台系统设计的注意点

（1）后台系统导航选择

后台系统的导航常见的有三种：

1、左侧导航；

2、顶部导航；

3、左侧导航+顶部导航。

截图的话，如下图所示：

1、左侧导航

2、顶部导航

3、左侧导航+顶部导航

一般选择导航时，会根据可扩展性和功能的多少来选择导航。一般会选择左侧导航（可扩展性比较强）。另外功能比较多时，也会选择左侧导航+顶部导航。

如果后台系统的第一级栏目（也就是XXX管理）比较多时，建议使用左侧导航（如第一张图所示）——一方面页面延伸性比较好，另外一方面可扩展性也比较强。

如果后台系统的第一级栏目比较少（之后可扩展性也不是特别强），但是第二级栏目比较多（可扩展性比较多），一般会选择左侧导航+顶部导航的形式（第一级栏目放置于顶部，第二级，第三级放置于左侧）。

（2）后台系统命名注意

在设计后台系统时，功能模块的命名要清晰易懂，不能有两义性。如果是操作按钮的话，就要使用动词，比如说：编辑，删除，查看，搜索，发起审核等等。其实命名这一块和前端设计是一样的，是很细节的地方，但是如果不注意，对于用户体验也有很大的影响。（虽然说后台相对前台来说，对于用户体验这一块要求没有那么高，但是因为后台的操作会影响前端系统甚至是第三方系统，所以对于操作方面（命名，操作权限，操作流程，前置操作，后置操作）还是要慎之又慎。）

如果对于某些用词不是很清楚时，可以使用百度百科，毕竟百度还是权威。

总结

后台系统的设计和前端系统设计有相同，也有不同。相同之处在于，在设计时，首先要搞清楚用户是谁，了解清楚业务和需求。不过相对于前端，后端的改动次数一般不会很多，同时可能会支撑多个系统。所以后台系统在设计时，很注重逻辑。另外一个好的，复杂的后台系统对于个人逻辑思维的锻炼也是很有帮助的。

注：我是兰兰，一名正在快速成长的产品菜鸟，欢迎加我微信和我交流。微信号：qjl0726

写于2017年1月23日晚