关于排版,给你几个甲方不怼你的理由!(一)

UI / UI设计教程 / UI教程 /      

uimaker
UI设计师 / 江苏 南京

来源:网络   作者:佚名

关键词

我们在进行设计排版的时,如果不考虑任何规律,很多情况下会产生一些奇怪的设计。如果有一定的理论作为基础和标准,并且以此为大致的方向和目标,那么在设计的过程中就会比较容易进行判断。

关于排版,给你几个甲方不怼你的理由!(一)

by Adrián Somoza

即使是在无理论基础支撑的设计上,按照理论作出适当调整,也能够向出色的设计迈出一大步。对于设计本身而言,感性也是非常重要的因素,但这并不等于单纯依靠感性就能做出美观的设计。在开始“版式系列”文章之前,我想先推荐一本《写给大家看的设计书》

关于排版,给你几个甲方不怼你的理由!(一)

不管你是需要设计页面,却苦于没有设计背景;或者你从来没有接受过正规的设计培训;甚至于你从事着和设计毫无相关的工作,这本书都会让你对设计有一个焕然一新的认知。

4大基本原则 亲密性原则

亲密性(物理位置的接近)意味着存在关联

关于排版,给你几个甲方不怼你的理由!(一)

将相关的项组织在一起,移动这些项,使它们的物理位置更加靠近,相关的项将被看作一个视觉单元,而不是多个孤立的元素。

关于排版,给你几个甲方不怼你的理由!(一)

by Ryan Bataillon

类似的元素组织为一个单元,使得页面变得有条理,清楚的知道视线的移动轨迹。

关于排版,给你几个甲方不怼你的理由!(一)

by Romain Briaux

利用亲密性原则,还可以使得留白变得更加有条理

关于排版,给你几个甲方不怼你的理由!(一)

byIceBear_Panda

通过把类似的项归类在一起来建立亲密性,有时需要做一些调整,调整文本的大小或字体粗细,或者改变图片的大小或位置等。

关于排版,给你几个甲方不怼你的理由!(一)

by Jenny Johannesson

亲密性原则并不是说画面上所有的元素都要更靠近,真正含义是:如果某些元素之间在理解上存在关联,那么这些元素在视觉上也应当有关联。而元素组之间则需要有适当的留白,来体现相互之间的关系。

在此之前你可能也会很自然的利用位置的紧密程度,来反映元素之间的关系,而亲密性实际上就是更有意识的这样做,并把这个概念更向前推进一步。在充分理解页面上各元素之间的关系,就会注意到亲密性的效果,一旦开始注意到这种效果,就会利用它,掌握它,并充分控制它。

对齐原则

任何元素都不能在页面上随意摆放

关于排版,给你几个甲方不怼你的理由!(一)

页面上的任何元素都应该与页面上的某个元素存在某种视觉关系,不能简单的认为页面上刚好有空间就把元素随意的仍到那里。

关于排版,给你几个甲方不怼你的理由!(一)

by Outcrowd

如果页面上的某几个元素是对齐的,即使在物理位置上是彼此分离的,但是在观者看来,它们之间有一条看不见的线把彼此连接在一起

关于排版,给你几个甲方不怼你的理由!(一)

by Johny vino

尽管你应用亲密性原则来指示它们之间的关系,但是对齐原则却告诉你,即使它们并不不靠近,但是它们属于同一组

常用的对齐方式有:左对齐、右对齐、居中对齐。

关于排版,给你几个甲方不怼你的理由!(一)

by Ali Sayed

左、右对齐会让文本块出现一条硬的竖边,使得文本看起来外观更加清晰、效果更分明;而居中对齐的边界却是软的,实在看不出来那条对齐线的强度。

关于排版,给你几个甲方不怼你的理由!(一)

by Axel Herrmann

居中对齐是一种很安全的对齐方式,感觉上很舒服,而安全也就以为着中规中矩,显得乏味。

关于排版,给你几个甲方不怼你的理由!(一)

by Alex Banaga

在这里并不是建议你绝对不要居中,我们可以尝试让文本居中,但是文本块本身不居中,也不失为一种有趣的表达。

关于排版,给你几个甲方不怼你的理由!(一)

by Parham Marandi

在运用对齐原则时,一定要坚持一个原则:只使用一种对齐方式。即使你在不同的文本上运用了不同的对齐方式,也要确保大的整体上以某一种方式对齐。

在设计中,统一性是一个重要的概念,要让页面上的所有元素看上去统一、有联系而且彼此相关,需要在各个独立的视觉元素之间存在某种视觉纽带。对齐的根本目的就是使得页面统一而且有条理。

重复原则

设计的某些元素需要在整个作品中重复

关于排版,给你几个甲方不怼你的理由!(一)

也许你在设计工作中无意用过重复元素,可能是一种粗字体、一条粗线、某一个项目符号、颜色、设计要素、某种格式、空间关系等,这些都是重复的例子。我们只要把这种无意变为有意,利用重复原则,将画面整体从视觉上变为一体。

关于排版,给你几个甲方不怼你的理由!(一)

by T U B I K

在确定重复元素后,我们需要让元素效果更强、更生动,通过重复表现的更加明显,这样不仅页面看上去更有趣,还能在视觉上增强其条理性和一致性。

关于排版,给你几个甲方不怼你的理由!(一)

by damith premakumara

如果页面中一切都是一致的,观者又怎么会知道哪些是特殊的呢?这时候就需要一个与众不同的元素,使观者真正注意到你希望他们关注的内容

关于排版,给你几个甲方不怼你的理由!(一)

by damith premakumara

重复有助于组织信息,可以帮助观者解读各个页面,也有利于将设计中单独的部分统一起来。

关于排版,给你几个甲方不怼你的理由!(一)

by Jakub Krzanowski

有时候为了实现重复,完全可以为此增加一些全新的元素,或者选择一个简单的元素,以多种不同的方式加以使用。重复元素的项并不一定完全相同,而只是存在明确的紧密相关的对象。

关于排版,给你几个甲方不怼你的理由!(一)

by ann

重复元素并不必须是图形,可以是空白、线、字体、对齐,或者任何有意重复的东西。

关于排版,给你几个甲方不怼你的理由!(一)

by Mike

重复还会为你的作品带来一中专业性和权威性,不管它看起来多有趣,都会让观者感觉有人在负责,重复元素显然是一种经过深思熟虑的设计决策。

 收藏