浅谈图型菜单与文字菜单

写这篇文章最初的想法是来自我看过的一篇关于汉字与英文阅读习惯差异的文章,可惜现在想起来的时候已经找不到那篇文章了(有知道的人请务必私信我)。


前言


写这篇文章最初的想法是来自我看过的一篇关于汉字与英文阅读习惯差异的文章,可惜现在想起来的时候已经找不到那篇文章了(有知道的人请务必私信我)。

图型菜单与文字菜单

浅谈图型菜单与文字菜单

浅谈图型菜单与文字菜单

在做浏览器测评的时候下载了firefox,一直都在用chrome的我第一眼就被主界面的图形菜单给吸引住了,包括右键菜单也是让我感觉耳目一新,但后来慢慢使用的过程中发现并没有想象中的那么好用。

主要是因为使用过程中这些图形菜单让我感觉操作变慢了,需要看比较长的时间才能找到自己想要找的选项,后来仔细分析对比了一下,我发现图形跟文字主要是识别节奏有区别的,识别主要分三个阶段:

第一阶段:区域识别阶段

浅谈图型菜单与文字菜单

这个阶段主要是将页面信息分区域,主要是受菜单里分隔线的引导,菜单里的选项的具体图形在脑海里还是比较模糊

第二阶段:形状识别阶段

浅谈图型菜单与文字菜单

这个阶段大脑会比较清晰看到菜单里面选项的形状,但具体文字以及图标还是一个模糊的阶段

文字菜单的识别工作在这个时候已经完成了一大半,主要是由于我们从小到大就一直在训练文字识别能力

所以我们看到选项大概的长度以及其中的一两个文字很快就可以联想到选项的内容,可以很快得找到自己想要的选项,而不用每一个选项的文字都看完了才能理解透

而图形菜单在这个阶段,由于图形更加突出,当我们又没办法对于大小类似的十个图标很快地进行具体识别,所以这个阶段还是没办法识别出具体选项

第三阶段:文字图标识别完成

浅谈图型菜单与文字菜单

图形菜单在这个阶段识别完成,而文字菜单在这个阶段把最后的10%给完成掉。。

总结

文字相对于图形来说,可以更快的通过选项以及第一个字的联想来识别出选项。

而图形菜单无法通过大概的形状去区分开每一个选项,并且软件的很多操作都是抽象的,没办法用一个具象的图标去很好地表达出来,这就导致了图形菜单选项识别速度会比较慢。

实际应用


实际上前文的对比还是有一定局限性的,浏览器主界面菜单有这样的特点:

  1. 使用频率不高
  2. 选项相对来说较多(10个或以上)
  3. 【图形菜单】实际上刚刚说到的图形菜单也还是有文字,只是图形会占比较大一部分而已
  4. 【图形菜单】纯图形无文字的菜单有些选项并不能及时地给予用户足够的反馈,例如复制,收藏一类的选项,不结合其它操作是很难产生效果的

举个反例大家很快就能理解了,安卓手机上的三大金刚键,选项少,操作频率高,并且反馈及时充分,用图形菜单选项就完全没有问题了

浅谈图型菜单与文字菜单

以文字为主,图形为辅的表现形式有时候反而会加强了文字选项的特征,达到更快识别的目的。例如各种解压软件在右键菜单里的选项,一眼扫过去就可以找到解压或者压缩的选项,当然这里其实还包括了选项分类的思路在里面。

浅谈图型菜单与文字菜单

结束


大概就是这样子啦。。

 

作者:kemchenj

来源:http://www.jianshu.com/p/b499173c7419

 

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/31873/

(0)
CatherineCatherine
上一篇 2017-06-03 07:26
下一篇 2017-06-03 09:20

相关推荐

  • 【译文】UI设计评审成就微创新

    产品设计流程中,有必要对设计进行评审是大家的共识。在我每周的工作内容中,参加各类大大小小的设计评审是必不可少的一环。既有脑力激荡的评审让设计方案脱胎换骨的,也有针锋相对的评审让设计方案摇摆不定的。怎样进行一场高质量的设计评审?设计师应该如何应对设计评审,更好的表达设计意图,并收集意见改进方案?怎样避免设计评审变成竞稿或PK?如何确保设计评审这样的流程能带来更大价值?带着这些问题,我们一起看看原文作者Jason的观点。*在你点评的设计细节上开始询问背后的原因及意图。为什么我们需要这条信息?对于允许索取这条信息我们设置了哪些期望?我们会用它做什么?如果我们能回答它们,再进入讨论解释各种元素的优劣以及与之对应的不同意见会比较好。“为什么”引出一个故事,解释某件事情的真实性。如果你问为什么,一切都无法奏效,你更想要创造一个故事,无论真实与否。这是让你感到糟糕的危险领域。 与询问“为什么”不同的是,考虑询问“如何”能够引出一个创造流程的故事,不必为它的存在辩护。然后你可以问设计师之前考虑过的各种可能,认真倾听设计师在提供方案之前做过的尝试。他们也许过于看重某些东西,不过没必要深究。优秀的适时交互是让产品(服务)吸引或失去客户的关键区别。将间歇性的互动变为持久关联的秘诀在于一系列精彩微交互,以及当用户需要时恰好出现的信息内容。 在设计评审流程中,应当询问每一个行动、每一次询问或者每一次数据展示是否出现在正确的时机,以确保界面在切换时传递信息时顺畅。随着扁平化设计与用户体验趋势的摇摆变化,我们能预感到页面部件缺少视觉线索的风险,因此动画能减少这种风险。 这种动效可能是颜色、透明度的变化,也可能是用猴子的手臂延伸页面这种细节,或者用户完成任务后展示太阳升起的效果。询问在UI设计中加入逐步动效的可能将极大的推动设计师改善设计,使得设计师思考时间维度的设计细节,而不只是局限在空间维度。这是一个很好的问题,我认为它是每个人都应该吸收的教训,尽管并非如此。我总喜欢提到:对用户的真实目标来说,页面或屏幕上的任何元素都不是解决方案的一部分,而是噪音和干扰。 在设计的每一步中,我们都需要自问:我们如何能够创造更小思考成本下能发挥同样作用的产品?在设计评审中,这是要求把方案简化的最佳表达。在设计中保持界面清晰很重要,使用尽可能少的点击、文案和输入框来达成目标更好。踏踏实实的把用户需要完成工作的消耗降到最低,用户会感激不尽。我们认为,很棒的产品描述(比如产品手册)对用户来说就跟“坐在60码时速的车上看到的广告牌一样”,UI设计师们比较难理解用户是如何忽略这些产品界面细节的,尽管设计师为此付出诸多努力。 优秀的设计评审放慢节奏,考虑每个元素,但是能认识到这些设计细节可能不会被用户注意到。如果参加评审的人员在颜色、字体及体验设计方面没有专业知识,他们可以考虑以下重要因素:经验告诉我,不要试图一概而论。例如我会问“我不确定开放的banner是否足以传达品牌?”,而不是问“哇,用户根本不会理解我们的品牌价值。”这就是为什么我认为每个设计师应该花时间观察用户并且使用自己的产品(又称可用性测试)。

    2017-05-18
  • 帐号与登录那点事

    帐号对于每一个互联网网民都是不陌生,只要我们还在上因特网,就几乎离不开帐号。有关帐号系统与登录方式的设计,成功与否,直接关系到用户利益的保护以及对服务的体验。如果是一个注册流程各种不顺畅,登录状态不稳定的服务,用户迟早是要用脚投票的。 也不知道什么缘由,自打入行以来,就参与好些项目的帐号系统建设,从最基础的用户名密码到标准OAuth再到关联登录,中间自然也是踩着各种坑走过来的,所以也算有感而发,整理之,记之。

    2017-05-30
  • 产品上线了,你咋都不好意思说是你设计的

    对于界面来讲,我们设计师过于关注设计的美观度,而忽略了图片和文字的内容的真实性。而界面内容的真实性相当关键,这往往关乎自己的设计最终能不能高还原度地呈现。

    2017-05-21
  • 微信Axure原型练习和资源分享

    “我根本没把你放在眼里。”“因为你一直在我心里。”▼这是咸冬日的第叁篇文章这两天业余时间学习了axure的基本功能,做了一个简单的微信原型练练手,教程分享给大家。首先需要准备基本素材,可以从我的源文件中获取。1.设置手机主页和home热键用例。2.拖入内联框架(w273*h482),设置从不显示和隐藏边框,并链接到主页。3.设置主页交互:1)主页内拖入动态面板“内容区”(273X396),并增加4个menu状态(微信、通讯录、发现、我;...

    2018-03-10
  • 全面揭秘!详析 Adobe XD 的团队内部使用的设计思考流程

    你有没有想过,如果有一种通用公式,能让你设计出创新性的产品、用户体验或服务,这世界将会发生什么? ——我指的可不是那些慢吞吞的递进式优化,我要说的是"破坏性"的革新! 可能你觉得我说的不太现实,好吧,我承…

    2016-10-18
  • 几乎是最完美的用户体验模型—CUBI

    【导读】我们都希望能做出引人注目的创意项目——能解决业务问题,同时通过有意义、有价值的体验吸引用户的项目。然而,紧缩的预算以及紧张的时间安排,都给创造真正新颖的设计、确定设计流程中的遗漏,以及充分考虑…

    交互设计 2015-04-24
  • 极有可能被低估的三种有趣的网页设计趋势

    设计出不同凡响的网站是许多设计师一直追求的事情,所以大家着迷各种时尚的元素,漂亮的配色,流行的趋势,复古的样式,等等。经过时间验证的经典设计、固定的搭配是不错的选择,而逐步展露头角的新趋势,则能更好的满足这一需求。

    2017-05-26
  • 用户体验设计中最常见的误解

    UX Myths网站收集了很多关于用户体验设计中最常见的误解和解释了为什么他们不适用。现在将这些经验研究整理出来,为各位设计从业者做参考,避免依赖个人的主观经验来做判断。建议你阅读完之后,还是应该结合自身的经验来审视你的设计是否满足用户的需求。

    2017-05-25
  • 总结|2017年的5个网页设计趋势

    几何图案与全屏背景图结合、灰色的高级用法、色彩叠加……这篇总结的这5个网页设计趋势,其实在年底就初现端倪,所以2017年大面积运用几乎势在必行,想不落人后记得打开阅读哟。

    2017-05-08
  • 交互设计创新之改变用户行为的设计

    这是百度MUX在IXDC2016北京前瞻活动『移动产品的交互设计创新』中的一次分享。 这个课程属于团队内部一个培训课程的一部分,是关于HCI用户认知结合交互设计项目管理的内容方向。该文章阐述了讲说Keynote的核心内容…

    2016-05-08