设计原则(亲密性、对齐、重复和对比)

Number.53,分享一篇《写给大家看的设计书》读书笔记-设计原则:

今天开始看《写给大家看的设计书》,补充设计方面的知识。之前就感觉自己在设计师眼里就是个土壳壳。。。肉眼凡胎,连字体大小、线条粗细都不能看出来,所以,为了以后少被高大上的设计师鄙视,现在开始恶补设计方面,fighting!

今天主要看了第一部分的基础设计原则,内容包括:亲密性、对齐、重复和对比。



1 亲密性(Proximity

亲密性基本思想

Robin亲密性原则

将相关的项,组织在一起,移动这些项,使它们的物理位置相互靠近,这样一来,相关的项将被看作凝聚为一体的一个组,而不再是一堆彼此无关的片段。

两种情况

(1)本来就接近:在一个页面上,物理位置的接近就意味存在着关联。

(2)应该接近:彼此相关的项应当靠近,归组在一起,有助于组织信息,减少混乱,为读者提供清晰的结构。

亲密性的作用

(1)亲密性会使页面会变得更有条理

(2)使用亲密性能清楚地知道从哪里开始读信息,而且明白什么时候结束

(3)“副产品”:“空白”也会变得更有组织。

亲密性的根本目的——实现组织性

(1)只需简单地将相关的元素分在一组建立更近的亲密性,就能自动地实现条理性组织性

(2)如果信息很有条理,将更容易阅读,也更容易被记住

如何实现亲密性

统计你的眼睛停顿次数,来数数页面上有多少个元素,如果超过3~5个,就要看看哪些孤立的元素可以归在一组建立更近的亲密性,使之成为一个视觉单元

使用亲密性应该避免的问题

(1)不要仅仅因为有空白就把元素放在角落或中央。

(2)避免一个页面上有太多孤立的元素。

(3)不要在元素之间留出同样大小空白,除非各组同属于一个子集。

(4)标题、子标题、图表标题、图片能否归入其相关材料?这个问题一定要非常清楚。

(5)不同属一组的元素之间不要建立关系,如果元素彼此无关,要把它们分开。

2对齐(Alignment)

对齐的基本思想

统一性

统一性是设计中的一个重要概念,要让页面上的所有元素看上去统一、有联系而且彼此相关,需要在各个单独的元素之间存在某种视觉纽带。

Robin对齐原则

任何元素都不能在页面上随意安放,每一项都应当与页面上的某个内容存在某种视觉联系。

三种对齐方式

居中对齐

(1)会创建一种更正式、更稳重的外观,显得中规中矩,但通常也很乏味

(2)大多数看来精巧的设计都没有采用居中对齐。

(3)并不是说绝对不要居中,居中适用于庄重、正式的场合。

左对齐和右对齐

使文本看起来外观更清晰、效果更分明

对齐的根本目的

(1)对齐能使页面统一而且有条理

(2)不论创建精美的、正式的、有趣的还是严肃的外观,通常都可以利用一种明确的对齐来达到目的。

如何实现对齐

(1)特别注意元素放在哪里

(2)应当总能在页面上找出与之对齐的元素

(3)遵循同一个对齐原则摆放找出的、需要对齐的元素

使用对齐需要避免的问题

坚持一个原则

(1)页面上只使用一种文本对齐(避免两端对齐)

(2)如果设计中的对齐很明确,那么可以有意识地打破对齐,而且一定要表现出这是有意的(Robin打破规则:在打破规则之前必须清楚规则是什么)

着力避免居中对齐

除非你有意识地想要创建一种正式、稳重的表示。

3重复(Repetition)

重复的基本思想

Robin重复原则

设计的某些方面需要在整个作品中重复, 基本要素在整个作品中重复出现,既能增加条理性,还可以加强统一性

重复的作用

(1)重复会为你的作品带来一种专业性权威性,它会使读者感觉有人在负责,因为重复显然是一种经过深思熟虑的设计决策

(2)创建包括多页的出版物,重复是使这些页,合为一体的主要因素。

重复的根本目的

实现统一增强视觉效果。设计中视觉元素的重复可以将作品中的各部分连在一起,从而统一并增强整个作品,否则这些部分只是彼此孤立的单元。

如何实现重复

(1)沿用现有元素:最初可以只是找出现有的重复,然后将其加强。

(2)创造新的重复元素:熟悉了这种思想后,再开始创建新的重复元素,来增强设计的效果并提高信息的清晰度;有时重复的项并不一定完全相同,而只是存在明确关联的紧密相关的对象。

(3)部分重复:对于一个大家都熟悉的元素,可以尝试只包含其中的一部分,或者采用不同方式使用。

(4)取得关注:如果一个出版物有非常好的一致性,则可以放入一些与众不同的元素,使读者真正注意到你希望他们关注的内容。

使用重复需要避免的问题

不要把重复用得太滥,而应当尽量“采用多样性实现统一”,即如果一个重复元素很明确,那么可以采用多种不同方式重复这个元素。

4对比(Contrast)

对比的基本思想

避免页面上的元素太过相似

(1)读者的眼睛总是随着页面上,任何人或动物的眼睛看过去,所以要确保将读者的目光吸引到页面的焦点内容。

(2)在设计原则中,对比最有意思,同时效果也最为明显

Robin对比原则

如果两个项不完全相同,就应当使之不同,而且应当是截然不同

对比的作用

(1)对比是为页面增加视觉效果的最有效的途径之一,很容易吸引读者去看一个页面。

(2)对比还能在不同元素之间建立一种有组织的层次结构

对比的根本目的

(1)增强页面的效果,如果一个页面看起来很有意思,往往更有可读性

(2)有助于信息的组织

如何实现对比

多种方式实现对比

(1)字体大小

(2)字体格式:要增强有意思的对比,最容易的方法就是实现字体对比

(3)线条粗细

(4)冷色与暖色

(5)平滑材质和粗糙材质

(6)水平元素与垂直元素

(7)间隔很宽的文本行与紧凑在一起的文本行

(8)小图片与大图片

一个重要原则

要想实现有效的对比,对比就必须强烈

使用对比要避免的问题

(1)不要犹豫,如果你想形成对比,就加大力度。

(2)如果各个项不完全一样,干脆让它们截然不同。

5设计的一般指导原则(不要畏畏缩缩)

(1)不要害怕在设计中留有空白,这能让你的眼睛稍作休息

(2)不要害怕设计是不对称的,使用非居中的格式,不居中往往能使效果更强烈

(3)不要害怕把单词设置得非常大或非常小

(4)只要最后的结果能支持或强调你的设计或观点,不要害怕让图片太大或太小

感谢阅读!



我是Glen,【公众号JiGlen】,觉得好的话,可以关注一下哦!
0岁的产品人,爱互联网,爱生活,坚持分享产品干货!
大家也可以在PC或MAC上登陆以下网址查看以往文章:
http://chuansongme.com/account/Ji_Glen



  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
《写给大家看的设计书》出自一位世界级设计师之手。复杂的设计原理在《写给大家看的设计书》中凝炼为亲密性对齐重复和对比4个基本原则。作者以其简洁明快的风格,将优秀设计所必须遵循的这4个基本原则及其背后的原理通俗易懂地展现在读者面前。《写给大家看的设计书》包含大量的示例,让你了解怎样才能按照自己的方式设计出美观且内容丰富的产品。   《写给大家看的设计书》适用于各行各业需要从事设计工作的读者,也适用于有经验的设计人员。 作者简介   RobinWilliams世界著名的设计师、技术专家和畅销书作家。通过写书和授课,她已经影响了整整一代数字设计师。同时,作为Adobe和Mac技术社区内的偶像级专家,她拥有大批的拥戴者。她是PublishMagazine、AdobeMagazine等杂志的专栏作家。是MacWorldExpo等业界重要活动和组织的顾问委员会成员。还创办了SantaFe电影艺术学院。除本书外,她还著有几十部畅销图书和获奖著作,包括TheNon-Designer'SWebBook、RobinWilliamsDesignWorkshop、TheLittleMacBook等,有的书已被翻译为15种文字。产生了世界性的影响。 编辑推荐   有大师指导,人人都能成为设计师!优秀设计就这么简单:C.R.A.P四条基本原则,生动幽默,图文并茂,让你手不释卷、欲罢不能。   在这个创意无处不在的时代,越来越多的人需要成为设计师。简历、论文、做演示用的PowerPoint、个人主页、博客、社团活动海报、给客户的信函或者电子邮件……。处处都在考验你的设计能力。   美术功课不好?没有艺术细胞?毫无设计经验?   没关系!在设计大师RobinWilliams看来,设计其实很简单。在这部畅销全球多年、影响了一代设计师的经典著作中,RobjnWilliams将优秀设计的秘诀归纳为对比、重复对齐亲密性四条基本原则,并用简洁通俗、幽默生动的文笔,同时配以大量经过修改进行前后对比的实例图解和设计练习(并提供解答),直观而清晰地传授给读者。通过《写给大家看的设计书》,普通读者很快就能够自信地设计出专业级别的作品,而专业设计师也将从中获得灵感和解决问题的途径。 毫无疑问,这个世界设计无处不在,优美的设计会得到会心的微笑和由衷的赞赏。然而,想从事设计或在设计边缘的人们未必有机会学习专业的设计。实际上,设计不仅仅是专业设计师的事情,比如,我是从事前端的开发的,虽然绝大部分时间是和HTML、CSS、JavaScript等这些代码打交道,但我需要维护自己的blog,需要做自己的幻灯片,更重要的是需要能够理解且欣赏视觉设计师的作品并实现它。如果我懂得设计,我肯定可以做的更好更专业,并能够提出建设性的意见。我想,类似的场景不仅适于我,也一定会适于你。所以,当我看完这本《写给大家看的设计书》(The Non-Designer‘s Design Book)时,我认为它是一本可以推荐给大家看的设计书。 这本书就是为了表明“优秀的设计就这么容易”,它仅有200页,相当容易读完。为了表明学习和实现起来相当容易,只需要你完成三步就可以办到: 学习4大基本原则 它们比你想象的要简单 认识到自己没有运用这些原则 形诸文字–陈述问题 应用基本原则 结果将使你大吃一惊 很明显,4大基本原则是核心,作者用了近80页来阐述这4个基本原则,这也是这本书的核心部分。正如作者所说:“一旦能够说出什么东西的名字,就会很容易注意到它。你就会掌握它,拥有它,使它在你的掌控之中。”所以,我就毫不犹豫的列下这4个基本原则,因为它们“怎么强调都不过分”: 对比(Contrast) 千万不要畏畏缩缩。 如果两个项不完全相同,就应当使之不同,而且应当是截然不同。 在页面上增加对比能吸引人的眼球。我们的眼睛喜欢看到对比的事物。 对比的根本目的有两方面,这两个方面相辅相成,无法分开。一个目的是增强页面的效果,另一个目的是有助于信息组织重复(Repetition) 设计的某些方面需要在整个作品中重复重复不仅对只有一页的作品很有用,对多页的文档设计更显重要。 重复的目的就是统一,并增强视觉效果。不要低估页面视觉效果的威力,如果一个作品看起来很有趣,它往往也更易于阅读。 对齐(Alignment) 任何元素都不能在页面上随意安放。每一项都应当与页面上的某个内容存在着某种视觉联系。 勇敢一些,不要畏缩,绝对不要居中。找一条明确的对齐线,并坚持以它为基准。 对齐的根本目的是使页面统一而有条理。 亲密性(Proximity) 物理位置的接近就意味着存在关联,实际生活也是如此。 如果多个项目相互之间存在很近的亲密性,它们将成为一个视觉单元,而不是多个孤立元素。 亲密性的根本目的是实现组织性。 这4大基本原则是组合拳,完全能够打出专业的设计作品。或许你会感觉到这4大基本原则太死板,束缚了你,但如作者所言“在打破规则之前必须清楚规则是什么”。这就像现在所有人都挂在嘴上的创新一样,如果连参照物都没有搞清楚,何来创新呢?当你“指出问题,你就能找出解决方案”。所以“只要你有意为之,有时完全可以任意地打破常规”。 后半部分是颜色、字体和综合应用技巧,或许因为文化的差异和专业性的问题,让它们看起来有点像鸡肋,其实如果你仔细去了解,你会发现应用的原理是相通的。 这是一本很务实的书,有大量的案例说明、练习、测试和小节,里面介绍的内容不仅仅适用于传统的印刷设计,同样也适于Web设计,只不过侧重点可能有所不同,正如作者强调“ 在一个好的Web设计中,最重要的两个因素就是重复清晰”。“不要忘记,我们的最终目的是为了更好的表达信息”,“如果一个作品看起来很有趣,它往往也更易于阅读”,这应该就是我们学习设计的终极目标吧。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值