400-611-9921

当前位置:首页 > 新闻资讯 > 建站知识
如何掌握布局设计

2021-08-09

2090

我们可以对这个问题进行哲学思考,但一般来说,众所周知,优秀设计的“秘密”在于您组织视觉元素的方式,与画布相关,以及元素彼此之间的关系。


以杂志的布局为例。他们的设计遵循经典的网格系统。一切通常都在左、右和底部对齐。这些尤其具有明显的对齐方式,这使页面不仅具有视觉吸引力,而且易于阅读。大标题吸引观众的注意力,而副标题则作为大小对比来创建信息的视觉层次结构。




所有这些品质使页面设计干净、结构化且易于阅读,并且它们与我们接下来要讨论的技巧保持一致。但首先,让我们更多地了解布局设计本身。


什么是版面设计?


版面设计涉及图形元素的排列,以吸引读者的注意力并以视觉上吸引人的方式传达特定信息。


印刷材料的设计,如报纸、杂志、海报及其数字对应物,以及网页、应用程序或 UX/UI 设计等都与此关系密切。


“布局”这个词给了我们很多提示。它意味着页面上预定元素的排列。


当布局有效时,它看起来不错,并引导观众理解设计试图传达的信息。因此,了解布局是创建有效、用户友好且令人愉悦的作品的关键。


如果一个布局不能很好地向观众传达其信息,或者换句话说,它没有“读好”,那么无论它看起来多么时尚,设计都将无效。在布局设计领域,内容取代了趋势。


版面设计的目的


快速传达信息


这是关键。布局设计建立图形资产之间的关系,以实现眼球运动的流畅流动,以实现最大的效果和影响。


创造平衡


使用布局设计的原则是在您的设计项目中创造平衡和对称感而又不会变得无聊的最直接的方法。


创造凝聚力


布局可帮助您以易于理解、有凝聚力和合乎逻辑的方式排列设计的许多元素。


创造美


平衡和结构自然创造美。如果您的布局设计正确完成,它将自动对观众产生视觉吸引力。观众为理解信息而付出的努力越少,您的设计就越有吸引力。

版面设计的要素


文本


这不仅包括文本正文或段落,还包括标题、副标题、页眉和页脚。您选择的排版、颜色和大小将对您的布局如何转化为观众产生不同的影响。


图像


最常见的图像类型是照片、插图或信息图表。


形状


形状可以是非常有棱角的几何形状,也可以是模仿自然世界的有机形状。它们也可以是抽象的。抽象形状在过去一年非常流行,因为我们已经看到网页设计师将它们融入复杂而庞大的构图中。


留白


任何布局设计都会有一定数量的留白,让您的元素能够独立呼吸并脱颖而出。


版面设计的黄金法则


您会注意到布局设计的原则遵循了许多设计的基本原则。就像以某种方式使用颜色、排版、重复、对比、层次和平衡。


原则1-使用网格


网格帮助设计师以一种看起来连贯且易于理解的方式定位各种设计元素,如文本和图像。


它们提供了一种秩序感,它们可以防止元素相互压倒,最重要的是,网格还将纠正您的对齐方式。

网格类型


布局网格最初用于在纸上排列笔迹。


它们最早可以追溯到 13 世纪,当时法国艺术家 Villard De 将网格系统与黄金比例合并,以制作带有边距的印刷页面布局。时至今日,您仍能看到这种网格系统,正如大多数印刷书籍和杂志布局所证明的那样。出版商、编辑和设计师更喜欢使用标准网格,不仅因为它们看起来不错,而且因为读者已经开始期望某些设计元素位于特定的位置。


网格可以通过两种方式设计:对称或非对称。


根据此分类,您可以依赖全球使用的五种主要布局网格类型:


手稿网格是最常见的文档网格类型。它们将页眉、页脚和边距分开,并在格式内创建一个矩形,为文本提供边界。它们是杂志、报纸和书籍的基础。所以这可能是你

最熟悉的布局。



列网格是杂志出版中的另一个最爱。典型的杂志布局使用列网格将文本分成易于阅读的部分。但它们在网站上也很受欢迎。您可以使用从两个到六个网格的任何内容。更多是可能的,但并不常见。关于列网格的一个非常重要的事情是列之间的间距相等。


例如,报纸使用对称列网格,而不对称列网格在网页设计中更受欢迎。


模块化网格类似于柱形网格,但它们也考虑了水平流线。当您必须在布局中组织各种元素并且列网格根本不够时,就需要这种类型的网格。


模块化网格具有相同大小的模块,这使得以不同方式可视化您的空间区域变得非常容易。


基线网格非常适合基于文本的合成。基线是您键入时文本所在的行,行距是两个基线之间的间距。想知道您的标题或副标题应该有多大?


基线网格可以帮助您的文本具有流畅的节奏。


与所有对应物相比,分层网格看起来不像网格。尽管如此,它们在按重要性顺序组织设计元素时非常有用。分层网格可以基于模块化网格,您甚至可以创建自己的网格。网站经常使用这种网格,尤其是数字杂志和报纸在向数字化过渡时往往更多地依赖分层网格而不是列网格。


原则2-使用负空间


负空间是设计中没有任何实际元素的区域。它不仅围绕着您的内容,还会在它们之间建立必要的纽带。正因为如此,负空间是一个合理的设计元素,对布局设计的有效性有着巨大的影响。


负空间将有助于分隔设计中的各个区域,同时还可以让您的布局呼吸。它有助于视觉层次和视觉平衡;它将用户的注意力集中在核心元素上;它降低了分心的程度。


缺乏经验的设计师可能倾向于通过放大文本或放大徽标或图像来尽可能多地填充画布。但是,为元素留出空间可以让观众更快、更舒适地选择某些信息。


负空间的一种简单方法是使用模块化网格。通过将其放置在您的设计之上,您可以轻松地查看哪些模块可以保留为空,哪些应该填充。

原则3-选择一个焦点


是否有客户要求您将徽标做得更大?然后让标题变得更大?


你不能强调一切。它违背了良好设计的意义。就像时间一样,焦点是相对的。为了让一个元素脱颖而出,另一个必须作为背景。为了让您的设计显示视觉层次结构,某些元素需要支配其他元素。


设计中的焦点是具有最大视觉重量的元素。它是首先吸引眼球的元素,比布局中的其他任何东西都重要。


这通常可以通过使用大图像或大量排版来实现。

原则4-考虑接近和流动


接近的原则很简单。确保相互关联的元素放在一起。


接近表示视觉内容相互连接并成为一个有助于组织布局的视觉单元。


因此,将相互关联的设计内容聚集,并使用大量信息来引导您的受众访问他们需要使用的相关内容。这也称为流动原理。


具有良好流动性的设计将在整个布局中从元素到元素轻松地引导观众的眼球。您的焦点将吸引眼球并成为休息的地方,而其他元素则赋予方向。


原则5-使用对比度


确保你的设计有足够的对比度。


对比有助于组织设计,并将建立急需的层次结构强调重要的内容。


不仅如此,对比度的良好使用还可以在整个设计中增加视觉趣味。所有大小、形状或颜色都相同的布局看起来会很无聊。


您的第一个想法可能是颜色对比,例如暖色与冷色、深色与浅色、蓝色与橙色。但是,虽然颜色是对比的一个极其重要的原则,但也存在类型、对齐和大小的对比。请记住,对比度也是相对的。它只有与其他元素并置时才有意义。


以下是一些以巧妙而美观的方式使用此规则的布局示例。注意排版、颜色的对比,甚至元素之间大小的对比。

原则6-重复、模式、节奏


当我们想到重复时,我们会一遍又一遍地想到同一个元素。


但是在设计上就不一样了。绝对没有那么无聊。如果使用得当,重复实际上可以增强您的设计。


尝试在整个布局中识别和重复使用一个主题,以便让各个区域感觉相连并成为同一构图的一部分。它将帮助您的设计有一个主题。通过重复元素,您不仅可以根据受众的期望进行设计,还可以改善用户体验。保持一致使用户感觉更舒适。


您可以通过重复形状或符号来做到这一点。或者甚至是配色方案、字体和总体上相同的风格。


限制不同数量的图案、线条粗细/样式和颜色,并始终重复。此外,尽量保持图像和图形的风格相同。例如,使用同一艺术家的插图。




最后


这六个原则将帮助您组织设计并实现更专业和平衡的布局。


平面设计不是一门精确的科学,它不应局限于技巧和原则。在所有创作领域都是如此,没有硬性经验法则。以微妙的方式突破这些技巧将为您的设计增加深度和多样性。

免费咨询热线

400-611-9921

020-29860991

联系方式

地址1:广州市天河区珠江新城邦华环球广场16F

业务 QQ:  3561401262

E-mail:  sales@zomsky.com

微信咨询
官方微信
微信咨询
在线咨询
TOP

立即与纵天项目顾问通话

400-611-9921

您也可以咨询我们的在线客服或预约资深顾问

信息保护中,请放心填写
关闭
免费获取方案