UED学习笔记
越努力越开森

交互流程图画法和注意事项

原文来自“人人都是产品经理”:http://www.woshipm.com/ucd/137757.html

文章简短,但说明了几个常见问题,好文

------------------------------------------------------------------------------------------------

什么  不  是设计流程图:

百度百科关于流程图的定义——以特定的图形符号加上说明,表示算法的图,成为流程图或框图。流程图是流经一个系统的信息流、观点流或部件流的图形代表。在企业中,流程图主要来说明某一过程。这种过程即可以是生产线上的工艺流程,也可以是完成一项任务必须的管理过程。

归纳两种流程图如下:

表示算法或内部逻辑的:可以看出这种流程图是描述算法的,或者理解成物体底层的运算逻辑,他的特点是底层、复杂。但他不是设计流程图

表示业务或工作流程的:常见于一些办事流程、服务过程,里面有各个不同的单位、人、物品参与其中,它的特征是宽泛、简单。但他不是设计流程图

流程图的基本构成:

流程图由特定图形构成,但具体的样子由图本身的目的和阅读者阅读习惯来局认定,所以使用的图形并不是固定的

设计流程图:

一大重点是面向表现层,描述的是界面(屏幕)的变化,是用户看到的界面的行为流

什么是行为?就是界面之间的跳转逻辑,也就是导航逻辑

信息架构划分为:组织、导航、标签、搜索四个。导航是信息架构的一部分

从图中可见构成:

1.界面:一个举行代表一个界面,这个流程中用户走过两个界面,因为表达的是界面的跳转,界面上用户实实在在接触到的媒介,非界面内容不要出现

2.动作:矩形之间也就是界面之间加上一个触发动作,比如从界面A点击下一步按钮,到达界面B,“点击下一步”就是连接两个界面的关键动作,需要表示出来

3.条件:一个动作执行后会有多种“是/否”的结果,则在矩形之间、动作之后加上一个或多个判断菱形

需要注意什么:

1.坚持表达表现层

不要一个流程图里面又有内部算法又有界面逻辑,下图标红的矩形就是多余的,这个用户不关心,会扰乱你的导航设计思路

不要把步骤和界面本身都用矩形表示,比如下图标红的矩形

2.抛弃系统错误

系统错误,也就是非用户犯的错误,比如登录的时候服务器当了,网络连接失误。除非你特别想强调系统错误后的提示界面,否则建议不要加进去

3.形式可以很灵活

如果一个界面可以通往多个界面,而你又真的要描述这些跳转,那么就一个进行长出多条路线,对应标识上对应的动作就可以了

如果几个界面属于同一个逻辑,比如实际是一个界面的几个TAB,则可以这样把几个TAB包起来

如果你想把一些警告窗口等临时窗口表达出来,可以一个字定义一些图形

更详细一点,如果你想把一个界面的主要内容表达出来,可以如下图(还可以细分里面的内容究竟是信息还是下个界面入口)

 

 

评论
热度 ( 1 )

©  ̄靑。 | Powered by LOFTER