17

Uploaded from authorPOINTLite
Views:
 
Category: Entertainment
     
 

Presentation Description

No description available.

Comments

Presentation Transcript

Slide1: 

《实用平面创意设计与技法》 主讲:袁 超 信息技术系软件教研室

上节回顾 : 

上节回顾  第9章 制作网页 A.设计网页应该注意的问题: 注意整体的 把握,色彩 的运用 要适当,不宜太多,要有 秩序感。 B.制作网页大体上包含的环节: a.设计素材的搜集与整理; b.创建静态画面; c.进入Image Ready设置动作,完成制作。 C.结合PS软件知识点: a.钢笔路径工具的应用 b.色彩渐变编辑器的设置 c.图层调板的综合应用

第10章 绘制网页广告 : 

第10章 绘制网页广告 

Slide4: 

效果预览

10.1 客户要求: 

10.1 客户要求 客户需求:零点都市广告的网页广告 主题内容:网页广告 1、客户要求 A、“猎人娱乐互动世界“网站 网页广告 效果要求:突出互动的特点以及娱乐、时尚的特点。 2、对客户要求的界定 ※ 网页广告与现实广告的区别:网页广告受到网速的限制。广告画面的 尺寸不能太大,颜色不能太丰富,画面的内容也不允许复杂。 A、绘制一个画面教为简洁的图象,从颜色上来和广告所要求表现的效果 相呼应

10.2 设计思路: 

10.2 设计思路 1、设计主题的传达 猎人娱乐互动世界这则广告,通过文字的颜色来和时尚呼应,以背景中 不停摆动的小球和网络互动的特点相适应。 2、具体思路表述 猎人娱乐互动世界的广告中 整个画面的色彩以黑、白、灰为主,只是在位于 画面正中的广告语中加了一些红色。黑色、白色、红色的搭配,给人以时尚、前 卫的感觉。再加上整个网页画面中简洁的图象与布局,以及背景中不停摆动的小 球,处处和猎人网互动、娱乐的特点想吻合。

10.3 设计前的准备工作: 

10.3 设计前的准备工作 1、设计素材的收集与整理 比较一下网页广告与常见的一些广告的区别 2、设计技巧概述 A、“猎人娱乐互动世界“网站 主要是对文字的设置和调整,以及细心的绘制出动画 中需要的每一个图象元素。然后是在Image Ready 中设置动画。(通过在动画 调板中添加动画帧,以及更改每一帧的停留时间和调整”图层“调板中的显示与否 来实现动画效果的。

第一节 绘制网页图像 : 

第一节 绘制网页图像 

Slide9: 

制作动画前的图像

10、4 猎人网 : 

10、4 猎人网 网站制作目的:使更多的人知道该网站,以增加该网站的知名度和点击率。 10.4.1 绘制静态的网页画面 制作步骤: 图10.1 ”新建“对话框 (1)启动photoshop7.0,在 菜单栏中选择”文件“|”新建“命 令,打开”新建“对话框,参照 图10.1所示,新建一个”猎人 网“的空白文档。

Slide11: 

(2)在工具箱中选择”矩形选框“工具,在视图的下端绘制一个矩形的选区,如下图10.2所示效果。 图10.2 绘制矩形选区

Slide12: 

(3)保持工具箱中前景色为黑色,在键盘上按下Alt+Backspace快捷键,使用前景色将矩形选区填充(如下图10.3所示)。 小帖士: 快捷键复习 前景色填充: ALT+Backspace/Delete 背景色填充: CTRL+Backspace/Delete 图10.3 填充后的效果一

Slide13: 

(4)继续使用:“矩形选框”工具,在视图的顶端再绘制一个大些的矩形选区, 并用浅灰色将其填充,取消选区后的效果(如下图10.4所示)。 图10. 4 填充后的效果二

Slide14: 

(5)使用“矩形选框”工具在如图10.5所示位置,绘制选区。 图10.5 绘制选区 (6)在工具箱中单击前景色按钮,打开“拾色器”对话框。如图10.6所示,将颜色 调整为深一些的灰色。 图10.6 “拾色器”对话框 参考如图 所示参数 较上面深一些的灰色

Slide15: 

(7)使用“矩形选框”工具在视图 中右击鼠标,在弹出的快捷菜单 中选择“描边”命令,打开“描边” 对话框,如图10.7所示。在“描边” 选项组中,将“宽度”设置为3像素, 位置为“居内”,单击“好”按钮,对 选区进行描边操作。 图10.7 描边选区 (8)在菜单栏中“选择”|“取消 选择”(CTRL+D),将图像中 的选区取消。

Slide16: 

填充像素 (9)选择工具箱中的 工具,单击其选栏中的黑色三角形按钮,在弹出的“几何 选项”面板中,选中“终点”复选框,然后再将“粗细”参数栏设置为5像素,如图10.8所示: (10)使用“直线”工具,在如图10.9的位置绘制箭头图像。 图10.8 设置选项栏 图10.9 绘制箭头 5

Slide17: 

(10)选择工具箱中的 “横排文字”工具,在如图10.10的位置输入“猎人娱乐互动 世界”,然后单击选项栏中的 “提交所有当前编辑”按钮,完成文字的设置。 图10.10 添加文字 (11)在“字符”调板中,将文字的颜色设置为白色,并将 “水平缩放”选项设置为 150%,如图10.11所示效果。 图10.11 设置文字

Slide18: 

(13)在菜单栏中选择“图层”|“图层样式”|“投影”命令,打开“图层样式”对话框,参照 图10.12所示,为文字图层添加投影效果。 图10.12 添加投影效果

Slide19: 

(14)继续使用“横排文字”工具,在视图中输入两段文字——“加入娱乐互动世界” 和“尽享无穷乐趣”,将字体颜色设置为黑色,并将字体大小设置为50点,如图10.13 所示效果。 图10.13 设置文字

Slide20: 

接下来为这两段文字添加上相同的样式。 (15)执行“图层”|“图层样式”|“投影”命令,打开“图层样式”对话框。如图10.14 所示效果,为文字添加投影效果。 图10.14 添加投影效果

Slide21: 

文字图层添加样式后的效果: 图10.15 添加样式后的效果

Slide22: 

(16)在“图层样式”的左边再选择“渐变叠加”选项,对话框右侧切换到“渐变叠加” 的相关选项。如图10.16所示效果。在对话框中,单击“渐变”选项右侧的渐变条, 打开“渐变编辑器”对话框,调整一个黑色到白色再到红色的渐变效果,如图10.16 右下图所示。 图10.16 编辑图层样式

Slide23: 

(17)编辑完毕后将“渐变编辑器”对话框关闭,再将“图层样式”对话框关闭。 此时文字效果如图10.17所示效果。 图10.17 文字效果

Slide24: 

(18)在“图层”调板中,先选中 “加入娱乐互动世界”图层,点击右键,选取“拷贝图层样式”,然后再选择“尽享无穷乐趣”图层,选取“粘贴图层样式”, 如图10.18所示,这样,两图层即产生相同的效果,如图10.19所示。 图10.18 拷贝图层样式 图10.19 两图层相同的效果

Slide25: 

(19)在“图层”调板中,双击“加入娱乐互动世界”图层的“渐变叠加”效果,再次 打开“图层样式”对话框,选中“反向”复选框,将文字的渐变效果颠倒过来,然后将 对话框关闭,如图10.20所示效果。 图10.20 调整图层样式

Slide26: 

(20)最后,再将该网站的网址添加到画面中,如图10.21所示。 图10.21 添加网址

本章小结 : 

本章小结  1.设计思路 猎人娱乐互动世界的广告中 整个画面的色彩以黑、白、灰为主,只是在位于画面正中的广告语中加了一些红色。黑色、白色、红色的搭配,给人以时尚、前卫的感觉。再加上整个网页画面中简洁的图象与布局,以及背景中不停摆动的小球,处处和猎人网互动、娱乐的特点想吻合。 2.结合软件知识点 A.选区工具的应用及调整 B.文字工具及字符调板的应用 C.图层样式的综合运用

Slide28: 

感谢系领导和相关老师的大力支持! 感谢现代技术教育中心的技术支持! 尤其感谢高斌老师的帮助和指导! 感谢每天坐在讲台下面给了我展示舞台的同学们! 谢谢大家!