当前位置:首页 > 经验学习 > 设计思想

在线应用窗口一致化分析

所属栏目:设计思想 时间:2013-12-26 来源: 作者:admin 点击:

虽说互联网的革命总觉得势不可挡,大家都期待着,某一天,只需要一个浏览器,就可以完成平常用客户端才能完成的任务。虽然,HTML5与Chrome一度让我们看到浏览器代替操作系统的希望(via 1,2,3,4,5),但目前来看,用户同时保持两种平台的使用的状况,要持续很长一段时间。
想让用户无缝地从客户端应用转移到在线应用,我们还面临很多问题。
从逻辑上说,在线应用属于操作系统中浏览器客户端应用内运行的一套程序,很多交互上依然还是要依赖上层应用(浏览器客户端),这就如同在Mac OS内跑一个Windows的虚拟机的那种差别。
这样的环境,就给在线应用带来一个很严重且无法避免的问题:体验不一致。在线应用没法提供和客户端应用一样的体验环境,用户如果如果想好好使用在线应用,得需要重新学一次,成本过高。尤其是对于那些生产力应用,而这种不一致,无疑是致命的打击。
生产力应用指的是可以完成那些对具体信息的组织与处理的任务。用户通过生产力应用可以创造并处理信息。比如Outlook,Photoshop,Word,AutoCAD。
这些体验的不一致在UI上的表现主要包括以下几点:
键盘快捷键 ——只有少部分在线应用支持快捷键,这些快捷键难以发现且不支持复杂的组合。
鼠标右键 —— 只有少部分在线应用支持,而且无法和浏览器右键菜单并存。(新版Flickr的交叉显示做法不错。)
信息交换 —— 把本地照片拖进Photoshop内即可打开,把Flickr照片能拖进Photoshop.com内编辑吗?
如有其他,欢迎补充。但我个人认为,最大的不一致,是在于页面的渐进变化,窗口深度变化以及模态化转变。因为这种不一致,用户很容易就在一个在线应用中迷失而困惑,因此,“首页”链接成为点击最高,最救火的链接。
观察一:多样的对话
在浏览器中,用户一共会遇到4种类型的对话窗口,分别是:
浏览器对话框——由浏览器驱动的对话框窗口,模态对话框(相对于浏览器,Opera除外。)如下图左上角,删除对话框。
内建对话框——由在线应用提供的对话框窗口,如下图左下角,为QQ邮箱写信提示,模态(只相对于当前浏览器标签页内。)
小弹窗——非模态的小浏览器窗口,用于完成一些在线应用的子任务。如下图中部,为Gmail添加其他邮箱帐号的小弹窗。
通用对话框——由操作系统所提供的模态窗口,如上传文件,保存文件,指定文件夹等对话框。
了解更多对话框的分类,请参考Windows user Experience Interaction Guildelines > windows



观察二:页面的流动差异化
同样的页面,即使他们的功能与内容相同,但在客户端与在线应用,也存在着较大的差异。
客户端中,使用窗口的模态叠加,给予用户导航,同时,Windows平台还提供了任务栏,帮助用户管理自己的窗口。对于用户而言,后退至上一步,只需关闭当前窗口,返回操作流程的原点,清除掉任务栏的窗口的占位即好。
在在线应用内,由于窗口的模态叠加存在实现难度,而且效果也不佳。同时,也不会有任务栏这样的控件去管理用户在网页端内的窗口(Firefox Panorama也不过是对浏览器的标签管理提供了解决方案而已),即使存在面包屑与导航,也难以避免导航迷失,用户难以在页面中快速找到准确的后退路径,不得不直接选择“回到首页”的方式,快速逃离。
窗口和页面流动



上图看起来比较复杂,但通过窗口的叠加,有效的记录到了用户的整个操作流程。用户在回退时,都可以采用点击窗口的X,或者Cancel退回上一步。



而对于在线应用,虽然有面包屑,但是他表现的不是用户操作流程,而是信息的分类。
页面模态的差异化



同样的内容(设置),在客户端内,使用模态的对话框,并且会新开一个窗口;而在线应用中,这就变成非模态了,且不会新开窗口。
网页端后退操作行为过多

请站长喝杯咖啡?

站长一直坚持白天工作、晚上熬夜更新素材,付出了巨大的精力和时间,其中的辛酸难以言述。

坚持免积分、免登录、无任何限制下载!如果本站素材对你有用,不妨考虑请站长喝杯咖啡鼓励一下!

标签:

你应该也喜欢这些吧

共有 0 条评论

给个评价吧

验证码: