首页 > 网页教程 > 设计分享 > 另眼观看用户界面扁平化设计的不足之外

另眼观看用户界面扁平化设计的不足之外

时间:2013-06-24    来源:极客公园

很高兴 iOS 7 终于把手电筒和系统功能快捷开关加上去了,但是大量滥用的扁平化设计深深刺痛了我这个果粉的心,我相信老乔此刻也在九泉之下吐血。我不是扁平化设计的反对者,也不是拟物化设计的拥护者,只是认为,在不同场合、不同需求的情况下,应该用不同的设计手法,比如用户界面就不适宜大量使用扁平化设计

从用户体验的角度

先说我女儿。在她两岁的时候,我就分别把 iPad 和 Nexus 7 给她玩。她会很主动地伸手去点 iPad 界面上突出来的按钮,她能够区分清楚什么是能够点击的,哪些区域是不会有反应的;换了 Nexus 7 她就变得不知道该怎么做了,对什么地方都乱摁一通。她的认知水平还搞不清楚某些文字+色块其实就是一个按钮,经过多次尝试后才知道哪些能够点击,哪些区域点击无效。一旦换了另一个 App,她对扁平化界面的响应区域又要重新探索,如此反复。

再说我老爸,70岁,数独迷,不会玩电脑,不会上网。我不玩数独,不知道哪些数独游戏好,于是就在 iPad 上装了 n 个数独游戏,让他老人家自己选,不好玩的我再删掉。大家不用猜,拟物化取胜,扁平化都被删了,因为老人家知道哪些方块可以移动,哪些地方可以把数字填进去,铅笔、木纹、纸张、橡皮擦,对他来说也很亲切,引用原话就是“跟玩真的一样”。

反驳者会说:“懂科技的年轻人才是智能手机的主流用户,并且教育用户的时期已经过去了,人们已经接受并会用扁平化设计的界面。”那么,请做一个实验,同一个 App 设计拟物化和扁平化两套界面,让熟悉科技产品的年轻人分成两组,让他们完成一系列指定操作,看看哪个组别完成操作的反应时间更快?

人类有寻求平衡的原始意识,看见凹进去的表面就想往里面填东西,看见凸出来的表面就想把它摁平,这就是为什么让用户填的表单要做成凹进去的效果,而提交表单的按钮要做成凸出来让用户去点击,这里面都含有心理暗示。

用户界面的扁平化设计

目前很多人都认同的理解是:拟物化设计是对真实事物的模仿,用户对界面的理解源于对真实世界的经验和认知,大大降低用户心理接受门槛和学习成本。

还有一个观点是我专门针对 iOS 说的:iPhone、iPad 的产品设计都是扁平化的,拿着冰冷的金属边框,在一块平滑的玻璃上点击一个不凸出的按钮是非常不带感的。如何把真实世界的感觉呈现出来,有生活气色,让人们不会对生冷的科技产生抗拒?亲切的、有温度的拟物化设计就是答案。

这就是老乔为什么坚持在 iOS 上用拟物化设计的原因。

从设计语言的角度

扁平化设计是 2D 的,只有 X 轴、Y 轴、颜色、形状、布局;拟物化设计是有深度的,多出一个 Z 轴,还多出一个纹理和质感。丰富的设计语言给予设计师丰富的表达能力,扁平化设计就像是说话时不允许使用比喻一样乏味,于是有些地方要让人“意会”就非常难以表达。对于用户交互界面来说,丰富的表达能力尤为重要。

有人说精简后的设计语言如何作出表达是能力问题,那请问世间有几个人是设计大师?如果你雇得起,那就请大胆使用扁平化设计界面!

相关推荐
iOS7用户界面设计的10个准则分享
分析用户界面中扁平化设计的优缺点
扁平化风格的网页设计案例欣赏
什么是扁平设计?如何创建扁平化设计风格?
21个扁平化设计的动态创意链接交互样式欣赏
换汤不换药?看应用们如何“为iOS 7设计”
网页设计中如何运用圆形的搭配 让网页更出彩
界面设计教程:如何做好扁平化设计之交互篇
扁平化设计的前世今生:灵感或来自瑞士风格
扁平化:回归真实的设计
网页设计分享:如何预知未来的大势所趋?
设计完美极简风格网站的六个步骤分享
年度最佳!20个最优秀的网页设计案例欣赏
网页设计师必看:2015全球网站设计趋势推荐
扁平化设计与Material Design区别在哪里?
关于扁平化设计的五个要素
网页教程:扁平化设计的步骤和要点
扁平化设计的六点优势分析
进化中的扁平化设计还能玩出什么花样?
24款响应式和扁平化设计的后台管理界面欣赏
20个精致漂亮的视频播放器界面设计欣赏及点评
视觉设计:页面构建的审图与细节
15个超棒的无线移动终端UI设计案例赏析
响应式网页设计正成为移动互联网大势所趋
浅谈界面设计中的结构设计
分享:5招助你打造更加简洁的用户界面
浅谈界面UI设计中的包容性设计
国外精彩网页界面设计案例赏析
Photoshop教程:提高IOS设计效率的30个要诀分享
网站专题页面的视觉设计及结构布局要点分享
产品视觉设计与用户心理的有趣现象
10个漂亮实用并附带源码的Web设计教程分享
优秀移动APP应用图标设计指南
在视觉设计中对像素的深度解析
色彩情感对用户体验设计的影响

精彩推荐

热门教程