学习产品设计:绘制交互设计流程图

文章描述:绘制交互流程图.

学习产品设计初期肯定会遇到两个问题:第一,如何考虑更全面;第二,如何绘制交互流程图。开始产品设计前先要考虑所有可能性,如何才能以线性流程图的方法组织所需的设计元素。小郑老师的《交互设计表格》中已经介绍了非常实用的表格穷举法,适合初学者使用。

流程图是产品经理和交互设计都必须掌握的技能,一张流程图可以省去需求文档和交互设计文档的很多文字描述,让技术人员一目了然地明白设计意图,便于组织程序的逻辑顺序。

绘制流程图准从简单的原则,流程图是设计师的产出物,体现设计意图,主要给技术人员和测试人员浏览,至于自己是如何思考不应体现在流程图中。别人也要早点回家被老婆,没有时间关心你如何的细心的考虑,也不关心用户会如何思考和操作的,请直接给他们展示设计的结果。

复杂和纠结留给自己,简单留给别人。对用户是这样,对工作同伴也是如此。

图例1:手机程序开机检查更新的流程图

流程图包括以下图形:

  • 矩形表示交互环节
  • 菱形表示问题判断
  • 箭头表示工作流方向

也有用圆角矩形表示“开始”和“结束”,个人一般不要该图形,因为从上而下的线性流程图。最顶部的图形或者箭头开始的部分是流程图的“开始”,如图例中,开启程序触发了事件,程序开始检查更新;最底部的图形或者箭头终止的部分是流程图的“结束”,如重启程序和不再提示表示本次事件结束,无须以图形区分表示“开始”和“结束”。

流程图容易和操作步骤混淆,比如《交互设计表格》中的登录框操作步骤是:

  1. 点击登录,弹出登录框
  2. 点击用户名输入框,输入用户名
  3. 点击密码输入框,输入密码
  4. 点击登录

操作步骤是用户正常情况下完成某项操作所需的操作,而交互流程图(严格意义上叫程序流程图)表达是执行逻辑的路径,通俗地将是当用户点击某个按钮之后,程序执行命令的顺序。更复杂的系统流程图可用于产品架构。

当用户点击的登录框之后,文字描述程序执行的顺序:

  1. 检查用户名是否为空。如为空,提醒用户“请您输入用户名”。如果用户名设置要输入手机号码,还要检查手机号码是否是否以13/15/18开头的11位数字。
  2. 检查密码是否为空。如为空,提醒用户“请您输入密码”。
  3. 检查用户名是否是已用账户。程序提交数据与服务器数据进行比对。如果不是,提醒用户“用户名不正确”。疑问:用户名有误和不存在是如何判断的?
  4. 检查密码是否与账户匹配。如错误,提醒用户“密码输入不正确”。

现多数登录框将4和3合并,只提醒“用户名或密码不正确”,可能是告知用户过于准确的信息之后会增加盗号风险。

图例2,wap站验证用户手机号码

时间: 2024-08-30 09:30:05

学习产品设计:绘制交互设计流程图的相关文章

界面设计师经验分享:界面设计与交互设计

文章描述:从商业角度看,聊聊为什么企业需要界面设计与交互设计? 我是学商科出身的,所以我有个常用的思维方式,做一件事情会思考对企业的价值.对客户的价值,成本和收益是什么.感觉业界流行的是如何做好界面设计和交互设计的博客与书籍,但很少能够看到"企业为什么需要界面设计与交互设计"这种话题的文章. 好像显而易见做界面和交互设计是为了用户体验,其实不是这么简单可以一言即止,还是有多个层面来看,其产生的价值和意义. 1.为了客户第一印象和形象 "食色"是人的天性,食物需要颜色

为什么要有交互设计和交互设计能够解决什么问题

文章描述:之前写过类似的文章,想写的东西太多,结果什么都没讲明白.所以重新写一套入门的教程,分「了解交互设计」.「交互设计的职能范围」.「交互设计的常用方法」--几个章节把我对这门行业的理解和经验做个分享. 之前写过类似的文章,想写的东西太多,结果什么都没讲明白.所以重新写一套入门的教程,分「了解交互设计」.「交互设计的职能范围」.「交互设计的常用方法」--几个章节把我对这门行业的理解和经验做个分享. 下面开始正题(为什么会有交互设计,交互设计能够做什么): 1.成功的互联网产品有哪些要素? ①

信息设计和交互设计

文章描述:发现网页中的信息与交互. 两周前,在一家知名互联网媒体公司做内部沙龙交流.有朋友问我,做为产品设计.用户体验师或交互设计师,在设计网站时有哪些事情要做? 互联网发展到现在,各种产品形态种类繁多,眼花缭乱.但再复杂的网站都是由页面构成的,而无论什么样的页面,都只有两样东西需要考虑:一种是让人看的元素:另一种是让人操作的元素.我这样的解释比较通俗,也并没有很好的把概念抽象出来,目的是为了方便记忆."让人用"和"让人操作"这两件事情,就是我们常说的信息设计和交互

用户交互设计:手机产品交互设计样式

文章描述:用户交互设计:手机产品交互设计样式. 很多人都说,手机产品交互限制因素很多,过小的屏幕分辨率,过低的系统性能,过慢的网速,过弱的电池续航能力等等.但是在限制中还能做出优秀的设计,才显得弥足珍贵,就像风靡Symbian平台的gravity一样. 其实,我认为手机产品交互设计还是有很多想象空间的,它不仅仅是界面交互,而是跟空间.跟时间.跟触觉.跟视觉.跟听觉.跟嗅觉的交互,而且随着技术的推移,相信界面的可扩展性也会越来越好,不管是电子纸(ePaper),还是投影技术应用到手机上,都会让手机

产品需求设计(以迅雷看产品为例)交互设计与视觉设计

文章描述:从产品到设计. 很多网页设计师认为自己做好设计就可以,其他的事可不用理会和学习,那就大错特错了!一个优秀的设计师,必须深入了解产品本身.相关交互结构及用户体验等常识!这样设计师设计的东西才能深入产品中去,避免不犯错误!设计来源生活和思考,同样作为一个网页设计师,要不断地学习.思考.分析产品才能设计出更好的作品! 这里主要以迅雷看看产品为例,谈设计及用户体验的点点滴滴!希望对刚跨入网页设计这行的童鞋们有所帮助! 主要两个方面讲: 1.了解产品需求设计(以迅雷看产品为例) 2.交互设计与视

产品设计与交互设计之胡言乱语

引用heide格物致的话,交互设计是这样的:" 以人的需求为导向,理解用户的期望,需求,理解商业.技术以及业内的机会与制约,创作出形式,内容,行为有用,易用,令用户满意且技术可行,具有商业利益的产品." 交互设计的服务对象是产品,是为产品锦上添花.而"产品"这块"锦"则是发现用户需求或者创造用户需求,并为用户提供满足需求的途径或工具. 产品设计师就像造物主,为了地球不太寂寞,为了地球更加完美,从而造出了"人"这一终极产品.当然

交互设计思考:交互设计元素的层级

网页制作Webjx文章简介:基础控件和交互设计元素的层级. 今天被jobs指出之前工作的方向性错误,才意识到构成最终产品元素之间的层级关系. 在现在的工作流程中,规范是大家熟知也都尽力执行的,目的是为了在保证产出物质量和一致性的同时,提高设计和工作的效率.不过规范还是由更基础的两个元素构成:基础控件和基础组件. 交互设计元素的层级 控件是互联网/软件产品的最小界面元素,包括按钮,单选框,复选框,滚动条等等. 而组件,是通过合理的组合和布局方式形成的比较通用,好用的控件组合. 最终的设计规范,则是

交互设计:衡量交互设计品质的重点

文章描述:注意力与交互设计. 以人为本的设计,不能不考虑普通人在一般任务执行中的耐受力问题.因为人的精力有限,再强大的需求,无力去完成也是枉然.精力的有效转化率,是衡量交互设计品质的重点. 1.公式 精力一般由脑力和体力构成.针对互联网产品,脑力居前(非生产类网站的体力消耗很低).而脑力的组成又分为注意力.理解力和记忆力.本文将尝试以注意力为例分析交互设计的特点和注意事项. 注意力本身可以集中.分散和转移.集中一般出于明确的需求.潜在的兴趣:分散则由于信息干扰和不可控的时间:转移一般发生在需求探

大胆设计之交互设计

今天ifanr上有一篇<手势操作(自然用户界面)再探讨>,观点保守,论据不足. Android的菜单确实难用,难以记住界面是否有菜单.Plam将菜单放置在状态栏的左边,保证了触摸屏也能使用菜单,但也有弊端.菜单放在界面 左上角,宽28像素,难以点击.请拿出你的手机,右手去点击大屏幕的左上角.要么大拇指伸过去,要么其余四指抬起才能点到左上角,甚为别扭. 弹出的菜单通常要么是无关紧要的功能,要么重要.如果功能无关紧要,那不如将菜单放置在启动程序的第一个界面(主界面),如帮助,当用户需要的时 候,完