用户体验交互设计:层级信息结构表示方法

文章描述:交互设计中的层级信息表达形式.

无论是固网还是移动网,在交互设计过程中,关于层级信息的表达有很多种不同形式,这里针对不同的手机平台的两层信息进行的简单的归类和探讨。

1,TAB方式

TAB 是互联网产品中非常普遍的应用方式,并在各种各样的软件应用中有着非常善变的形式。

A 最原生态的TAB形式

这种形式的TAB在传达什么样的交互信息呢?

1) 其他标签 简要概括该TAB对应页面的信息

2) 选中标签 显示当前浏览的信息

3) 虽然各个TAB之间相互独立,但是TAB提供了方便的信息认知方式(标签),便于准确迅速查找到对应的页面信息

4) 有一个问题是:随着TAB数量的增多,用户承受记忆单元的压力越来越大,标签本身信息传达也显得越来越无力

此时,我们是如何安排我们的记忆方式呢?按照一般人能够正常记忆的单元在7个左右,当要记忆的单元超过7个,我们会调整记忆的方式,比如将类似的信息合并为一个单元存储在记忆中。但是无论如何,这样的记忆方式确确实实加重中了我们的记忆负担,之前很随意,现在需要集中精力了!

但是一旦这些信息杂乱无章,让人无所适从的时候,我们开始完全记忆不清楚了,只能一个一个点击去“试”,碰一下运气。

这样TAB比较多的展现方式或许在PC端差强人意(通过TAB标签微弱的提示信息来猜测),但是在手机端上就太勉为其难了。

B 非触摸硬键操作手机

针对非触摸硬键操作手机,过多的TAB可以采用上图两种方式来表达:

1) 通过TAB标签一半的显示和隐藏来暗示更多TAB页面的存在

2) 通过左右箭头的存在或冻结关系暗示更多TAB页面

C 触摸屏手机

相比较非触摸屏手机,触摸屏手机对TAB元素的大小,操作行为有着更为积极的方式,直接滑动整体TAB群就可以浏览所有的TAB标签。

还有一种方式,这里没有涉及到,就是点击箭头滚动一组TAB的形式,鉴于不同平台的能力,这种方式在Window Mobile更为常见。

2,手风琴方式

手风琴式是针对两层信息界面表达的另外一种形式,但表达出来两层信息结构中的第二层信息有明显的连贯性,内容也有一定的限制。

A 非触摸硬键操作手机

硬键操作系统应用此方式,急需考虑列表展开和关闭操作的快捷性。

B 触摸屏手机

而针对手风琴式的界面表达方式,还可以针对其在屏幕中的显示方式有两种,一种是展开的内容和第一层级信息列表作为一个整体显示在屏幕,如果满屏则整体滚动;另一种是保证所有的第一层级信息列表显示在可视屏幕中,中间空出来的空间用来显示展开信息列表对应的内容,内容过多则在该空间范围内进行滚屏,而其他第一层级信息列表保持不变,这类方式适合第一层级信息列表不是特别多的情况。
我们可以根据需求的不同情况选择最优的设计方案。

3,其他延伸

无论是哪种信息表达方式TAB也好,手风琴也好,都和这两层信息结构的关系有着重要关系,合理的信息结构使用合理的表达方式才是解决问题的关键!

在上图中,我给出了第一层级信息和第二层级信息可能分割的几种状态,这种状态的分割依据有以下几种可能:

1) 层级信息本身的价值带来的判断

2) 屏幕空间的有限性,必须在第一层级和第二层级信息中做出选择

3) 需求导向型,这两层级信息显示的意图是什么?

4) 实际的软件开发中,实际资源或领导意志的限制

从对这两层信息结构重要性和信息价值的分析,我们或许能够从TAB和手风琴这两种表达方式中找到更多更有用的界面表达方式

A 当TAB标签变得越来越没有用

在前面关于TAB的论述中谈到,当TAB的数量越来越多,给我们带来的记忆负担也越来越重,实际也在说明一个问题:这个时候的TAB标签也开始显得越来越没用,那我们为什么不优化一下呢?

在IPHONE客户端也有相当这方面的应用


B 第二层信息没有多大的价值

这个比较典型的就是UC浏览器保留网页方式,Safari浏览器保留网页方式,QQ浏览器保留网页方式。


如上图所示,iPhone中的圆点组件可以看成是TAB标签,而把它本身信息压缩到了最少,此类设计是因为手机操作空间的局限或者从需求的角度来看这个TAB标签承载的功能表现出当前容器中有多少个页面已经足够了。

这个时候,其他页面显示是什么(TAB标签的文字带来的信息)相比较手机操作的局限和易用性来讲已经变得次要了。

而QQ浏览器则是在Safari浏览器基础上的设计延伸,可以在有限的空间,保存更多的浏览页面,但是随着浏览页面的缩小,窗口信息显示的也越来越有限,我们选择某个浏览窗口更多的可能是根据浏览窗口上的标题;不知道是不是这个原因,UC浏览器则直接做成了列表形式,两层信息变为一层信息的处理方式,因为另一层变得“没用”了。

C 推出新的页面分摊第一层和第二层信息

当第一层和第二层信息量产生一定规模效应时,推出新的页面分摊第一层和第二层信息来平衡。这个是最一般也是最容易理解的显示方式。当然这种方式也有它的问题,如果信息的层级比较多,可能因为页面的增加而增加用户的“深度”记忆负担。

在iPhone User Interface Guideline中,提出了三种不同形式的Application Style,其中一种为Productivity Application,对层级信息的处理方式如下图。

这种以页面的形式显示层级信息会因为信息本身结构的不同有各种各样的变化,这就需要参详各个平台本身控件的灵活运用和一些习惯用法的合理显示了。

时间: 2024-10-30 22:46:13

用户体验交互设计:层级信息结构表示方法的相关文章

用户体验交互设计 如何设计优秀的用户体验

虽然说起来简单,但这里所说的每一点都意义深刻.虽然可以把每一条都写成一篇文章,但我们只给出简短的解释.缺少的细节和例子,则要用你自己的经验来填补. 抓住基本功能 核心使用情境--人们使用你的 Windows Vista 程序的主要原因--远远重要于那些边边角角的情境--人们也许会做也许不会做的事情.牢牢抓住基本的东西!(如果你这么做,用户可以容忍那些发生在边角的问题.) 把某方面做出色 想想"真实"用户(而不是市场部或公关部的人)会如何描述你的程序.找出你的目标用户,保证他们会说&qu

将讲故事这种方法运用于用户体验(UX)设计领域

摘要: 本文摘自<Storytelling for User Experience>中的第一章. 为什么讲故事? 我们都会讲故事,这是分享信息最自然的方式之一,并且它同人类一样古老.这本书是关于如何以一种全新的方式使 本文摘自<Storytelling for User Experience>中的第一章. 为什么讲故事? 我们都会讲故事,这是分享信息最自然的方式之一,并且它同人类一样古老.这本书是关于如何以一种全新的方式使用一项你拥有的技能:将讲故事这种方法运用于用户体验(UX)设

良好用户体验产品设计的10点感受和实践经验

如何通过设计使产品达成良好的用户体验呢?很显然,这是一个复杂且系统的事情,尤其在今天,用户体验这个词被严重滥用,我们更要思考如何通过设计实质性的影响产品的体验质量,而非其他.设计师需要更多的关注产品,研究用户,理解和适应企业文化,从而通过设计过程.行为来影响产品的体验质量.以下是我实践积累和思考中感受较深的10点,聊以抛砖引玉.与大家进行探讨和交流,最重要的是,希望能在实际工作中发挥影响,有所改变.改善协作.流程,让各个团队的优势资源聚合,产生对产品强大的推动力量. 1.为用户设计产品,产品即体

5个严重影响用户体验的设计问题

  今天这篇译文聊的都是一些显而易见,但特别容易犯错的用户体验常识,别说,光第二个问题的汉堡菜单已经让不少网站躺枪了.如果你木有系统的用户体验知识,把这篇提到的5个常见问题读一遍,效果绝对大幅提升. 要使产品被用户接受而且乐于使用,需要满足的条件不少.你需要知道产品服务的目标人群是哪些,他们有什么问题需要解决,你的产品提供的解决之道和他们现在采用的方法相比有哪些优势,你需要怎样引导和帮助他们,等等. 作为用户体验设计师,需要考虑的东西很多,从怎样吸引用户使用产品,到引领他们上手,再到帮助他们解决

设计更好的用户体验:UI设计的黄金规则

文章描述:解析应用程序UI设计的15项黄金法则. 好友曾向我展示了最新的iPhone和iPad版<极品飞车>.游戏的渲染效果令人印象深刻,是款蓄势待发的优秀游戏.但是,游戏的前端是典型的UI设计偏差案例.但界面中有大量的属性数据等内容,它在玩家没有时间做决定时提供了过多的内容.这些内容能够显著改变他们的游戏体验,但却在玩家往往感受不到变化的时候呈现. 极品飞车(from itunes.apple.com) 这促使我开始思考UI设计的黄金法则.以下是我认为创造最佳体验应当使用的UI设计方法.坦诚

用户体验设计案例:用户体验就是设计

文章描述:实例告诉你为何体验就是设计. 我最近又重新点燃了对钢笔的强烈爱好,发现自己的书写装备收藏中又出了几个新品.由于其中一些相对昂贵,我决定向北卡罗来纳的一家小型的皮革制品制造商订购.价格公道,评论也表明其做工很好.网站十分简洁,商品才是其重点. 可是到了要付款的时候,我却被转到了 PayPal 的网站上,我跟这家公司的交互体验也就此被打断了,这不是因为这家笔筒制造商做错了什么,而仅仅是因为 PayPal 的界面和用户体验跟前者太不一样了.付款页面犹如一台时间机器,把我带回了至少 10 年前

用户体验:关于设计理论和设计术语

网页制作Webjx文章简介:关于设计理论和设计术语. 这几日的工作,涉及到很多会议. 也就涉及到很多人,很多意见,很多碰撞,很多思辨. 关于项目本身的不再多说,目前也不适合分享. 倒是有一些题外话,虽然和具体项目无关,但是会影响我们工作和沟通的效率.据我来看,也是很有意思的话题. 其中有些话: 功能性导航.全局性导航,我们是不是太扣字眼了?用户真的会关心什么是功能性导航,什么是全局性导航吗? 我们用这些原则来指导我们的工作,是不是太僵化了? 我们为什么先分析别的网站去找出这些规律,真的有用吗?我

用户体验:如何设计美好的瞬间(1)

瞬间设计是什么? 良好的用户体验,全在于那些完美的瞬间.在第一个瞬间,假设当一位用户从购物搜索结果页面跳转到某个店铺的时候,他此刻可能是想看看这个店铺的风格及其信用:而下一个瞬间可能就开始琢磨如何使用页面中的导航来观看某个宝贝介绍.再然后则可能是询问怎验购买,从哪里注册,者看看商品是否打折,或者尝试联系这个卖家. 若想完成优秀的设计,我们就需要时刻自问:在希望用户做些什么,界面应该如何鼓励他们完成这些任务?每一个瞬间对于完整的用户体验来说,都是不可或缺的一部分,因为他们都有可能加强也可能摧毁用户

用户体验:如何设计美好的瞬间(2)

好的设计绝不是单纯的因为天才的创意或者灵感爆发的一瞬间而产生的,只有设计师在"持续改进"的迭代方法中才能达到好的效果,你必须通过不断的"质疑自己",在不同的设计种找到缺点,并寻求 更好的方案来改进它.Bill Scott在他的<Web界面设计>里提到了关于富交互设计的六个原则告诉我们如何发现并找到解决的办法,我遵循这些设计原则,通过实例和数据来和大家一起分析一些有趣的瞬间,指导我们的设计. 一.直接操纵原则 直接操纵原则就像Alan Cooper在<