《网页美工设计》教案——第1讲 PC端网页UI设计制作.docVIP

PAGE

《网页美工设计》

教案

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

授课教师

PAGE1

第二部分技能提升篇

第七章网页UI设计制作

标题

第一节PC端网页UI设计制作

第一讲PC端网页UI设计制作（上）

课时

2课时

教学目标

教学内容与过程

如果说功能UI是指具有明确指代含义的图形，通过抽象化的视觉符号向用户传递信息。那么主题UI则多存在于电脑主屏幕界面，或者从网站下载时看到的图，通过点击它进入到某个网页或者某个应用。

网页图标是具有明确指代含义的图形，通过抽象化的视觉符号向用户传递信息。网页图标将分为两次课讲授，本节课主要讲解图标设计的基础知识：

1、功能图标的相关概念2、功能图标绘制技法

功能图标是指在网页界面中具有明确表意功能用来替代文字快速引导客户的导航。它的设计原则主要有三点，其中形状规范是功能图标最重要的一点。

说到形状规范就不得不说起布尔运算，他是目前绘制功能图标的最佳方式。大名鼎鼎的苹果公司LOGO就是运用这一方法设计出来的。

掌握了最基本概念，接下来我们就通过某家居网站的功能图标绘制来掌握UI绘制的基本方法。

通过观察效果图可知，该网页的功能图标多集中于导航栏位置和搜索栏位置，接下来我们由简到繁从最左侧的定位图标开始学习。

首先，新建一个900乘600像素的画布。

接下来为