《网站美工设计基础》第三讲 平面构成.ppt

《《网站美工设计基础》第三讲 平面构成.ppt》由会员分享，可在线阅读，更多相关《《网站美工设计基础》第三讲 平面构成.ppt（116页珍藏版）》请在三一办公上搜索。

1、网站美工设计基础,第三讲 本讲侧重介绍平面构成中的重复、渐变、发射、骨格、特异、对比的基础知识和基本构成方法，提高学习者对平面构成与网页设计的认识和理解，加强学习者实际动手能力的培养。,23 重复,在同一设计中，相同的形象出现两次或两次以上时称为重复。重复是平面设计中比较常用的手法，借助形象的重复，强化对形象的印象，用以加强人们的视觉感受，形成相应的节奏规律，使画面同一。,网站美工设计基础,网站美工设计基础,网站美工设计基础,网站美工设计基础,2.3.1基本形,一般来说，凡是用来重复的形状都可以称作“基本形”。在重复设计中，基本形不宜复杂，宜简约。如过于复杂，不仅不利于组合，而且容易使画面散乱

2、不整，这点应特别注意。,网站美工设计基础,网站美工设计基础,网站美工设计基础,2.3.2重复骨格基本形的构成,重复骨格在构成中如果骨格的每一单位形象和面积均相等时，这就是重复骨格。,网站美工设计基础,网站美工设计基础,网站美工设计基础,重复骨格构成画面，这样的现象生活中随处可见，如操场上做广播体操的学生，建筑墙砖、原野中的秧苗，图案设计等都有基本型的重复，这是一种规律性最强的设计手法，具有整齐、稳定、机械的视觉美感。,网站美工设计基础,网站美工设计基础,网站美工设计基础,网站美工设计基础,网站美工设计基础,2.3.3重复骨格近似基本形的构成,重复骨格近似基本形的构成，是将重复的基本形作一定的局

3、部变化，即整体的统一，各基本型可以不完全一样，但构成的大体效果相同。达到整体统一，局部有变化的效果即可。,网站美工设计基础,重复骨格近似基本形的构成示例,网站美工设计基础,网站美工设计基础,2.3.4重复骨格构成的应用,重复骨格构成是表现重复美的一种主要形式，在现实生活中应用非常广泛。实际设计时，主要是根据实际构成图形的需要，常常几种构成方法结合使用，突出重复格位的骨架作用。,网站美工设计基础,网站美工设计基础,网站美工设计基础,网站美工设计基础,网站美工设计基础,网站美工设计基础,2.3.5重复基本型的群化构成,群化是基本形重复构成的一种特殊表现形式。它不同于一般的重复构成，可以在上、下或左

4、、右连续发展，而是具有独立的存在性质，可以单独构成图样。因此，它可以作为标志、符号等设计的一种构成方式去把握。,网站美工设计基础,网站美工设计基础,网站美工设计基础,群化构成的基本要领有如下几点：（1）群化构成的基本形要求简洁，醒目，形象粗壮有力效果为好，一般情况下应减少琐碎细小、带尖角之类的造型，而且，基本型的数量不宜太多。,网站美工设计基础,（2）基本型的群化构成要紧凑、严密，相互之间可交叠或透叠，避免松散。,网站美工设计基础,（3）构成群化图形应完整、美观，要注意外形的整体效果，把握平衡和稳定关系。,简洁流畅的外形，黑、白纹样的交错，形成了完整醒目的视觉效果。,网站美工设计基础,网站美工

5、设计基础,单纯不等于简单,网站美工设计基础,24 渐变,渐变，也可称为渐移，是指以类似的基本形或骨格，循序渐进的、有秩序地、有节奏的逐步变化，呈现出一种阶段性的、调和的秩序，是我们日常生活中经常能见到的一种自然现象。,网站美工设计基础,网站美工设计基础,主要分类：形状渐变大小渐变位置渐变方向渐变色彩渐变骨格渐变,2.4.1形状的渐变,简单变化为复杂,具象变化为抽象,完整变化为残缺,网站美工设计基础,网站美工设计基础,由一个基本形渐变到另一个基本形，基本型可以由完整渐变到相对残缺，也可以由简单渐变到复杂，由具象渐变到抽象。,网站美工设计基础,蒙特利尔,莫斯科1980,网站美工设计基础,2.4.2

6、方向的渐变,基本形可在平面上做方向的渐变。,网站美工设计基础,网站美工设计基础,2.4.3位置的渐变,在规定的骨架内作基本形位置的渐变，因为超出骨架的部分会被切掉。,网站美工设计基础,网站美工设计基础,2.4.4大小的渐变,基本形由小到大或由大到小的渐次排列，能产生远近的纵深感和空间幻觉。,网站美工设计基础,网站美工设计基础,渐变,网站美工设计基础,2.4.5色彩的渐变,在色彩表现中，利用色相、明度、纯度都可以作出渐变的效果，并会产生丰富的美感画面。,网站美工设计基础,网站美工设计基础,2.4.6骨格的渐变,骨骼的渐变约定了基本形在形状、大小、方向上的变化。划分骨格的线可以是水平、垂直、曲线等

7、各种不同的渐变线形。渐变骨骼的精心设计，能充分显示出渐变的韵律美。,网站美工设计基础,网站美工设计基础,25 发射,发射是围绕一个中心，向外发射所呈现的视觉形象。中心是最重要的焦点，具有一种渐变的效果，有时可造成闪光的动感或产生爆炸性的感觉，有较强的韵律感和强烈的视觉效果。其骨格形式，是一种重复的特殊表现，在设计中是应用较为广泛的一种表现形式。,网站美工设计基础,发射骨格的构成要素为：,a、发射点 即发射中心，所有发射的骨格线都集中在此点上。发射点在画面中，有可见的，也有不可见的。,网站美工设计基础,b、发射线 根据发射的不同方向，在 构成时形式上又各有不同的表现。,网站美工设计基础,2.5.

8、1中心点发射,发射点在中央部位，发射线由外向内或由内向外发射的一种应用较多的构成形式。分别称之为“离心式”和“向心式”发射。其骨格线可以是直线、弧线、也可以是曲线。,网站美工设计基础,2.5.2同心式发射,同心式发射构成是指发射点从一点开始逐渐扩展，如同心圆层层环绕发射形成的重复性，也是发射构成的一种形式。,网站美工设计基础,网站美工设计基础,2.5.3移心式发射,移心式发射构成是发射点根据图形的需要，按照一定的动势，有秩序的渐次移动位置，形成有规则的变化。,网站美工设计基础,26 骨格,骨格是设计中基本形排列的位格依据。骨格网作为坐标的参考，是联络基本形之间关系的桥梁和纽带，使基本形成为有规

9、律、有秩序的构成。骨格分为规律性骨格，非规律性骨格，作用性骨格，非作用性骨格。,网站美工设计基础,2.6.1-2规律性骨格、非规律性骨格,规律性骨格有精确严谨的骨格线，有规律的数字关系，基本型有规律的按骨格线排列，构图具有强烈的秩序感。主要有重复、渐变、发射等骨格。,发射构成 渐变构成 重复构成,网站美工设计基础,网站美工设计基础,非规律性骨格一般没有精确严谨的骨格线，排列比较自由。,非规律性骨格,2.6.3-4作用性骨格、非作用性骨格,作用性骨格是界定基本形彼此之间准确空间位置的骨架。基本形可以在骨格单位内自由改变方向、位置、正负，甚至越出骨格线，使基本形彼此联合，在整体构图中灵活取舍，产生

10、丰富的变化组合。,网站美工设计基础,作用性骨格,网站美工设计基础,网站美工设计基础,非作用性骨格是概念性的，其骨格线有利于基本形的有序排列，但不影响它们的形状，也不会将空间分隔成独立的骨格单位。,非作用性骨格,网站美工设计基础,2.6.5-6可见骨格、不可见骨格,可见骨格是指骨格线和基本形明显的表现在构图中，有明确的空间划分。,网站美工设计基础,网站美工设计基础,不可见骨格是指骨格线只是在概念中存在，是作为基本形排列的依据和结构骨架，在构图中不一定画出来。,2.6.7重复的骨格,骨格的重复是指每一单位的形状和面积均完全相等，是规律骨格的一种，也是最简单的一种。,网站美工设计基础,27 特异,当

11、构成要素在有序的排列中有意违反秩序，使少数几个要素凸现出来，增强视觉冲击力，形成视觉焦点，以打破规律性，形成生动活泼的视觉效果时，称为特异。,网站美工设计基础,2.7.1形状特异,在重复和近似基本形的构成中，出现一小部分特异的形状，整体形成差异对比，是画面上的视觉焦点。,网站美工设计基础,网站美工设计基础,2.7.2色彩特异,同类色彩构成中，加进对比成分，以打破单调。,网站美工设计基础,网站美工设计基础,2.7.3大小特异,相同基本形构成中，对基本形的大小作适度的特异变化。,网站美工设计基础,2.7.4方向特异,基本形方向统一时，改变部分 基本形方向，产生特异变化。,网站美工设计基础,2.7.

12、5肌理特异,在相同的肌理质感中，适当穿插不同的肌理，达到肌理的特异。,网站美工设计基础,28 对比,对比，是人们对于一切事物识别的主要方法。“对比、变化”与“调和、统一”，二者是同一问题的两个方面，是一切事物“对立统一规律”在平面设计中的具体表现。在构成中运用相反性质的要素组合起来产生对比关系，有时为形态的，有时为变幻的，有时是色彩的，有时是质感的。,网站美工设计基础,峡江奇秀（水墨）王国昶,网站美工设计基础,晴云（摄影）,网站美工设计基础,装置艺术作品,网站美工设计基础,网站美工设计基础,水色天光（摄影）,甘南七月（摄影）,网站美工设计基础,余晖（摄影）,喜马拉雅远眺（摄影）,2.8.1形状

13、对比,外形具有一定差别的形状之间的对比。,网站美工设计基础,网站美工设计基础,网站美工设计基础,2.8.2色彩对比,由色彩三要素、色调之间的对比。,不同色相的对比 同色相的明度对比 同色相的纯度对比,网站美工设计基础,网站美工设计基础,网站美工设计基础,网站美工设计基础,2.8.3大小对比,画面中形状的大小不同，线条的长短不同的对比。,网站美工设计基础,网站美工设计基础,网站美工设计基础,2.8.4肌理对比,形象表面的视觉感不同，如粗糙与光滑、规律性与混杂形、质密于松散等的对比。,风化的岩石犹如朽木一般千疮百孔 长满青苔的石狮是沧桑岁月的见证,网站美工设计基础,网站美工设计基础,生命（摄影）,

14、雪绒花（摄影）,规律性与混杂形,网站美工设计基础,2.8.5位置对比,形状处在画面的上下、左右、等不同位置的对比。,网站美工设计基础,2.8.6重心对比,重心的偏移，轻重的不同感觉的对比。,网站美工设计基础,网站美工设计基础,映日（摄影）,绸带操,2.8.7空间对比,图形的疏密、大小、方向、形状、明暗及色彩寒暖等方面的对比。即所谓“密不通风，疏可跑马”的构成效果。,网站美工设计基础,网站美工设计基础,蜗式渐变形成的空间,色彩冷暖对比形成的空间,2.8.8虚实对比,虚与实可以看作是图与底的关系。平面中有实感的图形称为“实”，其他部分为“虚”，虚的部分大多是底。,网站美工设计基础,网站美工设计基础

15、,网站美工设计基础,网站美工设计基础,网站美工设计基础,思考题（5）1、什么是重复？2、重复的骨骼有什么特点?3、重复构成的“基本形”与基本几何形有什么不同？4、什么是群化构成？5、群化构成的基本要领有哪几点？,网站美工设计基础,网站美工设计基础,思考题（6）1、什么是渐变？2、结合现实生活举例说明渐变的基本形式。3、色彩渐变主要指哪几方面？思考题（7）1、什么是发射构成？2、结合现实生活举例说明发射构成的基本形式。,思考题（8）1、什么是骨格？2、骨格的种类？思考题（9）1、什么是特异构成？2、举例说明特异构成都有哪些种类？思考题（10）1、什么是对比构成？2、对比构成的种类有哪些？,网站美工设计基础,掌握重复、渐变、发射的构成练习。要求：在熟悉点、线、面的基本排列规律后，再作较复杂的构成练习。（随堂训练，在白卡纸或图画纸上，用铅笔、炭素笔、直尺、圆规、毛笔、墨汁等工具均可）分别作三个构成的练习，手绘（30CM30CM）在白卡纸上（黑白稿）作涂色练习。教师指导3学时或以上。学生课后练习40以上学时。,网站美工设计基础,实训（3）,网站美工设计基础,目的：理论，加强实践能力的培养。反复调整三个基本构成的骨架结构和设计效果，通过动手实践，体会手绘的感觉。参考内容：重复、渐变、发射构成部分。,谢谢,