谈Fireworks像素化文字的制作方法

1、打开fw，新建文件，大小为50 x 50 像素，背景色采用默认的白色即可。　　2、在编辑区输入文字对象，这里输入了“风\"这个字，字体为“华文行楷\"，字号大小随意，此处采用了“45\"，并且“加粗\"文本对象，将边缘效果设为“不消除锯齿\"，具体设置如下图所示。

/ h% w7 ?% Y# ^! \5 q4 q5 m
　　3、选中文本对象，单击菜单“修改--平面化所选\"命令，或者按快捷键“Ctrl+Shift+Alt+Z\"，将文本对象转化为位图对象，继续后面的操作。　　注意：此处务必要将文本对象转化为位图对象，否则后面的操作就没有意义了。　　4、在编辑区以外的任意地方单击鼠标左键，属性面板成为“文档\"属性面板的显示状态。单击面板上“图像大小\"按钮，在弹出的“图像大小\"设置框中，将图像的“像素尺寸\"区域的宽和高的数值大小都设为 500，然后单击“插值法\"的下拉菜单，将插值方式设为“最近的临近区域\"，具体设置如下图所示。

; q1 Y2 d$ @! X/ S" t8 E. @
" q8 }  Q- y. m4 |7 M/ N　　注意：有关“插值法\"的几种计算方式的知识，将在教程最后做一个简单的讲解。这里如果不太了解的话，可以先不用管它，继续后面的操作步骤即可。5、此刻编辑区的图形对象如下图所示。


- l8 U* V4 D% f% \  C, x( j1 U　　6、接下来，我们要制作一个用来产生像素化效果的填充纹理图片。再次新建一个文件，文件的大小为 10 X 10像素大小，背景色采用白色即可。　　7、使用矩形工具在编辑区绘制一个矩形对象，在属性面板上设置矩形对象的填充色为“无\"，描边色采用“红色\"，描边类型为“1像素\"，宽，高均为10像素大小，具体设置如下图所示：

8 [  d8 J: B! y& ^
　　8、一切设置完毕，保存文档到你知道的地方 。　　9、返回到刚才编辑的像素文字效果的编辑窗口， 打开层面板，按下“Ctrl\"键，然后单击“位图层\"，即可得到转化为位图对象的文字的选区，具体操作参看如下图。


　　10 、单击工具箱上的“油漆桶\"工具，然后调整属性面板的填充设置。单击“填充类别\"的下拉菜单，选择“图案——其他\"，在弹出的“定位文件\"的对话框中选择我们第8步操作保存的文件即可，颜色填充井就会显示出我们刚刚制作保存的纹理图案了，属性面板此刻如下图所示，
/ j7 ~2 y8 \6 `
9 W2 Q# i2 ?8 q8 o
　　注意1：将边缘设为“实边\"，“容差\"值设为“0\"并且取消“填充选区\"前面的复选框。　　注意2：如果我们将将“边缘\"设为“羽化\"，并且给予一个数值大小，并且将“容差\"值设为任意一个数值，如下图所示。
' g- \5 W- q7 S
, }  u: V2 t! Q/ q
- @' ^& G* T$ L/ Y' z: S9 L/ [　　如果我们按照上图设置继续随后步骤的操作的话，效果会有一些不同，具体操作结果请参看第12步的操作。11、此刻编辑区的“文字\"区域应该处于选中状态，在选择区域内单击鼠标，即可完成对选区的图案填充了，按快捷键“Ctrl+D\"取消选区，编辑区的像素化文字效果已经出现了。
4 _: A1 [8 M5 Q% g) u" q* R3 e
& Y6 r' D5 c5 V/ o6 \. _) _' J+ ]
　　　如果这样来看的话，使用FW来制作像素化的文字效果，比起PS来，要快了许多，大家不妨比较一下。　　13、如果按照第11步“注意2\"的设置进行上一步的填充操作的话，会出下如图所示的效果。
6 ]" |. ^1 Y6 f

; e3 l/ o0 Q% U( r# F　　图形边缘的颜色会以先前文字填充的颜色显示出来，从而形成了一种简单的立体效果。　　好了，有关像素文字的制作方法我们就先介绍到这里。有关制作中出现的问题及其“插值法\"的相关知识介绍，请参看后面的补充介绍内容。[补充介绍1 出现的问题]接下来我们一起再来看一下，有的朋友在制作的过程中可能会出现的一些问题。哪就是在第2步的文字输入操作中，字号大小那就是进行了第11步的操作后，有可能编辑区对象的填充的效果并非如同我们所期望的那样，而是出现了下面的填充效果，如下图所示。
, v* T" `5 s- @. c" |2 J+ t; B
0 _8 r2 f: I8 x! h% b
　　也就是说，图形的部分边缘效果并非如我们所期望那种闭合状态，这样需要我们做进一步的修整工作，将图形对象的边缘部分彻底必合起来。操作步骤如下。　　（1）按下“Ctrl\"键，单击位图对象所在图层，这样即可获得该位图对象的选区。　　（2）选择菜单“选择——边框选取框\"命令，在弹出的“边框选取框\"的对话框中，将宽度设为“1\"像素，单击确定按钮即可。


　　（3）将视图缩放到“300%\"状态，可以看到选框已经变成了宽度为1像素的选区状态，如下图所示。



（4）为了一次性将选区做一个填充，此刻单击层面板上
1 [* i  }9 c/ y
“新建位图图像\"按钮，这样就会新建一个只包含第（3）步操作得到的选区的位图图层，如下图所示。
4 l+ h# ]7 ^9 B5 A


　　（5）选择工具箱的“油漆桶\"工具，在属性面板上将填充类别变为“实心\"填充，颜色选择刚才字体的颜色——“红色\"，其他设置不用更改。在新建位图图层的选区上单击鼠标进行填充，这样就快速得到了图像的边缘填充效果。如下图所示。
$ N# }6 E/ S+ q


　　[补充介绍2 “插值法\"的知识了解]在前面进行的图像大小的调整操作中，我们特意强调要将插值方式设为“最近的临近区域\"。那么有关“插值法\"的知识想必大家也想简单的了解一下，接下来我们就一起通过几个小试验来共同了解一下有关“插值法\"包含的几种类型，及其对应的应用效果，从而对其有一个大概的了解。　　一般来说，如果现有图像的尺寸和分辨率与我们的要求不符的话，就需要使用菜单“修改——画布——图像大小\"命令（或者在文档属性面板上单击“图像大小\"按钮）打开“图像大小\"设置窗口来进行相关的设置，如下图所示。



在“图像大小\"面板中，可以了解到当前图像对象的有关“大小\"内容的各个参数。通过改变这些参数，即可对图像的大小做相关的改变调整。在调整中有三点需要注意： 　　1.如果只是改变“像素尺寸\"区域的宽、高的大小，那么它与图像的最终输出尺寸、及其文件的容量成正比关系，而图像分辨率则不受任何影响。也就是说，只改变图像的尺寸，并不会改变图像的分辨率，这在我们前面像素文字制作的实例中已经得到了验证。　　2.如果改变图像的分辨率，那么它与像素宽度、高度的数量以及文件容量成正比关系，而与图像的打印尺寸没有关系。也就是说，只改变分辨率的大小，并不会影响到图像的打印尺寸大小，请看下图操作示范。
# V1 [/ \! q2 h; D$ x5 c8 p


　　3.选中“约束比例\"前面的复选框，取消“图像重新取样\"前面的复选框，此刻图像的打印尺寸大小与分辨率大小成反比的关系，也就是说在图像的像素大小确定的前提下，如果要求图像的分辨率越大，其打印尺寸就会相应的越小。具体的操作如下图所示。

; O$ E4 D5 ?6 e8 T# z% A; B) r0 W& o6 ~
% ^) W* n5 ~- N/ a
7 f" ?( s% T! t3 W- M. U  d　　根据以上这三个需要注意的内容，那么我们将一个图像从小尺寸改变为大尺寸的时候，就肯定要增加新的像素；如果将一个低分辨率的图像提高分辨率，也需要增加新的像素，这些新增加进来的像素，就被称为“插值\"。而插值的方法在fw中总共提供了四种：双立方、双线性、柔化、最近的临近区域。使用过ps的朋友可能注意到了，fw中提供的插值方式比ps要多一种“柔化\"，几种具体的插值方式算法是不同的，所以其产生的效果也是各不相同的，具体到那种插值算法更好，更科学，我们不能下出结论，因为通过随后的操作试验我们会感受到各种插值算法产生的效果是各有千秋的，具体倒使用那种算法来进行我们的像素填充工作，就看看随后的每一个试验吧！1、 在编辑状态下，截取屏幕上任意一小部分图像，建立一个新文件，并且将这个图像文件制作三个副本以备随后的操作。打开“图像大小\"设置窗口，即可看到当前图像文件大小的各项参数。 截图对象及其该对象图像大小的有关参数如下图所示。

% }2 S- c+ \% ]4 i5 I

+ ~9 i* g% G$ h0 G6 K  @1 C2 o' Z　　2、选中编辑区的图像对象，打开“图像大小\"的设置窗口，将图像大小由106 X 67像素改成212 X 134 像素，单击确定按钮图像即以默认的双立方插值方式大大增加了图像大小。我们已经知道二次立方的插值方式是在原有的两个像素之间插过渡值，因此我们看到：尽管画面已经虚了，可画面中的图像部分还是合乎情理的，但文字部分虚的比较厉害。请参看下图。

! e" ?5 M; O' l8 x

: ^( {: X& a' j3 x1 S. Y+ f　　3、将图像大小由106 X 67像素改成212 X 134 像素，设定插值方式为“最近的临近区域\"，单击确定按钮，我们可以看到：画面中的图像部分出现了明显的像素化效果，尤其是边缘部分更为明显，但文字部分却比较“硬\"，这样反而显得清楚了很多，不过圆滑度却缺少了很多。请参看下图。
0 _' G& _6 p1 _: D% v3 f/ p


/ u; d) J3 g, D0 t6 F2 B- Y4、将图像大小由106 X 67像素改成212 X 134 像素，设定插值方式为“双线性\"，单击确定按钮，我们可以看到：图像比起“双立方\"方式设定后产生的效果要更为柔和，而文字也较“最近的临近区域\"要柔和些，能体现出文字的柔和度来。也就是说这种方式是介于“双线性\"和“最近的临近区域\"两种方式中间的一种方式。请参看下图。



　　5、将图像大小由106 X 67像素改成212 X 134 像素，设定插值方式为“柔化\"，单击确定按钮，我们可以看到：图像比起“双线性\"方式设定后产生的效果要稍微“硬\"些，从而表现得更为清楚些，而文字也是较“双线性\"方式产生的效果在圆滑的基础上更为清楚些。请参看下图。
4 F8 ]' ?! O. `- a! k: A


　　6、下面来一起看看原图和经过几种插值算法放大后的效果图的比较，这样我们能够比较直观的看到经过不同插值算法后产生的不同的效果。
/ x" W' n: S  C% Z& R% h; j


3 s* z6 B5 H* [　　这样，我们可以暂且得出一个结论，如果我们在非要增加像素不可的前提下，如果图片的质量需要得到较好的保证，那么采用“双立方\"和“柔化\"的方式来处理是一个不错的选择，如果以文字质量保证为前提，那么“最近的临近区域\"是一个不错的选择，我们这次制作的“像素文字效果\"也就是使用“最近的临近区域\"插值算法实现的一个最好理解的文字效果。　　如果我们既想要图片的质量，有想要清晰的文字效果，那么不妨把原始图片分别做两种插值计算，一方面进行“柔化\"或“双立方\"方式做插值来获得较好的图像效果，另一方面，采用“最近的临近区域\"方式做插值来获得较清晰的文字效果。最后将两方面做插值得到的不同效果来进行“修补\"，把文字清楚的部分“挖\"到图像清晰的图像上，如下图所示。
7 A! f( `4 _% B, d
1 T3 P5 X2 J" q0 P

　　好了，如果想了解“插值法\"的更详细的知识，请大家再去找一些相关的专业书籍来寻找答案，在这里，我们对“插值法\"的相关讲解就到这里了。