[组图]写实：Fireworks中显示器的绘制

一、显示器的外观　　新建一个800*600大小的画布，然后用“矩形”工具直接画一个446*384、圆角度为3的圆角矩形。而千万不要画个小矩形后再拉大到所需的大小，否则圆角度将不规则。然后由左#D4D4D4至右#BEBEBE进行线性渐变的填充。并为其添加一个 “内斜角”的特效，如图01。
4 l( C* |7 F5 o  c5 c

' j7 Y1 r* K3 ~1 ?4 h
9 A9 x! j/ k3 \2 u/ m图01　　用“椭圆形”工具画一个446*25的椭圆形，然后将这两个对象进行水平对齐后，把椭圆形的水平中线与矩形的底线进行重合对齐。如图02。
6 {- A2 b; p2 i# Z% ]. U
% h5 q( v6 ?4 N5 n# y8 }7 P3 \( i
2 k9 f: q+ g8 h$ D4 c- X  @* }
. @" x: ?7 d. s* P8 g1 u图02
　　把这两个对象同时选中后使用“修改—组合路径—联合”命令，使其形成一个显示器的外观路径。
二、绘制显示屏　　为了使这个显示器更加的逼真，我们不妨先回到电脑桌面，然后按下PrintScreenSysRq键，把你当前所用的电脑桌面截取下来，在Firework里按下“粘贴”按钮进行保存。然后把这个桌面的大小改为363*272。接着把桌面和显示器的外观路径进行垂直对齐，并使显示器的外观顶线高出桌面顶线47个像素。如图03。

& i: a7 @: ~: t8 j
! A- w; h' h5 r8 |
图03
　　显示器的桌面被确定下来后，也就等于将显示器的显示屏位置也确立了下来。这为接下来绘制显示器的边框带来坐标上的定位。三、显示器边框　　用“矩形”工具画一个405*6大小的长条矩形，从#CCCCCC至#E6E6E6进行由上而下的线性填充。使其与显示器外观进行垂直对齐后紧靠在显示屏上端，如图04。
( Y5 ^. q7 W2 U$ R, x, t
0 l8 l% S8 `! J2 k
, ^' a8 m6 K; \/ [: w+ j. {
图04
. H* ?$ D1 o, B4 A7 ~& y: _2 R- P　　用类似的方法，再绘制一个405*9的长条矩形，然后从#FFFFFF至#C7C7C7进行由上而下的线性填充。接着使其与显示器外观进行垂直对齐后紧靠在显示屏下端，如图05。
- a9 v9 y4 e- h) H9 h0 I' I
: R) f# {# e" q  u4 Q- m1 i$ w: @' J
( W4 r7 `: R* t8 l0 O( B
图05
; h/ g/ ^+ a0 f　　我们再来绘制显示器的左边框。先用“矩形”工具画一条28*286的长条矩形，然后从# D3D3D3至# FFFFFF由左向右进行线性填充。接着用“部分选择”工具将这一矩形右上角边路径节点选中后，用方向键使其向下移动6个像素。同样的，也把右下角的路径节点向上移动9个像素。然后使这个左边框在紧挨着显示屏左边缘的情况下，还要和上、下边框进行对齐。如图06。


' B' N3 g% n( `
4 c6 D( r& n$ g$ K1 r图06
0 I. E/ H5 x- l7 @/ @　　右边框的绘制也大至相同。先画一个28*286的长条矩形后，从# BFBFBF至# FFFFFF由左向右进行线性填充。然后用“部分选择”工具将这一矩形左上角和右下角的两个节点分别向下移动6个和9个像素。然后也要紧靠着显示屏右边缘的情况下进行对齐。如图07。

/ ?2 D2 \2 s" ^4 m* d7 ]9 K

/ V+ z- [/ D; q! h2 k图07
6 q# n: G) z. O/ v　　完成上面的所有操作后，我们把所有对象全部选中，然后使用“修改—组合”命令。四、显示器托架　　接下来我们来画显示器的上托架。先用“椭圆形”工具画一个201*121大小的椭圆形。使其与显示器进行垂直对齐后，采用# C6C6C6至#838383的椭圆形填充和# 757575的1像素柔化描边。然后再为其添加一个5%的木纹纹理。完成后将这一对象通过“修改—排列—移到最后”命令。如图08。
1 J6 u- m- a# {# h) {3 G

1 R2 G3 q3 X; q
/ D( a& I: p: @4 m1 x图08
3 q- Y- @0 b+ ]" d  e8 g　　画完上托架后再来画下托架。用“椭圆形”工具画一个299*80大小的椭圆。同样要将其与显示器进行垂直对齐，然后采用# E0E0E0至# 5E5E5E的椭圆形填充，并为其添加一个5%的木纹纹理。完成后也通过“修改—排列—移到最后”命令将这一对象移到最后一层。如图09。
3 ?3 T& }% H5 r1 p$ e% x' n


% e& x: \1 r. J  r  X& Z) l3 D图09
　　将这一椭圆进行复制后，把复制品改用线性填充，完成后也移到最后一层，如图10。

5 }; k+ \; {9 M0 R" O
8 V; p! C2 m, S/ ?; F9 o# R2 O
  l9 i- `: E. R! y" n图10
& H) t+ P7 o2 F3 K　　在托架上还有个垂直指针样的三角凹槽，我们用“矩形”工具画出一个4*9的矩形后，用“部分选择”工具将矩形左下角的一个路径节点选中后删除，然后把右下角的一个节点向左移动2个像素。接着再用#EBEBEB进行实心填充和#999999的1像素柔化描边，并为其增加一个“内斜角”特效。如图11。

7 E; O1 p" B! ~/ U" ~0 j- ], c4 F
! d: s8 q% T6 Y/ j) ]( k7 q
图11
9 j& b6 I- f' v0 [) c* }8 O　　完成后将这个三角凹槽与显示器托架进行垂直对齐，如图12。

- D( B% l- w  T: y

图12
五、开关键的绘制　　用“矩形”工具在显示器右下角的地方画一个21*21的矩形，然后为其使用# C1C1C1的实心填充和# 333333的1像素柔化描边。再分别添加一个“内斜角”特效和一个“外斜角”特效，各项设置如图13。



图13
* ~! S) M, P: Y' I, R　　在开关键上画一个7*8的椭圆，并使用#535353的1像素柔化描边，然后用“切线”工具将该圆的上部切出一个缺口，如图14。



图14
　　将该圆上部被切除的路径删除后，用“直线”工具顺着缺口的中央画一条描边色为# 818181的直线，如图15。
" Z' ^$ M: P# F. R2 t
* M1 t" |) p( C2 c

图15
. W3 z- v! ?, T0 Y; D- ~　　这样一来显示器的开关键也就画好了。我们顺便在这开关键的左方绘制一个4*4大小的圆形电源指示灯，用#E2FF71进行实心填充即可，如图16。
" Q2 H7 s/ `% f0 d8 V1 X
* g1 z: F) ^. E

图16
# Z$ y3 ~# f! g5 p) p/ X六、调节键的绘制　　我们接着来画显示器上的调节键。先画一个31*13的椭圆，然后再将该椭圆另行复制一份并将其向右移动19个像素，再将这两个对象同时选中后使用“修改—组合路径—联合”命令，使其形成一个新的组合路径。然后对这一路径使用# CCCCCC的实心填充和#666666的1像素柔化描边。接着还要为其分别添加一个“内斜角”和“外斜角”特效，各项设置如图17。

5 L7 Z6 _5 S8 S9 T) c7 _# O  R

/ P- [) n+ }3 P" D/ R& w1 ^/ y图17
# O( Q1 z/ P  A6 t　　完成这些操作后，将这一组合路径与显示器进行垂直对齐，如图18。


5 F  e" X4 n8 ~
图18
　　把这个组合路径再复制一份，然后用“部分选择”工具将复制品最左边的三个节点同时选中后进行删除，如图19。
# m5 j2 ~- H7 {; ]1 A' K


3 `. g' v; \( ~3 H/ W图19
  ~4 X; c% ~7 j% ~　　通过“部分选择”工具的修改，使这个复制品的左边路径形成一条直线，如图20。
4 y' j2 A0 z. J6 m0 ^5 y
3 t; e" ~5 M2 F1 `9 Z. U9 l: n

图20
1 B7 G! ]4 R; B; R2 U/ H: }9 I- U　　为这一复制品改用# C0C0C0进行实心填充，然后再添加一个“内斜角”特效，如图21。
" a) R5 }9 t1 O2 z+ g5 n' B. Q

) Z# j9 A  `) C) R( d# y
图21
3 L7 Z# Y1 |9 B# y7 H+ K7 \" H　　将这一复制品进行克隆后，把克隆对象进行垂直翻转，然后将其平移到右边。接下来就用“直线”工具在这两个调节键上分别绘制“—”号和“+”号，如图22。

5 p3 w: Q% k4 |) H
9 H0 x; h- M' ~/ _8 m* i! P! B
图22
! `' U' ?, m. R7 w5 d七、控制键及文字　　在距离调节键右边6像素的水平位置上我们来画一个控制键。用“椭圆”形工具画一个10*10的正圆形，然后对该圆使用# C0C0C0的实心填充，并以# 333333进行1像素的柔化描边。再为其分别增加一个“内斜角”特效和“外斜角”特效，如图23。
7 Q; J; J4 L! ~2 L
3 R) j8 W. R# P: A% V
" G% _2 f' l* k4 O, X. q
, i! H' x! h9 ?1 S& ~8 F# B6 z图23
5 X+ I0 _, a2 z: g6 R7 F　　将这一控制键再复制7个，然后按每个控制键相隔6像素进行水平排列，如图24。
0 K. G" [; X4 C  X. L
0 Z& u+ M" L$ b$ r- Y7 E1 e  `6 w

; {' L  f5 G2 d7 j! v图24
/ Z" q* F5 S+ q7 Y1 U9 T　　我们再为显示器加上显示器的商标及型号。选用“Impact”字体在显示器的左下角位置输入大写的“SAMSUNG”，然后更改其字体大小为12号，颜色采用# 838383进行填充，同时字体的水平间隔设为113%。如图25。

5 s. I! P4 K. I9 Y4 r$ l7 E1 h

图25
* R0 z+ p! O+ i4 S6 y: V　　在文本上点击鼠标右键，从弹出菜单中选择“转换为路径”项。然后再对文字使用一次“修改—取消组合”命令。文字被打散后每个字母都可以自由的移动了，我们将这些字母除最左边的S以外，其它的都向右进行水平移动。使每个字母相互间隔均为2个像素，如图26。
+ h7 |# w2 d5 o/ q! U


" ~: h/ U3 X% K6 g图26　　我们再为显示器输入型号。用“Haettenschweiler”字体在显示器开关键的上面输入“SyncMaster 550s”。然后改用字体大小为10号。使用# 686868进行文字填充即可，如图27。
* s% y% `0 t( b5 L7 S8 v5 `! w


7 q0 ]  T. X  Q. ]图27　　最后你还可以将当前所用的桌面壁纸导入Firework里并移至最后一层，为这个显示器当背景。然后通过“文件—导出预览”窗口把整个作品导出成JPG图片后，把这个作品设为你的新桌面，让亲朋友好友也能经常看到你的杰作！ 最终效果如图28。
! A4 }9 h# ]# B


图28　　源文件下载
0 b. `3 u/ ^; U0 A" e0 z?