动态LOGO设计
合集下载
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
动态LOGO设计
实训3 动态LOGO设计
一、实训目的：
准备期
1. 2. 3.
了解PS在网站设计中作用； 掌握PS设计网站制作网站动态LOGO方法； 了解ImageReady网站设计中的各种技巧。
二、实训学时：6学时
三、实训要求：
1. 要求能熟练掌握PS软件的使用技巧； 2. PS与ImageReady的互动。
四、实训内容及操作： “纵横网际”动态 LOGO 的制作
点击进入下一页
实训3 动态LOGO设计
实例1
“纵横网际”动态 LOGO 的制作，效果如下图 （播放幻灯片即可看到）
点击进入下一页
实训3 动态LOGO设计
实训步骤
实例1
1、新建88*31的文件。背景色填充为#536884 2、建新图层，使用文字工具输入5， 字体选择“文鼎广告体繁”。（颜色：#FF6D02）
点击进入下一页
实例1
点击进入下一页
实训3 动态LOGO设计
20、然后依次做头变大直到充满整个LOGO的过程。见图
实例1
点击进入下一页
实训3 动态LOGO设计
实例1
点击进入下一页
实训3 动态LOGO设计
21、下面一段是文字效果。
实例1
22、下面是白框的闪光效果。
点击进入下一页
实训3 动态LOGO设计
23、网址和背景的变化效果。
点击进入下一页
实训3 动态LOGO设计
实例1
3、复制5次文字图层，是为了做由模糊到清晰的动态效果。 （见下图 ）
点击进入下一页
实训3 动态LOGO设计
4、删格化文字后载入文字选区使用描边命令，参数见下左图， 其效果见下右图：
实例1
点击进入下一页
实训3 动态LOGO设计
实例1
5、由复制的第一个文字图层开始，使用滤镜/模糊/动感模糊命 令（具体参数自己决定，要注意是做模糊到清晰的过度，所以 复制的5个文字图层，每一个图层的参数应该都不一样。为了方 便你就由大到小设置吧。 ）
实训3 动态LOGO设计
17、再新建一层，点选第二个模糊的“5”层
实例1
点击进入下一页
实训3 动态LOGO设计
18、动画面板如图
实例1
点击进入下一页
实训3 动态LOGO设计
19、依此类推。直到这样：（再说一次，我的图是原文 件，你们后面的帧是没有的）
实例1
点击进入下一页
实训3 动态LOGO设计
实训3 动态LOGO设计
实例1
点击进入下一页
实训3 动态LOGO设计
实例1
8、输入文字，这里以“纵横网际为例”。输入以后复制文字 图层。在下面的文字图层使用滤镜/模糊/动感模糊，参数自 定。效果见下图：
9、在另一个文字图层使用描边命令，颜色自定。 10、用矩形选框工具在正中间选择一矩形区域，填充白 色。效果如图：
点击进入下一页
实训3 动态LOGO设计
14、切换到ImageReady。
实例1
15、先看看它的动画面板。第一帧保持原始的。（我这 个图里是已经作好的原文件，你开始只能看到一帧。）
点击进入下一页
实训3 动态LOGO设计
16、新建一帧，点选图层面板“5”模糊图层的最模糊那层，如图
实例1
点击进入下一页
点击进入下一页
实训3 动态LOGO设计
实例1
6、现在做“5”上面的“人头”，用椭圆选框工具拉出一个 圆，大小注意。并使用描边命令，参数和刚才的描边一样。 大小都不一样，因为是 为了做头由大到小的渐变，最后覆盖整个LOGO的过程。 图层见下图：
点击进入下一页
实例1
24、最后效果
点击进入下一页
实训3 动态LOGO设计
思考与操作
大致步骤 ① 建一个88*31的文件，背景透明，画一88*31矩形填充色为 #FF9900，边框为黑色，再画一个86*11的小矩形填充色 为#FFCF31，透明度为61% ② 输入文字，中文使用宋体，白色，黑色描边（发光）不消 除锯齿，英文使用10号字。 ③ 复制5桢，画一个88*31的白色矩形，分别设透明度为40%， 100%，58%，35%，0%。 ④ 复制10桢，画一个13*29的矩形，透明度为58%，将矩形 从左到右，再从右到左，逐桢移动位置。 ⑤ 最后导出成GIF动画。
点击进入下一页
实训3 动态LOGO设计
11、新建三个图层，每个图层的效果如图。
实例1
点击进入下一页
实训3 动态LOGO设计
实例1
12、复制最上面的图层（白色区域最长的那个）三次，调 整每个的透明度分别为：38%，75%，81%（这个可以自己 定） 主要做闪光效果。
13、这个LOGO还有一个网址，制作方法与文字（纵横网际） 相同。
实训3 动态LOGO设计
一、实训目的：
准备期
1. 2. 3.
了解PS在网站设计中作用； 掌握PS设计网站制作网站动态LOGO方法； 了解ImageReady网站设计中的各种技巧。
二、实训学时：6学时
三、实训要求：
1. 要求能熟练掌握PS软件的使用技巧； 2. PS与ImageReady的互动。
四、实训内容及操作： “纵横网际”动态 LOGO 的制作
点击进入下一页
实训3 动态LOGO设计
实例1
“纵横网际”动态 LOGO 的制作，效果如下图 （播放幻灯片即可看到）
点击进入下一页
实训3 动态LOGO设计
实训步骤
实例1
1、新建88*31的文件。背景色填充为#536884 2、建新图层，使用文字工具输入5， 字体选择“文鼎广告体繁”。（颜色：#FF6D02）
点击进入下一页
实例1
点击进入下一页
实训3 动态LOGO设计
20、然后依次做头变大直到充满整个LOGO的过程。见图
实例1
点击进入下一页
实训3 动态LOGO设计
实例1
点击进入下一页
实训3 动态LOGO设计
21、下面一段是文字效果。
实例1
22、下面是白框的闪光效果。
点击进入下一页
实训3 动态LOGO设计
23、网址和背景的变化效果。
点击进入下一页
实训3 动态LOGO设计
实例1
3、复制5次文字图层，是为了做由模糊到清晰的动态效果。 （见下图 ）
点击进入下一页
实训3 动态LOGO设计
4、删格化文字后载入文字选区使用描边命令，参数见下左图， 其效果见下右图：
实例1
点击进入下一页
实训3 动态LOGO设计
实例1
5、由复制的第一个文字图层开始，使用滤镜/模糊/动感模糊命 令（具体参数自己决定，要注意是做模糊到清晰的过度，所以 复制的5个文字图层，每一个图层的参数应该都不一样。为了方 便你就由大到小设置吧。 ）
实训3 动态LOGO设计
17、再新建一层，点选第二个模糊的“5”层
实例1
点击进入下一页
实训3 动态LOGO设计
18、动画面板如图
实例1
点击进入下一页
实训3 动态LOGO设计
19、依此类推。直到这样：（再说一次，我的图是原文 件，你们后面的帧是没有的）
实例1
点击进入下一页
实训3 动态LOGO设计
实训3 动态LOGO设计
实例1
点击进入下一页
实训3 动态LOGO设计
实例1
8、输入文字，这里以“纵横网际为例”。输入以后复制文字 图层。在下面的文字图层使用滤镜/模糊/动感模糊，参数自 定。效果见下图：
9、在另一个文字图层使用描边命令，颜色自定。 10、用矩形选框工具在正中间选择一矩形区域，填充白 色。效果如图：
点击进入下一页
实训3 动态LOGO设计
14、切换到ImageReady。
实例1
15、先看看它的动画面板。第一帧保持原始的。（我这 个图里是已经作好的原文件，你开始只能看到一帧。）
点击进入下一页
实训3 动态LOGO设计
16、新建一帧，点选图层面板“5”模糊图层的最模糊那层，如图
实例1
点击进入下一页
点击进入下一页
实训3 动态LOGO设计
实例1
6、现在做“5”上面的“人头”，用椭圆选框工具拉出一个 圆，大小注意。并使用描边命令，参数和刚才的描边一样。 大小都不一样，因为是 为了做头由大到小的渐变，最后覆盖整个LOGO的过程。 图层见下图：
点击进入下一页
实例1
24、最后效果
点击进入下一页
实训3 动态LOGO设计
思考与操作
大致步骤 ① 建一个88*31的文件，背景透明，画一88*31矩形填充色为 #FF9900，边框为黑色，再画一个86*11的小矩形填充色 为#FFCF31，透明度为61% ② 输入文字，中文使用宋体，白色，黑色描边（发光）不消 除锯齿，英文使用10号字。 ③ 复制5桢，画一个88*31的白色矩形，分别设透明度为40%， 100%，58%，35%，0%。 ④ 复制10桢，画一个13*29的矩形，透明度为58%，将矩形 从左到右，再从右到左，逐桢移动位置。 ⑤ 最后导出成GIF动画。
点击进入下一页
实训3 动态LOGO设计
11、新建三个图层，每个图层的效果如图。
实例1
点击进入下一页
实训3 动态LOGO设计
实例1
12、复制最上面的图层（白色区域最长的那个）三次，调 整每个的透明度分别为：38%，75%，81%（这个可以自己 定） 主要做闪光效果。
13、这个LOGO还有一个网址，制作方法与文字（纵横网际） 相同。