http://www.jiachengqi.com/ zh-cn PBlog2 v2.4 http://www.jiachengqi.com/images/logos.gif http://www.jiachengqi.com/ 风筝的过去和未来 http://www.jiachengqi.com/default.asp?id=141 ikite@tom.com(kite) Wed,29 Nov 2006 12:13:08 +0800 http://www.jiachengqi.com/default.asp?id=141 有兴趣的时候，会写一下制作的方法，主要是symble符号的应用，配合给线条填充颜色，即可出现所示的效果了。

jpg效果图如下：






png档在下：




]]> http://www.jiachengqi.com/default.asp?id=126 ikite@tom.com(kite) Mon,13 Nov 2006 19:29:04 +0800 http://www.jiachengqi.com/default.asp?id=126
把下面的代码放在head区就可以解决问题了。

<script type="text/javascript">
function correctPNG() 
{
for(var i=0; i<document.images.length; i++)
{
var img = document.images[i]
var imgName = img.src.toUpperCase()
if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
{
var imgID = (img.id) ? "id='" + img.id + "' " : ""
var imgClass = (img.className) ? "class='" + img.className + "' " : ""
var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
var imgStyle = "display:inline-block;" + img.style.cssText 
if (img.align == "left") imgStyle = "float:left;" + imgStyle
if (img.align == "right") imgStyle = "float:right;" + imgStyle
if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle 
var strNewHTML = "<span " + imgID + imgClass + imgTitle
+ " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
+ "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
+ "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>" 
img.outerHTML = strNewHTML
i = i-1
}
}
}
window.attachEvent("onload", correctPNG);
</script> 
]]> http://www.jiachengqi.com/default.asp?id=125 ikite@tom.com(kite) Mon,13 Nov 2006 19:26:40 +0800 http://www.jiachengqi.com/default.asp?id=125 不过幸好的一点是，虽然不能保存为png格式文件，但是可以输出为任意的格式，既然如此的话，我就还是选择在fw中制作图片了，然后直接导出TIFF完事儿，反正这个东西也不需要保留源文件，呵呵，真无奈啊！]]> http://www.jiachengqi.com/default.asp?id=17 ikite@tom.com(kite) Thu,20 Jul 2006 15:24:59 +0800 http://www.jiachengqi.com/default.asp?id=17


希望大家能够仁者见仁，智者见智，留言也好，到织梦论坛参与讨论也好，总之只要能把头发与背景分离的方法都是好方法！


]]> http://www.jiachengqi.com/default.asp?id=16 ikite@tom.com(kite) Thu,20 Jul 2006 15:19:07 +0800 http://www.jiachengqi.com/default.asp?id=16 素材图已经在上节的作业中提供了：


相信大家使用上节提供的knockout软件已经将这幅图片较为理想的扣出来了，本节我们就不学习knockout的使用了，我们还是用最原始的方法（四）来看看能否达到我们的预期目的。
本节关键词：转换为Alpha，颜色填充，色相/饱和度

还是先来看我们是用最基础的教程（四）提供的方法，生成的扣图效果：

通过上图，可以看到头发的过渡很不自然地说，因为头发颜色毕竟不是黑色的了，所以效果自然就不够好了。如果使用本例提供的方法来处理后，大家可以看一个效果的比较。上图的飘散头发的颜色和主体基本上一致了，这个才是我们想要的效果啊！下面就来看看在上面操作的基础上，我们还应该做什么样的具体操作吧！

1、选中位于中间图层的位图对象，此时该对象应该是应用了“转换为Alpha”滤镜，现在我们要将其转化为单一的位图对象，从而将滤镜效果产生的图形变为一个单一的独立图像，通过快捷键“Ctrl+Alt+Shift+Z”即可快速的将选中对象进行位图的转换。
2、选中新生成的位图对象，在属性面板上选择“滤镜|调整颜色|颜色填充”命令，在弹出的设定框中，将填充颜色设为了红色，此处是应该考虑人物主体头发的颜色的，这样才能便于随后的操作。鉴于人物头发的颜色偏土黄，所以这里采用了同色系的红色来进行颜色填充操作。

3、看看经过“颜色填充”设定后的图形效果。

4、可以看到外部飘散头发和主体头发的颜色有些接近了，但是还是有些不同，需要进一步进行设定。
5、按“Ctrl+Alt+Shift+Z”快捷键，将滤镜效果应用，并转化为位图对象。
6、选中新转化的位图对象，执行属性面板上的“滤镜|调整颜色|色相/饱和度”命令，在弹出的设定框中，参照下图所示进行设定。

7、在预览状态下，调整到比较完美的结果后，单击确定退出，编辑区图形效果如下：

8、添加一个背景图像，看看是否让自己满意呢？！


提示：本例中，两个“Ctrl+Alt+Shift+Z”转化为位图的操作是很关键的，因为如果在“转换为Alpha”的基础上，对该图形进行后期的“添加颜色”和“色相/饱和度”的滤镜操作，是不会产生任何效果的，因为大家知道，在Alpha状态下，所有的颜色信息只剩下“黑”和“白”，所以其他的任何调整颜色的设定都是多余的，不会发生任何效果的。
但是如果我们在其为“转换为Alpha”的状态下直接将其转化为位图对象后，我们就可以对新生成的位图对象进行后期的颜色调整的操作了！这点儿需要大家额外注意！]]> http://www.jiachengqi.com/default.asp?id=15 ikite@tom.com(kite) Thu,20 Jul 2006 14:51:44 +0800 http://www.jiachengqi.com/default.asp?id=15 既然提到了knockout2.0，我们就先要拥有这个软件才是。

点此下载knockout2.0的汉化版 

具体的安装过程这里就不作说明了，需要提醒的一点而是，在第一次选择安装目录的时候是无所谓的，可以任意放置，在提示选择插件的安装目录的时候，就一定要选择安装到fw的安装目录的“Plug-in”目录下了，否则就无法正常运行了。

至于knockout软件的使用方法，也不是本例的重点，大家可以先看看这篇文章热热身，再看后面的教程就会简单多了。织梦相关教程

素材图上节已经提供了：

既然有了第三方滤镜的支持，我们接下来的工作就会简单多了。

我们先来用扣图教程（六）提供的方法来看看处理完的效果。头发的边缘明显发生了颜色的偏差，这个是我们不想看到的。


既然这样，我们就来感受一下knockout的强大功效吧！
1、打开原图后，复制一个新的图层。选中复制图层后，执行菜单“滤镜|knockout2|载入工作图层”命令。

2、选取“内部对象”绘制工具，开始对人物的主体进行绘制。

3、可以使用放大镜工具将图像放大后进行绘制。重点来看头发部分，注意绘制的时候千万不要绘制到与主体无关的部分。

4、内部对象绘制完毕后，可以接着是用“外部对象”绘制工具描绘头发的外部零散边缘部分，如果是较为复杂的头发发梢，建议采用“外部对象”绘制工具，不过鉴于本例的头发边缘效果较为简单，所以我们直接单击工具栏上的“自动外部对象”按钮即可快速实现对人物外部边缘的轮廓的选取了。
5、单击“自动外部对象”按钮后，看看效果。

6、满意后，按“Ctrl+P”快捷键或者“处理这个图像和显示输出图像”按钮。

7、扣图的处理完成了。

8、选取菜单“文件|应用”命令，即可将处理完毕的图像返回到FW的编辑界面中来了。
9、添加一个背景图像，看看最终效果。对于细节的一些部分，可以通过橡皮擦工具或者画笔工具进行细微的调整，以期取得最佳的效果。


本例其实对于Knockout软件的使用并未做非常细致的介绍，大家如果对这个软件有兴趣，想深入了解的话，不妨找一些相关的专业教程来认真学习一下，本例就偷懒了。当然，最关键的一点儿是，不怕大家笑话，我也是现学现卖来者，呵呵！怕把大家教错了，岂不是罪过！

作业：大家可以使用knockout来处理一下下面这幅素材图（有人说了，风筝也太狡猾了，拿一个巨简单的素材来写教程，拿一个那么复杂的图片来留作业…… 呵呵，忘了偶是老实了吧？！老师一般不都是这个样子地吗？！ ）

]]> http://www.jiachengqi.com/default.asp?id=14 ikite@tom.com(kite) Thu,20 Jul 2006 14:15:36 +0800 http://www.jiachengqi.com/default.asp?id=14 我们在扣图教程（四）中，重点推荐了一种滤镜的使用——转换为Alpha，其实对于白色背景而言（如果非白色，就使用色阶滤镜来制造白色背景），使用“转换为Alpha”滤镜真的是一个比较不错的去背手段，即使头发不是黑色。本例我们就来深入探讨一下其中的关键所在。
照例先来看素材图：

背景色为白色，不过两个MM的头发颜色不太一样哦，一个是黑色，一个偏黄，如何处理呢？还直接按照教程（四）提供的方法来做的话，会出现什么效果呢？！来看具体步骤。

1、好习惯，先来复制新的图层，隐藏、锁定原图所在层。

2、选取套索用具，属性面板上不作更改，“边缘”采用默认的“实边”效果。

3、将最上层图片的人物主体扣出，然后将中间层的位图对象执行“转换为Alpha”滤镜操作，可以看到编辑区出现的效果了。

4、黑头发还好了，偏黄的头发的效果就太差了，这不是我们想要的效果。还好，有个变通的办法。不过先声明，这种办法只适用于那些对于扣图的最终效果要求不是特别高的用户而言，希望大家明白这一点。

好了，让我们重新来一次吧！

1、同上面的操作
2、选取套索工具，在属性面板上进行设定，将“边缘”设为“羽化”，将数值设为30左右（注意：数值的大小和图像的性质是紧密相关的）。

3、重复上面的操作，出现效果。

4、似乎基本上符合我们的要求了，添加一个背景图片看看效果吧！

5、问题出现了，1、2、3处皆出现了“漏底儿”的问题，这是我们在进行上面第2步操作的过程中不注意的结果。
6、撤销操作，重回到第2步，进行选区的选取操作。尽量将选区的范围扩大到人物的主体之外。

7、接下来的操作不作追述了，最终效果看看如何吧！


呵呵，其实本例是对前面教程（四）的一个补充说明吧！希望大家不要烦噢！！
留作业：
扣头发，素材图如下：


敬请关注 扣图系列教程（七）的新鲜出炉！！
]]> http://www.jiachengqi.com/default.asp?id=12 ikite@tom.com(kite) Wed,19 Jul 2006 23:50:22 +0800 http://www.jiachengqi.com/default.asp?id=12 特别提示：本例中使用到了色阶工具。目的只有一个，将非黑白背景想办法再次变成黑白背景！
还是照例先来看需要进行处理的素材图：


1、在层面板上复制两个图层，隐藏、锁定原图层。

2、选中最上面的图层，是用套锁工具选定人物的主体部分，还是那样，除了飘散的头发外，能选中的部分尽量都选中，无关的内容能去除尽量去除。

3、得到选区后，按“Ctrl+Shift+I”快捷键，反选选区，然后按“Del”键，删除选区，然后隐藏该图层。
4、选中第二图层的位图对象，选择属性面板上“滤镜|调整颜色|色阶”命令，在弹出的“色阶”对话框中，单击那个白色的吸管，提示为“选择高亮的颜色”。

5、在背景色最蓝处单击吸管，确定高亮的颜色。（注意：对于色阶的知识如果不太清楚的话，本处可反复试验一下，总之是要想办法将背景色变为白色才是）

6、单击确定按钮，编辑区的图象发生了变化。背景色接近为了白色，这就是我们刚才使用色阶命令后产生的效果。

7、接着继续执行属性面板上的“滤镜|其他|转换为Alpha”命令。

8、取消最上层图像的隐藏，可以将它放置到任意的背景中去了！


补充说明：有关色阶的详细知识，建议大家搜索一下相关的详细的介绍，我们这里就不作具体说明了！]]> http://www.jiachengqi.com/default.asp?id=11 ikite@tom.com(kite) Wed,19 Jul 2006 23:33:49 +0800 http://www.jiachengqi.com/default.asp?id=11
扣头发是比较令人头疼的事情，为了便于说清楚，我将扣头发的类型分为了四类（我目前只想到了四类）：
其一为：扣黑白背景效果的黑头发；其二为：扣非黑白色的接近纯色的背景效果的黑头发；其三为：扣背景色较为单一的非黑色头发；其四为：扣背景色和头发色接近的头发。个人认为这几种类型的难度系数是逐渐增大的。在接下来的几篇教程中，我会依次介绍前三种的扣图方法，至于第四种，在fw中，还没有找到较好的解决方法，留待继续研究中！

本例学习最简单的第一种类型。
在本例中，使用到了一个“滤镜”——“转换为Alpha”，可不要小看这个滤镜哦，如果仅仅是单一的黑白背景，仅仅通过这样一个小小的滤镜效果的使用，就可以达到预期的扣图目的。

好了，照例，教程开始前，先来看需要进行处理的素材图：


1、扣图开始之前，养成好习惯，在层面板上先复制出2个新的图层，将原图层隐藏、锁定。

2、选中最上面的图层，用套锁工具，将人物的主题轮廓勾勒出来，也就是说，除了飞舞的头发外，其余的部分能选中的尽量都选中，不需要的部分能去掉的都尽量去掉。（为了自由的进行选区的操作，记得灵活配合Shift键和Ctrl键啊！）

3、选区完成后，按“Ctrl+Shift+I”快捷键，实现选区的反选，然后按“Del”键，将选区删除。然后可以在层面板上暂且隐藏该层，以便后后面的操作。
4、选中位于中间的图层对象，选择属性面板上的“滤镜|其他|转换为Alpha”命令。

5、将最上层的图层对象变为可视，添加背景，看看效果吧！


好，收工！简单吧！
]]> http://www.jiachengqi.com/default.asp?id=10 ikite@tom.com(kite) Tue,18 Jul 2006 18:21:26 +0800 http://www.jiachengqi.com/default.asp?id=10 说白了，扣婚纱的关键所在就在最终处理婚纱的透明效果上，为此，本例中使用到了FW工具组中我们平常很少用到的工具——减淡工具。
具体步骤开始前，还是先来看看本例操作中使用到的素材图。


1、因为是单色背景，所以我们直接使用魔术棒工具进行背景的选取即可。

2、得到背景选区后，按“Ctrl+Shift+I”，反选选区，得到人物主体的选区。“Ctrl+C”复制人物选区，然后打开新的背景图片，“Ctrl+V”粘贴过来。

3、在图层面板上，快速建立一个人物图层的拷贝。然后隐藏下面的原图，并且可以锁定它，避免误操作。

4、因为婚纱的透明部分颜色基本上比较接近，所以仍然使用了魔术棒工具来进行透明婚纱部分的选取操作了。

5、为了避免自己辛苦得到的选区不小心被破坏了，我们可以选择菜单“选择|保存位图所选”命令，将得到的选区进行保存。

6、同样，对于选区的细节部分，仍然可以配合“Shift”键、“Alt”键和套索工具进行调整。

7、处理完毕，直接按“Ctrl+X”快捷键，将选区剪切，然后按“Ctrl+D”快捷键，取消选区，接着按“Ctrl+V”，粘贴选区内容，层面板上会自动新建一层。

8、选中新增的图层，将图层混合模式设为“平均”，数值不作调整。

9、可以看到编辑区已经初步出现婚纱的透明效果了。

10、接下来，就要使用到减淡这个工具了。选取工具箱里的“减淡”工具，在属性面板上对减淡工具进行相关的设定。大小的设定不作说明，这个根据实际情况来做设定。重点是进行“曝光”和“范围”这两项的设定，“曝光”值不要太大，否则就太白了，“范围”共有三项可以选择，先选取“中间影调”作为基准。具体设定，如图：

11、好了，设定完毕，对透明婚纱所在层进行减淡的涂抹操作吧！晃悠鼠标估计谁都会吧，嘿嘿~~~

12、擦拭了一遍，出现下图所示的效果：（注意，不要总在一个地方擦来擦去，要注意总体的效果，免得出现不均匀的下场）

13、使用减淡工具擦拭完毕后，感觉婚纱的褶皱的地方效果不太好，颜色太深，和总体不协调，怎么办？先隐藏了透明婚纱所在层，发现了原因所在，原来是前面在进行剪切操作时的后遗症：

14、别急，还是使用减淡工具，接着将褶皱部分进行擦拭，不过这次在属性面板上要进行一定的更改，关键还是“曝光”数值和“范围”选项的设定，具体设定，如图所示：

15、设定完毕，擦！擦完后的婚纱褶皱处的效果如下：

16、取消透明婚纱层的隐藏，总体效果出现了！


呵呵，本例的扣图工作就宣告结束了，大家对于这种方法有什么好的建议和想法，不妨一起到织梦论坛来进行讨论吧！！
]]>