扁平化设计这么火,会有过气的一天么?

Will flat design ever die?

文/Jerry Cao、Kamil Zieba、Matt Ellis  翻译/ONES Piece何聪聪

译者按:乔布斯曾经在很久以前评论过微软是“完全不懂品味”,但如果他知道现在苹果已经抛弃了他所钟爱的拟物设计,加入了扁平化设计的阵营,而这个阵营的创始者是微软的时候,他会怎么说?扁平化的大潮之后,下一个流行的风格又是什么?扁平化还有什么有待挖掘的潜力么?也许这篇文章能提供一些思路。

本文摘自Jerry Cao、Kamil Zieba和Matt Ellis合著的电子书《2015年和2016年网站设计趋势》。三人均来自UX设计平台UXPin。

从2013年开始,扁平化设计就呈现出燎原之势。但这真的是因为它实用,还是只是另一股昙花一现的网站设计潮流?

诚然,扁平化设计在简化网站构架和突出内容本身方面功不可没。但如果走向极端,网站就容易显得像千万美金的山顶豪宅一样高冷,格调有余,而亲和力不足。

在这篇文章中,我们将深入探索扁平化设计的风格,讲讲哪些元素是有效的,哪些不过尔尔。

优点与缺点

Zune播放器

扁平化设计最早可追溯至早期的Windows Metro(它曾被运用于Zune播放器)。这种风格光滑、快速、现代。但后来设计师意识到锦上添花并不一定会喧宾夺主、掩盖实质内容。到了今天,扁平化设计——俗称扁平化设计2.0——相比过去更加优越,适用范围更广,功能也更强大。但这种风格还是有待改进,也远不是解决所有设计难题的万能钥匙。

优点:

响应式架构:扁平化设计的流行,很大程度上归功于它简洁的页面排版,尤其是跟之前的拟真设计相比的话。简洁的排版能够提高下载速度,使断点的设置更加自然,对于无论是手机还是其他形式的响应式架构来说都堪称完美。

顺畅的浏览体验:简洁的排版还有一个优点,用户可以更方便地浏览、查阅,当然那是在有一个分明的视觉层级前提下。

丰富的配色:相比其他风格,扁平化设计的用色更加鲜亮,视觉效果更加醒目。不过现代扁平化设计中,最好还是采用简单的配色(哪怕是单色系也不错),不然,网站看上去会像是一坨俗艳的色块的堆砌。

简洁的图像设计:简洁的图像图标设计便于用户理解,有助于建立导航系统和提升用户体验。如果想要更复杂一些的视觉效果,可以试试在大幅的色块上设置虚拟按钮,或者采用高清首图。

分明的结构:加粗的线条和形状呈递出一种像建筑一般的逻辑美感。相比已被用滥了的汉堡式菜单(就是常见的那种三条杠按钮),不妨在页面顶部用清爽的字体设置一个简单的导航菜单。

易于阅读的字体设计:扁平化设计的字体风格摒除了那些华而不实的元素,确保了可读性。在花哨设计消失的同时,留下的内容也随之被凸显了出来。

缺点:

设计困难:一种常见的误解是,极简的扁平化风格运用起来很容易。但事实恰恰相反。因为界面空间有限,每一种元素都必须精心挑选。总而言之,扁平化设计很难做好,要搞砸却是分分钟的事情。

点击模糊:设计的简洁性有时会适得其反,让用户搞不清楚哪儿可以点击,哪儿不可以。

表现形式单一:扁平化设计限制了可采用的元素——比方说其中就没有纹理——同时也就限制了内容的表现形式。

时而“无趣”:有些用户,比如儿童,也许会觉得极简风格很是乏味。

缺乏个性:由于太受欢迎,越来越多的网站都用起了扁平化设计,也就导致了大多数网站看上去都大同小异。

其实运用扁平化设计最好的方法,和其他任何设计理念一样,就是关注你设计的目,而不是展现形式。从本质上来讲,扁平化设计就是提供不多不少恰到好处的辅助元素来实现对内容的导航。切记,视觉风格只是内容为王这个目标的一种衍生品。

那些不会过气的元素

尽管扁平化设计的风靡确实带有一定时效性,但我们认为其中一些核心的元素确是建立在实用性和视觉设计原则基础上的。

在其发展过程中,扁平化设计最佳的风格其实介于最早期的Metro和已经被摒弃的拟真设计之间。那些会成为经典的扁平化(或者更准确地说,准扁平化)元素中,差不多只有三分之二才是真正的扁平化设计,另外三分之一其实属于拟真设计。

图标

扁平化设计赋予了图标应有的重视。既然页面更加简洁了,设计必须真正把重心放在完善这些通常微不足道的元素的细节上面。

Iconography


如今的用户早已习惯了精致的图标,很难再接受简单粗暴的设计。而我们对于图标的使用,也更多地作为一种艺术表现形式,而不仅仅是用户点击的对象。今后各种表达网站风格和个性的方式也将会受到用户和设计师的欢迎。

字体设计

正如我们在本书中所说,人们将越来越关注字体设计的美观程度、自定义范围和使用目的。

Typography

随着首页导航菜单、巨型的字体和纯文字网站等设计潮流的出现,你很容易从设计师所选择的字体看出扁平化设计对他们的影响。

极简主义

极简主义作为一种艺术风格已有好几十年的历史,这本身就说明它具备成为经典的潜质。简单、悦目的设计对于登陆页面来说是极好的,很大程度上是因为这种风格醒目又不失实用。

Minimalism

功利地来看,由于界面上的元素不多,极简设计对于响应式断点也是个很好的选择。

单一字体系列

扁平化设计主张使用简单的字体,其中一种表现就是“一件设计,一种字体”。

Single Type Families

除了采用简单易读的字体,这种理念更多地把重点放在文字周围的设计和内容本身(毕竟这才是字体设计的真正目的),而不是字体设计上面。不过,logo仍然可以采用另一种字体来呈现,以凸显品牌个性。

色彩的运用

色彩的运用也许会随着不同的设计潮流而变化,但它的角色却并不是一个花瓶。

Color Usage

比起只是用来给网站填色,现在设计师更倾向于将色彩当作一项点睛的工具。正如我们之前说过,这跟极简主义其他的一些手法——包括大块留白和运用大图作为视觉焦点——也会起到相辅相成的效果。

那些可能会过气的元素

相比之下,其他的一些扁平化设计元素就是明日黄花了。

大多数这些元素本身很“有趣”,但要产生良好的用户体验实属不易。如果使用得当,那么单靠这些设计本身就能够成就一个很酷炫的网站,设计美观,操作顺畅,但更有可能发生的情况是弄巧成拙。

色彩杂乱:在扁平化设计中,设计师可以更自由地运用大量色彩。这本来是挺有趣的,但最终导致的结果是颜色有点太过杂乱,所以很多人又重新回归传统,只运用有限的几种颜色。

长阴影的滥用:长阴影从的风光也是好景不长。设计师仍然在使用阴影,但会选择更加温和、含蓄的风格。

主次不分:扁平化设计的一个不足之处就是缺乏主次,难以突出其中的重点元素,所以只在简单的设计中比较好使。不过现在设计师已经意识到了这个问题,采用“三分之二扁平化,三分之一拟真”的方法,以弥补在视觉层级方面的缺憾。

字体过细:在扁平化设计早期,一些字体看起来着实费劲。当年苹果选用Helvetica Neue的时候,就曾经备受争议。而现在极细或者极轻的字体已经不那么受欢迎了,倒是中等粗细的字体因为易读更加受到追捧。

话说回来,好在扁平化并不是那种“要么一无可取要么十全十美”的设计风格,可以根据实际情况取其精华去其糟粕。总体来说,不要只是照搬照抄表现形式,最好把重点放在设计风格背后最基本的一些东西上面。

结论

近两年扁平化设计貌似很火,这也不是没有道理。即使未来不久它死在了沙滩上,我们依然觉得后浪是源于扁平化设计的。

The Survival Kit

就像是叛逆时期的青少年,扁平化设计开始意识到并不是一切都值得自己奋起而攻之。2013年的时候,任何拟真设计都遭到强烈反对,但渐渐这种态度有所缓和,我们也随之看到一些拟真设计的特征开始回归业界。

细细想来,其实扁平化设计(简洁的视觉效果)和拟真设计(模拟现实的视觉效果)这两种不同的设计理念是可以和平共存的。关键在于,你如何处理好两者之间的平衡。

本文原载于Fast Company,由ONES Piece何聪聪编译。ONES Piece是一个由ONES Ventures发起的非营利翻译计划,聚焦科技、创投和商业。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,324评论 5 476
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,303评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,192评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,555评论 1 273
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,569评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,566评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,927评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,583评论 0 257
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,827评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,590评论 2 320
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,669评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,365评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,941评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,928评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,159评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,880评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,399评论 2 342

推荐阅读更多精彩内容