随本索源探讨Metro风格

分类栏目:用户体验 - 用户研究

29082

发布于 10 条评论

BannerForBlog

Metro风格的起源自瑞士国际主义平面设计

虽然扁平化的设计在metro风格之前已经存在,但真正引起人们注意的,正是它的诞生。Metro风格是从Segoe字体开始的。Segoe是一款西文无衬线体,为微软公司诸多新产品中用户界面的字体。Segoe的设计灵感来自于Helvetica和瑞士国际主义平面设计,它的设计像是一种简单而又能准确传递信息的工具。没有多余的装饰和移动部件,Segoe是一种呈现清晰、准确和的新方式。

1-Segoe-helvetica

Segoe与Helvetica

2-Switzerland-design

瑞士国际主义平面设计

瑞士国际主义平面设计与Metro风格设计共性

由于metro风格是由瑞士国际平面主意设计发展而来,经过类比,惊讶地发现两者有惊人的相似之处:他们的设计目的均为单纯,易于识别。风格简单明确,传达功能准确,追求几何学式的严谨。采用非对称的版面组织方式。对齐方式使用左齐,右长短不一的对称方式使用方格网为设计基础。形成高度功能化,理性化的设计风格。使用无饰线体作为主要的设计字体。

3-windows8

windows8启动界面

4-Switzerland-design

瑞士国际主义平面设计

从瑞士国际主义平面设计的局限性到metro风格界面的局限性

正所谓针无两头利。瑞士国际主义平面设计的优点正正是他的缺点所在。 首先瑞士国际主义平面设计作品的要求必须是客观的非个人的设计。个体偏好、顾客的特殊要求、宣传的压力都应该漠视不顾。唯一的标准是视觉的力量与效果。过分的理性化与公式化导致了个人性化的过道泯灭。忽略了普罗大众对于情感化的需求。 其次瑞士国际主义平面设计形式为数字网格注重数学逻辑和理性思维缺乏感性的思想给设计者造成很大的局限。不利于思维的发散而且形成的版面过于死板、拘束缺少更为自由、更为个人化的特点。

5-grid-design

网格设计

最后瑞士国际主义平面设计发展到美国后渐渐背离了设计先驱们的初衷。它渐渐变成了一种风格而不是一种动机成为了虚空的形式主义。

以史为镜,可以知兴替,根据瑞士国际主义平面设计的消亡可以得出关于metro界面的局限性。

6-win8-design

优秀win8设计

1、个人情感主意的抹杀。不同与ios的拟物化情感化设计。Metro风格对于质感作了最大限度的抽象化。界面设计上对于高光,阴影这样的基本元素都作了舍弃。纯粹的平面设计风格到底是不是用户想要的呢?当真实世界与互联网世界完全割裂的时候,未来的界面设计,到底是不是一个与真实世界没有交集的平行性视觉体系?

2、过于严格的网格式排布对设计者造成很大的局限。首先不能否认的是网格设计具有良好的指导性,会使界面更加整齐划一。但使用网格并不意味着枯燥的设计,一个好的设计师不仅能够合理地应用基于网格布局的规则,而且还能适时地打破这些规则。但是当规则不能破的时候,如何展开一个有创造性的设计?

3、增加认知和学习成本。当信息以他本来的面目完整地展示到我们的面前的时候,我们如何快速区分这些信息?目前metro界面使用了色块来快速定位相应的模块。但是如果是色盲患者呢?他们可以看到的,或者是以下这张难以辨认的图。

8-windows8-ui

正所谓穷则变,变则通。从metro的起源瑞士国际主义平面设计中,我们已经看到了危机与机遇。如何化解相应metro风格下的界面设计呢?其实在诸如无印良品与宜家的相关设计里面,已经可以找到相关的答案。在去繁求简,信息明了的基础上,开放布局,适当增加质感,添加人性化的味道。如下图,同样是信息的直接罗列,但是使用图片带来自然质感。板式灵活,在规矩中与简洁中带来不一样的味道。

7-wuyin

目前为止metro风格的延续与发展还是一个不明朗的疑问号?他或许是现今ui趋势的一个颇为强大的分支。但是它会像科幻电影中未来的界面,到处充斥着由metro风格演化而来的简单的线条与图标信息?我想还是个未知数。

全部评论 / 10

  1. 文章页面的作者名称都是可以后台自定义的是吗?

    8
    1. Javin

      是可以自定义

      1号 Javin 2013-06-07
  2. 在人机交互时间和场景越来越多的情况下,简洁明了的风格会成为趋势。拟物化的存在完全是减少学习成本所存在的,就像文中说的那样,可识别性,因为第一次接触的时候拟物化设计很人性。但是一旦人机交互达到一定的程度,学习成本也就不需要了,现在小孩子都会用ipad iphone,以后学习成本会大大减少,metro或者叫flat design绝对是主流。

    6
  3. 中文很难找到很好的字体来做Metro,像是最简单的header用文字表达的话英文就比中文好看的多。

    teemo 2013-06-07
    5
  4. metro风格很不错,但有时就是感觉太平了。

    攻城师 2013-06-07
    4
  5. 这个主题不错,有下载的吗?

    3
  6. 这种风格挺新颖的

    2
  7. 好文章~~

    木公 2013-06-07
    1