“ 海底世界” GIF 图像设计

《图形图像处理技术》课程

佛山职业技术学院 张伟 讲师

情境引入

设计一个展示海底世界的动画图像

1 、针对 3 岁小朋友；

2 、是一个动画图像；

3 、要有多种海底生物。

动画设计

动画原理

GIF 知识

任务目标

小结与练习

学习内容

用 Photoshop 软件设计“海底世界” GIF 图像

动画设计动画原理GIF 知识任务目标 小结与练习

GIF 意思为“图像互换格式”，是一种连续色调的无损压缩格式，其压缩率一般在 50% 左右。

GIF 含义：

GIF 格式是电脑中主要的动画图像格式，可直接显示在网页和手机彩信中，是应用最广泛的动画图像格式。

动画图像格式：

动画设计动画原理GIF 知识任务目标 小结与练习

思考：动画的原理是什么？

当你翻阅纸张时，会产生这样的效果：

原理：多幅静止画面连续播放，利用视觉暂留形成连续影像。

动画设计动画原理GIF 知识任务目标 小结与练习

1 、搜索海底世界 PSD 素材；

思考：为了完成海底世界设计任务，你的设计思路是什么？

2 、在 Photoshop 软件动画面板中设计每一幅单帧画面；

3 、让多幅静止画面连续播放；

4 、设置帧与帧之间的时间间隔，保存成 GIF 格式。

动画设计动画原理GIF 知识任务目标 小结与练习

第一步、利用百度搜索引擎搜索海底世界 PSD 素材

第二步、打开 Photoshop 软件，执行“文件”→“打开”命令，导入海底世界素材

动画设计动画原理GIF 知识任务目标 小结与练习

第三步、执行“窗口”→“动画”命令，打开动画面板，了解各按钮功能

动画设计动画原理GIF 知识任务目标 小结与练习

选择第一帧

当前帧当前帧停留时间

当前动画文件循环选项

选择上一帧播放当前动画

选择下一帧删除所选帧

复制所选帧过渡动画帧

动画设计动画原理GIF 知识任务目标 小结与练习

第四步、复制第一帧，在第二帧上调整素材中各生物位置

第五步、单击过渡动画帧按钮，设置过渡动画帧属性

第六步、预览效果，发现问题，调整动画图像

第七步、设置各帧图像停留时间及动画文件循环播放次数

动画设计动画原理GIF 知识任务目标 小结与练习

第八步、设置存储路径，保存文件成 GIF 格式

回应问题：

因为：

PSD 格式是 photoshop 软件的源文件格式，保存有完好的图层效

果，每个图层中的元素可以直接编辑。

在搜索海底世界素材时，为什么要搜索 PSD 格式素材？

动画设计动画原理GIF 知识任务目标 小结与练习

1. GIF 的含义2. 动画的基本原理3. 海底世界动画设计 （ 1 ） PSD 素材搜索 （ 2 ）每一帧图片的设置 （ 3 ）过渡动画帧的设置 （ 4 ）播放时间与循环次数设置

小结

练习

1. 制作闪烁星星

2. 制作一个 QQ 动画表

情

动画设计动画原理GIF 知识任务目标 小结与练习

本项目结束 谢谢你的聆听！