影响至今的“大众化”设计美学———Metro 扁平化

查看 230|回复 21
作者:TermyTracker   

影响至今的“大众化”设计美学———Metro 扁平化
   
  上篇图文介绍了“梦核”的美学代表之一——Frutiger Aero,得到了很多读者的点赞,我很高兴![坏笑]其实今年我原本是要写 Windows Vista 的,但在实体机取材的时候因为遇到了一些 Bug,没法得到好的体验,所以原本的草稿就废掉了[发怒]
  不过好在我寻找到了新的灵感,也就是今天要向各位讲述的内容:Metro 扁平化风格[欢呼]
  这个灵感源于我前不久在 BH 的 Webmaster 那里收了一台 Lumia 930,里面搭载了 Windows Phone 8.1 系统(后被我升级到 Windows 10 Mobile v1709)。Windows Phone 系列一向一以简洁而超前的 Metro UI 为卖点,收割了很多扁平化爱好者,其中我也被这种前卫的创意给吸引到了[掩面笑]
  于是我打算趁着对 Windows Phone 的热情,来认真的向各位讲述“扁平化”的诞生及流行过程
Part 1 落地生根,但烂了
  如果你认真阅读了上篇图文,你一定知道 Frutiger Aero 走向消亡的时间:2013 年
  事实上,早在微软将 Frutiger Aero 推进赛博坟场的三年前,就注定了扁平化会成为微软主流设计风格的现实了[表面开心]
  Windows 虽然仍在 PC 市场占有相当的优势,但在移动端市场中,iOS 与 Android 等这种更多样的移动端系统的崛起,给 Windows 子系列 Windows Mobile 这个老套系统了一次“当头一棒”。于是微软坐不住了,在 2010 年,微软速速推出了他们的新型移动端操作系统——Windows Phone 7
  WP7 没有效仿当时流行的拟物化风格,也没有用微软率先提出的 Frutiger Aero 风格,而是大胆地将 UI 拍扁了,仅用简易线条来勾勒出各个图案,变成了一个新的 UI:Metro UI,并且使用了一种可自定义排版的方形图标——也就是磁贴[受虐滑稽]
  磁贴的诞生,也标志着 Metro 扁平化在微软产品中的首次诞生
  为什么叫 Metro UI 呢?Metro 原有的英文含义为“地铁”,常进出地铁站的读者会知道,地铁站广告都是投放在一块块规则方块显示屏上的,并码放整齐。而微软设计出的磁贴,灵感就是来源于地铁站广告屏,再结合其 UI 拥有地铁广告观感上的简洁、扁平感,微软便将其命名为 Metro UI
  不过当年的 WP7,貌似并没有深受人们喜爱,甚至到后续的 WP8 和 8.1,Windows Phone 的使用率也并不理想[流汗滑稽]
Part 2 迫不得已,再启动
  2010 年代,“平板电脑”成为了“畅销”产品。微软似乎也想分到一杯羹,便产生了 Windows 8[二哈]
  如果你有第一代 Surface,你就知道早年的 Win 板们有多菜了,面对 Aero 高斯模糊的渲染问题,微软为了让平板的性能更佳,竟让 Win8 直接放弃了延续 Aero 的道路,与 WP7 一样采用了 Metro 方案[二哈盯]
  Windows 8 Build 7814 是 Win64 系统使用 Metro UI 的开端
  从 Windows 8 Preview 一直到正式版 build 9200,甚至是再往后到 Windows 8.1 正式版 build 9600 ,我们对其 UI 总有一种很熟悉但又很奇怪的感觉[哼唧]像 8.x 最具代表性的全屏开始菜单背景,虽说微软当时确确实实在尝试把界面扁平化,但又总是保留着原先 Frutiger Aero 那点元素(例如光影,花草),进而在模糊但存在拟物化的基础上实现扁平化[耐克嘴]
  而这种别扭的设计后续也被人们命名为:Frutiger Metro
  Frutiger Metro 常被看作是 Frutiger Aero 的衍生体,是拟物化向扁平化的过渡,不过也因为 Frutiger Metro,8.x 的设计看起来十分割裂[t耐克嘴]
  很让人惊奇的是,Frutiger Metro 即便是个过渡产物,竟然也流行过一段时间。记得我幼儿园的时候,教学楼墙壁上的画就是 Frutiger Metro 风格的[偷看]
Part 3 完全进化,不挽留
  Frutiger Metro 占据大众审美大概是从 2011 年一直到 2014 年,上文说到了 8 和 8.1,那记下来要说的肯定就是 Win10 啦[牛啤]
  Win10 算是彻彻底底撇清了与拟物化的关系,在原始版本 Windows 10 v1507 中,UI 相对之前绝对是有着极大的变化,几乎所有东西都扁了[二哈盯]
  在 Win10 Technical Preview 中,Metro UI 不断地在调整。其中让 Win10 彻底翻新的,是 build 10014,而到了 10114,熟悉的 UI 便扑面而来了,再往后到 10240 便就是我们的初代 Win10,完全进化的 Windows
  至此,2015 年,Metro UI 基本定型了,也算是给往后微软的设计方案立了参考。[doge呵斥]至于微软怎么将这个美学怎么广泛应用在自家产品的…其实都不用看产品,就看微软自己的 logo 吧[受虐滑稽]
  还有 Office 2016,其实 Office 上的 Metro UI 味儿也很重,而且更能看得出变化(指 2010-2016),相对于 Office 2007 这种复杂感十足的 Frutiger Aero 拟物化风格的 UI,Office 2016 显得简单多了
  那么我们可以给 Metro 扁平化下一个整体的概念:一种有鲜艳的色彩,简单的线条图案,且表达简单明了的设计美学 [牛啤]
  Metro 扁平化在微软自家得到广泛使用后,无人不知的”扁平化“美学便慢慢扩散到整个科技界。不仅 Metro UI,也有很多其他衍生的扁平化设计,例如上篇图文说到的 Material Design,扁平图案与阴影的叠加,显得更为生动[doge原谅ta]
Part 4 All in all
  Metro UI 诞生于微软大胆的想象,在经历多次辗转变化后演化出了 Metro 扁平化美学并成功得到反响。一直到现在,Metro 扁平化也一直是微软设计的参考对象。即便现在 Windows 11 这个 UI 叫 Fluent UI[流汗滑稽](又称塑料玩具质感 UI[t耐克嘴])。但设计灵感也或多或少离不开 Metro UI
  其实 Metro 扁平化的诞生,个人认为也和现实生活节奏变得越来越快有关[表面开心]现代人们越来越不像以前那样,能有一段安稳的时间来获取一些信息,而是尽可能收集碎片时间来完成对信息的获取,这就要求信息做到简洁易懂,久而久之人们的观念便开始以“简单”为主了,审美同样也变得“简单”——于是便有了符合人们标准的 Metro 扁平化[doge笑哭]
  Metro 的诞生也有十几年了,我们的生活节奏也比十几年前更快了,所以 Metro 扁平化是否还能再坚持数年呢?[牛啤][玫瑰]
*Article is written by Termy
Easter Egg:
  其实早在 20 多年前,1999-2001 年这段时间吧,微软就有过做扁平化的打算了…呃,就是很像,但当时也确实没这个概念[受虐滑稽]
  Windows XP Beta 在 build 2257-2419 这段时期中,一些 UI 也具有上文所说 Metro 扁平化的特点[受虐滑稽]









微软, 扁平化, 美学

zjpChina   
[流汗滑稽]
Dahuangniao2007   
我是真的很喜欢wp[流泪]可惜被微软玩死了
呜月   
感觉fluent ui最符合我的口味[受虐滑稽]
几粒米   
归来仍是少年[受虐滑稽]
Einewill   
win10x怎么没有[受虐滑稽]
Einewill   
好文章[受虐滑稽]
zjpChina   
[流汗滑稽]
酷炫掉渣   
[受虐滑稽]
顺桥_PANG   
我的手机桌面是这样[受虐滑稽][受虐滑稽][受虐滑稽]
您需要登录后才可以回帖 登录 | 立即注册

返回顶部