网页艺术设计：视觉流程及版式类型（下）.ppt

//视觉流程，是视线在页面上的移动过程，是二维空间中的运动 // 视觉流程的设计结果就是版式 。 综合运用多种分栏形式 2.满版型 页面以图像充满整版。主要以图像为诉求点，将少量文字压置于图像之上。视觉传达效果直观而强烈。满版型给人以舒展、大方的感觉。美中不足的是，限于当前网络宽带对大幅图像的传输速度较慢，这种版式多见于强调艺术性或个性的网页设计中。 大面积的图片配以文字，视觉效果强烈 四边出血，向外扩张，适合年轻人的口味 满版的出血大图，给人以强烈的视觉冲击 满版的页面，运用放射性图形突出主题 3.分割型 分割型版式设计，是把整个页面分成上下或左右两部分，分别安排图片和文案。两个部分形成明显的对比：有图片的部分感性而具活力，文案部分则理性而平静。 页面的分隔让画面产生更多的层次。 首先以图片吸引浏览者的注意力，然后将视线引向文字。 左右分割型版式 。 页面右侧使用斜线分割，打破了呆板的感觉 。 4.中轴型 中轴性版式，是沿页面的中轴将图片或文字作水平或垂直方向的排列。水平排列的页面，给人稳定、平静、含蓄的感觉。垂直排列的页面，给人以舒畅的感觉。 水平的中轴线营造了静谧的空间 。 左重右轻，以打破中轴线的平衡 。 图库类的网站，在中轴线上排列的图片使自身得到了强调 。 栏目导航安排在垂直的中轴线上 。 分割线上的压置的图片既打破了页面分割的生硬感，也使自身得到强调。左边框上的小标签乃点睛之笔。 5.曲线型 曲线型版式，是图片或文字在页面上作曲线的编排构成。这种编排方式能产生韵律感与节奏感。 整个页面大量运用了曲线，主题文字也以曲线排列 。 曲线与直线的对比使画面产生了节奏感 。 导航安排在弧线上，给人以活泼的感觉 。 这也是一个导航安排在弧线上的案例 。 6.倾斜型 倾斜型版式，是页面主题形象或多幅图片、文字作倾斜编排。它能造成页面强烈的动感，引人注目。 对角线构图，以横排的文字进行分割，求得均衡对比 。 斜置的纸张与浏览器边框形成对比，印象被加强 。 以房间的透视线打破水平线的呆板 。 7.对称型 对称型的页面版式，给人以稳定、严谨、庄重、理性的感受。 对称的版式设计、多变的色彩组合使页面稳重而不乏时尚感 。 相对对称的版式，以像素画的手法制作的游戏场景 。 8.焦点型 焦点型的网页版式，通过对视线的诱导，使页面具有强烈的视觉效果。 A.中心 B.向心 C.离心 中心以对比强烈的图片或文字置于页面的视觉中心。 向心视觉元素引导浏览者视线向页面中心聚拢，就形成了一个向心的版式。 离心视觉元素引导浏览者视线向外辐射，则形成一个离心的网页版式。 9.三角型 这种版式是网页各视觉元素呈三角形排列。正三角形（金字塔型）最具稳定性，倒三角形则产生动感。侧三角形构成一种均衡版式，既安定又有动感。 10.自由型 自由型的页面具有活泼、轻快的风格。 画面层次感强，图形语言独特 对比色及创意图形的运用，页面个性十足 三版/式/的/基/本/类/型 A. B. C. 三版/式/的/基/本/类/型 三版/式/的/基/本/类/型 * 主讲：顾群业 一.视觉流程的筹划 二.视觉流程类型 三.版式的基本类型 F. 三版/式/的/基/本/类/型 A. B. C. D. 三版/式/的/基/本/类/型 A. B. C. D. 三版/式/的/基/本/类/型 A. B. C. D. E. 三版/式/的/基/本/类/型 A. B. C. D. 三版/式/的/基/本/类/型 A. B. C. 三版/式/的/基/本/类/型 A. B. *