这里是IT修真院产品分享课,今天要分享的是

【聊聊后台5种常见的几种布局】

一、默认页面设为统计

调研的几个平台首页默认显示的都是welcome,估计大多数后台都没考虑到首页放什么,也不知道放什么(就跟砸门小分队不知道中午吃什么一样)。在设计中如果没有使用者有需求度高的页面时,这时候放统计页面绝对是个good idea(前提是有的话,连统计都没有的后台是有多简陋),不然浪费了这么好的资源。

统计页面要统计什么数据呢?我认为从三个方面考虑比较得当:

1.当前角色可以看到的系统级别的数据。(考虑到不同用户的身份和访问数据权限不同)

2.用户自身要进行操作的数据。

3.通知类内容。

第一个方面我们在设计系统的时候,要考虑到哪些数据是需要统计的,比如电商系统中的下单率,客单价,订单总数,订单总金额、单品销售排行榜等,再比如金信金融的销售统计(金融产品的购买次数和销售总额),然后再将这些统计数据通过权限的划分分配给不同的角色。

第二个方面是用户自身的数据,主要有工作流的状态即当前用户的工作流中已经流转到该用户的一些操作,诸如合同审批,发货审批等等一系列的流程。

第三个方面通知类的内容主要有以下几类:

某些关联的工作到一段时间内有了新的状态需要提醒:比如物流发货,或者财务审核通过;资格审核的提醒。

系统内部的一些警醒:比如仓库容量已到临界值,用户账户状态的异常。

当前时间截点的警示:比如租户、车位、合同等等即将到期。

二、不同功能之间多用标签切换,慎用跳转和新增页面。

标签切换可以完成页面之间的快速切换操作已深入人心,还兼备着随便切换查看之前的数据做对比分析以及多项工作需要对照同时来做的功能,这样的操作可以快速的定位到当前的操作模块,并且方便的切换。

三、记录类列表的三大布局模块:筛选、列表和新增。

记录类后台产品的布局一般都比较固定,学渣乐园、萝卜多、第九肌肉和修真院后台应该属于此类范畴。记录类布局分为三大块:筛选(或者叫搜索)部分。列表部分,和新增。如果有一些特殊的业务需要,会可能在这个上面新增一些其他的小的需求,但是大体上这样的布局就可以满足一般的业务。

a.筛选的模式

一般来说,筛选部分主要是通过筛选时间或字段内容或其组合进行筛选。记录的字段就包括这项业务的特有字段,比如用户管理页面有“手机号码”“真实姓名”“用户状态”等。

在进行筛选部分的设计时,筛选的字段可以分为选择部分和填写部分。选择部分指的是某些字段的值在填写的时候就已经限定了,只需要选择点击筛选即可。

b.新增部分要考虑交互方式

新增部分一般来说就是一个按钮,点击后有两种方式可以进行记录的新增:一是新页面,二是弹窗形式。

如果说新页面给人正式的印象像个绅士,弹窗则让人感觉随意像个唐突的陌生人。所以新页面适合填写字段较多及内容比较重要的时候使用。弹窗形式一般在字段较少,以及内容相对来说不需要十分慎重的填写时使用

C、重中之重的列表部分设计法则

列表部分是最重要的部分,也是页面的核心部分。页面内容的增删改查,以及核心工作都在这里进行。当然,其列表中的每一条数据都是有一个个的字段值堆叠而成的,字段上大致我分为以下几个部分:

ID:每一条数据所具备的唯一标识,一般都会加上。

时间:数据的产生时间,操作类型的业务字段一般会有,比如库存管理,进货单管理等。配置类的一般可以没有,比如角色配置等。

标识名称:确定该条记录的标识名称字段,方便在其他部分用到时进行识别。

状态:增删改查很重要的一个部分就是状态的变更及查看。比如“缺货中、货源充足”“正常、已冻结”“上线、下线”等业务相关的内容。

其他重要的标识字段:即新增内容的时候填写的字段需要考虑显示在列表的。

其他字段:不是填写的,但是也必须生成的,比如某个用户填写后生成记录会有“填写人”字段。

工作流:涉及到工作流时,工作流的状态显示。

操作:操作相当于整个页面的核心内容和主要功能。一般有查看、修改、以及对应业务的操作内容。

四、非标准工作流的解决

工作流能简单分成标准工作流和非标准工作流

标准工作流相对来说比较简单,即某一项工作在进行的过程中,所有的流程都是规划好的,角色的操作都是固定的。

非标准工作流则有些复杂,它会涉及到与或非这样的逻辑判断。要仔细、不要遗忘流程或者角色,考虑周全。

套路是先配置流程,再配置角色,配置流程的时候,如果操作者有一定的技术能力,可能让其用SQL语句进行自定义配置,如果没有的话可以用流程图的形式表现出来再往里面填加角色。如果要再小白一些,可以将每一个非标准化流程拆成一个个的标准化流程,单独去配置,虽说麻烦一些,但是对于用户来说,整体的操作逻辑则会简单很多。

五、权利的游戏

1、用户角色配置和角色权限配置

权限配置一般分为两个部分,用户角色配置和角色权限配置。有些系统可能比较简单,用户身份不多,但是一旦用户类型变多,处理起来就相当的麻烦。所以在一开始设计系统的时候,要将角色和权限分清楚。

我们可以根据部门把角色提前创建好,比如创建角色会员运营、产品经理、售前客服等,为这些角色提前分配好权限,那么新开通的账号只需要与这些角色做关联就可以关联到对应的权限了。

这里我们需要特别注意三个地方

第一个是权限怎么分?

方案:权限可以分成三种(1)菜单权限(2)页面权限(3)操作权限

第二个是,相同角色的人员,如果有个别权限不同,应该怎样分配?

方案:账号先选择角色,然后针对账号再选择对应的特殊权限

第三个是,公司的一些敏感信息应该怎么控制权限?

方案:把敏感字段当成一个权限来进行分配,对部分人隐藏该私密字段的内容

账号开通流程

从流程上可以看出,我们需要先设置角色,然后给新账号关联对应的角色,如果账号有特殊权限或者相关字段的权限,需要单独设置特殊权限和相关字段,这是非常完备的权限设置流程

【更多内容,欢迎加入交流群565763832与大家一起讨论交流】

【这里是技能树·IT修真院:IT修真院官网,初学者转行到互联网的聚集地】

转载于:https://juejin.im/post/5cb734966fb9a068b0375fe2

聊聊后台5种常见的几种布局相关推荐

  1. 计算机编程种常见的几种编码详解

    计算机编程种常见的几种编码详解 其实计算机编程离不开编码 但是大多数都不能真正全面了解各种编码 今天就来好好和几位编码熟悉熟悉 一.字符.字符集和字符编码方式 字符:字符是抽象的最小文本单位.它没有固 ...

  2. 移动端图形化报表界面设计_移动端几种常见的界面设计布局

    在日常产品交互设计中,有时候总会对界面的排版和布局的选择上很纠结,界面的排版布局直接影响了用户体验,选择一个合适的排版是值得持续打磨的事情. 这里我画了几种移动端常见的页面布局和他们的各自特点: 1, ...

  3. CSS初始化的两种常见方法

    CSS初始化的两种常见方法 两种CSS初始化的常见方案,都是通用类的 CSS reset Eric Meyer写的 CSS reset,源码不是很长: /* http://meyerweb.com/e ...

  4. 常见的CSS页面布局方式

    详情:CSS页面结构是我们日常生活中最常使用到的,当然目前可能大家用的最多的是elementUI实现布局,简单方柏霓,下面介绍几种常见的原生页面布局的方式 公共的样式部分 <style>* ...

  5. 寻找网站后台的几种常见的方法

    (注:本教程仅供学习交流使用,不可用于一切未授权的网络攻击和违法行为!) 当我们进入一个网站时,如何对其后台进行查找.从而进一步渗透?今天给大家介绍几种常见的方法: 查看网站图片中的属性 我们可以随机 ...

  6. 处理接口幂等性的两种常见方案

    在上周发布的 TienChin 项目视频中,我和大家一共梳理了六种幂等性解决方案,接口幂等性处理算是一个非常常见的需求了,我们在很多项目中其实都会遇到.今天我们来看看两种比较简单的实现思路. 1. 接 ...

  7. 为何大量网站不能抓取?爬虫突破封禁的6种常见方法

    为何大量网站不能抓取?爬虫突破封禁的6种常见方法 在互联网上进行自动数据采集(抓取)这件事和互联网存在的时间差不多一样长.今天大众好像更倾向于用"网络数据采集",有时会把网络数据采 ...

  8. 常见的几种扫码支付方式

    目前,以支付宝和微信为代表的扫码支付正在各个线下消费场景中攻城略地,也给我们的生活带来了不小的方便.今天就来聊聊生活中常见的几种扫码支付方式. 1. 扫码转账 支付流程:用户点击支付宝扫一扫,扫码商家 ...

  9. 聊聊呗|红包系统支持以下三种模式

    本文标题:聊聊呗|红包系统支持以下三种模式 常见的消费者扫码送红包,导购扫码送红包.代理商扫码送红包,都是通过扫码送红包营销活动,来实现企业的各种战略目标. 目标一:扫码送红包,激励导购卖货 导购是门 ...

最新文章

  1. WEP保护帧移除工具airdecloak-ng
  2. mysql连接查询作业答案_MySQL连表查询练习题
  3. Silverlight杂记-控件相关
  4. 修改tomcat的临时文件夹_tomcat 临时文件夹被移除的问题
  5. 合理的布局,绚丽的样式,谈谈Winform程序的界面设计
  6. jsf表单验证_动态表单,JSF世界期待已久
  7. matlab_ga(),matlab遗传算法ga函数
  8. Oracle能用什么软件访问,使用工具访问ORACLE数据库(一)
  9. Linux操作系统 和 Windows操作系统 的区别
  10. OpenCV和java做人脸识别
  11. VmPlayer 无法启动解决方法一例
  12. 如何用python制作五子棋
  13. 正弦波和方波驱动的优缺点
  14. 最伟大IT人物10强出炉 乔布斯第一盖茨第三
  15. matlab系统稳态误差终值,Matlab求解给定系统稳态误差
  16. android之GMS认证
  17. (封装调用) layui table中checkbox 付款框 跨页保存选中赋值状态 跨页记忆选择
  18. linux内核是压测,从应用到内核查接口超时(中) -枕边书
  19. 洛谷-4735 最大异或和 /【模板】可持久化Trie
  20. 华为nova2s用哪个型号服务器,华为nova 2s

热门文章

  1. JAVA 基础——学习
  2. 谈谈我的一些学习感悟
  3. 盘点人气云计算大数据开源技术变迁
  4. 信息中心网络ICN在卫星通信中的应用调研
  5. 2022建筑焊工(建筑特殊工种)考试题库及在线模拟考试
  6. 2D游戏中遮挡实现--记录
  7. pycharm 选中多行,点back space键无法删除
  8. Couldn't find preset es2015 relative to directory
  9. 基于PHP语言Laravel+Layui后台代码生成工具
  10. 删除指定的iptables规则