页面流程图用什么画如何画出好看的流程图

最近在做一个关于阅读笔记的原型，业务流程是要通过 app 扫码识别图书背面条形码，然后将图书加入书架，加入书架的书可以写阅读笔记，记录阅读的页数和阅读的状态，中间的页面流程复杂，于是决定通过阅读笔记的业务跟大家说说页面流程吧
01 什么是页面流程页面流程图是展示页面之前的流转关系——用户通过什么操作进了什么页面及后续的操作及页面，页面流程图是在业务流程图之后原型设计之前的工作，是提高原型效率的中间件。
做原型图，线框图之前先列一个大纲，这个大纲就是页面流程，可以帮助你更清晰的梳理需求，考虑每个页面的重点和每项功能的前置与后置，在做原型之前需要先思考页面流程，定好大纲，才能不偏离需求。
而且在做好页面流程图之后，也可以更好的帮助产品经理跟UI、测试、开发沟通，为之后做原型图减少了很多不必要的修改。
02 为什么要有页面流程1. 原型设计的基本依据新入门的产品经理，接到一个需求之后往往就会先画原型，而当你快速画好原型投入开发之后就会发现需要一直改改改，不断的改，逻辑漏洞很多，为什么会这样呢？如果你有这样的困惑，那就需要好好反思一下是不是你的页面流程是缺失的。
因为我们做产品是个逐层分解的过程，首先有需求，从需求转化功能，确认功能梳理逻辑，根据业务逻辑拆解页面流程，最后出原型效果图，这时候的原型才会是围绕需求展开的，所以页面流程就是我们原型设计的基本依据。
2. 通过页面流程模仿用户操作能发现体验问题页面流程是原型设计的基础，所以代表的是用户的立场，是站在用户视角考虑用户操作从而发现其中流程的合理与否。
以需求为出发点首先需要明确用户需求的场景，用户是怎么用的，在用的过程中会有什么问题，把用户需求场景想清楚后再思考怎么解决这个需求，通过模拟用户的操作来发现用户体验的问题，这也是我们做原型设计的时候需要考虑的，所以页面流程梳理好确认用户的需求场景和操作逻辑才能更好的提高用户交互体验。
03 页面流程该怎么画1. 页面流程中包含什么四方形：表明页面主业务，通常是页面的主功能部分

文章插图

文章插图
在这个页面流程图中，包含了以下几类：

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

只要确认好每个页面功能中想要重点表现的是什么，那在原型设计中就会更加表现得更见直白。
有一些页面的最终路径可能都是同一个页面，这也是很正常的，通过页面流程能够很清晰的看到站在用户的角度每一个点击操作的进展和之后的逻辑，这也就是产品交互的雏形
5. 优化和调整页面顺序当梳理清楚业务和功能逻辑后就可以整理页面流程了，页面流程要遵循尽可能穷举所有相关涉及的页面，然后做减法的方法。
将相同功能或者元素的页面合并，可以通过画原型草图的方法优化和调整页面关键元素，在这个过程中或许会发现某一些页面的元素展示并不符合预期逻辑，这时候就可以考虑换掉，也可以跟UI沟通是否调整，最终呈现出来的原型才是符合业务逻辑的。
页面流程的问题画页面流程的过程会帮助你更全面的思考逻辑，这中间包含了正常逻辑和异常逻辑，也会有各个页面之间的跳转逻辑。那么画页面流程要注意哪些问题呢？
1. 不要忽略异常流程关于异常流程的处理逻辑，在原型中一般表现为弹层或者提示。
对一些关键元素的操作会触发异常流程，以个人书架业务的添加图书信息为例，正常流程为输入图书信息点击添加按钮完成添加进入图书详情页，然而在输入图书信息的过程中会存在一些必填项的非空判断的错误提示和关于专业名词的解释说明或者其它规则说明，也要在设计之初就考虑进来。
2. 考虑下游的触发点在页面流程的设计中需要加入下游处罚点的考虑，通常是按钮或者超链接的形式，通过点击不同状态的按钮会跳转到不同的页面，那每一个按钮对应的下游页面是什么，想要引导用户做什么样的操作都要考虑，通过页面流程的梳理会增加你对整体业务逻辑的进一步理解，形成一个产品的全局意识。
以上就是爱惜日网»页面流程图用什么画(如何画出好看的流程图)的相关内容了，更多精彩请关注作者：爱惜日号SEO专员
【页面流程图用什么画如何画出好看的流程图】声明：本文由爱惜日网/爱惜日号作者编辑发布，更多技术关注！