平面设计的概念和基础
网页设计虽然在包含了传统平面设计的文字、图片外，增加了如动画、声音、视频等新的信息方式，但从设计角度但仍属平面设计的一种，了解平面设计的概念和基础是每一个合格网页设计师的必修科。只要掌握一些平面设计的规律，灵活运用，我们就能设计出精美的网页，本文章将用图文并茂的方式向您介绍十余种平面设计的常用手法，希望对您有所帮助。
一、基本概念
（一）、平面设计
平面设计是将不同的基本图形，按照一定的规则在平面上组合成图案的。主要在二度空间范围之内以轮廓线划分图与地之间的界限，描绘形象。而平面设计所表现的立体空间感，并非实在的三度空间，而仅仅是图形对人的视觉引导作用形成的幻觉空间。
（二）、平面设计的术语：
1.和谐：从狭义上理解，和谐的平面设计是统一与对比两者之间不是乏味单调或杂乱无章的。广义上理解，是在判断两种以上的要素，或部分与部分的相互关系时，各部分给我们的感觉和意识是一种整体协调的关系。
2.对比：又称对照，把质或量反差很大的两个要素成功的配列在一起，使人感觉鲜明强烈而又具有统一感，使主体更加鲜明、作品更加活跃。
3.对称：假定在一个图形的中央设定一条垂直线，将图形分为相等的左右两个部分，其左右两个部分的图形完全相等，这就是对称图。
4.平衡：从物理上理解是指的重量关系，在平面设计中指的是根据图像的形量、大小、轻重、色彩和材质的分布作用与视觉判断上的平衡。
5.比例：是指部分与部分，或部分与全体之间的数量关系。比例是构成设计中一切单位大小，以及各单位间编排组合的重要因素。
6.重心：画面的中心点，就是视觉的重心点，画面图像的轮廓的变化，图形的聚散，色彩或明暗的分布都可对视觉中心产生影响。
7.节奏：节奏这个具有时间感的用于在构成设计上指以同一要素连续重复时所产生的运动感。
8.韵律：平面构成中单纯的单元组合重复易于单调，由有规律变化的形象或色群间以数比、等比处理排列，使之产生音乐的旋律感，成为韵律。
（三）、平面设计的元素
1.概念元素，所谓概念元素是那些不实际存在的，不可见的，但人们的意识又能感觉到的东西。例如我们看到尖角的图形，感到上面有点，物体的轮廓上有边缘线。概念元素包括：点、线、面。
2.视觉元素：概念元素不在实际的设计中加以体现，它将是没有意义的。概念元素通常是通过视觉元素体现的，视觉元素包括图形的大小、形状、色彩等。
3.关系元素：视觉元素在画面上如何组织、排列，是靠关系元素来决定的。包括：方向、位置、空间、重心等。
4.实用元素：指设计所表达的含义、内容、设计的目的及功能。
下面我们具体介绍平面设计的构成方式。
二、元素的运用
（一）点、线、面的构成
形象是物体的外部特征，是可见的。形象包括视觉元素的各部分，所有的概念元素如点、线、面在见于画面时，也具有各自的形象。
平面设计中的基本形：在平面设计中，一组相同或相似的形象组成，其每一组成单位成为基本形，基本形是一个最小的单位，利用它根据一定的构成原则排列、组合、便可得到最好的构成效果。
1.组形：在构成中，由于基本的组合，产生了形与形之间的组合关系，这种关系主要有：
2.分离：形与形之间不接触，有一定距离。
3.接触：形与形之间边缘正好相切。
4.复叠：形与形之间是复叠关系，由此产生上下前后左右的空间关系。
5透叠：形与形之间透明性的相互交叠，但不产生上下前后的空间关系。
6.结合：形与形之间相互之间结合成为较大的新形状。
7.减却：形与形之间相互覆盖，覆盖的地方被剪掉。
8.差叠：形与形之间相互交叠，交叠的地方产生新的形。
9.重合：形与形之间相互重合，变为一体。
点效果欣赏
200812252037735.gif (36.61 KB)
2010-11-2 16:04
线效果欣赏：
3.gif (26.24 KB)
2010-11-2 16:04
面效果欣赏：
2008122520313651.gif (4.67 KB)
2010-11-2 16:04
（二）渐变
渐变是我常常听说的一种效果，在自然界中能亲身体验到，在行驶的道路上我们会感到树木由近到远、由大到小的渐变。
渐变的类型：
1.形状的渐变：一个基本形渐变到另一个基本形，基本形可以由完整的渐变到残缺，也可以由简单到复杂，由抽象渐变到具象。
2.方向的渐变：基本形可在平面上作有方向的渐变。
3.位置的渐变：基本形作位置渐变时需用骨架，因为基本形在作位置渐变时，超出骨架的部分会被切掉。
4.大小的渐变：基本形由大到小的渐变排列，会产生远近深度及空间感。
5.色彩的渐变：在色彩中，色相、明度、纯度都可以出渐变效果，并会产生有层次感的美感。
6.骨格的渐变：是指骨格有规律的变化，使基本形在形状、大小、方向上进行变化。划分骨格的线可以做水平、垂直、斜线、折线、曲线等个总骨格的渐变。渐变的骨格精心排列，会产生特殊的视觉效果，有时还会产生错视和运动感。
渐变的效果欣赏
2008122520313724.gif (23.18 KB)
2010-11-2 16:04
（三）重复
重复的一般概念是指在同一设计中，相同的形象出现过两次以上，重复是设计中比较常用的手法，以加强给人的印象，造成有规律的节奏感，使画面统一。所谓相同，在重复的构成中主要是指形状、颜色、大小等方面的相同。重复中的基本形：用来重复的形状称为基本形，每一基本形为一个单位，然后以重复的手法进行设计，基本形不宜复杂，以简单为主。
重复的类型：
1.基本形的重复：在构成设计中使用同一个基本形构成的图面叫基本形的重复，这种重复在日常生活中到处可见。例如：高楼上的一个个窗子。
2.骨格的重复：如果骨格每一单位的形状和面积均完全相等，这就是一个重复的骨格，重复的骨格是规律的骨格的一种，最简单的一种。
3.形状的重复：形状是最常用的重复元素，在整个构成中重复的形状可在大小、色彩等方面有所变动。
4.大小重复：相似或相同的形状，在大小上进行重复。
5.色彩重复：在色彩相同的条件下，形状、大小可有所变动。
6.肌理的重复：在肌理相同的条件下、大小、色彩可有所变动。
7.方向的重复：形状在构成中有着明显一致的方向性。
重复的效果欣赏
2008122520315877.gif (66.72 KB)
2010-11-2 16:04
四）近似
近似指的是在形状、大小、色彩、肌理等方面有着共同特征，它表现了在统一中呈现生动变化的效果。近似的程度可大可小，如果近似的程度大就产生了重复感。近似程度小就会破坏统一。
近似的分类：
1.形状的近似：两个形象如果属同一族类，它们的形状均是近似的，如同人类的形象一样。
2.骨格的近似：骨格可以不是重复而是近似的，也就是说骨格单位的形状、大小有一定变化，是近似的。
注意：近似与渐变的区别，渐变的变化是规律性很强的，基本形排列非常严谨，而近似的变化规律性不强，基本和其它视觉要素的变化较大，也比较活泼。
近似的效果欣赏
2008122520316776.gif (63.28 KB)
2010-11-2 16:04
（五）骨格
骨格网决定了基本形在构图中彼此的关系。有时，骨格也成为形象的一部分，骨格的不同变化会使整体构图发生变化。
骨格分为：
1.规律性骨格：规律性骨格有精确严谨的骨格线，有规律的数字关系，基本形按照骨格排列，有强烈的秩序感。主要有重复、渐变、发射等骨格。
2.非规律性骨格：非规律性骨格一般没有严谨的骨格线，构成方式比较自由。
3.作用性骨格：作用性骨格是使基本形彼此分成各自单位的界线，骨格给形象准确的空间，基本形在骨格单位内可自由改变位置、方向、正负，甚至越出骨格线。
4.非作用性骨格：非作用性骨格是概念性的，非作用性骨格线有助于基本形的排列组织，但不会影响它们的形状，也不会将空间分割为相对独立的骨格单位。
5.重复性骨格：是指骨格线分割的空间单位在形状、大小上完全相同，它是最有规律性的骨格，基本形按骨格连续性的排列。
骨格的效果欣赏
2008122520317856.gif (9.92 KB)
2010-11-2 16:04
平面设计的概念和基础相关推荐
- 点线面平面设计的概念是什么，分享点线结合构成设计图
点线面平面设计的概念是什么,在平面设计的领域里,点.线.面有其独特的视觉效果和审美价值,它作为视觉语言,通过一定方式的组合,向人们传达出特定的内涵和信息.点线面是平面设计中常用的构成元素,它构建了整个 ...
- 如何让自己的平面设计水平从零基础到精通
一个平面设计师从零基础学起,再到精通,在这过程中,了解设计的概念和原则是第一步,它可以让我们快速了解平面设计师的职责,融入设计师行列. 设计包括很广的设计范围和门类.建筑.工业.环艺.装潢.展示.服装 ...
- Python基础概念_2_基础概念
基础概念 3 基础概念 3.1 数字 计算机最初设计时就是为了做数据运算的,所以针对这个概念应该不会陌生.在Python的世界里数主要有三种类型: 整数.浮点数和复数,详见下例: a) 5 是一个整数 ...
- 安卓APP_ Fragment（1）—— Fragment概念、基础用法、动态变换、管理栈
摘自:安卓APP_ Fragment(1)-- Fragment概念.基础用法.动态变换.管理栈 作者:丶PURSUING 发布时间: 2021-04-15 23:32:31 网址:https://b ...
- 负载均衡原理与实践详解 第三篇 服务器负载均衡的基本概念-网络基础
负载均衡原理与实践详解 第三篇 服务器负载均衡的基本概念-网络基础 系列文章: 负载均衡详解第一篇:负载均衡的需求 负载均衡详解第二篇:服务器负载均衡的基本概念-网络基础 负载均衡详解第三篇:服务器负 ...
- 零基础学平面设计怎么掌握好基础
本文由:"学设计上兔课网"原创,图片素材来自网络,仅供学习分享 零基础学平面设计怎么掌握好基础?设计要有秩序的美感,使设计中的元素,包括色彩或构图等处于一种有条理.有规则.有某些共 ...
- 太极图形课S1第06讲：光线追踪的概念与基础
序 总觉得,这个以后能用的上 视频 太极图形课S1第06讲:光线追踪的概念与基础_哔哩哔哩_bilibili 代码 GitHub - taichiCourse01/taichi_ray_tracing ...
- RabbitMQ核心概念及基础API应用
RabbitMQ核心概念及基础API应用 1 主流中间件介绍 衡量消息中间件的指标:服务性能,数据存储,集群架构. 1.ActiveMQ:Apache,支持JMS规范最完整的. 2.RocketMQ ...
- 计算机基础知识 基本概念,计算机基本概念与基础知识.ppt
计算机基本概念与基础知识 学什么? 上网.打字.聊天? 第1章 计算机基本概念与基础知识 1.1 概述 1.2 计算机数据表示 1.3 计算机系统 第一台电子计算机(ENIAC) 1.1.1 计算机的 ...
最新文章
- Xamarin中Unsupported major.minor version 52.0问题解决
- 在Matlab符号计算中灵活运用assume
- docker-elk装IK自定义分词库
- 【Qt】数据库SQL接口层
- 【最全最详细】使用publiccms实现动态可维护的导航菜单栏
- Mysql教程｜基础使用方法
- java 移动平均_移动平均（转载）
- 2018校招 多益网络 人工智能及大数据研发工程师 面经
- 使用 PhyML 构建进化树
- [fairseq] 报错：TypeError: _broadcast_coalesced(): incompatible function arguments
- 计算机硬盘合并怎么弄,如何将分区的硬盘合并为一个磁盘？
- pandas删除行删除列，增加行增加列
- 软件工程-第二章 软件过程
- 基于 RTS 超低延时直播优化强互动场景体验
- 排球比赛计分程序功能说明书
- h5调取摄像头实时显示并点击按钮拍照
- legacy服务器安装系统,支持UEFI和LEGACY的多系统安装U盘
- 精选了国内外 6 个接私活的网站，供大家赚钱！
- 爱码哥移动开发平台的4大开发环境
- 【网页设计自习室#002】网站页面基本布局与结构