产品经理画流程图的两个重要方法!

我们产品在梳理较为复杂的业务流程的时候可能涉及到多个组织部门,业务场景、系统交互等等,梳理起来十分困难。

光是如何布局都比较头疼,最后终于把业务的千丝万缕梳理清晰了,才发现业务流程图十分庞大复杂。

在和领导汇报同时交流的时候,ppt和word里面都塞不下;最后用着最小的字体,将整体流程讲解完成发现大家也是很难理解。

这里说明了我们日常流程图存在三个问题:

  1. 梳理困难
  2. 展示不清晰
  3. 讲述困难

针对上述的问题,建议产品能够明确对应的流程图的作用与区分。

01

常见的流程图:

  1. 业务交互流程图
  2. 系统交互流程图
  3. 页面交互流程图
  4. 时序图
  5. 数据交互图等

其中:

面向业务:业务交互流程图

用于标识业务流转规则,需要有事项的明确开始和结束节点,需要明确的职责划分与对应的输入输出标准。整体保证流程或者事项能够通过业务流转与解决。

面向产品:系统交互流程图

当某个功能涉及多个子系统的时候,需要从业务规则中抽象出需要的功能点,并将这些功能点依据产品定位进行区分,确定系统职责。这个时候可以初步设计可能需要的接口或者大致的交互机制与主键(没有必要定死几个接口和所有字段,这个接口更像是业务属性的接口)。

面向交互:页面交互流程图

用于表述用户操作的细节,这个时候需要将用户场景理解清晰,用户操作需要用到哪些页面,这些页面之间的跳转返回逻辑是什么,有哪些校验条件。这里更加偏重用户体验,可以交给我们的交互同学协助完成。

面向开发:时序图

梳理时序图可以帮助开发梳理逻辑,也可以自己验证设计的逻辑是否闭环,很多异常场景可以在梳理时序图的时候自我反省出来。

面向开发:数据交互图

当项目涉及多个产品的时候,需要单独整理数据词典、接口清单、与数据交互图。

数据交互图在设计的时候有助于全局观审视系统设计。可以避免后端系统系统需要的字段,前端系统没有下传的问题。

这个举一个例子:

数据流为:A–B–C 如果C系统需要某个字段是A系统产生的,但是B系统不需要,可能B系统在梳理的时候就会忽略,导致C系统重要字段缺失。如果梳理清晰数据交互图就可以避免类似的问题。

有了以上的对于流程的图划分,我们就可以“看人下菜”,即提高的沟通的效率,也让对方容易理解。而不是拿一张流程图和所有人讲,结果大家都不清晰。并且上述流程图的输出排序也建议按照上述排序进行输出。

02

如果某个流程图过于复杂怎么办?

这个多见于业务流程图,因为业务流程可粗可细,如果业务纠结于一些细节,光是一个小的场景,就可能会有多个复杂的逻辑,并且需要展示流程全貌,这个时候你的业务流程图就是巨型的,及时你仅仅绘制业务层面的内容,其体量也很大,这个时候如何处理?

建议大家可以从几个层级来细分:

  • 部门层级:在了解业务的组织架构于职责之后,通过部门的维护进行业务场景梳理,比如销售部门,财务部门,行政部门。以这个维度进行业务场景的划分,重点在于了解业务主线于全貌,和整体流程的职责划分。
  • 岗位层级:在上述基础上将部门所负责的模块拆分到岗位。这个时候可以明确流程处理逻辑,已经可以通过岗位流程图了解到事项处理的条件与要求。并且明确责任到岗位,明确每一个岗位输入和输出的标准产物。
  • 操作层级:针对某个岗位的具体操作进行梳理,在明确输入与输出条件的基础上,明确每一步执行的动作。虽然不能达到操作手册的细度,但是要求可以将对应的画面在脑海中勾勒出来的程度。
  • 场景层级:如果这块业务十分复杂,可以将其分为几个场景来明确步骤,比如依据地点进行划分,依据处理事项的具体类型进行划分。

01 什么是页面流程

页面流程图是展示页面之前的流转关系——用户通过什么操作进了什么页面及后续的操作及页面,页面流程图是在业务流程图之后原型设计之前的工作,是提高原型效率的中间件。

做原型图,线框图之前先列一个大纲,这个大纲就是页面流程,可以帮助你更清晰的梳理需求,考虑每个页面的重点和每项功能的前置与后置,在做原型之前需要先思考页面流程,定好大纲,才能不偏离需求。

而且在做好页面流程图之后,也可以更好的帮助产品经理跟UI、测试、开发沟通,为之后做原型图减少了很多不必要的修改。

02 为什么要有页面流程

1. 原型设计的基本依据

新入门的产品经理,接到一个需求之后往往就会先画原型,而当你快速画好原型投入开发之后就会发现需要一直改改改,不断的改,逻辑漏洞很多,为什么会这样呢?如果你有这样的困惑,那就需要好好反思一下是不是你的页面流程是缺失的。

因为我们做产品是个逐层分解的过程,首先有需求,从需求转化功能,确认功能梳理逻辑,根据业务逻辑拆解页面流程,最后出原型效果图,这时候的原型才会是围绕需求展开的,所以页面流程就是我们原型设计的基本依据。

2. 通过页面流程模仿用户操作能发现体验问题

页面流程是原型设计的基础,所以代表的是用户的立场,是站在用户视角考虑用户操作从而发现其中流程的合理与否。

以需求为出发点首先需要明确用户需求的场景,用户是怎么用的,在用的过程中会有什么问题,把用户需求场景想清楚后再思考怎么解决这个需求,通过模拟用户的操作来发现用户体验的问题,这也是我们做原型设计的时候需要考虑的,所以页面流程梳理好确认用户的需求场景和操作逻辑才能更好的提高用户交互体验。

03 页面流程该怎么画

1. 页面流程中包含什么

四方形:表明页面主业务,通常是页面的主功能部分

菱形:异常流程或判断逻辑说明,一般在页面中用tips或弹层来展示

流向:流向分为主干流向和辅助流向,代表业务的逻辑走向

重点元素:每个流程中重点要表达和体现的内容

2. 画页面流程图的工具

Axure:对于习惯用Axure的同学们来说,用这个工具画页面流程图足够了,画完页面流程图还可以继续画原型,用同一个软件切换会更方便

Visio:流程图常用工具,不管什么流程都可以轻松应对

总之页面流程图是帮助产品经理梳理业务逻辑的,只要能理清思路,手绘或者用PPT简单连线都可以达到目的

3. 明确业务流程 ,清晰页面核心功能主线

之前说到页面流程是在业务流程之后的,所以开始页面流程之前,要先明确业务流程,那么业务流程是什么呢?

如果说页面流程是站在用户视角的,那么业务流程就是产品视角。以产品的角度回归业务流程的梳理,业务流程画的好,页面流程就能顺理成章的清晰找到页面流程中的四方形和菱形。

那有了业务流程为什么还要画页面流程呢?因为页面流程在业务流程的逻辑上加入了对于页面的核心元素说明和下游触发说明,也就是考虑了用户的实际使用场景的流程以及异常流程的处理方式,更加清晰展示用户操作的每一条逻辑线。

4. 明确页面中的核心元素和逻辑关系

页面流程往往不仅仅只有新页面,还会有涉及一些老页面需要优化,如果一个新页面的功能需要在老页面加一个入口的话,那么这个入口的核心元素是什么,需要重点表现的是什么,入口到下一个页面之间的逻辑关系是什么,是怎么跳转的,需要增加哪些异常流程的处理逻辑,通过页面流程来明确页面的核心元素,对原型设计是一个非常大的提升。

只要明确了页面的核心元素和下游逻辑关系,就基本确定了原型的大概,这个时候不用过于关注按钮的形态和颜色,只需要确认是否符合业务需求的功能逻辑即可。

案例说明

以个人书架的加入藏书业务为例,看一下页面流程图的具体绘制过程

首先来说明下加入藏书的需求,用户通过App扫一扫家里图书背面的ISBN码识别图书加入个人书架,形成个人藏书架。

业务流程是这样的:

在业务流程中说明了个人藏书架的功能逻辑,而接下来就要考虑每个功能需要几个页面,每个页面需要体现什么样的元素,这些重要元素会不会触发一些异常流程,该怎么触发下游页面。

我们继续来看个人书架的页面流程图:

在这个页面流程图中,包含了以下几类:

  • 页面说明,如页面的名称是什么,有哪些核心元素;
  • 通过页面点击动作后会分为有几条逻辑线,每个逻辑的过程以及跳转。比如4.图书信息的页面,核心元素分为展示扫描到的图书信息和结果不符合两部分,如果结果符合就点击加入藏书完成,不符合就点击不符合进入下一页面逻辑,这就是不同的元素会触发不同逻辑;

只要确认好每个页面功能中想要重点表现的是什么,那在原型设计中就会更加表现得更见直白。

有一些页面的最终路径可能都是同一个页面,这也是很正常的,通过页面流程能够很清晰的看到站在用户的角度每一个点击操作的进展和之后的逻辑,这也就是产品交互的雏形

5. 优化和调整页面顺序

当梳理清楚业务和功能逻辑后就可以整理页面流程了,页面流程要遵循尽可能穷举所有相关涉及的页面,然后做减法的方法。

将相同功能或者元素的页面合并,可以通过画原型草图的方法优化和调整页面关键元素,在这个过程中或许会发现某一些页面的元素展示并不符合预期逻辑,这时候就可以考虑换掉,也可以跟UI沟通是否调整,最终呈现出来的原型才是符合业务逻辑的。

页面流程的问题

画页面流程的过程会帮助你更全面的思考逻辑,这中间包含了正常逻辑和异常逻辑,也会有各个页面之间的跳转逻辑。那么画页面流程要注意哪些问题呢?

1. 不要忽略异常流程

关于异常流程的处理逻辑,在原型中一般表现为弹层或者提示。

对一些关键元素的操作会触发异常流程,以个人书架业务的添加图书信息为例,正常流程为输入图书信息点击添加按钮完成添加进入图书详情页,然而在输入图书信息的过程中会存在一些必填项的非空判断的错误提示和关于专业名词的解释说明或者其它规则说明,也要在设计之初就考虑进来。

2. 考虑下游的触发点

在页面流程的设计中需要加入下游处罚点的考虑,通常是按钮或者超链接的形式,通过点击不同状态的按钮会跳转到不同的页面,那每一个按钮对应的下游页面是什么,想要引导用户做什么样的操作都要考虑,通过页面流程的梳理会增加你对整体业务逻辑的进一步理解,形成一个产品的全局意识。

 

(小技巧:对于一些特殊场景可以单独抽出来,不要影响主线流程的理解;对于分支场景也可以仅仅在主线流程里面一笔带过,单独一个页面进行整理。)

文章由PM28网编辑,作者:海阁,如若转载,请注明出处:http://www.pm28.com/3918.html欢迎投稿

联系我们

在线咨询:点击这里给我发消息

邮件:403567334@qq.com

工作时间:周一至周五,9:30-18:30,节假日休息