您当前的位置:首页 > 计算机 > 软件应用 > 图形编设

广告条动画_Photoshop Cs5制作Gif Banner广告条动画

时间:01-15来源:作者:点击数:

效果图

Photoshop Cs5制作Gif Banner广告条动画

1.新建文件250px*250px,分辨率设为70px,背景用#f2f2f2填充。

Photoshop Cs5制作Gif Banner广告条动画(1)
Photoshop Cs5制作Gif Banner广告条动画(2)

2.放置Logo到靠近画布顶端的中间位置。

Photoshop Cs5制作Gif Banner广告条动画(3)

3.在Logo下发输入宣传标语。

Photoshop Cs5制作Gif Banner广告条动画(4)

4.绘制矩形选区,填充“#b90909”。

Photoshop Cs5制作Gif Banner广告条动画(5)
Photoshop Cs5制作Gif Banner广告条动画(6)

打开图层样式面板,选择“投影”,降低投影距离和大小为2px。

Photoshop Cs5制作Gif Banner广告条动画(7)

选择“渐变叠加”,设置混合模式为“正片叠底”,不透明度28%。

Photoshop Cs5制作Gif Banner广告条动画(8)

选择“描边”,描边大小1px,描边颜色设为“#a31b1b”。

Photoshop Cs5制作Gif Banner广告条动画(9)

5.增加关键内容。

Photoshop Cs5制作Gif Banner广告条动画(10)

栅格化文字,并且为文字创建剪切蒙版。

Photoshop Cs5制作Gif Banner广告条动画(11)

6.放置一张引人注目的图片。

Photoshop Cs5制作Gif Banner广告条动画(12)

7.放入更多文字内容,摆放在图片的下方靠近画布底部的位置,所有内容均居中对齐。

Photoshop Cs5制作Gif Banner广告条动画(13)

8.创建圆角矩形选区,填充#fdfcfc。

Photoshop Cs5制作Gif Banner广告条动画(14)
Photoshop Cs5制作Gif Banner广告条动画(15)

打开图层样式对话框,应用“投影”,降低投影半径和投影大小为1px。

Photoshop Cs5制作Gif Banner广告条动画(16)

应用“内发光”,参数保持默认值。

Photoshop Cs5制作Gif Banner广告条动画(17)

应用“渐变叠加”,颜色设置为#a10000到#fffff的渐变,不透明度设为6%。

Photoshop Cs5制作Gif Banner广告条动画(18)
Photoshop Cs5制作Gif Banner广告条动画(19)

9.打开动画面板(窗口-动画)。用时间轴动画面板,并不是帧面板。把所有图层的不透明度设为0%。

Photoshop Cs5制作Gif Banner广告条动画(20)

10.插入关键帧和增加透明度。

Photoshop Cs5制作Gif Banner广告条动画(21)
Photoshop Cs5制作Gif Banner广告条动画(22)
Photoshop Cs5制作Gif Banner广告条动画(23)
Photoshop Cs5制作Gif Banner广告条动画(24)
Photoshop Cs5制作Gif Banner广告条动画(25)
Photoshop Cs5制作Gif Banner广告条动画(26)
Photoshop Cs5制作Gif Banner广告条动画(27)
Photoshop Cs5制作Gif Banner广告条动画(28)

11.文件-存为“WEB文档格式”,进行设置并保存。

Photoshop Cs5制作Gif Banner广告条动画(29)
Photoshop Cs5制作Gif Banner广告条动画(30)
方便获取更多学习、工作、生活信息请关注本站微信公众号城东书院 微信服务号城东书院 微信订阅号
推荐内容
相关内容
栏目更新
栏目热门