扁平化设计技巧:中空的图标用户体验

发布时间：2018-05-17浏览次数：1095 <p> </p> <table style="BORDER-RIGHT: #cccccc 1px dotted; TABLE-LAYOUT: fixed; BORDER-TOP: #cccccc 1px dotted; BORDER-LEFT: #cccccc 1px dotted; BORDER-BOTTOM: #cccccc 1px dotted" cellspacing="0" cellpadding="6" width="95%" align="center" border="0"><tbody><tr> <td style="WORD-WRAP: break-word" bgcolor="#fdfddf"> <font color="#ff0000">网页制作Webjx文章简介：</font><font color="#000000">扁平化设计反思：“中空图标”很难被理解吗？</font> </td> </tr></tbody></table> <p><img alt="1" width="842" height="480" src="http://www.webjx.com/files/allimg/131216/2034290.jpg"></p> <p style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; COLOR: rgb(82,82,82); FONT: 1.2em/1.8 Tahoma, Verdana, 宋体; MARGIN: 20px 0px; ORPHANS: 2; WIDOWS: 2; LETTER-SPACING: normal; BACKGROUND-COLOR: rgb(255,255,255); TEXT-INDENT: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px">随着IOS7的发布，苹果的界面做出了有史以来最大的改变。IOS7的设计语言强调了高光、极简，包括所有的按键以及app图标。</p> <p style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; COLOR: rgb(82,82,82); FONT: 1.2em/1.8 Tahoma, Verdana, 宋体; MARGIN: 20px 0px; ORPHANS: 2; WIDOWS: 2; LETTER-SPACING: normal; BACKGROUND-COLOR: rgb(255,255,255); TEXT-INDENT: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px">这个改变使苹果的操作系统更加时尚、简单，同时也影响了人们对扁平化的理解。当然有人欢喜有人愁，一些人对此颇有微词，认为这一改变并没有使IOS系统向好的方面发展。</p> <p style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; COLOR: rgb(82,82,82); FONT: 1.2em/1.8 Tahoma, Verdana, 宋体; MARGIN: 20px 0px; ORPHANS: 2; WIDOWS: 2; LETTER-SPACING: normal; BACKGROUND-COLOR: rgb(255,255,255); TEXT-INDENT: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px">使用IOS7的用户都知道，这款操作系统中所有的图标都是简单的线条构成，也正是这种“过于简单化”的设计引起了重大争议。尽管现在这些图标被广泛的应用在手机app上，但是还未被全面接受。它们需要被理解，但是至今好像没有做到。</p> <p style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; COLOR: rgb(82,82,82); FONT: 1.2em/1.8 Tahoma, Verdana, 宋体; MARGIN: 20px 0px; ORPHANS: 2; WIDOWS: 2; LETTER-SPACING: normal; BACKGROUND-COLOR: rgb(255,255,255); TEXT-INDENT: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px">软件设计师Aubrey Johnson写了一篇文章，说他们并不是为了简单而简单：“中空的图标更容易为用户所接受。” Audrey认为复杂的形状用户难以理解，简单的元素用户反而更能接受，并且轻量化的可视元素意味着更快的解析速度，因而用户能快速消化。这一观点看上去似乎非常重要，但是不是每个人都赞同。<br>例如Bobby Solomon，他写了一篇文章说：“你脑袋里的符号没有一千也有一百多个了，中空图标肯定会让你把它们弄混淆。”他认为中空图标缺乏辨识度，不容易与其他的图标区分开。</p> <p style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; COLOR: rgb(82,82,82); FONT: 1.2em/1.8 Tahoma, Verdana, 宋体; MARGIN: 20px 0px; ORPHANS: 2; WIDOWS: 2; LETTER-SPACING: normal; BACKGROUND-COLOR: rgb(255,255,255); TEXT-INDENT: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px">Bobby还指出“中空图标”的也是一种语言，它必须让我们每天使用的时候都能理解，一个简单app的图标绝对不会有这么大的信息量。在交互界面设计中，图标需要易于理解&#8212;&#8212;不管我们是否熟悉。<br>另一位设计师Caesar Wong在这次讨论中强调了“图片是怎样被眼睛接收“这一理念，他个人认为现在的讨论方向跑偏了，更偏向于艺术而不是科学。</p> <p style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; COLOR: rgb(82,82,82); FONT: 1.2em/1.8 Tahoma, Verdana, 宋体; MARGIN: 20px 0px; ORPHANS: 2; WIDOWS: 2; LETTER-SPACING: normal; BACKGROUND-COLOR: rgb(255,255,255); TEXT-INDENT: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px"><span class="wp_keywordlink_affiliate">扁平化设计</span>任重而道远，你觉得呢？哪种图标更容易给人好的第一印象？请在下面的评论里告诉我们吧~</p>