网页设计中的版式设计

网页设计中的版式设计（精选12篇）

网页设计中的版式设计 篇1

版面设计的最终目的是使版面空间产生清晰的条理性。版式构成中注重版面视觉中心的处理, 增强读者的注目力, 却往往忽略了视觉流程中的过渡空间, 也就是版式设计的“灰空间”。版式设计的“灰空间”能增强空间的可塑性, 丰富性。出新的版式设计, 总是摆脱规范化的、习见的常规束缚, 将那些平淡无奇的字体、线条、空白, 经过有序组合, 形成不同寻常的“灰空间”关系, 使之变得色彩纷呈, 让人耳目一新。

一、版式设计中的“灰空间”

(一) “灰空间”的涵义:

“灰空间”一词最早是由日本建筑师黑川纪章提出的。其本意是指建筑与其外部环境之间的过渡空间, 以达到室内外融和的目的, 比如建筑入口的柱廊、檐下等。“灰空间”也可理解为建筑群周边的广场、绿地等。我把“灰空间”这个概念在平面设计中进行运用, 发挥重要的作用。

按我的理解, 就像灰色是黑白的过渡色一样, “灰空间”就是封闭空间与开放空间的中介, 或者说是内容与功能不同的空间之间的过渡空间。由于它的存在, 冲破了封闭空间的制约而争取与各因素空间取得更加广泛的联系, 从而使主体与客体情景交融。在版式设计中也是如此, 通过图形, 文字和色彩等元素来构建成有过渡作用的“灰空间”, 可以最大限度地体现出二维版式的视觉三维空间, 使其更加完美统一。

(二) “灰空间”的视觉传达功能

在设计时巧妙的利用灰空间创意, 可将作品的信息以及内涵以一种强大的视觉力度传达出去, 以达到震颤人心的视觉魅力。

1. 形成三维空间

平面设计中的版面属于二维空间的范畴, 版式设计是将不同的设计元素, 按照一定的规则进行组合编排, 在二度空间范围之内以轮廓线划分图与底之间的界限, 描绘形象。那如何在二维的长宽中表现出深度的感觉, 对人的视觉引导形成的幻觉空间?正是通过设计元素比例, 位置, 动静和色彩明暗等因素形成诱导视线的“灰空间”辅助形成平面中的三维空间, 甚至是多维空间, 来增加空间的层次, 完善视觉流程, 并有助于突出主题。

2. 完善视觉流程

视觉流程是一个视觉传达过程, 也是一个感知过程。人们在阅读时, 目光本能的按着设计的视觉流程阅读信息。“灰空间”的设计即版面中起引导和过渡的次要元素的编排设计, 它能使版面获得良好的诱导力, 鲜明的突出诉求主题。使用恰当的“灰空间”能使视觉流程更加完善、流畅, 帮助人们以最合理的顺序, 最快捷的途径阅读和理解作品产生积极的心理诉求和欲望, 以实现传达和说服的效力。

3. 营造愉悦心理感受

使人们在从“绝对空间”进入到“灰空间”时可以感受到空间的转变, 享受在“绝对空间”中感受不到的心灵与空间的对话。科学运用“灰空间”的版式设计, 恰能营造一条颇具诱惑力的桥梁, 诱导读者心登堂奥, 在作了一番台榭漫游、曲径探幽之后, 有层有次地渐入佳境, 于不知不觉之中遍览全书, 心旷神怡至极, 愉悦满足至极。

二、“灰空间”的构成因素

所谓的版面设计是在既定的平面上将诸多的视觉元素进行最佳的空间定位。这些元素可归纳为文字、图象、色彩等。同样作为空间定位的重要部分“灰空间”的基本元素也是如此。“灰空间”的运用是看我们如何经营好文字、图形和色彩等元素。

(一) 文字的“灰空间”编排

文字既是语言信息的载体, 又是具有视觉识别特征的符号系统。文字版式设计是“灰空间”中不可分割的一部分, 对视觉传达效果有着直接影响。如在两个设计单体之间用一段文字编排做引导就形成一个视觉上的过渡空间。版面中除了文字这些实体造型元素, 编排后剩余的空间即为“负形”, 也会影响版式设计的视觉效果。负形与字体实形相互依存, 使实形在视觉上产生动态, 形成“灰空间”;在安排文字的位置、结构变化与字体组合时, 应充分考虑负形的位置与大小。“以白当黑”是把文字间的空白作过渡性的设计的一种方法, 通过版式编排、处理以达到“以形写意, 以意达神”的目的。大胆地留出恰当的空白, 形成一个“灰空间”打破死板呆滞的常规惯例, 使版面通透、开朗、清新, 目力因之得到松弛、小憩。鲁迅先生就特别强调版式中要留一些空白, 鲁迅先生在《华盖集》中写道:“我于书的形式上有一种偏见, 就是在书的开头和每个题目前后, 总喜欢留些空白。”他针对当时的一些密密匝匝的版式设计说:“使人发生一些压迫和窘促之感, 不特很少‘读书之乐’, 且觉得仿佛人生已没有‘余裕’, ‘不留余地’了。”也就是说, 文字空白的“灰空间”过渡不仅是为了视觉的快感, 而是为了在阅读时进入一个审美的境界。

在文字编排时, 讲究空白形成的“灰空间”, 是为了更好的衬托主题, 集中视线和拓展版面的视觉空间层次。设计者利用文字编排和空白形成“灰空间”使版面布局清晰, 疏密有致, 并给读者恰当留出视觉休息和自由想象的空间。

(二) 图形的“灰空间”组合

现代社会是图像爆炸的时代。在铺天盖地的图像轰击下, 人们被惯坏了。当他们需要信息时, 他们不再说“告诉我”, 而是说“画给我”。于是图片的作用和地位越来越突出, 所占据的版面位置也越来越大。

图形在排版设计中最直接的效果就是简洁明了, 主题突出。设计师通过控制图形或照片的形状、大小的变化以及图形的虚实、色彩来设计“灰空间”, 调和设计元素间的差异性。这些“灰空间”的过渡, 成为图形的一个关联元素, 递延视觉, 反映空间上的节奏。另外图形的灰空间作用还体现在版式的编排和图片可以任意相互叠加重合、放射、变形上, 使版面中有无数的层次, 构建一个有趣的“灰空间”, 以增加画面的空间厚度。

在实际的版式中, 字体常常成为图形的一部分。在字图一体的编排过程中, 这种编排的行文既是平面的, 又是立体的。图形的虚实手法、互相叠加重合等手法来达到字图一体, 使版面中有无数的层次, 塑造三维的“灰空间”。

(三) 色彩的“灰空间”运用

很多时候, 配色方案是升华一个版面结构的有力武器。如果科学地使用颜色, 可能得到意想不到的结果。当人的视觉接触到某作品, 色彩就会给大脑传递信息, 使人产生空间的联想。

无论是有色还是无色的版面, 均为黑白灰的三色空间层次。黑白为对比极色, 最单纯、强烈、醒目, 最能保持远距离视觉传达效果;灰色往往形成“灰空间”, 能概括一切中间色, 且柔和而协调。三色的近中远空间位置, 依版面具体的明暗调关系而定。

色彩是创造视觉空间的最好帮手, 不同色相、明度、纯度的色彩都会产生不同的空间感受。版面中色彩的运用会很好地形成二维空间中的视觉三维。比如纯度黄色会跳出画面, 灰度蓝色则会隐退到画面的后方, 而它们之间的颜色, 如各个色阶的灰度绿就形成一个过渡色。“灰空间”的色彩冷暖, 明暗的合理搭配起着协调整个画面色彩的作用, 反之“灰空间”色彩不当, 则使作品混乱, 模糊不清。因此应加强形“灰空间”与整体的关系, 以及用集中近似的色彩面积等来达到色调统一。

三、“灰空间”的多样性表现

生活中的三维空间是立体空间, 看得见、摸得着、能深入, 如当我们走进教室的感觉, 而在平面编排中的三维空间, 是在二维空间的平面上建立近、中、远立体的空间关系。看得见而摸不着, 是假象空间。这种假象中的“灰空间”, 是通过借助多方面的空间关系来表现的, 即:比例、动静、图象肌理等空间因素。

(一) 适度的比例关系营造“灰空间”

适度是只整体和局部与人的生理或习性的某些特定标准之间的大小关系, 即要从视觉上符合人们的视觉心理。焦点透视的近大远小的经验长期积累, 人观看二维平面的形象时, 也往往产生三维空间的错觉。面积大小的比例, 即近大远小产生近、中、远的“灰空间”。在编排中, 可将主体形象或标题文字放大, 次要形象缩小, 来建立良好的主次、强弱的空间关系, 灵活利用“灰空间”以增强版面的节奏感和明快度。

(二) 不同的位置关系营造“灰空间”

前后叠压的位置关系所构成的“灰空间”。将图象或文字作前后叠压排列, 产生强节奏的三度层次空间。编排时, 依从主次顺序, 将重要的信息或视觉流程的信息安排在注目价值高的部位, 其他信息则与主体成相应上左或右下的配置关系这样所构成“灰空间”。位置关系所产生的“灰空间”产生紧张或舒缓的心理感受。

(三) 动静关系、图象肌理营造“灰空间”

动使版面充满活力, 获得更高的注目度;静使版面冷静、含蓄, 具有稳定的因素。两者在版面的组织上, 以动为前, 静为后, 彼此以动静的对比关系来建立“灰空间”。以细小的文字或图象组织的版面, 从整体看具有肌理感, 其空间关系建立在肌理组织的大小及色彩的强弱关系上。

“灰空间”这个概念虽然源于环境艺术设计理论, 但是它可以延伸到平面版式设计中灵活运用。随着信息量的增大, 平凡俗套的设计难于激起观众的兴趣。版面的设计面积大小不同, 但其所有的元素都不是静止的, 作为设计师, 要利用各种元素的流动、互动、融合、排斥做好“灰空间”的设计, 使小小版面具有视觉魅力的空间形式, 有效地传达设计信息。

参考文献

[1]郑娟.艺术设计中的空白意境[J]包装工程, 2003年

[2]阿历克斯·伍·怀特[美].平面设计原理.[M].上海.上海人民美术出版社.2005年

[3]国际版式经典-世界著名企业年报设计.[J].河南.河南美术出版社.2004年

网页设计中的版式设计 篇2

一、老子美学“虚与实” 在版式设计中的原理

1、老子美学中的“虚与实”

老子美学是中国美学史的起点, 以“自然” 作为宇宙之本原, 以“道法自然” 作为人生之要义。“道” 是老子哲学的中心范畴和最高范陈老子认为, “道” 具有“无” 和“有” 这样双重的属性。作为“天地之始” 的角度看, “道” 是“无”即无规定性、无限性。作为“万物之母” 的角度看,“道”是“有” , 即包含有规定性、差别和界限。 就现象界来说,宇宙万物也都是“无” 和“有”的统一,或者说是“虚” 与“实” 的统一。

“虚实结合” 是中国古典美学的重要特点: “虚实结合” 讲究“气韵生动” 。“气韵生动” 的“气”不仅表现于具体的物象,而且表现于物象之外的虚空。没有虚空,就谈不上“气韵生动” ,艺术品就失去了生命。中国古代诗、画的意象结构中,虚空、留白有很重要的意义,没有虚实留白的美,中国诗歌和绘画的意境就不能产生。

2、“虚实” 美学在版式设计中的原理

邓石如则说: “字画疏处可以走马,密处不使透风常计白当以黑,奇趣乃出。”“虚实” 留白在中国传统美学上被称作“计白守黑” 。“黑” 是指版式中编排的内容,虚”指细弱的文字、图形或色彩。“计白守黑” 指笔画之间的关系要得当。’ `疏可走马” 则指写字要有疏密。

书法版式中讲“分间布白” ,蒋和在《书法正宗》说: “布白有三: 字中之布白,逐字之布白,行间之布白。”

这里的“分间布白” 指字行之间处理空白关系的方法。书画中版式如此,在平面设计版式中也一样追求字与字之间的疏密空间处理。

3、“虚实结合” 在版式设计中的`体现

空间是无所不在的,我们所处的环境就是一个三维空间,当然版面设计中也存在着“ 空间”的概念。这种空间的感觉并不是真实的, 用文字图形的元素组成“近、中、远” 的立体空间,比起平铺直叙的版面, 空间感强烈的版面更有层次,视觉度更高,也更加耐人寻味。

虚实结合,实为有为物,虚为无为境; 实制约了虚,虚则自由和扩大了实、丰富了实。只有虚中有实,化实为虚,以实暗示虚的存在,才能创造出意趣无穷、空灵的意境。

由感官直接接收到的视觉信息既是“实”我们因此视觉带来的联想部分,则是“虚” 的含义。在直接了解到的信息上增加了二次传达的功能,是超越具体形象而存在的。

二、在版式中如何设计“虚、实” 意境

在中国的传统哲学里,讲究“中和为美”, “中”指不过于多,不过于少。“和” 指协调差异分歧,达到和谐统一,这个统一指和谐但也承认了不同。“中和为美” 的原则应用到版式设计里,在设计的过程中就要将不同的元素针对不同的主题用到“恰如其分、恰到好处” 。“饰不可过、亦不可缺。”

1、构图“恰到好处”

虚实结合的目的是强化我们需要传达的重要信息,而补充的信息应作为次要层级来处理,以确保引导大众正确有效的视觉流程,对基本信息的读取,以及对直观信息的联想、二次信息传播。构图的“恰到好处” ,使得版式设计在信息传达的同时又能体现设计的美。

2、视觉度“以少用多”人们阅读的视觉流程一般是从左到右,从上到下较强的视觉度是会改变整个版面的视觉风格,引导人们搜索信息且具有空间力场和遐想的意境。排版设计中图与图的色彩呼应,标题文字与内容文字调整字体、分栏,可以在视觉上利用有限的文字和图片,营造出具有力场的版面,避免版面枯燥杂乱。

3、文字营造“虚实”文字作为版式设计中信息传达的重要要素,在文字的排版中对信息和图片依照内容的层级进行虚实处理,适当的留白空间使版式更加优美。标题文字的处理要醒目和区别于正文,利用字体、粗细区别重点、或者字号大小、颜色,也可以改变字体原有的形状,按要求而设计。

文字量很多的情况下,不能很好地强调重点。调整行距、字距配合文字达到舒服的阅读模式,有虚实对比更加强调文字的可读性。结合图片排版时,图片很多的情况下,可以将优质的图片占用多一些的版面,其他作为辅助,并且很好的协调图片与文字之间的空间距离。

三、“虚、实” 在版式设计中的意义

虚实的审美特征为“虚由实生,实仗虚行,以实为本,以虚为用。” “虚实” 表现了空间无限与有限的关系,无限是对版式中内容的延伸和读者想象的空间,有限则是传达的主题内容。设计中的正负形象与空白背景的关系,都在视觉上造成虚实的效果。

版式设计中的“易经”思想 篇3

关键词：版式设计；易经思想；太极；阴阳

视觉版面的构成，是一个复杂事物组合的空间。《易经》中指出，宇宙从混沌未分的“太极”中发生出来，尔后分成两仪。太极为初、为一，可化成万物，又可至于无穷。因而，宇宙中的一切都是从太极中发生出来的，包括具体的版面设计形式、元素及抽象的设计理念。太极是一切相对事物的混合体，从广义上来讲，版面的整体视觉形态也是一切相对事物的混合体，它是由各对立统一的视觉元素构建而成的整体视觉效果。因此，版面也是太极。视觉版面中的整体视觉形态可以不断进行再分，但无论经过多少次再分，其视觉分子永远是太极，也就是“一”。在版式设计中，上至图形与文字所传达的信息事物，下至版面构成编排的视觉形态，都是太极，都具有太极的对立统一的特性。形式是太极，元素是太极，由此形成每一个版面的设计思考都是太极思维的过程。

版面的设计空间从广义上来讲，也是一切相对事物的混合体，即太极的发展空间，版面的设计空间也具有太极的对立统一性。《道德经》中指出：“一生二，二生三，三生万物。”“一”是指太极，“二”是指阴阳，“三”则指阴阳互动。由此，版面的构成组织中的各元素均有阴阳之分，且阴阳之间存在辨证关系。阳的视觉元素可以看成是阴的，阴的视觉元素可以看成是阳的。正是这阴阳两种相反的视觉力量促使运动的产生。《系辞》中说：“一阴一阳之谓道。”整个版面的构成形式是在阴阳两种相反相成的视觉力量的相互作用下，不断运动、变化、生成、更新的，这是一个视觉动态平衡的设计过程。

在版面设计时，我们要充分利用各视觉要素所产生的力量，对版面进行编排，追求阴阳两种力量间的动态平衡。然后根据版面的具体情况，对视觉元素的位置进行主动的变化，使版面设计更具视觉形态的生命力。

《易经》告诉我们，一切的一切都是人想出来的。《系辞》中指出：“生生之谓易”。“易”就是“生”，“生生”则是一个连续不断的生成过程。同时，它也是由事物本身不断生成和创造的过程，而这一变化都是从混沌未分的太极中生发出来的，这过程正是体现了事物的生生化化。不言而喻，作为版式的构成形态，设计也应具有易经思想的根本精神。

版式形态设计的“生生”精神，主要是指在编排过程中，设计人员对版面的组织元素反复进行“易”的过程。对版面形式不断进行组织和解构，即是创造的行为。从多方面、多层次对作品的整体视觉形式着手设计，不断推敲，精益求精，最终创造出令人满意的作品。这一行为过程可使独立作品衍生成系列作品，也可为书籍、画册等的整体设计提供辅助参考。

版式设计的存在、发展到本土化、个性化的过程正是“生生”精神的一大体现，具体表现为将民族文化融入版式设计的这一精神，使版式设计成为一项具有民族化、本土化性质的创造活动，对中式版式设计的发展尤其具有重要意义。

“天人合一”是指人与宇宙自然界的生生之德完全合一的存在状态。在版式设计中，构建“天人合一”的理念，是要充分意识到从整体的角度去认识设计的内容、对象和设计的人，把设计师与设计内容以及受众，看成一个相互感应的整体。

在设计的实施过程中，“天人合一”的设计理念要求设计人员针对受众的需求，站在受众的角度，应用系统的思维方法，对版面进行整体编排。设计人员的主要目的是将所要表达的意图与设计的版面相契合，最终使受众的需求得到满足。其中，设计人员和受众是主体，版面设计内容是客体，主体支配客体，同时客体制约主体，只有合理地处理好三方的关系，才能达成设计者与设计内容以及受众互相感应、相辅相成的融合状态。

在版式的视觉传达设计发展的过程中，变通显得尤为重要。“易，穷则变，变则通，通则久。”这是《系辞》中所提出的，也是版式设计中不容忽视的一个重要辩证法则。古往今来，凡是墨守成规的，最终都逃不过被取代的命运。

“变”即“创新”，这是版式作品成功的一个至关重要的原则。版式的构成语言因袭过去，版式的视觉形式墨守成规，这都不符合“变”的要求。设计人员要引领设计潮流，将视觉要素运用新颖的视觉形式语言来表达，引导读者产生兴趣并从中获取信息。如果设计形式千篇一律，读者就会审美疲劳，并对此类版面形成视觉排斥。只有不断推陈出新，与时俱进，从常态中寻求突破，才能使版式作品呈现出百花争鸣、百花齐放的繁荣景象。

综上所述，版式设计是太极的产物，版面即是太极，版面中的各要素间互为阴阳且阴阳互动并处于动态平衡。版式设计的设计精神、法则及设计理念与易经思想息息相关，我们要深入探究版式设计中的易经思想，使版式设计更具民族性和文化性，使得中国传统文化得以传承。

【参考文献】

[1]祖行.图解易经[第四版][M].西安：陕西师范大学出版社，2010

[2]曾仕强.易经的智慧[M].西安：陕西师范大学出版社，2010

[3]辛艺华.版式设计[M].武汉：华中科技大学出版社，2006

[4]辛华泉.形态构成学[M].杭州：中国美术学院出版社，1999

[5][美]赫伯特·斯潘塞.现代版式设计先驱[M].上海：上海人民美术出版社，2006

浅析字体设计在版式设计中的运用 篇4

一、字体设计本身的符号作用

1. 字体设计

字体设计、应用水平的高低都会直接影响到信息的传达和设计的整体效果。

简单地说, 字体设计就是对文字按视觉设计规律加以整体的精心安排要素进行审美化形式设计, 创造具有鲜明视觉个性识别的字体形象。

2. 符号作用

文字是约定俗成的符号, 文字形态的变化不影响自身传达信息的功能, 但是会影响信息传达的效果。因此, 视觉美学规律的运用是十分必要的, 配合文字本身的含义和所要传达的目的, 对文字大小、笔画结构、排列乃至赋色等方面加以创意设计, 使其有适合传达内容的感性或理性表现和优美造型, 能有效地传达文字深层次的意味和内涵, 发挥更佳的信息传达效果。从某种意义上来说, 文字既可单独作为一种标识记号, 又可作为版式编排的一种运用元素。文字作为记录语言的符号, 它是利用其形体、通过其语音来表达意义的, 所以文字本身的图案特征和象形因素就是一种创意。然而, 如今设计师们在进行新的设计形式的探索过程中, 往往不够重视字体的重要性, 忽略了文字的创意性。所以, 对字体的创意的追求与设计理念的更新, 无疑在当今的设计行业中扮演着一个举足轻重的角色, 并在众多媒体领域中显现出这一新的时代特点即“字体效应”。

二、字体在版式设计中的任务

对于设计师而言, 版式中的字体设计首要任务是版面文字的视觉化处理, 即通过恰当的字体艺术设计, 使版面图文的阅读感觉顺畅舒适。所以, 字体是一种具体的视觉形象要素, 并占据一定的视觉空间, 它就必然与版面中的其他视觉要素———图形、色调产生互动的视觉效应。因此, 设计师们把字体看作是另一类的视觉图形要素, 并重视它在商业平面设计作品中不可或缺的作用, 以此作为优秀设计师追求的理想境界。当代设计作品中有相当数量的设计师“故意”用纯粹的文字构成版式, 它们或以极富视觉冲击力的个性化手写体作为设计的核心元素, 或选用由基本字体转化而来的专用字体作为视觉中心, 但是无论选择何种方式, 字体设计的优劣, 都将直接关系到艺术设计作品的整体视觉美感。因此, 对设计师来说, 在画面中善用字体, 是其设计的重中之重。这个“善用”包括对字体的审慎选用、中英文字体的合理搭配、大小字体的有效组合、字体与图形的有机配合及与主题的高度吻合等。因而设计界有“能驾驭文字的人, 才能高谈设计”的说法。

三、字体在版式设计中的作用

1. 字体与版式设计的相互关联性

字体与版式设计在平面设计中有着举足轻重的作用, 它使各种设计构成要素和谐地出现在同一个版式上, 互相衬托, 互相呼应, 将文字、图形、色调有机的组合在一起, 将信息强有力地传递给受众, 引起受众者的注意和兴趣, 达到销售商品或建立知名度的目的。优秀的艺术设计作品一定会做到让图形与文字协调和呼应。尽管它们在版式设计上是两种不同特质的构成要素, 但当它们在同一空间共同出现时, 通过版面的设计形成某种形式的相互配合, 以达到最佳的视觉传达效果。

2. 字体在版式设计中的实用性

字体在版式设计中的可读、易读, 是衡量字体与版式设计实际功用发挥的重要标准, 当然, 这种实际功用并不如生活用品那样表现纯粹。如:水可以拿来喝;面包可以拿来吃;衣服可以拿来穿等。虽然, 字体不可以拿来用, 但经过编排后的版面文字同样具有实用性, 那就是通过受众者的眼睛, 让其能够借用字体这一特殊符号, 读懂所要传递的信息内容, 并且正确地理解设计师所要表达的意图。因此, 字体和版式设计的应用应准确而易认, 准确是为了不引起误解, 易认则是为了便于辨识及记忆, 这就是字体和版式设计的实用性体现———识别和易读。

3. 字体在版式设计中的艺术性

经过设计的字体不仅使文字更容易为人们所识别记忆, 使版面更便于浏览, 而且使字体和版面更具有独特的个性, 同时也给人们视觉上带来审美愉悦。字体虽占有一定的视觉空间, 并通过某种特殊的构成形式表达出一定程度的视觉传递, 但也不完全只是视觉形象的单纯表现, 这是由于字体同时兼具有文辞内容的传载及视觉形象的单纯表现的双重角色功能, 因此, 如果仅以纯粹的视觉语言的方式表现, 而忽略字体所应有的艺术感染力;或走向另一端, 只注重内容的传达记忆, 无视字体的影响力, 这类设计作品都是残缺而失败的。在版式设计中, 如何在文字阅读性与版面视觉张力之间找到最适合的平衡点, 甚至将文字与图形在同一时空中可能产生的冲突, 转化成整体视觉沟通的相辅相成, 达到艺术视觉冲击的最佳效果, 正是字体与版式设计最具挑战性, 也是最能发挥字体与版面潜力的地方。这就是字体与版式设计的艺术性体现———美观。因此, 实用性和艺术性, 是字体在版式设计中贯穿始终, 并且必须具备的双重属性。

四、结语

综上所述:字体设计的作用已越来越被人们所重视, 无论是对字体的选择或是对字体的使用都构成了衡量一个设计师水平的标准。一个成功的字体设计, 它拥有生命力, 可以感染观众情绪。作为当代设计师, 依靠迅猛更新的计算机技术、先进的印刷技术将在艺术设计领域里赋予字体排版设计更多的可能性, 有理由相信字体在版式设计中亦将呈现出更“风格化”、“多元化”、“艺术化”的趋势。

参考文献

[1]王龙兵.浅谈平面设计中的字体设计[J].文化商业, 2009年第八期.

版式设计教案设计 篇5

教学目的：在变化与统一是设计的总法则的统领下，编排与版式设计有各种具体版面形式，初步理解每种类型的设计方法和特点，掌握主要的几种编排与版式设计版面类型。教学重点：骨格型、满版型、分割型、对称型版式类型的设计方法和特点。

教学难点：在版式设计的所有版面类型中，骨格型的版式设计最不易掌握；在大量信息文字图片处理上，怎样突出重点，让版面达到构成上的和谐与组织上的合理，传达上更条理清晰。教学时间：2课时

讲授内容：

 上节课版式设计的形式法则复习3分钟 提问法

版式设计的形式法则有哪些以及特点？

学习版式设计的形式法则，既帮助我们克服在设计中的盲目性，又为设计前的思考提供了丰富的内涵。

1.单纯与秩序是求取有机的整体； 2.对比与调和是求取强调的效应； 3.对称与均衡是求取稳定的因素； 4.节奏与韵律是求取情调的悦意； 5.虚实与强弱是求取主次陈述。

 版式设计的基本版面类型导入前讨论 7分钟 演示法结合讨论法

版式设计

1.老师演示少量电影海报，活跃上课氛围，并提问：“平时同学们看哪些电影，有留意海报有哪些不同编排形式？给人的感觉是什么？” 2.学生分组自由讨论三分钟后，每组派代表发言。

3.老师表扬发言同学后，引出今天上课主体：版式设计基本版面类型。

 结和图片讲解每种版式设计类型的特点，帮助学生更好的理解和掌握，提高学生的设计感受能力。35 分钟 演示法（图文讲解版式的基本类型）

版式的基本类型有骨格型、满版型、上下分割型、左右分割型、中轴型、曲线型、倾斜型、对称型、重心型、三角型、并置型、自由型和四角型等13种。

重点讲解：骨格型、满版型、分割型、对称型版式类型的设计方法和特点。

一、骨格型

图形或文字在版面编排中，总是按照某种规律，在版面中作某种倾向性的排列，这种隐藏的规律性在平面的空间设计中即称为骨格。在编排与版式设计常以分栏的形式出现，如二分栏、三分栏的编排与版式设计。达到构成上的和谐与组织上的合理，传达上更条理清晰。

二、满版型

版面以图象充满整版，主要以图象为诉求，视觉传达直观而强烈。文字的配置压置在上下、左右或中部的图象上。满版型给人以大方、舒展的感觉，是商品广告常用的形式。

第2页，共7页

版式设计

三、上下分割型

把整个版面分为上下两个部分，在上半部或下半部配置图片，另一部分则配置文案。配置有图片的部分感性而有活力，而文案部分则理性而静止。上下部分配置的图片可以是一幅或多幅。

四、左右分割型

把整个版面分割为左右两个部分，分别在左或右配置文案。当左右两部分形成强弱对比时，则造成视觉心理的不平衡。这仅仅是视觉习惯上的问题，也自然不如上下分割的视觉流程自然。不过，倘若将分割线虚化处理，或用文字进行左右重复或穿插，左右图文则变得自然和谐。

五、中轴型

将图形做水平或垂直方向的排列，文案以上下或左右配置。水平排列的版面给人稳定、安静、和平与含蓄之感。垂直排列的版面给人强烈的动感。

第3页，共7页

版式设计

六、曲线型

图片或文字在版面结构上作曲线的编排构成，产生节奏和韵律。

七、倾斜型

版面主体形象或多幅图版做倾斜编排，造成版面强烈的动感和不稳定因素，引人注目。

八、对称型

对称的版式给人稳定、庄重理性的感觉。对称有绝对对称和相对对称。一般多采用相对对称。以避免过于严谨。对称一般以左右对称居多。

九、重心型

重心有三种楷念。

1、直接以独立而轮廓分明的形象占据版面中心。

2、向心：视觉元素向版面中心聚拢的运动。

3、离心：犹如将石子投入水中，产生一圈圈向外扩散的弧线运动。重心型版式产生视觉焦点，使强烈而突出。

第4页，共7页

版式设计 十、三角形

在圆形、矩形、三角形等基本图形中，正三角形（金字塔形）最具有安全稳定因素。

十一、并置型

将相同或不同的图片作大小相同而位置不同的重复排列。

并置构成的版面有比较、解说的意味，给予原本复杂喧闹的版面以秩序、安静、调和与节奏感。

十二、自由型

自由型结构是无规律的、随意的编排构成，有活泼、轻快之感。

第5页，共7页

版式设计 十三、四角型

版面四角以及连接四角的对角线结构上编排图形。

给人严谨、规范的感觉。

 骨格型版式设计练习

分钟

练习法

1.骨骼型的版式特点和骨骼型优秀报纸版面设计欣赏

在编排设计方法上有两种倾向：

1.一种注重理性分析，运用数学和几何知识，达到构成上的和谐与组织上的合理； 2.另一种是注重感性的判断，编排审美依赖于设计者的感官知觉判断力。

在编排设计中有多种骨骼的分割形式，而各种风格给人的视觉效果各有不同，设计师根据设计的要求和性质来决定版面的设计风格，以打动读者心灵。

国外优秀报纸版面设计欣赏：让学生借鉴灵活的骨骼型编排方式，在大标题、小标题、正文、插图、及颜色搭配的细节处理。

第6页，共7页

版式设计

2．骨骼型版式设计练习

结合学院应用设计系系报

老师提供参考图片和文字。

作业要求：在编排设计中有多种骨骼的分割形式，学生要灵活运用，系报编排时参考国外优秀报纸版面设计。

老师编排示范：

1.版面设定A3竖版；

2.大标题、小标题、正文字体要求区分开，调理清楚； 3.注意边距、行间距、段落间距 4.分栏设计时图片要灵活结合

学生骨骼型版式设计练习，老师巡回指导点评。根据不足,课后完善系报设计。

 总结 ： 提问法 3 分钟

1.编排与版式设计的基本类型有哪些？

骨格型、满版型、上下分割型、左右分割型、中轴型、曲线型、倾斜型、对称型、重心型、三角型、并置型、自由型和四角型等13种 2.骨格型版式版面设计特点？

图形或文字在版面编排中，总是按照某种规律，在版面中作某种倾向性的排列，这种隐藏的规律性在平面的空间设计中即称为骨格。在编排与版式设计常以分栏的形式出现，如二分栏、三分栏的编排与版式设计。达到构成上的和谐与组织上的合理，传达上更条理清晰。

 课后作业布置 2分钟 1．完善骨骼型版式系报设计；

2．做一张A3尺寸的分割型版式设计海报，主题自定。

版式设计中的视觉形态探析 篇6

关键词：点；线；面；节奏；韵律

一、版式设计中的视觉元素

1.点

点、线、面是视觉构成的最基本要素，是版式设计中最重要的构成元素和最重要的表现手段之一。任何版式设计最后都可以归结为点、线、面的组合构成。

在版式设计中，点是有面积的，只有当它与周围要素进行对比时才可知这个具有具体面积的形象是否可以称之为“点”。从内在性的角度来看，点是最简洁的形态，它是由形状、方向、大小、位置等形式构成的。点即是最简洁的元素，也是最基本的要素。在版式中，可以通过大点与小点的对比关系，突出主次，也可以通过重复排列形成一种视觉上的冲击。

在设计中，点在版面上的的运筹和安排要服从整体风格，在整个风格的基础上，做到区分主次，突出重点。以《艺术与设计》系列为例，作为一个艺术类刊物，书的封面颜色或是清雅或是大胆，都会在视觉上给观看者很强的冲击力，把艺术类书刊的氛围表现得淋漓尽致，但是这本书的封面运用的元素很简练，可见成功的设计并不需要各种元素一拥而上排列在版面上，运用最关键的几个点，突出整体风格和氛围才是好的版式。

点的作用在设计中是最基本的，作为视觉中心的核心，这些点积聚起来要有一种很明显的凝聚力，能够抓得住读者的眼睛，而小的、散的点，它们分布在整个版面的各处，虽然多如天上的繁星，但是每一颗都有其特别的意义。

2.线

版式设计中，线的应用要符合线其本身的运动规律和性格，突出版式设计的艺术感和美感。线具有切割空间的作用。线的功能主要体现在分栏和图文混排模式，有时也会起到融合图文的效果，产生流动性的美感。线是有方向性的，它引导我们的视线随之前行。不同源头的线在一点交织，这个交点就是中心，即视觉中心。现代设计越来越趋于追求简洁的美感，蒙德里安曾用硬的线条切割平面空间，再对小的空间格子进行规划，赋予不同的颜色，于是生成了很好的韵律感和平衡感。

线在版式设计中的表现力远远高于其它元素，直线给人简单直接的视觉感受，曲线则有柔和动感之美，自然、亲切。在美学中，线体现了形式美，丰富了人们的视觉感受。

3.面

点和线在平面空间上的延伸便形成了面。点、线、面共同构成了一个完整的主题。面在基本元素中属于面积比较大的，它特别强调元素的位置关系。在排版设计中要注意各个元素之间的和谐与统一，才会产生具有美感的视觉表现形式。面是点或线延展开来的产物，可以变换成为不同的形态。面的大小、虚实、空间、位置等不同状态都会让人产生不同的视觉感受。

在一本时尚杂志中，内页与封面的色调在读者面前重复出现，刺激读者眼球，能够稳固一部分读者。同时，时尚杂志没有一个统一的色调，会显得杂乱无章。色调的呼应在时尚杂志设计中有一定的潜移默化的作用，有的体现在刊物名称上，有的体现在人物的着装上，有的体现在背景上，有的体现在标题上。有些杂志封面善于大面积采用同一色调，以《时尚芭莎》为例，很多期的杂志都是标题采用白色，关键字采用红色，而背景则是浑然一体采用同一色调，版式设计简洁舒适。通过色调内部和外部的统一，整个版面看起来十分和谐。

二、版式设计中的形式语言

1.节奏

节奏本是指音乐中音响节拍轻重缓急的变化和重复。节奏这个具有时间感的用语在构成设计上是指以同一视觉要素连续重复时所产生的运动感。在版式设计中，有规律的重复和对比因素的存在是节奏产生的基本条件。节奏既有同等距离的连续形式，也有大小、明暗、渐变等的不同排列构成。当在节奏中渗透美和感情，也就有了韵律。

节奏即各色彩要素的有秩序的变化。它包含色彩明度的深浅、色相的不同、彩度的纯和浊、面积的大小、色块位置的高低和方向以及色彩心理造成的冷暖、轻重、远近、软硬、动静等有秩序的变化。

2.韵律

韵律原本指音乐中的声韵和节奏，平面构成中单纯的单元组合重复易于单调，由有规则变化的形象、等比处理排列，则使之产生音乐、诗歌的旋律感。韵律的支点其实是节奏，节奏也是韵律设计的基本因素。

综上所述，版式设计中的视觉元素和表现形式在设计中的表达是多种多样的。不管是具象还是抽象的表现形式，都会因为排列的不同而给人各种特色的视觉冲击力，所有的元素都不是独立存在的。善于把握各个元素之间的关系，可以使版式设计的整体感和美感得到更好的表达。因此，正确把握好个元素还有各种形态之间的联系和差别，对于设计出更好的艺术作品，增加作品的神韵和美感，具有重要的意义。

参考文献：

[1]吴祖慈.艺术形态学[M].上海：上海交通大学出版社，2003：74-76.

[2]陳瑛，冷先平，吴志勇.商业版式设计[M].北京：化学工业出版社，2004：35-37.

版式设计中的错视空间 篇7

错视空间作为艺术空间的一种, 利用特殊的错视表现方式, 在平面版式中产生多变的层次和不确定的空间关系, 造成刺激、新奇的变幻莫测的艺术空间效果。正因为如此, 错视空间的表现方式愈来愈受设计者和观看者的喜爱, 成为大家竞相模仿、发展、探讨的一个话题。随着设计师表现手法的多样性, 版式设计作品视觉冲击力的增强, 现在已经有越来越多的观者喜爱并为错视空间的特殊表现形式所吸引。

图与底的关系

阿恩海姆认为:“图形与基底之间的关系, 就是指一个封闭的式样与另一个和它同质的非封闭背景之间的关系。”我们在看东西时, 必须将物体与它的背景分开, 才能看见这个物体。人们习惯于将看到的物体称之为图, 背景则称之为底, 这就是图底关系。

人类从婴儿时期便开始适应自己周围的空间, 然后一步步地建立对空间的总体感觉。在成长的过程中, 由于人自身已经完全适应了空间, 对自己通常的活动都是自然而然地保持着清醒, 这是因为一切活动都是为了使你能更好地在一个三度空间中生活。正是这种对空间的适应, 使得大家在看到一个圆环图片的时候, 几乎所有的人都会将其看做是一个纸面上的圆, 而不会把它看做一个环。我们从这一图像发现可以把圆看做图形, 把纸这个平面看做背景, 并且图形圆看起来在背景的前面。反过来, 背景在图形的后面延伸。这个例子是一种普遍的现象, 人们习惯于将看到的前面的图形“圆”称为“图”, 后面的纸面背景称为“底”, 这就是图底关系。“用前面、后面这两个词来讨论只是画在平面上的、根本不存在任何深度的一张纸的某个部分的确微妙!这充分说明, 我们这样适应于空间, 以致能以特殊的感觉来对平面的刺激作出反应。” (1) 人们在观看事物的时候, 实际上总是会受到经验、需要、情绪、意愿的影响。克罗齐认为:“我们倾向于看见我们以前看到过的东西, 以及看见最适合于我们当前对于世界所全神贯注的和定向的东西。”人的视觉习惯于把对象进行有效的整合、分出主次、理清层次, 这说明图与底之间能使人产生心理空间。

图底关系的基础

图与底的关系在视觉上是可以相互转换的。将图底关系这一现象进行科学、系统学术研究的是哥本哈根的鲁宾 (E·Rubin, 1886-1951) , 非常著名的《鲁宾之杯》就是他的研究成果———如果我们一直看着黑色的杯形, 就会看到两个侧面的人脸形象, 而白色部分的杯形就会后退为背景;反过来, 如果注视白色的杯形, 黑色的两个侧面人脸部分又会后退为背景。我们无法同时实现这两部分图形, 也就是说, 当你把一部分认为是图的时候, 另一部分则成为底。反之, 原来意义上的图就会成为底。由于这种不断变化的前后层次关系, 使人的视觉处于一种极不稳定的状态, 由此产生一种刺激, 这正是设计所要达到的有趣的图底关系的目的。其中杯形和人的脸形像共同的轮廓线分别蕴涵两种不同的图形, “你中有我, 我中有你”, 创造出浑然天成的有机体, 图与底是画面中一对重要的概念。因此, 从图底关系的构成中, 我们应该注意作为底的背景的处理, 使它在画面的整体上起到重要的作用。

在鲁宾的研究中还发现有这样一个因素:“凡是被封闭的面, 都容易被看成图, 而封闭这个面的另一个面总是容易被看成底。这一因素中其实还包括着另外一个因素, 这就是:在特定的条件下, 面积较小的面总被看成图, 而面积较大的面总是被看做底。” (2) 通常情况下, 人们在看物体的时候往往集中于一点而把周围的一切当做环境和背景。从上面对图底关系的分析中我们得知, 画面中图与底的合理安排与使用能够使画面主次分明, 层次清晰, 为画面营造出丰富的空间层次。如图与底的安排分量相当又能创造出交替的图与底的视觉效果, 增添了画面上的趣味性, 满足了人们的审美和心理需要。

图底关系也叫“正负图形”。它是元素在相互矛盾、相互补充、相互统一中形成的图形。正负图形中的“有”和“无”、“实”和“虚”也是在相互矛盾、相互依存中统一起来的。其中所表现出的两个方面是宇宙万物的精神本原和物质本原。最具代表性的表现形式就是中国的太极图 (俗称阴阳鱼) 。这种图式结构最早在彩陶纺轮上出现时, 是作为纺轮旋转的一种模拟, 也是人们精神生活的一种直接反映。纺轮彩纹转动时, 不但能产生多样的美的旋律, 同时也便于观测转动的速率, 有利于生产更便于使用。古代思想家取了这个形象用来说明它的一种哲学观点, 《易经》有“易有太极, 是生两仪”之说, 所谓“太极”就是当“天地未分之前, 元气混而为一”, 好像是混沌一团的一个圆形;所谓“两仪”就是由太极分化出来的天和地, 天为阳, 地为阴, 于是在圆形内画出一黑一白相对照的回旋纹, 说明天地的运转和无穷的生命力, 这就是所谓的“太极图”。阴阳鱼首尾相接, 围绕一个中心回旋, 呈现出一种前后、上下、左右相顾相随的核心运动。显示了图与底相互依存又相互对立, 相互拥抱又相互隔离的哲学内涵。我们这里对它的哲学内涵不作深入的探讨, 单从图形设计的巧妙性来说, 它成功运用了图底关系的表现手法, 表现了典型的中国式的图形与背景空间相互依赖的表现方式。在其中我们还能够感觉到疏与密、动与静、虚与实、变化与统一等的空间美, 使人在这种变换的空间中细细品味、回味无穷。这种因素渗透到了每一个艺术领域, 在版式设计中更是如此, 使观者感受到图与底中的对比统一在画面中的微妙空间变化, 体现了版式设计的独具匠心。

图与底的空间表现

当观看画面时图与底相分离, 产生一种前后的层次关系, 这样才能更好地理解形象, 这是人对图底关系的一种最简单、最普遍、最原始的认识方式。版式设计中图底的空间关系是设计师巧妙设计的, 当我们的视觉集中于一种图形时, 另一种图形则后退为背景, 反之亦然。图底关系在强调图与底同等重要的基础上, 从多视角去观察生活, 充分利用一切可利用的元素进行精心巧妙的设计。如鲁宾所说:“被围裹在一条轮廓线内的面总是被视为图, 周围的围裹面总是被视为底;就质地来说, 质地紧密的易被视为图, 质地疏松的易被视为底;就上下来说, 因下半部较‘重’, 就容易被视为图, 上半部较‘轻’, 容易被视为底;就颜色来说, 红色、黑色易被视为图, 蓝色、白色易被视为底;就图的形状来看, 较为对称和规则的形, 容易被视为图, 其他则易被视为底。”鲁宾较为详细地说明了图与底在理想状态下, 人们对它们的认识。 (3) 因此, 图底关系的处理就是将图形的层次按照需要进行安排, 诉求什么, 主题是什么, 让人一目了然, 有意识地将图底分开有利于事物的识别。

我们会发现当有多个形体组成一幅画面时, 人们会有意识地将画面中的图形分成不同的层次, 并且尽力使它们凸显于背景之上。这样也就很自然地出现了一个图形与背景的关系, 也就是图形之外的背景对图形起到的作用能够影响图形的程度。一般来说观赏者能够注意到主体物体, 但不能同样察觉到背景所在。虽说如此, 背景也不是随便怎样都行的, 而是相当重要的部分, 因为它的任务是要使主体更容易被关注。即使形象能够与背景融为一体, 影响人们的理解和分析, 但是人们还是试图把背景和图形分离开。在图底转换的构成中, 设计师应该有目的、有意识地注意空白背景的自身意义和将在画面整体范围内起到的重要作用。背景不应成为某种干扰因素, 而应成为画面中形与形连接的不可分割的一部分。

图底的互换与共生

这种表达实际上是公用边界线, 往往是把两种不同的图形嵌合在一起, 当我们的视觉集中于一种图形时, 另一图形则退为背景。这种图形容易产生不确定的空间感, 给人一种不安定的感觉。正是这种不确定的空间关系, 表现出一种游戏式的趣味形式, 使作品表现出一种“动态”空间, 让人产生强烈的好奇心。

荷兰版画家M·C·埃舍尔 (M·C·Escher) 的作品, 多是以具象的动物、建筑和人物为主, 结合少量的抽象几何图形, 他的作品不同于其他艺术家力求表现优美的形态, 他所用的图像相对比较客观甚至怪异, 因为他着力表现的是图像与图像、图与底之间的关系, 而且对此有着持久不衰的兴趣, 并力图通过复杂具体的形象来突破单纯的空间层次。《昼与夜》是埃舍尔一幅杰出的作品, 运用黑白图底互换的规则, 在一幅图中完成了从白天到黑夜的自然过渡, 田地变成飞鸟, 飞鸟变成天空, 与城堡、河流、船只一起完美地融为一体。在一般图形中底是主体图形的陪衬, 但在埃舍尔的这幅作品中图与底是等量的。图就是底, 底就是图, 任何一部分都有变化的可能, 因此这幅作品的空间关系显得更是难以捉摸, 到底是天与地的空间, 还是白天与黑夜的空间, 由观者自己去揣摩、总结, 但不论你得出什么结论, 埃舍尔都会回应给你一个神秘的微笑。

日本设计师福田繁雄善用图底互换进行设计, 并使他的作品大放异彩。他曾说:我们必须学习向前推与向后拉是同样实存而有效的一种力量。然而, 将图底反转的原理应用在设计形式上则是一项令人着迷的工作。在日本的京王百货举行个展的宣传海报上, 他就开始运用图底互换的图形与背景之间的互补性、可逆性原理来探究版式设计, 并尝试巧妙地将男性与女性的腿一上一下、忽前忽后地并列构置, 其手法为“正倒位图形反转”, 创造出了生动而有趣的效果。这幅作品中的形象, 成为福田造型的代表形象。

另外图底形象经过变异组合, 还可以构成极具视觉表现力的三面封闭一面开放的图底关系, 即所画的形象以外的背景部分仍然能呈现为某种图形。如中国妇女联合会的标志设计, 采用英文WOMEN的字首“W”用以寓意“妇女”, 并由此派生出3个“W”, 构成一朵娇美的花朵。当陈汉民教授在花心处加了一个圆点之后, 该标志顿时发生了惊人的变化, 原先的3个“W”构成的黑色图形被取而代之变成了汉字“女”字, 这一空间信息的构成可谓天衣无缝, 绝妙之极。这种空间的设计方式意在构建一种“隐匿空间图形”的意境, 让人细细咀嚼, 仔细体味, 给人“形有尽而意无穷”的审美感受。表现出一种融洽、团结有致的团队精神。黑色图形与白色背景呈半封闭的图与底的构成形式。观者的视线一会儿被白色图形吸引, 一会儿又被黑色图形吸引。这种图与底的空间结合, 在某种程度上造成了视觉上的僵持, 观者只有在反复的回味中才能逐渐看出其全貌。这种有趣的图底关系能够创造一种包含图形背景与主体视觉切换的设计。图与底的关系乃是彼此交织, 不可分割的整体, 虽然它们原本存在着矛盾冲突的状态, 但是若能善用, 则可达到充满趣味、富含寓意的效果。而这种互生互存的关系, 不仅可将主题与背景相互交融成为一个共同体, 也会使整体画面具有包容性与双重性的微妙合作关系。有效地处理好图底关系, 不仅能使主题一目了然, 还能最大限度地利用空间, 简约图形, 增强版式设计的视觉趣味性。

参考文献

①卡洛琳·M·布鲁诺[美]著:《视觉原理》, 北京大学出版社, 1987年版, 第62页。

②阿恩海姆著:《艺术与视知觉》, 四川人民出版社, 2001年版, 第302页。

版式设计中的图底关系 篇8

1、版式设计的概念

“版式设计, 就是在二维的长宽比例中, 将有限的视觉元素进行有机的排列组合”, 版式设计将理性思维, 个性化地表现出来, 是一种具有个人风格和艺术特色的视觉传送方式。在传达信息的同时, 产生感官上的美感。

2、版式设计的作用

版式设计又称编排设计, 是平面设计中的一个组成部分, 为视觉传达设计的重要环节。版式设计当然要调动各类视觉元素进行形式上的组合排列, 但更重要的是版式上新颖的创意和个性化的表现。同时能够强化形式和内容的互动关系, 以期全新的视觉效果。

二、版式设计的范围、主要功能

1、版式设计的范围

版式设计涉及到平面设计的各个方面, 诸如广告、包装、报纸、杂志、书籍、宣传手册、CI、网页设计等。

2、版式设计的主要功能

“版式设计是现代设计艺术的重要组成部分, 是视觉传达的重要手段, 表面上看, 它是一种关于编排的学问;实际上, 它不仅是一种技能, 更是技术与艺术的高度统一”版式设计是现代设计者必须具备技术知识。它所体现的不仅仅是理性的知识, 还是理性与感性审美的统一。富有一定理论色彩的版式设计能体现出设计的严谨性和专业性。

三、决定图底关系的因素

1、相对较小、相对封闭的区域易被认作图形。封闭性是图形有了明确的轮廓和形状, 而扩散与弥漫的背景则被认为是无具体形状的。

2、相对规律易被认作图形。一般一副图中那些较规律图形给人的视觉冲击力大, 而底就会退居其后。因此很容易辨别清楚图底。

3、在直觉上“有意义”者易被认作图形。如《鲁宾之杯》是著名的心理学测试案例。当我们注视画面的中央区域, 把它看做一个酒杯时, 该中央区域显示出知觉的“意义”即被认作图形。然而当我们转而注视画面两侧, 并且认出是两张侧面像人脸时, 图底关系发生了转换, 原来的“图” (杯子) 变成了“图” (双人脸) 。

四、如何处理版式设计中的图底关系

1、矛盾空间、错视原理的运用, 如福田繁雄的海报, 主画面为福田名字的首字母”F”, 对该字母进行变化。在其轮廓内部根据主题内容进行图形元素的置换, 而是以”F”为基本型, 作者对其以往在众多平面作品中惯用的图形符号或表现方式进行的重现。福田的海报语言简洁、幽默、巧妙并深刻, 常以简练的线和面构成, 具有强烈的视觉张力, 充分显示了他对图形语言的驾驭能力。

2、正负位图底反转的运用, 1975年福田繁雄为日本京王百货设计的宣传海报中, 其图底关系表现的淋漓尽致, 他故意不明确交代图与底, 让图与底产生反转互溶的现象, 进而产生双重意象, 同时也赋予整个画面无限扩展的空间。作品巧妙利用黑白、正负形成男女的腿, 上下重复并置, 黑色"底"上白色的女性的腿与白色"底"上黑色男性的腿, 虚实互补, 互生互存, 创造出简洁而有趣的效果。

3、放射状图底反转, 1984年福田繁雄的《UCC咖啡》海报, 他以搅拌咖啡的杯中漩涡正负纹理交错, 造型成众多拿着咖啡杯子的手, 并呈螺旋状重复并置, 突出咖啡这一主题图形又不失幽默情趣。我们称这种将主题图形分置并列呈现出相互回转展开的动态意味的手法, 为放射状图底反转。

4、水平交错式图底反转的运用, 1986年福田繁雄作品展海报, 他将女人躯体的轮廓从中部横向分割, 并且被分割的图形做重复的平移式交错重组, 造成图底交叉汇合的错视, 我们可称之为影像的“水平交错式图底反转”。

从福田繁雄的作品中给了我们很大的启示, 在版式设计中互生互存的图底关系不仅可将主题与背景互相交融成为一个共同体, 也会使整体画面具有包容性与双重性的合作关系。也使图形在简洁的构图当中给人以强烈的视觉冲击力, 让人从趣味中获得新的思维。

五、图形、色彩、文字的视觉次序对图底关系进行编排

版式设计要求准确快速的传达信息。必须完全合理的利用图与底的视觉次序进行编排, 使这些视觉语言要素呈现一条完善的视觉次序, 从而带动观众依次阅读需要传达的信息。以统一方便面的平面广告为例。红色背景的延展将视线带领向画面上方的口号式广告语。再次被色彩明度吸引收束于黄色, 完成一个完整的色彩次序。在画面右方有一组发射构成形式的同心圆式弧线, 明亮度明显高于其他图形, 圆弧线具有张力效果和旋动的动感暗示, 带同视线向画面左方移动。画面中部和下部延续舒缓的波浪线引导视觉缓慢移动, 经过主题形象。左侧弧线起到和右侧弧线同样的作用, 旋转的动态带动视线向画面上方移动。画面上方的自由曲线明暗渐变形成箭头式的形态暗示, 方向指向性明确, 引导视线划过广告语。尾部渐变消失, 使得视觉向下收束至黄色的起点。

在这里图形、文字、色彩共同服务于一个目的——增强阅读效率, 在相对短的时间里将大量信息次序的传达给观者, 利用这个潜在的向导达成一个流畅的阅读次序, 在这个流畅的次序中有目的的编排信息, 依次传达层层递进。

六、结束语

在电脑的辅助设计下, 许多复杂的图形处理、文字的分解叠合、多维空间的传达都变得更容易表达, 各种各样的风格设计带给我们的是更自由, 更活力的人性化设计, 这也是当代平面设计追求的风格与时尚前卫的标志。

参考文献

[1]eye4u视觉工作室:《进阶级理解版式设计》, 中国青年出版社, 2009年6月。

[2]李放:《唯美至上》, 天津杨柳画社, 2007年8月。

[3]Sendpoint Books:《全球最佳版式设计》, Sendpoint Books, 2010年2月。

[4]蔡顺兴:《编排》, 东南大学出版社, 2006年10月。

[5]杨敏:《版式设计》, 西南师范大学出版社, 2006年8月1日。

[6]锻炼:《版式设计风暴:赏析与实践》。电子工业出版社, 2007年。

浅谈版式设计中的“黄金比例” 篇9

(一) 内容

版式设计就是在有限的平面上, 根据设计要求, 运用相关美学知识, 结合视觉关系以及背景色彩的合理应用, 进行版面的点线面的分割, 设计出美观实用的版面。

(二) 基本类型

包括了骨骼型、满版型、上下 (左右) 分割型、中轴型、曲线型、对称型、重心型、自由型、倾斜型、三角型、并置型和四角型等一共13种类型。

(三) 原则

1. 思想性与单一性。

排版设计本身就是为了更好的传播客户所要表达的信息, 部分设计师只是沉醉在自己设计作品的艺术感中, 却没有按照设计主题曲完成, 因此会出现很多失败的实际。一个成功的版面设计, 最重要的就是要先去理解用户的目的和想要表达出的信息, 然后深入了解再去设计会事半功倍。一个好的版面设计只有主题鲜明, 简单易懂才能够算是一个合格的版面设计。

2. 艺术性和装饰性。

在版面设计主题明确之后, 版面的布局与结构的表现形式就是版面艺术的核心内容, 也是一个很艰难的设计过程。设计师应该考虑的就是如何才能做到有新意、有美感又不会让人觉得枯燥。因此排版设计是对设计师的很大的一个考验, 只有设计者有深刻的内涵素养, 才可能设计出完美的版面。版面通过文字、图形以及色彩的拼合, 运用一些夸张的手法, 来表达设计者的目的, 不仅是一种美观的设计, 还起到了突出版面新淫读者的作用。

3. 趣味性和独创性。

版面设计不仅要从美感、艺术感去考虑, 还有融合一些趣味的东西, 从而改善部分设计的枯燥性, 调动读者的兴趣, 更加吸引读者。趣味性可以采用寓言、动画或者是幽默等方式来表达。独创性则是任何行业都在抑制追求的特性。鲜明的主题设计是一个版面的灵魂, 要想更出众, 被大家所记住, 那么创新、别出心裁的设计就会为你加分, 在一个版面的设计中, 多一些创新元素, 更容易赢得消费者的喜爱。

4. 整体性和协调性。

版面设计必须追求完美、符合主题, 这是设计最基本的要求。若只是从单方面来讲只重视形式忽略内容或者是只重视内容忽略艺术表现, 那么这种版面设计就是失败的。只有合理的把内容与设计巧妙的融合在一起, 强化整体布局与结构, 才能体现出版面的社会和艺术价值。而版面设计的原则性就是对版面各种元素的安排的结构和色彩方面的相关性, 通过对版面间的图文和色擦的组合与协调, 使版面更具有艺术美感。

二、版式设计中的黄金比例

(一) 传统的黄金比例

黄金比例又称为黄金分割, 是指事物之间各部分的数学比例关系, 较大部分与较小部分之间的比值越是1:0.618, 这个数值被公认为最具有审美意义的比例数值。在版面设计中也有一定的应用, 给人们带来美感与享受。

(二) 现代设计理念中的黄金比例

随着现代人审美观念的改变, 出数字的黄金比例已经不再能满足其的需求, 而且现在电脑技术的发展也是复杂的设计变得更加简单易操作。而人们对比例之一定义也进行了新的理解:不仅可以代表部分与部分的比例, 还可以是尺寸、颜色、长度等等方面的比例。主要是突出表现在外形与色彩构造的比例上, 从这些方面给人们带来相对的美感。

1. 大小的对比。

大小关系是造型设计要素中最受重视的一部分, 几乎可以决定意象和调和的关系。大小的关系差异小, 消费者的感觉就会相对的更加温和, 差异大就会给人较鲜明的对比, 具有突显感。如何把握好这个比例的是适度性也是版面设计中黄金比例的一个重要问题。

2. 明暗的对比。

明暗关系的对比可以表现在版面设计的画面感中, 例如白天和黑夜, 事物的正与反等方面, 明暗关系是色彩中的最基本的要素, 消费者能够辨别色彩带来的冲击感, 但是最基础的本质上也就是最容易被接受的, 明暗对比的程度是把握现代版面设计黄金比例的一个关键元素。

3. 位置的对比。

在画面两侧放置某些物体, 不仅可以起到强调的作用, 还能产生对比, 吸引读者注意力。画面的上下、左右以及对角线上的四个点都具有这种潜质, 若是在这些位置放置照片、文字或者几号等元素, 可以显现出意想不到的效果。因此, 注意版面中的某些位置放置鲜明的元素, 可以显示出相关的对比关系, 产生紧凑的画面感。对版面设计的比例也是有冲击的。

三、版面设计中黄金比例的研究意义

通过对版面设计的黄金比例的研究, 相关设计工作者可以更好的对版面设计进行理解, 并对自己存在的不足进行改善, 从版面的布局和结构以及色彩的对比度等方面进行版面设计, 运用相关的自然元素, 使整个版面更加具有美感, 更能吸引消费者的眼球, 达到设计师的初步要求。另外版面设计的黄金比例的研究也加强了设计师的责任感和求知力, 对于自己有更高的要求, 不断提升自己的能力与设计美感, 从而加强自身的素质。

结束

综合来看, 黄金比例不是固定的数值, 也不是一种纯粹的美感, 它是设计中各种元素、布局结构, 色彩对比的融合, 单纯的考虑数值的比例或者单一的看待元素的组合都不会达到最好的效果, 现代设计中的黄金比例要考虑到更多方向的设计因素, 进行更好的融合, 从而设计出更加完美的版面设计作品, 增长消费者的见识和满足消费者对美的欣赏。

摘要：版式设计是现代设计艺术的重要组成部分, 是视觉传达的重要手段。它不仅是一种艺术技能, 同时也实现了技术与艺术的完美融合。而在设计中最重要的就是要有适度的比例。众所周知, 比例是整体与部分或者是部分与部分之间数量的一种比率, 可以代表现代生活和现代科学技术的抽象的艺术形式。随着现代人审美水平的提高, 黄金比例是版式设计中追求的完美比例, 寻求最大程度上的画面的和谐感。本文对版式设计的内容、特点进行分析研究, 特别是对设计中的黄金比例进行了深入的分析, 对如何达到设计中美的和谐进行探讨, 提升设计的美感。

关键词：版式设计,内容原则,黄金比例,美感

参考文献

[1]张伟.数值比例在书刊版面设计中的作用[J].山东轻工业学院学报 (自然科学版) , 1998 (02) .

版式设计在网页中的重要性 篇10

关键词：网页设计,互联网,浏览网页

1 网页的原则

网页设计由于是在电脑屏幕上观看的, 还需要跟浏览者进行互动, 这就和普通的平面设计有了质的不同。观看载体不同, 所以我们在研究网页设计的时候, 除了要研究网页的美观还要研究浏览者在面对网页的心理感受, 要让读者先从功能上对其有个认知, 在认知基础上才能进行制作版面的设计。这就使得网页设计的这门技术还需我们做更多的相关探究。

2 网页的布局风格

网页布局, 就是以最适合浏览的方式将图片和文字排放在页面的不同位置。看看我们经常用到的版面布局形式:

(1) “同”字型布局。这种布局结构的最上面一般是网站的标志、广告以及导航栏;下面是主要内容, 左有一些栏, 右也有一些栏目, 在结构的中间位置是内容主体;结构的最下面是一些网站的基本信息及版权信息。国内一些大中型网站常见的是这种结构布局方式。这种结构的优点是把版面充分的利用了起来, 让读者有很大的信息量进行阅读;它的缺点是页面看上去灵活性不够, 有时也给人一种拥挤的感觉。

(2) “厂”字型局:这种布局结构的特点是在页面的顶部设为标志和广告条, 下方左面为主菜单, 右面显示正文信息。本布局方式是目前应用比较广泛的一种。本布局的优点是主次非常分明, 页面结构一目了然, 很清晰;它的缺点是对色彩搭配要求比较高, 如果搭配不当的话, 会给人以规矩呆板, 甚至容易引人厌烦。

(3) “框架”型布局:这种布局结构一般为上下或左右布局, 一栏是导航栏, 一栏是正文信息。也有将页面分为三栏的, 上边一栏放图片广告, 左侧栏放导航栏, 右侧为正文信息。

3 网页布局清晰的原则

3.1 网页的标题设计

在网页的版式设计中成功的标题可以让人一目了然和赏心悦目, 也能给整个网站提高气氛。网站的首页上方会有公司的标题, 标题后面的背景也有静态的和动态的区分, 也可以形成交互性。这也是网页的版式与普通印刷品版式的区别。

3.2 文字的编排

文字本身是以传达内容和表达信息为主题的。在网页设计过程中, 网页的设计一定要抓住这个主题不要放松, 但是同时也可以利用字体也表达一定的感情, 例如:粗体字强壮有力, 有男性特点, 适合机械、建筑业等内容;细体字高雅细致, 有女性特点, 更适合服装、化妆品、食品等行业的内容。同时设计者也要考虑到一些细节的内容, 如很多读者的计算机中只装有三种字体及一些相应的特定字体, 如果没有特别强的针对性的要求, 最好采用缺省字体。

字号的大小也有一定的要求, 如标题和其他需要强调的地方用字号大一些, 如9磅, 而网页的正文, 这是人们阅读量最大的, 12磅的字体是比较合适的, 像一些页脚的和辅助性的信息, 可以使用能小一点的字号。

页面里的正文部分, 这个部分是最重要的部分, 这部分的内容是由许多单个文字经过编排组成的群体, 这个群体影响着读者的阅读, 可以从艺术、个性、情感方面对这部分进行处理, 以达到最好的抓住读者眼球的作用。

3.3 图文结合

版式有可以分为无图的版式和有图的版式, 有图的版式钢架丰富, 无图的版式需要给人不容易枯燥的感觉就需要巧妙的排版了, 两种版式都不可缺少, 当然网站上更多的还是图文结合的版式。

在视觉顺序上, 从吸引人的注意力角度来说, 图形对人眼球的吸引力远远是超过了纯文字对人眼球的吸引力, 图形给人的视觉印象要比文字强烈得多, 这是因为图形的色彩变化明显, 所含内容也异常丰富, 同时图片的引入也对页面起到好很好美化作用。可以说, 要使网页更好的吸引人的眼球, 更好的抓住人们的视线, 并在纯文本基础上变得更有趣味, 最为简捷省力的办法就是使用图片。几乎所有的网页都用到了图形, 善于使用图形, 可以让网页的主题表现的更加生动、形象和直观, 同时也较好地增强网页的宣传力、号召力和感染力, 吸引读者的注意, 引起读者的兴趣。网页可以图文并茂地向用户提供信息, 成倍地加大了它所提供的信息量。对于一条信息来说, 图片对浏览者的吸引远远超过单纯的文字。页面的节奏韵律。这也是图文排版的魅力所在。

4 网页视觉美观的原则

网页的颜色表达一种情感, 也象征不同的含义。这些象征含义在人们思想交流形成了复杂的问题, 如人们的时代、民族、年龄、地域、阶层、工作能力、经济地区、通过不同的颜色组合, 呈现给他们的心理感受是截然不同的。如紫红和土黄搭配, 可以产生高贵的, 的气氛。粉色和白色混合, 能体现柔顺、雅致、浪漫的气氛。金色和大红、金色的搭配能渲染喜庆的气氛。而橙色和黄色的搭配则会给人带来暖意。设计主题的不同, 颜色搭配的方法也随之改变。兼顾网页的适应性, 应尽量使用网页安全色。可先确定一种能表现主题的主体色, 然后根据具体的需要, 应用颜色的近似和对比来完成整个页面的配色方案。整个页面在视觉上应是一个整体, 以达到和谐、悦目的视觉效果。

总是, 一个优秀网页的实现离不开以上几点原则, 只要每个细节都做到合理设计一定能够呈现出一个精彩的网站。

参考文献

[1]董海斌.平面视觉元素在网页设计中的应用研究[J].科技信息, 2008 (05) :155.

[2]尹振鹤.云计算的特点及应用分析[J].硅谷, 2014 (12) :126.

[3]邹钰.Auto CAD动态块在室内设计制图中的应用[J].硅谷, 2014 (12) :126.

浅析版式设计中的节奏与韵律 篇11

关键词：美术；版式设计；节奏与韵律

节奏与韵律来自于音乐概念，正如歌德所言“美丽属于韵律”。韵律被现代版面构成所吸收。节奏是按照一定的条理，秩序，重复性连续排列，形成一种律动形式。它有等距离的连续，也有渐变，大小，长短，明暗，形状，高低等排列形成。在节奏中注入美的因素和情感的个性化，就有了韵律。韵律就好比是音乐中的旋律，不但有节奏，更有情调，它能增强版面的感染力。

在平面设计中，节奏和韵律包含在各种构成形式中，但其中最为突出的是表现在“渐变构成”和“发射构成”两种形式中。下面我们将详细地学习这两种形式，从这两种形式中去体会节奏和韵律的美感。

一、渐变构成

渐变是指以类似的基本形或骨格，渐次地、循序渐进地逐步变化，呈现一种有阶段性的、调和的秩序。这种表现形式，在日常生活中是极为常见的。这些采用渐变形式所构成的结构，具有很强的节奏感和韵律美。

渐变形式是多方面的，包括大小的渐变、间隔的渐变、方向的渐变、位置的渐变和形象的渐变等等。下面将为大家讲解几种主要的渐变形式：

1、大小的渐变。依据近大远小的透视原理，将基本形作大小序列的变化，给人以空间感和运动感。

2、间隔的渐变。按一定比例渐次变化，产生不同的疏密关系，使画面呈现出明暗调子。

3、方向的渐变。将基本形做方向、角度的序列变化，使画面产生起伏变化，增强了画面的立体感和空间感。

4、位置的渐变。将部分基本形在画面中的位置做有序的变化，会增加画面中动的因素，使画面产生起伏波动的视觉效果。

5、形象的渐变。形象的渐变是指从一种形象逐渐过渡到另一种形象的手法，可以增强画面的欣赏乐趣。

除此之外，渐变形式还包括自然形态的渐变、色彩的渐变、明度的渐变等等，。在实际运用中，我们可以将这些形式结合运用，可以取得更加丰富且具有变化的画面效果。

二、发射构成

发射是一种特殊的重复，是基本形或骨骼单位环绕一个或多个中心点向外散开或向内集中。在生活中，我们会经常看到发射构成的图像，例如自然界盛开的花朵，绽放的烟火等等。

发射具有两个显著的特征：一个是发射具有很强的聚焦点，这个焦点通常位于画面的中央；另一个是发射具有一种深邃的空间感，使所有的图形向中心集中或者由中心向四周扩散。根据发射特征的不同，可以将发射构成归纳为以下几种：

1、离心式发射。这是一种发射点在中央部位，其发射线向外方向发射的一种构成形式。

2、向心式发射。这是一种发射点在外部，从周围向中心发射的构成形式。这是与离心式相反方向的发射骨格。

3、同心式发射构成。发射点从一点开始逐渐扩展，如同心圆渐变扩散所形成的重复形。这种构成，由于主要放射线，都集中在一起，格式变动有较大的局限性。所以，在应用时可以结合其他形式，使画面效果更加丰富。例如在下面广告设计作品中，不仅采用了同心式发射构成，还结合了不同间距、不同大小的色块进行对比，使画面更加具有变化性。

4、多心式发射构成。在一幅作品中，以多个中心为发射点，形成丰富的发射集团。这种构成效果使画面具有明显的起伏感。例如多心式放射构成的应用，增加了画面的空间感。

网页设计中的版式设计 篇12

1 网页版式设计

1.1 网站制作流程

每个网站在主题、内容、规模、功能等方面都各有不同, 但是有一个基本的开发流程可以遵循。第一阶段是规划网站和准备素材;第二阶段是网站的总体设计和网页版式设计及具体制作;第三阶段是测试、发布、推广与维护网站。可见网页版式设计是网站制作过程中一个非常重要的环节。

1.2 网页版式设计步骤

网页版式设计就是我们在浏览器上看到的一个完整页面。设计师依据网站理念, 将造型、结构、信息、色彩等视听多媒体元素进行有机的排列组合, 将理性思维个性化地表现出来, 达到某种视觉效果, 从而形成网页风格的整体设计。它是网站风格的重要体现, 是决定网站外观的直接表现形式。用photoshop进行网页版式设计的步骤如下:

1.2.1 构思

根据网站的主题及访问群体确定网站整体风格, 并设计版面布局。常见的网页版面布局类型:T型布局、口型布局、三型布局、POP布局等。用哪种布局需具体情况分析。如内容多, 可用口型或T型布局;如展示型企业网站或个人风采的主页, 则POP布局是首选。

1.2.2 用photoshop进行页面整体设计

根据设想的网页页面布局, 用photoshop设计网页页面的效果图。这一步主要是把网站的标志、广告条、菜单、导航条、图象等信息

1.2.3 对页面图象切片并形成网页文件

页面整体效果图设计好后, 利用切片工具将图象文件切割成小图象并优化, 保存为网页文件。一般来说, 头部的色彩丰富, 中间和底部的色彩比较少。为尽量缩减文件大小, 可以在photoshop中分别选择头部、中间、底部分别处理裁切, 另存为几个不同文件, 然后切图。

2 实例设计

本实例以为博士伦眼镜进行网站主页设计为例。首先打开photoshop, 新建一个文件, 尺寸为978*600像素, 颜色为RGB模式, 背景颜色为深灰色。然后根据网站主题, 图片色彩确定白色和灰色为网页主色调, 局部使用绿色、棕红色, 简洁明了, 视觉效果好。最后通过布局模块, 元素整合等步骤, 简单制作出一个网页雏形, 如图1。

本实例主要使用矩形选框工具、椭圆选框工具、钢笔工具, 使用填充命令填充颜色, 然后用文字工具将网页名、导航栏上的菜单名等输出并加入准备好的图片素材, 即可达到以上效果。

3 应用技巧

用photoshop进行网页设计时, 适当运用一些小技巧, 可增加网页的美感。如对本实例中进行一些细节设置, 即可让页面更生动。

3.1 图层样式使用

图层样式的阴影、发光、斜面和浮雕等效果多次作用, 能让网页元素更有立体感, 如本实例中的多处文字和图片均使用到图层样式。用铅笔工具分别选取一个较背景色更深的颜色和较背景色更浅的颜色紧挨着分别画一条直线, 即可得到如图2B的凹进去的效果。

3.2直线设计

图2A中的上下端线条为多次使用矩形选框工具并填充颜色得到的效果, 缺乏立体感。

3.3 自然光照效果

图1中网页每个模块的颜色都是简单的纯色组合, 其效果显得死板不生动。为让页面色彩更加丰富有质感, 可使用白色的软画笔工具, 点击新建图层, 调整图层不透明度, 即可得到图3的自然光照效果。

通过以上各种细节效果设置, 最后得到效果图如下:

与图1相比, 图4显得整体效果更佳美观高档, 从细节处体现出品质和水平。

4 结束语

Photoshop软件在网页的版式设计中发挥着巨大的作用。正确运用photoshop处理图像, 并对网页进行整体设计, 有利于网页各元素合理的整合, 增加网页的美观效应, 并提高网页的制作效率。

摘要：一个优秀的网站除了需要不断更新的内容、合理的色彩搭配、恰当的构图和先进的技术外, 大方的网页版式设计在网站的艺术设计中同样占据着非常重要的地位。笔者介绍了运用photoshop进行网页版式设计的思路和步骤, 并举实例介绍了一些相关的应用技巧。

关键词：网页版式设计,photoshop,应用与技巧

参考文献

[1]张楼英.Photoshop轻松布局网页[J].大众科技, 2012 (04) .