交互设计:如何利用状态机模型来设计
关关 2018-05-22 来源 : 阅读 1364 评论 0

摘要:本文讲解了如何利用状态机模型来进行交互设计,界面都是有状态的。每一个状态下,用户都需要完成特定的任务。设计界面的过程就是找出这些状态来,划定每个状态提供给用户的功能清单。希望本文可以加深大家对交互设计的理解。

实际上,界面都是有状态的。每一个状态下,用户都需要完成特定的任务。设计界面的过程就是找出这些状态来,划定每个状态提供给用户的功能清单。
状态要尽量少,尽量符合逻辑,状态之间的切换标志要尽量清晰,用户才容易掌握。
有个隐形的需求大家很容易忽略:有些功能,用户需要在任何状态下都随时可以调用。这时候可以将这些功能集成在一块每个状态都可以看到的面板上。

臭名昭著的ACDsee就是在这方面做的不够好。它分为缩略图浏览、大图浏览、全屏、图片编辑等几种状态。各个状态之间界限分明,井水不涉河水。在大图浏览状态下,用户不能越界去看缩略图;在图片编辑完成之前,不能转去看其它照片。相信大家都有为了有选择地看几张大图,不停地在缩略图模式和大图模式切换的经历。acdsee的图片编辑状态设计的特别糟糕,很多人用acdsee功能多年,甚至不知道acdsee原来还有图片编辑功能。搞笑的是有些人一不小心进入了图片编辑模式,还误以为acdsee出了错,怎么不能正常浏览了。
作为一个比较,google的picasa在交互设计方面比acdsee好了不知多少倍。picasa将图片浏览模式和图片编辑模式合二为一。编辑功能只不过是在图片浏览时放在旁边的一个面板,用户随时可以编辑图片,不存在如何“进入编辑模式”和“退出编辑模式”的问题。考虑到在看大图时,用户也可能有看缩略图列表的必要,它在大图模式下还显示了一个导航条,显示缩略图列表,非常方便用户选择。

再回头看photell界面设计,可以发现它犯了与acdsee相反的另一个错误。它把太多的东西都集成在主界面上,该划分的状态没有划分。根据blog中的介绍,这一个界面是分为编辑和浏览两个状态的,用户浏览的如果是别人,那么所有的东西都是只读的(发表评论除外);如果浏览的是自己,那么面板中的内容都是可以编辑的:增删共享目录,增删标签,管理评论,更换用户头像和个性签名等等。
很明显,两个状态之间切换的动作是不自然的,状态标志也很不明显。用户使用这个界面,是一定会感到迷惑的。
还有其它问题,如左边的树型图,把用户列表、用户共享目录、用户标签等等东西都集成到一棵树下面了。树的表达能力很强,我知道,但总不能把同类不同类的东西都一股脑往树里塞啊,用户同不同意?按blog中的说法,作者还想把用户个人信息、评论等等都放到这棵树里。拜托,干脆把其它面板中所有内容都扔里面算了,包括主菜单都可以装在里面的,整个界面就一棵树和一个图片显示窗口,多清爽。
从交互设计的角度来说,这个photell的设计无疑是失败的。


本文由 @关关 发布于职坐标。未经许可,禁止转载。
喜欢 | 0 不喜欢 | 0
看完这篇文章有何感觉?已经有0人表态,0%的人喜欢 快给朋友分享吧~
评论(0)
后参与评论

您输入的评论内容中包含违禁敏感词

我知道了

助您圆梦职场 匹配合适岗位
验证码手机号,获得海同独家IT培训资料
选择就业方向:
人工智能物联网
大数据开发/分析
人工智能Python
Java全栈开发
WEB前端+H5

请输入正确的手机号码

请输入正确的验证码

获取验证码

您今天的短信下发次数太多了,明天再试试吧!

提交

我们会在第一时间安排职业规划师联系您!

您也可以联系我们的职业规划师咨询:

小职老师的微信号:z_zhizuobiao
小职老师的微信号:z_zhizuobiao

版权所有 职坐标-一站式IT培训就业服务领导者 沪ICP备13042190号-4
上海海同信息科技有限公司 Copyright ©2015 www.zhizuobiao.com,All Rights Reserved.
 沪公网安备 31011502005948号    

©2015 www.zhizuobiao.com All Rights Reserved

208小时内训课程