谈谈用户界面中扁平化设计

扁平化设计在当下的用户界面设计界是很有争议的，微软的Metro风最早将其介绍给大众，之后有了很多人跟风，比如LayerVault、The Next Web以及更多。许多设计师从最开始就不看好这类设计，主要是因为在稍微复杂一点的界面中，扁平化设计会带来很多困扰。

扁平化设计既漂亮又清新，设计起来快，也更容易响应。如果只是绘画上的设计趋向可能会被广为接受，但是网页设计者总是对易用性持有很高的关注度，因此总会觉得扁平化设计天然的就有缺陷。

下面这张图从左往右分别是苹果、Google和微软的设计美学展示，三家走了非常不同的路线。

中庸之道是解决复杂争端的最好办法。妥协对观点鲜明的人来说很难，但是最终受益的还是大众。在这一例中，受益的大众就是产品的用户。

有一个办法，那就是把扁平化设计的优势都抽出来，应用到高度复杂的用户界面中去。至于具体怎么做，可以参考Google现行的界面设计语言。Gmail(web+iOS)，Google Maps(iOS)和Google+(iOS)都是非常好的准扁平化设计的例子。

大多数情况下，这些界面都遵循扁平化设计的原则：扁平色块，没有阴影，利用颜色鼓励用户去进行交互(比如Gmail中的红色按钮“写邮件”)。但是仔细看时，你会发现这个红色按钮其实是有很小的弧度的。这道弧度就像是“嘿，快点我!”而不是“哇哦，我看起来诱人的就像糖果一样!对了你还可以点我的。”这类微妙的功能可见性是准扁平化设计的重要组分之一，也是其优于真正的扁平化设计的一大特点。

准扁平化设计自然也不会忽略深度的概念。相反的，适度加入深度的元素可以促进用户对界面的理解。但是就像弧度一样，深度元素的融入也需要仔细斟酌，才能让信息从平面中跳离出来，但又不会破坏扁平化设计的氛围。

准扁平化设计的例子不单有Google，新版MySpace也采用了这种看起来扁平，但是当你把鼠标移过去就会出现“快点我”的弧度。Letterpress，这款大师之作的游戏，虽然有些人说是扁平化设计，但是也采用了阴影设计来改进交互体验。还有自最开始就一直不怎么用弧度设计的Facebook，也用阴影来分隔覆盖图和其余页面。

iOS的未来应该会同繁复的拟物化设计渐行渐远，微软的Metro在易用性也有硬伤，设计的未来可能属于准扁平化设计这类兼具易用性和高效率的设计语言。

网友点评：

黑白：对于平铺的大量内容，阴影渐变是很有效的组织秩序的方式，通过颜色组织秩序只在视野中央有效，视野周边几乎没有颜色感知细胞，这也就决定了难以产生整体稳定的秩序感。想想我们周围的世界如果只有颜色纹理形状，而没有阴影渐变会是多么难以辨认，ios 反对的似乎是对实物诸如纹理特征等与视觉心理无关的模仿，并不等于扁平化～而且阴影渐变形式还有很多潜力可挖呢～

注：产品中国