FW形状文本路径绘图:大学校徽

[复制链接]
查看: 432|回复: 0
gggds 发表于 2009-12-27 13:25:08 | 显示全部楼层 |阅读模式
  k7 b3 |& i; L, S7 K

+ ^! ]* F8 r) o0 ?4 q- `  本文实例主要和大家一起绘制南开大学的校徽。我们的思路是校徽中心放置“南开”两个字来代表学校的名字,文字的四周是个八角的星状图像,星状图外切一个圆形,圆形外围有个“NANKAI UNIVERSITY”和“TIANJIN”等文字,这些文字又是处在另外一个圆环之内的。下面我们就来看看校徽的具体制作步骤,从中熟悉Fireworks MX 2004中形状、文本、路径等工具的使用。文章末尾提供.png文件供大家下载参考。
* {1 u6 C# G9 {  绘制步骤    (1)新建一个大小为400×400的图像,我们首先绘制八角形。点击工具箱上的星状工具
: u# p5 c( B* B: p( ]
; B, e0 ?5 J' i$ T3 g4 | 绘制一个五角形,并将填充设为无,笔触颜色为#865DA2,笔触类型为Felt Tip中的Dark Marker,并设置笔触大小为8,得到图1所示的图像。 # i9 e. D3 |- h7 y
7 f4 I+ C" _- r: R8 S

* s- H% }6 h2 J 图1 绘制五角星形
/ z3 g7 P/ A# C& F  (2)我们设计的校徽中的星状图形有八个角,那该怎么办呢?不要着急,在五角星中我们找到点5,也就是左下角的那个控制点。这个点是控制星状工具的角数的,使用选择工具选中这个点,按住鼠标右键不放,并旋转拖动鼠标,这时候我们发现五角星的角开始变化了。当出现八个角的时候我们释放鼠标左键就可以了,如图2所示。
: t1 t6 ?6 ^6 D9 ?6 ~  注意:在Fireworks MX 2004中增添了许多功能,其中这些新工具如星形绘制工具的控制点是一个特别的东西,需要我们逐步了解。。
: H& x' J" h( x" t0 A  H6 }4 L# k9 ]9 r: O" J+ h
: Y/ u1 C( |' E2 V) q& f3 c
图2 改变星形的角数
: n( v% F0 g; N  O1 r) b1 R- \* {  (3)虽然星形编程了八个角,但是我们觉得凹入的角度过于尖锐,需要将凹入的角度变大,这时候我们使用类似的方式,选择控制角度的控制点,按住鼠标右键向外拖动即可将凹入角度值调大,如图3所示。
" y% a/ F' `8 v. h; `
; S* D! E* Z" A$ v" ]. U$ Q- E. z1 f: i. N* o0 I) W
图3 调整凹入角度8 B" d; |) l3 s$ |& }3 ^
  (4)释放鼠标,我们就得到了图4所示的八角内部边框了,下一步的工作便是在图像内部添加“南开”两个文字并对文字进行调整了。. h8 [8 o( j4 z; e' y7 J9 X) v
* j/ Q6 R9 h- q5 U# K6 M: N* |

; L- _7 M  E. V1 H. |8 | 图4 校徽的八角内部边框( f) R' F2 j; Q6 V0 q, ?! u
  (5)现在我们点击工具箱上的文本工具 " G( R4 a* F2 J/ y3 X& j

- q; ^( \; _# Y" `; b% U 添加“南开”两个文字,设置字体类型为“文鼎繁淡古”,颜色和内部边框颜色近似即可,如图5所示。
9 b! e/ ]4 L8 p; `1 b3 y- h5 w: c; t: d
) H% s) t9 m7 W$ G* N/ I
图5 添加文本
. [+ b4 x% f- g: n& m  q  (6)选择工具箱上的缩放工具
) A+ v: |; E& M- L: C7 X7 S7 Z4 H- u% W% u7 F
对文本实行变形和缩放,调整文本的大小和长宽比,使得文本能够和边框匹配,如图6所示。
* p/ b% Z6 L6 I2 L: |' B1 W  z! l: g4 q$ k

0 }& E2 ]0 m) [1 z2 Y2 L 图6 对文本进行调整) E! q* F& b1 o3 b0 `; Y
  (7)我们还想对“南”字进行一定的调整,使得“南”字的横能够两端向上挑起来,但是没有这样的字体。难道我们没有办法了?其实我们只需将文本转换为路径就可以了。选中文本,右击鼠标选择快捷菜单的“Convert to Paths”即可,这时候我们发现原来的文本变成两组对象的组合了,如图7所示。/ F2 w5 p9 o! o7 Q1 Y3 r

& V9 L) ^$ F  q- z+ Q7 I' S2 N( h8 y0 k% S
图7 将文本转换为路径7 r1 `9 y! P$ w. o2 l% L) r! A2 m
  (8)文本现在已经不存在了,原来的文本现在变成两个路径的组合。由于我们只需要改动“南”字,所以需要将组合取消。选中上面的组合,右击鼠标在弹出的快捷菜单中选择“Ungroup”即可取消组合,得到图8所示的图像。
+ A5 U7 y& a% T5 [8 c: k- N% l- H/ ]+ m* L4 l) F
, d+ C( A: @; Z5 }' t, W" [/ G; x
图8 取消组合
: V4 x9 d7 n8 |/ n  (9)这时候我们使用选择工具只选择“南”字路径,切换到400%视图,适当的使用钢笔工具 " _, m: G% n" D0 @9 F0 D; U( q( ^/ B1 e
. j. H5 O5 |# W$ }. q( h
增加控制点,使用次选择工具 5 q( W$ ^! C& j8 q' W1 Q
" V6 j! w1 I( K3 ?# V
调整路进,使得“南”字路径上面的一横的两脚上挑起来,如图9所示。
  P. U8 j! s( l6 ]
# Z/ e2 h; O& `$ m1 b# ~9 |- |  o: }1 ~  h/ l1 h7 g( f9 X
图9 修改路径
2 }; W* `, k3 _# u  (10)切换到100%视图之下,我们发现“南”字横线两角已经上挑了,实现了我们需要的效果。接着我们使用工具箱上的椭圆工具同时按住Shift键绘制两个大小分别为216×216、276×276和333×333的三个正圆,并且放置到适当位置,如图10所示。3 a6 v0 }0 |4 y# M8 o

. i4 y, Y% j$ }* [6 S. \* z* L% ~" c; _$ @
图10 绘制三个正圆; t. O2 \5 j7 N% i/ y! y
  (11)上面三个正圆中间的那个正圆是为了附加文字所用的。我们由于要附加“NANKAI UNIVERSITY”和“TIANJIN”两组文字,所以中间的圆形路径也要被切割成为上下两段,这样不同文字附加不同路径。选中中间的路径点击工具箱上的刀子工具对路径进行切割,如图11所示。
8 K+ x6 w$ f- W- j9 {+ z% B* h$ {2 @2 s" A: J/ b! M) ?* q
( g( L/ l: c( x, b2 R
图11 切割路径: c6 q; n. M6 g) v1 @- t. J
  (12)方式我们切下路径对称的两段,然后使用选择工具选择这两段路径并将它们删除,最后剩下如图12所示的路径。! J4 n. ?% H0 G

9 ^' t% m  T  G4 ^+ R& B5 D/ r9 r" Z% H( p" F5 k- R8 o! c
图12 删除路径后的图像2 E( l  l7 c' F8 x7 U
  (13)现在为图像添加文本,我们首先添加“NANKAI UNIVERSITY”,然后按住Shift键同时选中上面的路径,如图13所示。' V: ~& q# {) h) l: `& V7 k2 r, A
8 w+ P  `, V6 Q8 u4 c& H. d0 U5 S
( Z' d3 x0 l1 q1 ]+ Y4 H7 B
图13 添加文本并同时选中路径
; V) t5 _' d" R/ \; O8 C  (14)点击“Text”菜单,选择下拉的“Attach to Paths”,这样文本就被附加到了路径之上了,如图14所示。
+ z4 ~0 h: E9 U' `& Z; i% Z  C( d5 Q  u
3 K+ {; i! ]0 s- |9 P
图14 文本附加到路径
! |# o  p1 J' n0 e9 o  (15)我们发现文本在路径上面,我们想让文本处在路径的中心位置,那么怎么办呢?其实我们只需要选中文本,单击鼠标右键,在快捷菜单中选择“Editor”打开文本编辑器,然后在其中调整文本的上下位置即可,如图15所示。( _! ^" q# t) \3 A8 d% ?

+ D7 e5 p  y& |3 H6 H* {' L1 q( }9 h4 l9 f& s1 G; C! v
图15 调整文本上下位置
8 j+ R& O* |) K* H, ]+ f1 u9 z  (16)调整好位置之后,我们单击“OK”即可,这时候我们发现“NANKAI UNIVERSITY”文本已经处在路径的中心位置了,如图16所示。* S  O4 R* V+ `' T8 j: |# b

  e" U! M/ s9 ?" }* x5 V/ f& }. q; U* R
图16 调整文本位置后的图像
8 }2 t$ l1 @8 E$ u  (17)同样方式我们添加“TIANJIN”文本并选择下面的路径,然后选择“Text”>>“Attach to Paths”,但是我们发现文本附加反了,如图17所示。
2 x. l- g: `% i* }  h, N3 ?$ a5 u

" K9 g$ h9 W, K# M 图17 再次附加文本到路径
* i0 \% `" L& T9 W  (18)其实不要紧,只要我们选中上面的文本对象,然后点击“Text”>>“Reverse Direction”即可将文本倒置过来,如图18所示。, ]5 g) B; ?4 R% F9 t5 e) W  n

& f. m( Q" y( x, C/ k  f3 I% V  G+ j  N& U5 G" R$ {, H
图18 倒置文本后的效果# \7 {. Z4 u) `
  (19)然后使用同样的方法,调整文本的上下位置,适当地在校徽上添加两个修饰的圆形图案,最终我们就得到图19所示的校徽图了。是不是很简单啊? .png文件下载
  {% z3 j* b# x8 o  C5 d$ f( s, I: l' v. v& \( i
% N* }1 C" |. `* [, q" B$ E4 E1 y
图19 南开校徽

本版积分规则

精彩图文

Copyright   ©2015-2016  展示网  Powered by©Discuz!  技术支持:凡尚展览     ( 粤ICP备14065977号 )