《网页美工设计》教案——第三章 网页布局与视觉流程设计 教案.docVIP

PAGE

《网页美工设计》

教案

授课专业广告艺术设计专业

授课教师 周国宝

铜陵职业技术学院制

PAGE1

第一部分理论基础篇

第三章网页布局与视觉流程设计

标题

第三章网页布局与视觉流程设计

课时

2课时

教学目标

教学内容与过程

视觉流程的含义

视觉流程：人在观察事物时视线在空间中的移动过程和运动轨迹，即观察事物的先后顺序。

网页设计视觉流程：访问者在浏览网页时视线的运动走向。

二、视觉流程设计的作用

1、秩序感、节奏感

2、感染力、冲击力

3、轻松、舒适、美观

4、提升受众的浏览兴趣

5、引导观者的视线

三、网页视觉流程的筹划

（一）合理运用视域

上部：轻快、漂浮、积极、高昂

下部：压抑、沉重、限制、稳定

左侧：轻便、自由、舒展、活力

右侧：局促、庄重

（二）遵循阅读习惯

从左到右，从上到下，先中间，后四周。

（三）强化视觉元素的可视性

通过颜色、大小、字体、字型、角度、虚实、位置等加以区分。

四、网页设计的视觉流程类型

（一）线性视觉流程

1、直线视觉流程

水平视觉流程：稳定、恬静、平和

垂直视觉流程：直观、坚定

2、斜线视觉流程

自由、活泼、动感十足

3、曲线视觉流程

舒畅、饱满、曲线美、时尚

（二）导向视觉流程

1、文字导向

通过文字的编排方向引