GIF – 设计之家 //www.laura-marie.com 传播先进设计理念 推动原创设计发展 Tue, 12 Sep 2006 18:57:00 +0000 zh-Hans hourly 1 https://wordpress.org/?v=6.9.4 Photoshop如何输出透明背景的gif图像 //www.laura-marie.com/9800.html //www.laura-marie.com/9800.html#respond Tue, 12 Sep 2006 18:57:00 +0000

怎样从Photoshop输出透明背景的gif图像,是很多初学者碰到的棘手问题,下面我们就来看看常用的几种方法。
  方法一:

  选择菜单命令 File > Export > Gif89a Export ,用吸管吸取要透明的部分,保存图片。没有Gif89a Export这个选项,可以在Photoshop 5.5中找到Adobe Photoshop 5.5/Plug-Ins/Adobe Photoshop Only /Import-Export/GIF89a Export.8be,把这个名为GIF89a Export.8be的文件拷贝到相应的路径下就可以了。

  方法二:

 




  保证你要输出的图像已经在透明背景上,选择菜单命令 File > Save for Web (Photoshop 5.5 以上版本),调出 Save for Web 对话框,设置好调色板及属性、容差范围、颜色数、仿色等参数后,确定 Transparency选项被选中,保存图片。

 方法三:

  选择菜单命令 Help > Export Transparency Image,调出 Export Transparency Image Wizard 对话框,选择合适的方式,一步步根据提示选择适当的选项,最后保存图像。这种方法要求你想要输出的图像已经在透明背景上,或者已经选择了需要处理成透明的部分。

]]>
//www.laura-marie.com/9800.html/feed 0
ImageReady修改GIF动画尺寸 //www.laura-marie.com/9798.html //www.laura-marie.com/9798.html#respond Tue, 12 Sep 2006 18:41:00 +0000 GIF动态图片以其较小的体积、丰富的表现内容,受到许多朋友们的喜爱。从彩屏手机普及以来,GIF动态图片就一直为广大手机使用者所津津乐道。由于网络上散布着数量众多的GIF图片,因此要找到自己喜欢的GIF动态图片并不困难。但是由于每个手机的屏幕分辩率有差异,所以在遇到自己特别喜欢,但尺寸和画面比例都不合适的Gif动画图片的时候就会让人非常的头疼。为了解决这一问题,下面介绍用ImageReady简单修改GIF动画尺寸的方法,希望对大家有所帮助。

  这张图是我小时候比较喜欢的一款街机“侍魂”的场景图,看到之后特别的喜欢。但是这张图片是横向构图,而且分辨率也不合适,所以得修改一下才能正常的使用。(以手机屏幕分辨率为176×220为例)

要作修改的GIF动画

  下面我们使用ImageReady来修改GIF图片,ImageReady是Adobe软件包里的一个软件,在安装PhotoShop的时候就会自动安装上。操作也和PhotoShop非常相似,比较容易上手。 

ImageReady操作界面

  首先,当然是选择你自己喜欢的GIF动画,复制下来之后在ImageReady里打开。

  然后在软件界面左侧的工具箱中选中裁切工具。

  确认选中“裁切工具”之后,在软件顶部状态栏里填上你所要得到的图片分辨率,也就是你的手机屏幕的分辩率。这里以分辨率为176 ×220为例。

  用鼠标在打开的图片上框出你需要的部分,然后双击,得到修改后的图像。

  最后,选择“将优化结果储存为”一项,将你修改好的图片保存到适当位置。

  保存的时候注意选择储存格式,应选择:“仅限图像(*.gif)”一栏保存。

  这样,我们的手机桌面就会有更丰富的选择了,无论是论坛里的个性签名档、有趣QQ表情,还是帅气十足的视频截图,都可以轻松的作成自己的手机桌面。

 

 

]]>
//www.laura-marie.com/9798.html/feed 0
GIF索引色图像中的三种“仿色”模式 //www.laura-marie.com/9510.html //www.laura-marie.com/9510.html#respond Thu, 17 Aug 2006 09:21:00 +0000 所谓“仿色”可以理解为仿造颜色,主要应用在想用较少的颜色来表达较丰富的色彩过渡的场合,就好比要用极少的原料做出丰盛的菜肴一般。

  我们可以动手来感受一下,在Photoshop中新建一个300×100像素的RGB模式图像,选择渐变工具〖G/SHIFT G〗,在默认的渐变列表中选择“蓝色、红色、黄色”,将渐变定义线从左至右充满全图像,形成如下图的效果。

漫谈GIF索引色图像中的三种“仿色”模式

  然后选择菜单【图像>模式>索引颜色】将会出现设置框,将其中的参数按照如下图设定。

漫谈GIF索引色图像中的三种“仿色”模式

  我们就会看到图像呈现出如下图的效果。这是因为我们现在指定只能用8种色彩来表达这幅图像。在无仿色的情况下图像由原先的平滑过渡变为了一个个相邻的色块,数一下正好是8个。这是Photoshop根据计算得出的最接近原图的颜色。显然,这对于表达原图像是远远不够的。

漫谈GIF索引色图像中的三种“仿色”模式

  那么,是不是就一定要使用更多的色彩才能产生较好的过渡效果呢?不一定,我们可以在设置框中选择不同的仿色选项,将会看到如下的效果。明显感觉到色彩的过渡变得柔和了。注意设置框中的颜色数仍然是8,这意味着颜色的数量并没有变化。

漫谈GIF索引色图像中的三种“仿色”模式


  那何以颜色过渡看起来要平滑许多呢?奥秘就在下图,这是扩散仿色的局部放大图,我们看到各种颜色不再是互相独立的色块,而是互为交融渗透,这样在人眼的整体视觉效果中就会形成平滑的过渡。


漫谈GIF索引色图像中的三种“仿色”模式

扩散仿色放大图

  在三种仿色方式中最为常用的是扩散,因为其效果最好,并且可以调节仿色的程度(即数量,数值为百分比)。其次是图案,这两者的颜色渗透都较为整齐有规律。而杂色方式无规律,看起来较为杂乱,因此较少使用。

  仿色在网页设计中较为常用,因为减少颜色数可以减小图片的字节数,有利于在带宽有限的网络上快速传递。当然过少的颜色也必然损失图像的质量和细节,因此在图像质量和图像字节数之间的权衡是进行网页制作时常会遇到的问题。有些新手追求高图像质量,结果导致整个网页图片字节数庞大,传输缓慢。或者过分追求传输的速度,大幅降低图像质量。这两个极端都是不可取的。而熟练的制作者必备的本领就是在两者间取得最好的平衡点。这些人制作出来的网页不仅图像质量高,传输速度也快。

  这里所说的在两者间取得最好的平衡点,不单单指如何对图像进行优化(即尽量减少字节数同时尽量保证质量),还包括在设计过程中就要为以后的优化做好准备。比如不要大面积地使用过渡色等。

]]>
//www.laura-marie.com/9510.html/feed 0
GIF的基础教程 //www.laura-marie.com/8631.html //www.laura-marie.com/8631.html#respond Thu, 11 May 2006 09:23:00 +0000

 

GIF(CompuServe GIF/Graphic Interchange Format)。它是在INTERNET上(作为附件、WEB页、E-MAIL等)进行

图像信息传送的两种主流文件格式之一(另一为JPG)。GIF有几种版本,包括GIF87a、GIF89a。PHOTOSHOP使用GIF89a,但也能够打开GIF87a。这些文件格式都采用索引颜色,支持8位的彩色或灰度及一个单独Alpha通道。

这种文件的特别之处是能够保存动画,并允许渐次打开,并支持透明。

对于有限颜色数目和只有两种颜色梯度的图像,GIF是一种很好的格式。GIF采用无损LZW压缩,但这种无损压缩是相对的,对于某一图像,如果要存盘成为GIF图像,就是从源图像的RGB颜色到GIF索引颜色进行转换,即从16777216色到最大可能的256色(GIF最多支持256色)进行转换,这就已经对图像造成了损害。然而,对于WEB图像来说,为了得到紧缩的大小尺寸和快速的下载,计划采用颜色数目有限的图像最终会产生好的综合效果。

GIF最好用于颜色数目有限的图像(如图像按钮)。GIF本身并不是具有照相精度的图像而设计的。对于彩色图片来说,在网页上还是使用JPEG图像格式比较好。

 

一、GIF保存有下面几种方式

方法1、文件\存储为WEB所用格式(这种方法是常用的首选方法,可调整度高)

1、点菜单“文件\存储为WEB所用格式”

 

2、弹出下面这个工作框

 

3、下面我们对这个对话框中的每个部分进行细分
(1)工具栏。

 

2)视图选项卡,共有四个,通常用二联或四联预览查看,以方便优化前后的对比。

(3)点按对话框中“双联”或“四联”视图,并在应用优化设置之前选择一个视图。“黑色框”表示被选中并优化后的视图。
每个图像的对话框下方的注释区域提供了优化信息。原稿图像的注释显示文件名和文件大小。优化图像的注释显示当前优化选项、优化文件的大小以及使用所选的调制解调器速度时的估计下载时间。

 

(4)可以在“预览”弹出式菜单中选取是否使用浏览器仿色、使用何种颜色配置及调制解调器速度。

 

(5)左下角是预览比例,右下角是WEB浏览器预览按钮,中间的部分是显示RGB、Alpha、十六进制和索引色阶值的“取样颜色信息栏”,随鼠标在图像上的移动而改变。

(6)优化设置的已存储组合。这里提供了GIF、JPG、PNG三种文件格式不同的组合方式,位数越高文件越大而图像损失越小,反之损失越大。

这里提到一个仿色的概念,下面是PHOTOSHOP帮助文件对仿色的解释:
“仿色”是指模拟计算机的颜色显示系统中未提供的颜色的方法。若图像所包含的颜色主要是纯色,则在不应用仿色时通常也能正常显示。包含连续色调(尤其是颜色渐变)的图像,可能需要仿色以防止出现颜色条带现象。
 

 

 

]]>
//www.laura-marie.com/8631.html/feed 0