佛山网站设计必须考虑扁平化设计不良影响的问题
扁平化作为一种风格没有问题,可是任何风格运用过分都是问题。
说起界面规划里对扁平规划,主流感触都是正面的,似乎很少有人提出它有什么问题。扁平风格在这个精约至上的年代表现了契合潮流的审美,可是它是否真的能够给用户体会带来价值?一味的寻求扁平化是否会对可用性形成负面影响?
视觉风格可能对可用性形成出乎预料的影响,这是我长期持有的情绪,之前颇受争议的无框界面一文也来历于此。前段时刻刚好在Nielsen Norman Group上看到有人做出了较为可信的试验研究,其成果也刚好证明了我的观念。
Kate Meyer 的眼动试验
试验将实在的网站的页面改形成强化版(非扁平化)和轻量版(扁平化)两个版别。相对与轻量版,强化版页面用户运用了更强烈、有深度的视觉款式来着重可交互元素(按钮、衔接、页签和滑块)。
例如下面两个页面分别是一个旅馆网站的强化版和轻量版:
强化版
轻量版
包含上例在内,试验总共选取了九个相对不错的网站(都不算特别杰出或特别糟糕的规划),涉及六个职业:电子商务(书本、墨镜和珠宝出售)、非盈利网站、旅馆、旅行(轿车租借和航班查询)、科技和金融。
每个网站都有一个适宜试验使命,这样就能够在用户执行使命的一起调查用户的行为。例如,旅馆网站的使命描绘是这样的:
你将看到一个旅馆的网站。你要预订看见的房间,请通知我们你决议要点击的当地。
一切网站的图片和使命信息太多,就不放在这儿了,感兴趣的人能够去这儿看。
总共有71个一般的网络用户参加试验,他们每人都被要求用所提供的悉数九个网站(随机选取两个版别中的一个)完结相应的使命。
试验进程很快,用户先阅读使命,然后环视看到的页面,看到他们想要点击的方针他们就说「我找到了」,一组试验便到此为止。
用户找到方针所花费的时刻以及进程中注意到的方针都会被记录下来(后者用到了眼动仪)。
试验成果
统计发现了两个要害点:
运用轻量版的用户比运用强化版的多花了22%的时刻找到方针。
运用轻量版的用户比运用强化版的多出25%个视野焦点(原文用词是 Fixation ,指的是当用户看到页面上感兴趣的点是发生的注视)。
这两个要害点意味着,轻量版/扁平化的规划让用户花费更多的时刻来在页面上寻觅方针,而且需求调查更多的元素才能够找到方针。
这是一个使命方针十分明确的试验,参加者并不会觉得页面美观就停下来赏识。所以花费更长的时刻和调查更多的东西所代表的不是「沉溺式的体会」,而是寻觅进程中更多的尽力和找到后的不断定。
扁平化的问题在哪?
1. 弱化了信息结构
扁平化呈现之前,我们有各种手法来描绘信息之间对层级联系。扁平化呈现之后,这些手法都被视为「剩余的装饰」。一味地寻求极简,把各个元素都同等对待,这样反倒给用户形成了更大的了解担负。
下面这个轿车租借网站的视野热门图能够让你感触到显着的区别。强化版的视野焦点显着比轻量版的更少一些,也就是说用户在轻量版的页面上看了许多当地,才终究找到使命方针。
左为强化版,右为轻量版
他们的不同在哪呢?比照下图的两个页面,你会发现比较轻量版,强化版的首要特征是:
用暗影着重了界面之间的层级:表单卡片、背景图和右侧列表之间的联系;表单卡片顶部页签的状况。
用渐变色着重了界面上的重要元素:导航、按钮和文本框。
你会发现,扁平化尽管让页面看起来视觉作用更清爽了,可是却更难了解了。
上为强化版,下为是轻量版
2. 省掉了点击暗示
历史上,下拉框/高亮色几乎是文本链接的必备款式。后来跟着文本链接的运用越来越广泛和普遍,许多界面开端摒弃特别款式,让文本链接看起来和一般文字的不同越来越小。
扁平化兴起之后,这种趋势愈演愈烈,有时乃至连要害的文本链接都被省去了特别款式。如果是百科类网站里的名词链接,做轻量一点的确能够进步可读性。可是如果是在阅读信息之外的,功能比较要害的文字链接,去掉特别款式之后反倒可能让用户认为此处不可点。
下面这个珠宝出售网站的视野热门图最大区别在于底部那两处视野焦点的比照。
左为强化版,右为轻量版
下图是视野焦点相差较大区域的界面比照。
左为强化版,右为轻量版
这个界面的使命是寻觅珍珠的相关信息,也就是说,用户的使命方针就是上图那段话底部的文字链接。
问题就来了,从轻量版的视野热门图能够看到,用户在写有“珍珠”的标题上看了很久很久,而在真正的使命方针,即底部的文字链接上逗留的时刻却不长。
扁平化的风格让整个页面的视觉风格愈加一致和谐,可是却可能一不小心就把点击暗示给省掉了。用户可能需求更屡次地调查,并合作鼠标的悬停作用,才能断定哪里是标题、哪里是点击区域。
扁平化就必定欠好吗?
上面的试验成果是,大部分强化版的可用性都比轻量版好要,除了以下这个网页(左面是强化版,右边是轻量版)的相差十分小。这两个界面的首要不同仅仅是文字链接的颜色和下划线。
可是这个试验毕竟是有限的,我并不认为扁平化就必定欠好。
扁平化的界说
扁平化(Flat Design)作为一种以视觉为主体的规划理念,自身的界说就十分含糊和理性,也没有拟定任何规模和极限。这个理念被传扬的方法通常是认出几张很美观的图,没有暗影、层级和剩余的装饰,大家觉得美观便对扁平化发生了好感。
一个乃至不能被精确解说的东西,明显就不可能被彻底否决了。所以我并不想说扁平化欠好,可是关于这种含糊的方向,必定要掌握好轻重,防止过为己甚。
半扁平风格
任何东西,过分了都欠好。许多优异的规划,尽管大体上也是扁平化的,但都不是朴实的扁平风,我这儿先用「半扁平」称号它们(参阅:Flat Design: Its Origins, Its Problems, and Why Flat 2.0 Is Better for Users)。
这也不是什么新鲜的风格里,比方下面这种图标你必定老早就看过了。
大厂牌的规划,尽管都在潮流中扁平化了,但大多也不是市面上常见的纯扁平风格。
例如经历过画风骤变的 iOS 到现在也没有毛玻璃和大暗影这种非朴实的扁平款式。
再比方说谷歌的 Material Design 要害特征就在于用实在国际的暗影资料层次感。
苹果和谷歌的规划师明显知道盛行趋势是什么姿态,可是在可用性和盛行趋势之间,他们不是一味地跟风或是凭空捏造,而是进行了取舍和平衡。
可用性的要害仍是交互
理想中,交互款式决议界面好欠好用,视觉款式决议界面好不美观。可是实在国际十分复杂,许多情况下视觉款式会对交互款式发生影响。
扁平化原本只是一个视觉趋势,对界面可用性影响最大的应该是交互计划才会。可是有的规划将扁平化用的过分,盲目地学习一些十分理想化的扁平化典范,导致对可用性发生了影响。
可是大体上,对可用性发生最直接影响的仍是交互规划。所以要保证规划出来的页面不被过度的扁平化连累,首先要在交互规划阶段打好根底,然后才是在视觉规划阶段掌握尺度。
总结
扁平化作为一种风格没有问题,可是任何风格运用过分都是问题。面临这类十分含糊的规划理念,规划师应该掌握尺度,冷静地将视觉作用和可用性区别对待。
博象是专业佛山网站建设、佛山建站、网站制作、网站设计、网页设计、网络营销、网站运营、百度竞价排、品牌策划
、
企业管理咨询名托管的优质企业
联系方式:
广州热线:020-81122189, 佛山热线:0757-85905233
客服QQ:853233398,客服微信:MZ853233398
微信:boxiangchina