交互设计——绘制流程图

在上一篇文章中了解如何寻找接触点、梳理接触点,在这篇文章中主要就是如何来绘制流程图。现在普遍对流程图的分类有四种:业务流程图、页面流程图、功能流程图、程序流程图。在这主要通过现有的APP分析来进行区分不同流程图以及如何交互设计师或者产品经理选择应该使的流程图。何为流程图在上文中讲到了流程,流程是事物进行中的次序或顺序的布置和安排。流程是自然而然就存在的,它可以不规范,可以不固定,可以充满问题。而流程图的核心就在于如何排布事物进行的次序,...

        在上一篇文章中了解如何寻找接触点、梳理接触点,在这篇文章中主要就是如何来绘制流程图。现在普遍对流程图的分类有四种:业务流程图、页面流程图、功能流程图、程序流程图。在这主要通过现有的APP分析来进行区分不同流程图以及如何交互设计师或者产品经理选择应该使的流程图。


何为流程图

        在上文中讲到了流程,流程是事物进行中的次序或顺序的布置和安排。流程是自然而然就存在的,它可以不规范,可以不固定,可以充满问题。而流程图的核心就在于如何排布事物进行的次序,不同的顺序可能造成截然不同的结果。

流程图作用

        对于交互设计师而言,其主要的作用是表达每一个页面的跳转逻辑是,这个页面是怎么样到下一个页面的。

        对于产品经理而言,可以保证产品的使用逻辑合理顺畅、传达需求,用流程图来更好地表达产品逻辑、查漏补缺,检验是否有遗漏的分支流程。

流程图种类

        现在大多数人将流程图分为业务流程图、页面流程图、功能流程图、程序流程图这四种,交互设计师主要要了解页面流程图与功能流程图。


(1)业务流程图

        定义:基本上按业务的实际处理步骤和过程绘制,是一种用图形方式反映实际业务处理过程的"流水账"。(360百科)

        在这里涉及一个细致程度的问题,当然是根据实际的情况。流程图的细致程度越高,产品设计就越准确顺畅。但实际情况中,过度的详细反而是浪费时间。但一般是抽象地描述事物进行的次序和顺序,不涉及具体操作与执行细节。在互联网产品的业务流程图中就是脱离了用户实际的操作行为,而只是表现没有业务的具体步骤。

交互设计——绘制流程图


(2)页面流程图

        定义:指电子产品具体所呈现的页面跳转流程图。其承载了业务流程图所包含的业务流转信息。页面设计流程图的一大重点是面向表现层,也就是说,描述的是界面(或叫屏幕)的变化,是用户看到的界面的行为流。何为行为,可以说是页面的跳转逻辑

交互设计——绘制流程图

        页面流程是表示每一个页面出现的跳转,表现的是每一个页面(注意,停留在表现层)。其次,页面流程图依然是包含在业务流程图之中的,可以说是将业务流程图进行了细化。将抽象的业务流程图以页面的具体形式很具象的表现出来。

(3)功能流程图

        定义:指单页面内或多页面之间的功能操作流程,其包含在页面流程中。任何功能都是被包含在页面内的,但一个页面内往往不止一个功能,所以单单页面流程图可能无法完整表达所有流程,而这时就需要用功能流程图来更加具体表达每个页面内所包含的功能

交互设计——绘制流程图

        例如“得到”与“淘宝”,在一个页面有不同的功能操作,所以现在需要用功能流程图来更加具体表达每个页面内所包含的功能。以“得到”为例:

交互设计——绘制流程图


(4)程序流程图

        与其它三种流程图不同,业务流程图大多以人为核心,每个节点都是在传递人的不同行为、页面流程图和功能流程图也类似,都是以人的操作行为为核心,在不同页面和功能间进行流转。但数据流程图不同,它是以数据为核心,展示整个系统中,数据是如何被处理的。程序流程图更会注意流程背后的的程序。还是以得到为例:

交互设计——绘制流程图

        简单来说,程序流程图更多会考虑背后的背后程序流程是怎么样的。


流程图的组成元素与组成部分


(1)组成元素

交互设计——绘制流程图

        画流程图的工具有很多种,AXURE/WORD/WPS都是可以的。

(2)组成部分

主要分为主干(用户的主要完成步骤)、枝干(分支流程)、子流程(将某几个具有逻辑关系的节点集合而成的,可以复用在各个地方),以上面的“得到”为例:

交互设计——绘制流程图


(3)流程图的结构类型

主要分为:顺序结构、选择结构、循环结构

交互设计——绘制流程图

总结

流程图主要表示了一种结构顺序,对于交互设计师而言,在进行信息架构的组建的时候,其实也进了部分的流程图的设计,只是在根据接触点的梳理再次将流程进行梳理。交互设计师主要是页面跳转逻辑,也就是要注重页面流程图与功能流程图——页面功能流程图。一般交互设计师根据页面交互流程图会产生这样的流程交互稿:

交互设计——绘制流程图

超sir 

第十一

原创文章,作者:交互精选,如若转载,请注明出处:https://www.iamue.com/36875/

(0)
交互精选交互精选
上一篇 2018-05-06
下一篇 2018-05-06

相关推荐

  • 智能语音交互设计 1 — 总览篇

    大家好,从本周开始会进行Conversational AI Design Newsletter编写。希望把一些现有的语音交互的研究成果和一些关于Conversational AI的方法收集起来分享给大家。source: Pinterest第一篇 — 总览篇语音助手(Voice Assistant)主要由几种重要的技术组成:自动语音识别系统(ASR),自然语言处理(NLU),和机器学习(Machine Learning)。ASR类似于我们...

    2018-02-05
  • 2018年04月07招聘岗位

    诚聘:通辽澳鼎医疗器械公司诚聘:工作人员要求:40岁到50岁之间的女性,能长期工作的,有爱心,有孝心,家庭没有负担的,高中以上文化程度,语言表达能力好待遇:中午有工作午餐,每个周日休息,节假日休息,基本工资1800元,满勤奖200元,年底奖金不少于12000元。联系人:闫经理。联系电话,15247572846,15374967717不能长期工作的勿扰!招聘服务员工资底薪2500加提成收银员2700元加提成招聘电话:8663888,157...

    2018-04-08
  • 不以用户体验为目标的人工智能都是耍流氓

    上周末,老刘在家整理了一下旧物,忽然发现了这个。估计现在很多人都会觉得这简直是土到爆了,但在当年那可是先进到不行。听歌、拍照、玩游戏、上QQ,绝对是功能最强大的手机,每当老刘拿出来,那内心简直不要太骄傲。曾经把诺基亚这款手机当成宝贝的老刘,绝对没有想到,短短几年后,那些曾值得炫耀的功能,会变得不值一提。看看现在的手机,拍照都是自带PS的,玩游戏都是屏幕上直接操作的,买东西手机是可以直接付钱的,出门迷路了是可以直接导航的。老刘不禁感叹,科...

    2018-02-01
  • 用户体验(UX)专家是如何进行设计评审?

    设计评审是一种可用性测查工具,通常由一个评审员审查设计方案中的可用性问题。本文摘自https://www.nngroup.com/articles/ux-expert-reviews/原文标题:UX Expert Reviews原文作者:Aurora Harley什么是“设计评审”?定义:设计评审是一种可用性测查工具,通常由一个评审员审查设计方案中的可用性问题。“设计评审”一词颇为广义,涉及数种可用性测查方法,且每一种的运用因人(评审员...

    2018-04-19
  • 像用户体验设计师那样思考

    [国外设计第158期][图片]插画来自Crafticons培养探索未知的心态(持续)学习用户体验是最需要技巧的事情。因为这不是标准教育中的某个正式课题。它总是以某种神秘不可预测面貌示人,直到你在设计、研发、市场推广(或者其他创意领域)中遭遇到用户体验的具体概念。虽然在用户体验方面

    微信热点 2018-04-18
  • 论数字媒体交互设计的未来

    “交互设计”这一概念如今风靡全球,对于它的研究 与实践受到企业、院校等机构越来越多的关注。现如今交互设计正在呈现出一种放射状成长态势,这使得交互设计没有绝对的定理,都是在共同交流,探索中前进。国内交互设计优秀案例分析在信息全球化的时代,无论是国际还是国内市场,大多数设计机构都在言必称交互,“交互设计师”、“用户体验设计师”已经成为炙手可热的职位。我国也涌现出一批优秀的交互设计师们,其设计出的作品均获得了国内外的一致好评。例如,中央美术学...

    2018-03-03
  • 玩转交互设计,给景观来点生命力!

    景观设计从一开始关注项日的审美性,再到功能性,全社会对于它的要求已经在逐步升高。现代景观设计中,公园、绿地,甚至校园景观、风景名胜区等需要从单纯的生态意义中提升到一个更高的层次。在诸多国内的项日中,虽然将“以自然为题,以人为本”定为设计目标,但是往往停留在服务于人们行为上的舒适性、安全性,而忽略了人性中的更多需求。与此同时,人们每天被层出不穷的新鲜事物所包围,绿色环境对人的吸引力逐渐降低。在现代化工业大发展的背景下,人与人、与其他生物间...

    2018-02-07
  • AXURE免费元件库分享-web

    分享个WEB端axure元件库下面是元件库地址:https://pan.baidu.com/s/1pLXHuf5

    2018-03-05
  • 极致用户体验的养成

    上周五约了朋友吃晚饭,提前约的顺风车。由于堵车,司机到了办公区的北门。经过沟通,我从定位地点过去找他。四扇车窗都是开的,他坐在副驾驶,烟刚抽了三分之二,后视镜旁还有未散尽的烟雾。他回头看见了我,我朝他微笑示意。确认了眼神,我是他的乘客,他马上把烟灭了。左手在空中挥了挥,右手扭转了空调按钮,抬起头在空中胡乱吹了几口气。隔着车窗看见副驾驶有件外套,说了句“久等了”,我便从右后侧上了车。刚落座,他就急忙表现出歉意:不好意思,不知道你走过来这么...

    2018-04-25
  • 上海benhealth招聘实习生 150/天

    回复「简历」,送你优秀简历模板。岗位岗位实习生岗位职责参与公司移动端、小程序以及 PC 端 Web 产品的交互设计;与产品经理和开发人员共同完成产品开发。岗位要求1. 平面、视觉传达相关专业本科或以上学历;2. 熟悉 Axure 和 Sketch 等交互设计工具;3. 热衷网络文化,熟悉网络热点和主流 App;4. 良好的沟通学习能力,工作热情高,责任感强。薪资福利150 元/天工作地点上海简历投递投递邮箱:jun.pan@benhea...

    2018-04-08