设计文章 | 文章资讯
  • 2919

    浏览
    转载
    排版 主次不明确 设计原则 主次明确
     
    标签释义【排版】
    文字排版较好
    新手设计快速入门—排版四大原则

    291901

    作者:知乎专栏 做生活的设计师

    大伙好久不见,本篇是新手设计入门系列读书笔记第四篇—排版入门。

    虽然《写给大家看的设计书》在很久之前已经出版,如今再看还是有许多值得借鉴的地方。本期总结了书中排版的四大原则部分,结合我搜集的一些案例,希望有所帮助哈。

    一般说来,如果我们想要控制页面,首先要知道有哪些设计原则,一旦我们注意到它,他们便无处不在。其中,最基础也是最重要的页面排版四大原则:对比、重复、对齐、亲密性

    对比(Contrast)

    对比从字面上简单易懂,很容易吸引读者去看一个页面。例如大字体和小字体的对比,冷色和暖色的对比等。如果两个元素想要形成对比,就应当使之不同,而且是截然不同。

    每天都会发生的错误案例:

    一眼看下去这个页面干净简洁,但是缺少了一些能够抓住眼球的东西,也就是看不到明显的主次之分。既然不同,就可以让他们截然不同,我们可以尝试做以下修改:

    对于标题,既然我们想让读者第一时间注意到,不妨用更大更粗的字体来强调它,内容的小标题,统一用一种稍小的加粗文字,也符合之后要讲到的“重复”原则。同时,标题和内容的大小要做明显的区分,以此达到“对比”。

    一句话中不同部分也可以采用粗细或大小对比,强调感情强烈的部分,画面也更具感染力。

    强烈的大小对比可以使目光很快地聚集到文字较大的部分。

    颜色对比,对于视觉感受的影响立竿见影,例如这张一加3手机发布会的PPT,仅仅通过颜色好像就能体会到高低温的区别。

    对比(contrast)小结

    如果你想形成对比,不妨加大力度。对比不仅可以增强页面效果,更有助于文字的组织。可以通过大小、颜色、粗细、空间等方式,需要注意的是,对比一定要强烈。

    ————————————————————

    重复(Repetition)

    重复绝不仅仅是元素的复制粘贴,更多地时候我们可以把它理解为页面的一致性,利用某些元素的重复来使整个设计作品达到统一的效果。它们可以是字体、形状、颜色等等,但是一定要遵循某种设定好的规律。

    logo设计中,将相似的元素进行重复变形,也可以取得不错的效果,例如华为和Adidas。

    在PPT页面排版中,将多个相同类别的栏目重复排放,屡试不爽。

    在海报设计中,重复的运用也可以使画面富有张力,例如今年的苹果开发者大会(WWDC)邀请函。

    苹果的设计师对于重复似乎乐此不疲,官网的广告中也频繁使用这种手法,将多个相同的产品同时呈现,但他们各自在颜色、形态上并不完全相同。

    在做设计的过程中,如果一个元素引起了你的兴趣,不妨拿来做重复元素,同时也添加一些全新的东西。这些重复的部分并不一定完全相同,但是会给人一种不突兀的整体感。

    重复(repetition)小结

    重复最重要的作用就在于统一,并增强作品的视觉效果。同时,为了避免重复过多同一种元素,不妨对其进行适当的变化,引起兴趣的同时又不会让人生厌。

    ————————————————————

    对齐(Alignment)

    对于设计新手而言,图片、文字的随意摆放往往让人感觉页面很杂乱,任何东西好像都是随意丢在一边。相对的,对齐原则是说任何元素都不能随意摆放,它们应该与页面上的某个物体有空间上的联系,虽然眼睛看不到,但是好像有一条线将他们连接起来。

    现代大多数人的阅读习惯是从左侧开始,为数不少的海报设计都采用了文字左对齐的方式,即使文字大小、数量不同,仍可以散发出一种整齐的美感。

    在用到邀请函以及一些较为庄重的场合时,居中对齐的方式往往更加有仪式感,这也是平时我们最常用的一种方式。

    对齐(Alignment)小结

    对于新手而言,一个页面上一种对齐方式已经足够。另外在设计页面时,使用辅助线是帮助我们对齐的一个好习惯,可以让页面统一而有条理。补充一条简单实用的对齐方法:确保任何一个元素都能在本页与另外一个元素存在着视觉联系。

    ————————————————————

    亲密性(Proximity)

    亲密性的原则是指将相关的部分组织在一起,这样一来,有关系的部分被看做一个组,而不是零散的个体,这样也给读者明确的提示,快速掌握页面的内容分布。

    在这里,我们不妨将“对比”中的案例进行优化。案例中小标题与内容、段落之间的距离过于相似,两端的区别没有能很好地区别开,我们可以做适当变化。

    优化之后,页面的内容被划分为了明显的两个部分,更易于阅读。

    在多组并列内容排版时,重复与亲密性往往是不可分离的,使页面充满条理。

    亲密性原则在一些时尚画册类的设计中也尤为明显,画面的内容呈现为块状分布。

    亲密性(proximity)小结

    亲密性的根本目的是实现组织性,如果信息具有条理,将更容易被阅读,也更容易被记住。如果元素无关,就要将其分开,同时避免页面上出现太多孤立元素。

    ————————————————————

    四大原则的内容基本介绍结束啦,需要注意的是,它们并不是单独分离的四项原则,而常常作为一个整体同时出现,下面补充一些优秀的排版设计作品,共同学习进步。

     

    本文由 @助教贰师兄 转载发布于云琥在线。

    转载于:https://zhuanlan.zhihu.com/p/26699949

分享:
你还没有登录,请先登录注册

  • 还没有回复,赶快添加一个吧!

助教贰师兄

贰师兄

474粉丝 | 76关注

关注
同学的热门标签
加入讨论圈子
免费试学
平面/UI/电商/室内
/运营/短视频任选
意见反馈
公众号
微信扫一扫
关注天琥公众号