推荐给大家看的设计书

毫无疑问,这个世界设计无处不在,优美的设计会得到会心的微笑和由衷的赞赏。然而,想从事设计或在设计边缘的人们未必有机会学习专业的设计。实际上,设计不仅仅是专业设计师的事情,比如,我是从事前端的开发的,虽然绝大部分时间是和HTML、CSS、JavaScript等这些代码打交道,但我需要维护自己的blog,需要做自己的幻灯片,更重要的是需要能够理解且欣赏视觉设计师的作品并实现它。如果我懂得设计,我肯定可以做的更好更专业,并能够提出建设性的意见。我想,类似的场景不仅适于我,也一定会适于你。所以,当我看完这本《写给大家看的设计书》(The Non-Designer‘s Design Book)时,我认为它是一本可以推荐给大家看的设计书。

这本书就是为了表明“优秀的设计就这么容易”,它仅有200页,相当容易读完。为了表明学习和实现起来相当容易,只需要你完成三步就可以办到:

  1. 学习4大基本原则
    它们比你想象的要简单
  2. 认识到自己没有运用这些原则
    形诸文字–陈述问题
  3. 应用基本原则
    结果将使你大吃一惊

很明显,4大基本原则是核心,作者用了近80页来阐述这4个基本原则,这也是这本书的核心部分。正如作者所说:“一旦能够说出什么东西的名字,就会很容易注意到它。你就会掌握它,拥有它,使它在你的掌控之中。”所以,我就毫不犹豫的列下这4个基本原则,因为它们“怎么强调都不过分”:

  1. 对比(Contrast)
    1. 千万不要畏畏缩缩。
    2. 如果两个项不完全相同,就应当使之不同,而且应当是截然不同。
    3. 在页面上增加对比能吸引人的眼球。我们的眼睛喜欢看到对比的事物。
    4. 对比的根本目的有两方面,这两个方面相辅相成,无法分开。一个目的是增强页面的效果,另一个目的是有助于信息的组织。
  2. 重复(Repetition)
    1. 设计的某些方面需要在整个作品中重复。
    2. 重复不仅对只有一页的作品很有用,对多页的文档设计更显重要。
    3. 重复的目的就是统一,并增强视觉效果。不要低估页面视觉效果的威力,如果一个作品看起来很有趣,它往往也更易于阅读。

  3. 对齐(Alignment)
    1. 任何元素都不能在页面上随意安放。每一项都应当与页面上的某个内容存在着某种视觉联系。
    2. 勇敢一些,不要畏缩,绝对不要居中。找一条明确的对齐线,并坚持以它为基准。
    3. 对齐的根本目的是使页面统一而有条理。
  4. 亲密性(Proximity)
    1. 物理位置的接近就意味着存在关联,实际生活也是如此。
    2. 如果多个项目相互之间存在很近的亲密性,它们将成为一个视觉单元,而不是多个孤立元素。
    3. 亲密性的根本目的是实现组织性。

这4大基本原则是组合拳,完全能够打出专业的设计作品。或许你会感觉到这4大基本原则太死板,束缚了你,但如作者所言“在打破规则之前必须清楚规则是什么”。这就像现在所有人都挂在嘴上的创新一样,如果连参照物都没有搞清楚,何来创新呢?当你“指出问题,你就能找出解决方案”。所以“只要你有意为之,有时完全可以任意地打破常规”。

后半部分是颜色、字体和综合应用技巧,或许因为文化的差异和专业性的问题,让它们看起来有点像鸡肋,其实如果你仔细去了解,你会发现应用的原理是相通的。

这是一本很务实的书,有大量的案例说明、练习、测试和小节,里面介绍的内容不仅仅适用于传统的印刷设计,同样也适于Web设计,只不过侧重点可能有所不同,正如作者强调“ 在一个好的Web设计中,最重要的两个因素就是重复和清晰”。“不要忘记,我们的最终目的是为了更好的表达信息”,“如果一个作品看起来很有趣,它往往也更易于阅读”,这应该就是我们学习设计的终极目标吧。

ps,这本书是由人民邮电出版社图灵教育出版的,按照他们的惯例翻译的书封面会被重新设计,我不知道为什么这么做,但我看到的结果是重新设计的封面基本上都很丑,还好这本书的封面有点例外,这或许也体现了设计的意义。

标签:, ,

作者:秦歌,时间:2009-01-20 1:31,归纳于:web2.0 & so on,订阅:RSS 2.0,引用:Trackback

有评论 21 条,发表一条新评论 »

密室逃脱说:2009-01-20 9:28 #1

看了上面的介绍,真绝对是本值得一看的好书。很有自己的想法,

CssRain说:2009-01-20 9:55 #2

每次你推荐的书都是那么好,记得以前你推荐过 DOM编程艺术,也许就是你的推荐,让我走上了前端 开发之路。
谢谢了。

qingbo说:2009-01-20 9:58 #3

不错,正好今天要去买书

Betty说:2009-01-20 10:22 #4

这几大原则非常好,特别是前两条
后两条和前两条好像不是一个层面上的 :)

blogring.org说:2009-01-21 3:55 #5

Blogring for 摄影网站推荐…

Blogring for 摄影网站推荐…

行云流水泵说:2009-01-23 9:51 #6

幸好博主买的是图灵版的,如果是机械工业版的,恐怕就不会向大家推荐了。
建议博主调整一下这个BLOG的文字颜色,有些文字实在不容易看清。

秦歌说:2009-01-23 14:30 #7

嗯,我调整了文字的颜色,楼上再看看呢?

turingbook说:2009-02-02 11:37 #8

To:行云流水
图灵版的是该书的新版(第3版),而且是全彩印刷。

则名说:2009-02-04 14:28 #9

恩,已订购,呵呵

Argoy说:2009-02-09 8:43 #10

这本与机械工业出版社的《写给大家的Web和版式设计书
对比有啥不同呢?

如何做好一份前端工程师的简历? @ 随网之舞说:2009-02-17 0:30 #11

[...] 简单设计,千万不要把你的简历搞一团糟,设计虽然不是前端工程师最重要的技能,但是良好的视觉设计更能体现前端工程师的价值,所以审美其实也是前端工程师的基础素质。如果对视觉设计感到困惑,你可以从看《推荐给大家看的设计书》开始。 [...]

如何做好一份前端工程师的简历 «  Hsiang Chieh说:2009-02-18 16:23 #12

[...] 简单设计,千万不要把你的简历搞一团糟,设计虽然不是前端工程师最重要的技能,但是良好的视觉设计更能体现前端工程师的价值,所以审美其实也是前端工程师的基础素质。如果对视觉设计感到困惑,你可以从看《推荐给大家看的设计书》开始。 [...]

baljeans说:2009-02-25 2:17 #13

恩 有空一定看 感觉封面怎么又点Silverlight LOGO的感觉

eddie说:2009-02-26 21:49 #14

不错,准备现在就上当当买~原来这里用的是正黑体啊,本来以为是雅黑~

如何做好一个前端工程师 - Fangleo.cn 关注Web前端开发的IT博客说:2009-03-03 19:50 #15

[...] 简单设计,千万不要把你的简历搞一团糟,设计虽然不是前端工程师最重要的技能,但是良好的视觉设计更能体现前端工程师的价值,所以审美其实也是前端工程师的基础素质。如果对视觉设计感到困惑,你可以从看《推荐给大家看的设计书》开始。 [...]

口碑UED:如何做好一份前端工程师的简历? | TechUED说:2009-03-13 18:42 #16

[...] 简单设计,千万不要把你的简历搞一团糟,设计虽然不是前端工程师最重要的技能,但是良好的视觉设计更能体现前端工程师的价值,所以审美其实也是前端工程师的基础素质。如果对视觉设计感到困惑,你可以从看《推荐给大家看的设计书》开始。 [...]

舟 » Blog Archive » WEB前端工程师简历说:2009-04-17 10:39 #17

[...] 《推荐给大家看的设计书》 开始。  四、细节决定体验 [...]

匿名说:2009-07-20 15:22 #18

靠我 要 看 黄色

如何做好一份前端工程师的简历 | CssRainBow.cn说:2009-07-22 17:26 #19

[...] 简单设计,千万不要把你的简历搞一团糟,设计虽然不是前端工程师最重要的技能,但是良好的视觉设计更能体现前端工程师的价值,所以审美其实也是前端工程师的基础素质。如果对视觉设计感到困惑,你可以从看《推荐给大家看的设计书》开始。 [...]

如何做好一份前端工程师的简历? | IdeaoR--理想者说:2009-10-25 17:06 #20

[...] 简单设计,千万不要把你的简历搞一团糟,设计虽然不是前端工程师最重要的技能,但是良好的视觉设计更能体现前端工程师的价值,所以审美其实也是前端工程师的基础素质。如果对视觉设计感到困惑,你可以从看《推荐给大家看的设计书》开始。 [...]

如何做好一份前端工程师的简历? | 我是UED说:2009-12-18 20:48 #21

[...] 简单设计,千万不要把你的简历搞一团糟,设计虽然不是前端工程师最重要的技能,但是良好的视觉设计更能体现前端工程师的价值,所以审美其实也是前端工程师的基础素质。如果对视觉设计感到困惑,你可以从看《推荐给大家看的设计书》开始。 [...]

发表一条评论

您可以在下面评论内容中使用下列XHTML标签:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>


回到页眉