创立于2004年的莹晨设计
为北京传诚信旗下的网站建设高端品牌,专注于HTML5自适应设计及响应式网站设计
京ICP备05019839号
京公网安备 11010502031691号


无论是Web还是移动app,位于界面内容当中的加号图标通常用来表示该内容可以扩展查看更多信息,有时还会搭配箭头图标同时使用。通过加号来触发其他类型的功能很可能破坏用户所习惯的预期。

见过的app越多,你越会发现,在不同的环境当中,加号图标往往会代表各种不同的功能。当加号位于导航栏当中时,通常表示“新建”功能;如果被放在列表单元当中,要么是表示将这条内容添加到某种分组当中,要么是用来展开详情。无论是在同一个app的不同界面,还是在不同的app之间,同一元素承载着不同的功能含义,这对于用户的认知与记忆都是一种负担。

iOS中UI元素加号(+)图标的优化

加号图标的可用性在很大程度上取决于它在界面当中所处的位置。当位于导航栏时,加号通常能够表达准确的含义,即创建一条与主要内容相同性质的新内容。然而,当加号出现在主要内容当中时,多种含义的可能就会给用户带来迷惑。

举个例子,Any.do曾经的一个版本当中,会在待办事项分组标题右侧放置加号图标。在这个环境下,你不知道点击这个图标是会展开其中的全部事项,还是会在这个分组中创建新事项。在最近的一个版本中,他们将加号放在了界面右上角,明确的用于创建新事项。

iOS中UI元素加号(+)图标的优化2

无论是Web还是移动app,位于界面内容当中的加号图标通常用来表示该内容可以扩展查看更多信息,有时还会搭配箭头图标同时使用。通过加号来触发其他类型的功能很可能破坏用户所习惯的预期。例如,在LinkedIn的app当中,取决于所在位置的不同,嵌套在圆环当中的加号图标代表着关注或是加入某小组的功能。在我们的可用性测试当中,很多用户抱着查看详情的预期去点击该按钮,却发现自己关注了对方动态,进而感到莫名其妙。

iOS中UI元素加号(+)图标的优化3

取决于产品类型及目标用户行为习惯的不同,你的app当中的加号图标可能最适于表达某个特定的功能含义。无论怎样,要尽量避免在app当中随处使用,因为取决于所处位置的不同,用户确实很容易将其理解为不同的含义,或是抱着一直以来习惯的认知进行操作而导致与预期不符的结果。

鉴于加号图标所存在的一些可用性问题,我们建议:

  • 导航栏是一个相对安全的位置,而在其他位置使用加号按钮则需通过可用性测试来确保用户能正确的理解你想表达的功能含义。

  • 要彻底避免加号图标带来的潜在问题,不妨彻底避免使用它,取而代之的,通过箭头来代表详情扩展,通过简单明确的文字按钮来清晰准确的传达其他功能含义。


 
QQ咨询 点我
咨询热线
400-697-8610
咨询热线
010-62199213