Biaobiaoqi的博客

《写给大家看的设计书》

| Comments

从 iOS7 的扁平化谈起

昨晚看了 WWDC2013 的直播,iOS7 以扁平化 UI 的方式展现在世人面前。于是接下来进入了微博吐槽时间。

大象要跳舞是很难的,这正是苹果面临的情况。现在无论是 Android 还是 Winphone,与 iOS 系统体验上的差异已经不是难以企及的,甚至有些方面更能为大众接受。于是 Ive 带领他的团队开始拥抱 Flat Design。乔布斯子不知道会怎么想,他可是坚持了一辈子的拟物风格。当然,无论乔老爷子怎么想,时势如此,由不得苹果不变。

从微博疯狂的 iOS7 刷屏中挑出了些有价值的信息,关于扁平化和拟物化的:

看完这些已经晕头了。人的思维总是有惰性的,倾向于接受自己头脑中已经有条理的思维结果。不情愿的说,这些略显专业的介绍已经超出了我对设计的思考范畴了,我看到的只是零散的观点,而找不到源头。

于是想起了《写给大家看的设计书》。作为非设计人员,这本书够接地气。一个多月前看完,让自己对设计的认识从一个完全的小白提升为一个略有喜好和观点的小白了。还是先聊这本书吧。

设计的基本原则

读这本书之前,在不同平台上看见它的好多推荐了。不过鉴于大多数设计类书都是『手把手教你画马』的效果(详情参见下图),一直不太感冒。

怎样画马

后来码代码太烦躁,抱着试一试的态度在多看上下载了下来,一着眼便被吸引住了。书本本身的排版设计就透露着简洁明了的设计感,配色也恰到好处的清新。

全书循序渐进的从设计的四大基本原则讲起,结合丰富的案例分析,延伸到具体的主题设计技巧中。这部分是最让我觉得受益的部分。当然,不仅仅只是这些,还有涉及到颜色的运用、字体的设计等内容,本着『不要在意这些细节』的原则,它们被我匆匆略过。

可以这么夸张的说,设计的『四项基本原则』是我有自主意识以来觉得最受用的『条条框框』:

原则一:亲密性

亲密性的根本目的是组织性。还有个副产品,利用亲密性可以使空白更美观。

  • 将相关的项组织在一起。
  • 物理位置的接近就意味着存在关联。

原则二:对齐

对齐的根本目的是使页面统一而有条理。不论创建精美的、正式的、有趣的还是严肃的外观,通常都可以利用一种明确的对齐来达到目的。

  • 任何元素都不能在页面上随意安放。每一项都应当与页面上的某个内容存在某种视觉联系。
  • 对齐的项会形成一个内聚的单元。
  • 居中对齐显得正式、稳重,但一般不要用居中对齐。
  • 一定要坚持页面上只使用一种文本对齐,避免混合使用多种文本对齐。
  • 可以适时的打破规则,但在此之前得清楚什么是规则。

原则三:重复

重复的根本目的是统一,并增强视觉效果。

  • 设计的某些方面需要在整个作品中重复
  • 重复是一种全局的一致性,比如杂志每页的标题都使用同样的字体大小。这有利于信息的组织。
  • 重复也一定程度给作品带来专业性和权威性。
  • 要避免太多的重复,重复太多会让人厌烦。注意对比的价值

原则四:对比

根本目的有两方面。一个目的是增强页面效果,如果一个页面看起来很有意思,往往更有可读性;另一个目的是有助于信息的组织。

  • 如果两项不完全相同,就应当使之不同,而且应当是截然不同。
  • 对比一定要强烈。

应用设计原则

优秀的设计就这么容易:

  • 1.学习 4 大基本原则;
  • 2.认识到自己没有运用这些原则;
  • 3.应用基本原则。

这四个基本设计原则是相互关联的,只应用某一个原则的情况很少。当对应着一个个的举例体验过四条基本原则的威力后,接下来就是在自己身边实践这些原则了。

一方面,可以观察四项原则在现有设计中的应用:比如当前所打开的网页,是否足够清晰、明确的展示了它所要表达的意图;手头的书本,排版是否跟内容在情感上吻合。

另一方面,时常会有些文档、写报告、为展示写 slides 的需求,自己在创作的过程中,也可以应用起这四条原则,慢慢体会,慢慢修炼。

体会

歌德在《浮士德》中提到过这么一句话:『理论是灰色的,生活之树常青』。在我看来,所有的事物都是如此,人性使然。抛开这四条原则本身,它们归结起来都是要实现意图的传递:

将信息从设计者准确无误的传递给目标用户

设计作为一种原始信息的载体,本身的形式上会带来附加的信息量,如何让这些设计自身的附加量不混淆了核心的原始信息,是设计好坏的根本。更进一步,设计的更高层次应该是让设计的附加量起到正相关的增益效果。《写给大家看的设计书》中的四个原则正是最基础的实践。

现在是信息的时代,信息量的暴增让信息的简洁展示和选择变得越发关键。前文提到的扁平化的设计风格的崛起,就是一个例证:

『扁平化设计具有一种给你让人心醉的美丽,没有大量的修饰,它能以一个简单直白的方式传达一个信息或者帮助一个产品以及思想变得更加深入人心……扁平化设计正是通过放弃任何附加效果的方式,创建一个「零」3D 属性的设计方案。在这里,没有阴影效果、斜角、浮雕、渐变等其他方法来帮助元素产生相对于屏幕的凹凸效果。不带有羽化边缘以及阴影效果的图标和 UI 元素也都看起来非常鲜明。』

相对而言,乔布斯推崇的拟物风格中,所秉承的是让所有用户能快速的学会如何使用它。而随着时代的发展,这种降低学习成本的方式渐渐的不是必须,数码产品充斥着生活,大多数人已经有足够的经验来应对新的操作体验。从这个角度讲,扁平化在现阶段或许是更有好的选择。

不管怎么样,WWDC 以后,苹果股价已经持续下跌了,祝福苹果吧,希望 Ive 不要成为苹果的罪人,据说他是最懂乔布斯的人呢。