闪动图片制作教程[Photoshop&Imageready]版本
应玩友的要求发布一下内容,篇幅比较大,希望保持耐心。
图片可能在浏览器中显示不完全或者显示不清
晰,请务必保存下来看。
谢谢。
老样子同时发布一下声明。
如果有朋友将愿意此文转载,那将是对我们莫大的支持,但出于我站的服务器使用效率,请转载的朋友使用自己的空间上传文件。
如果出现文件链接在非天空发布区域使用,我们将不得不站在自己的利益角度上重新定位立场。
望合作,再谢。
格式介绍——GIF的特点:
1.具有“多元化”的结构,能够存储多张图像——这是制作动画的基础。
2.调色板数据有“通用调色板”和“局部调色板”之分。
3.采用改进版的“LZW”压缩法,该压缩法优于“RLE”压缩法。
4.图像数据用一个字节存储一个像素点,GIF图像文件在压缩图像数据之前,必须先将图像数据处理成一
个字节只存储一个像素点的值。
5.根据标识符寻找数据区。
GIF这种图像文件内的各种图像数据区和补充区,多数没有固定的长度和存放位置,为方便程序寻找数据区,就以数据区的第一个字节作为标识符,让程序能够判断所读的是哪种数据
区。
6.图像的数据排列分为“顺序排列”和“交*排列”两种方式。
7.图像文件最多支持256色存储,适合色块平涂或者简单的(注意区别简单的和不鲜艳的之间的区别)
图像。
基础程序要求以及介绍:
要求有附带imageready[IR]的photoshop[PS]版本。
以及知道图像文件从PS转到IR的转换编辑方式的使
用。
下图说明。
发送图片到手机
文中我使用了PS7.0完整版做例子来说明。
由于程序的兼容性,PS CS 8和PS CS2 9的操作方法大同小异,也同时并不是说PS 5.0或者PS6.0就不能做,我想强调的一点就是只要有IR就可以做了,只不过我
手头上最老的PS软件就是7.0而已。
而流传中的所谓的迷你版,发布者在精简的过程中,把他们自己认为的不重要的内容(IR、WEB功能等都多多少少有所精简),所以迷你版一般不再附带IR。
不是说所有可以下到的迷你版就一定没有IR,只是想表明,如果使用完全版的话,功能上的烦恼就会降低到最佳的限度。
PS从5开始就附带了IR,主要功能为网页制作,功能强大。
配合PS神奇的2D想像空间满足能力,精彩之至。
如今发展都CS2 9功能自然会比以前的有非常大的加强。
但这不是我们讨论的重点,在这里什么需要使用的仅仅是IR带的一个小小的功能,也就是支持动画制作这个小功能。
必须指出,要流畅地完成这看似简单的操作,基本的操作认识是必不可少的,知道与能做是一个区别,而能做与熟练又是一个区别,再加合上我们的想像力,得到表达的话,那又是一个新的境界。
当然,大多时
候行动会比想像更有用。
前期准备工作以及说明:
1.为减少等待的时间,我们同时打开PS和IR,方便文件在程序转换编辑方式的快速进行。
2.我们就以新发布的宠物小精灵剧场版的字幕发布帖LOGO来做为例子,为大家介绍这个流程。
3.准备好LOGO的素材[LOGO]和填充素材[闪幕素材]。
把LOGO在PS中打开并做好自己认为应该进行的
处理,剔除不需要的部分,留下透明的背景。
闪幕素材在IR中打开。
得到组成祯的图层。
4.由于主要介绍的是从填充方式到最后获得图片的流程,前期的LOGO素材的获得方法、挑选注意事项以
及准备等涉及大篇幅的过程便不再多说,大家可以根据自己的想法去进行渲染。
——————————————————————————————
制作的主干流程以及解释:
1.在IR中把素材打开,软件会自动把打开的GIF以时间轴和图层的方式分别排列。
完全打开后点击“在PS 中编辑”的功能按钮切换到PS中进行编辑。
(其实在什么软件中编辑效果都是没有多大出入的,但是笔者认为,在PS平台中可以随时根据自己的灵感对图片进行渲染,虽然IR也有渲染的功能,但终究不如PS
强大。
)
发送图片到手机
2.我们可以看见IR输入PS的图片已经被打开,分了3个图层(此GIF有3祯)另:在PS中直接打开GI
F的话,只能编辑第一祯。
发送图片到手机
3.接下来我们要做的是把闪幕的3个祯(PS中的状态为3个图层)逐祯粘入目标LOGO的指定区域。
发送图片到手机
粘贴的方法很简单,如果不习惯“粘贴入”这个操作,请直接使用“ctrl+v”的粘贴形式。
如果选用了ctrl+v的粘贴,接下来要做的事情如下。
——把闪幕素材的3祯全部粘贴完毕。
——之后用魔棒工具圈选不想保留的区域(也就是透明的区域)分别选定上一步粘贴上来的图层,进行清除(delete)操作。
这样视野中留下的就是我们意愿中需要保留的区域了(也就是闪字的有效部分)
发送图片到手机
——————————————————————————————
到这里ps的工作便可宣告结束。
我们点击“在IR中编辑”的功能按钮。
切换到IR工作平台。
这里顺便解释几个词:
select inverse 为反选。
历史纪录里的两次操作是没有意义的,位避免引起误导,这里事先说明。
clear为清除,即是按下delete 的操作过程,清楚不需要的部分。
magic wand 为魔棒,是选定区域的工具。
——————————————————————————————
IR中的编辑基本应该算做是最后期的的工作了,且我们会在下面的流程中碰见很多以往小区的教程中没有碰见过的新功能,希望在对这些新功能的接触、了解以及认识到熟悉的过程中,大家都至少可以保持最低
限度的耐心。
首先我们要做的是复制祯。
因为在PS中我们对目标图层粘贴了3个图层,所以我们便复制2次,使得IR
中可编辑的祯数也达到3个。
然我们得到的3个祯看起来都是一样的。
当然我们下面要做的就是对3个祯做一些处理,使他们看起来不一样。
请大家之前先放轻松,因为处理并不需要滤镜,而只是在IR显示的图层栏中改变图层的显示属性而
已。
图层上大家应该都可以看见那个眼睛的标记,当选定一个祯的时候,图层变会有不同的显示方式。
图层上有眼睛标记的代表这个图层在这个祯里显示,没有的话自然是代表不显示。
而我们要做的就是选择不同的祯,让不同的图层在不同的祯里显示,使得GIF在发布的时候因为图层的切换而表现出“动态”这种感觉。
眼睛的标记点一次就会消失[不显示状态],在同一个地方再点一次,眼睛就会重新出现[显示状态]。
最后的一步工作就是设置各个祯的延迟时间。
这当然也很重要。
每一祯下面都可以看见一个倒三角号,点击即可在下拉菜单中选择延迟时间。
NO DELAY即是无延迟。
延迟时间可以自定义,也可以使用IR给的常
用定义。
定义好之后可以先庆祝GIF制作的完结,然后考虑发布的方式。
最简单的输出方法就是点击IR工具栏上的浏览器图标。
IR会自动帮你生成一个临时的HTML文件并在浏览器中打开,把里边的GIF文件;另存一下就可以得到了[包括源代码的表述,当然,这对我们来说不主要,因为那是属于网页里代码设置的东西了,我们需要的只是这个临时页面里的GIF文件]。
重复强调一下,可能大家在对“编辑祯的显示内容”这个操作上会有一些困难,但熟知并熟练运用只是一个时间的问题。
一方面那需要比较清醒的意识才能保证做得有条有理,另外一方面这也是做GIF的一个比较
灵活的办法。
发送图片到手机
——————————————————————————————
另外一个用IR做GIF的办法是在IR中导入含有图片的文件夹,IR会自动将每一张图片做为一个独立的祯和一个独立的图层做排列。
这种方法直接简单,且不需要再考虑某某图层是否需要显示或者不显示,缺点
在于编辑上不如上面介绍的方式。
我们的方法便介绍到这里。
大概大家都很明白,这文章的篇幅和小屋中FW那张帖子的篇幅比起来,可谓是大得惊人。
但从能随时根据自己的灵感做随心所欲的修改那是macromedia相对adobe的不足,即是F W的局限。
并且有必要说明的是IR用来做这类型的图片也不过是有几步而已,只是我在文中加了过多的
解释。
另外为使过程更简单,我尽量用了一些比较容易明白且比较容易操作的步骤去代替上手比较困难的那些工具使用的步骤——即大家依然可以用别的方法来代替文中所介绍的方法,而且方法是多种多样的,大家可以根据自己的习惯、爱好以及领悟去做,那些多而杂的方法变不再累述,PS中达到同样一种效果的过程可
以用很多种方法来完成,相信大家也都已经知道。
坦白说(我相信大家都看起来了,这只是兵临城下的坦白),这个过程完全可以使用IR来完成,因为期间所用到的工具IR都具有,但我还是用了PS。
因为想让大家了解有的时候灵感的表达是很重要的事情,而
在这种表达方式上,我习惯在PS的帮助下做表达。
应该说这同时也是教大家做动画的一篇文章,虽然方法看起来有点傻,甚至有一些地方到了多余的地步,但其实我们的目的是去掌握,所以我花了很多时间和篇幅去附加介绍了一些东西,希望对大家都有帮助,
也希望大家都喜欢这种连带的表述方式。
谢谢大家花了那么多时间去看这些东西。