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

[复制链接]
查看: 330|回复: 0
gggds 发表于 2009-12-27 03:26:39 | 显示全部楼层 |阅读模式
 本文实例主要和大家一起绘制南开大学的校徽。我们的思路是校徽中心放置“南开”两个字来代表学校的名字,文字的四周是个八角的星状图像,星状图外切一个圆形,圆形外围有个“NANKAI UNIVERSITY”和“TIANJIN”等文字,这些文字又是处在另外一个圆环之内的。下面我们就来看看校徽的具体制作步骤,从中熟悉Fireworks MX 2004中形状、文本、路径等工具的使用。文章末尾提供.png文件供大家下载参考。
  x6 Z$ z- i6 y0 T& m* X; l/ `  绘制步骤    (1)新建一个大小为400×400的图像,我们首先绘制八角形。点击工具箱上的星状工具
; `" T* X- f/ t  [$ X
( [# L- n1 G9 ]7 L5 Q) w) p5 ^ 绘制一个五角形,并将填充设为无,笔触颜色为#865DA2,笔触类型为Felt Tip中的Dark Marker,并设置笔触大小为8,得到图1所示的图像。
  B' B4 c% b$ s  F8 L0 e* T) G. P7 V" X

# E1 ?9 v, A: e; E) d, A 图1 绘制五角星形8 d% i& O9 j8 P2 Y9 H
  (2)我们设计的校徽中的星状图形有八个角,那该怎么办呢?不要着急,在五角星中我们找到点5,也就是左下角的那个控制点。这个点是控制星状工具的角数的,使用选择工具选中这个点,按住鼠标右键不放,并旋转拖动鼠标,这时候我们发现五角星的角开始变化了。当出现八个角的时候我们释放鼠标左键就可以了,如图2所示。
0 K8 M; E, `8 I$ @5 _: Y  注意:在Fireworks MX 2004中增添了许多功能,其中这些新工具如星形绘制工具的控制点是一个特别的东西,需要我们逐步了解。。4 M1 x. C3 x; I" ~2 s: y

' b1 z5 h; a* A( I" i' b4 s: c2 q( S
图2 改变星形的角数" ]- G4 _3 ?9 c
  (3)虽然星形编程了八个角,但是我们觉得凹入的角度过于尖锐,需要将凹入的角度变大,这时候我们使用类似的方式,选择控制角度的控制点,按住鼠标右键向外拖动即可将凹入角度值调大,如图3所示。6 T0 I, I" F) E4 O

8 _! U! M' h- J7 N* v0 s4 T" e: E, x" H9 H& s3 {
图3 调整凹入角度
8 \% }: i  p. F# `  (4)释放鼠标,我们就得到了图4所示的八角内部边框了,下一步的工作便是在图像内部添加“南开”两个文字并对文字进行调整了。
0 \- B% @  C- x( o9 f% L
4 ]( a/ ~/ X+ k% `$ j* A/ ?) E, o( Y: {  [6 t7 S7 l
图4 校徽的八角内部边框" @8 T) ?9 I3 r& n5 l
 (5)现在我们点击工具箱上的文本工具
/ m/ r! Y! s9 c- L. v. S( u
: X8 B9 R; h4 O# k, Q 添加“南开”两个文字,设置字体类型为“文鼎繁淡古”,颜色和内部边框颜色近似即可,如图5所示。
! \# D( v0 K* p/ d1 Q) w5 p0 @' H9 Y- T8 R+ w: o4 w
/ J. G: X. ]+ O

! v* p9 X& t+ {6 U- G4 S 图5 添加文本' ~  |4 h5 }4 Q. N* R
  (6)选择工具箱上的缩放工具 7 k. `- X2 j3 E. a
6 a7 z  A4 n3 u. i
对文本实行变形和缩放,调整文本的大小和长宽比,使得文本能够和边框匹配,如图6所示。8 t$ {+ ?# T* [# h  y. _7 i

) Y7 b( b$ H" p' h2 g& h' r
% f) g# r, K: h' z/ {+ f, q, B 图6 对文本进行调整  g/ e, H3 K' J1 e" k
  (7)我们还想对“南”字进行一定的调整,使得“南”字的横能够两端向上挑起来,但是没有这样的字体。难道我们没有办法了?其实我们只需将文本转换为路径就可以了。选中文本,右击鼠标选择快捷菜单的“Convert to Paths”即可,这时候我们发现原来的文本变成两组对象的组合了,如图7所示。
' h8 D! E6 G/ V  T$ \# |& D5 ]7 X7 O& I) f2 S

$ D2 _0 P( l) q0 f& @ 图7 将文本转换为路径5 M2 a  Z: m: L5 R2 D
  (8)文本现在已经不存在了,原来的文本现在变成两个路径的组合。由于我们只需要改动“南”字,所以需要将组合取消。选中上面的组合,右击鼠标在弹出的快捷菜单中选择“Ungroup”即可取消组合,得到图8所示的图像。9 w; z- a, Z9 e3 M+ g
  Q* w$ h5 _% v# }( y

+ E0 s' X3 H& v$ O" o: ?  K; L- Z 图8 取消组合 (9)这时候我们使用选择工具只选择“南”字路径,切换到400%视图,适当的使用钢笔工具
& w" d! [; r# g2 \! w, b7 v. [
) Z4 U8 }  l" j' k3 J 增加控制点,使用次选择工具 6 T, e+ \2 B! \
" ~9 U6 I" c1 E  G& {, f" o
调整路进,使得“南”字路径上面的一横的两脚上挑起来,如图9所示。
& x6 ?) G& i- O2 X' h+ L6 q9 C) h' N% R/ u4 W) d

( ?7 q4 I4 m2 I  u
8 @; P* E1 j. D 图9 修改路径
) v  ?' _* q# v' Y9 {  (10)切换到100%视图之下,我们发现“南”字横线两角已经上挑了,实现了我们需要的效果。接着我们使用工具箱上的椭圆工具同时按住Shift键绘制两个大小分别为216×216、276×276和333×333的三个正圆,并且放置到适当位置,如图10所示。' x, }* i4 u8 e+ [

' x( D. V8 C0 @) I( V  f: ^
) d) G* @+ Y/ p; v  e 图10 绘制三个正圆$ B4 K3 M. l" m7 x# u! @
  (11)上面三个正圆中间的那个正圆是为了附加文字所用的。我们由于要附加“NANKAI UNIVERSITY”和“TIANJIN”两组文字,所以中间的圆形路径也要被切割成为上下两段,这样不同文字附加不同路径。选中中间的路径点击工具箱上的刀子工具对路径进行切割,如图11所示。9 l6 |) Q: q, q" I- m2 l. z

4 l& j- g% r/ ]/ }5 J, M7 p# {  p0 b: g6 i* C. v& s- d
图11 切割路径
" C6 q+ {) P+ v6 _; O( l  (12)方式我们切下路径对称的两段,然后使用选择工具选择这两段路径并将它们删除,最后剩下如图12所示的路径。
2 `, |3 _5 h% g: D! ]
3 A- d8 W, Z0 ^6 `8 H% ]4 ?& k. S  z4 D
图12 删除路径后的图像8 o  G4 d% |. K$ p1 O5 l1 V* ]( p, w
  (13)现在为图像添加文本,我们首先添加“NANKAI UNIVERSITY”,然后按住Shift键同时选中上面的路径,如图13所示。
1 q9 t1 ^2 Q2 H) K! ]$ V- _- {; p' a2 D' X- X& ?5 z5 q3 g$ F$ _

! s8 U( N8 r! k3 a1 u/ L 图13 添加文本并同时选中路径
+ `' D' q+ ~2 b* f# q& { (14)点击“Text”菜单,选择下拉的“Attach to Paths”,这样文本就被附加到了路径之上了,如图14所示。
4 I4 U6 `2 e% a2 S) l& T+ `+ b  u5 x* g" d
, X, Q0 b, [, ~* J3 o
6 }; s- [$ f4 z/ L; V+ \
图14 文本附加到路径2 e' s# S5 q# v8 E6 J% S# t0 l* _
  (15)我们发现文本在路径上面,我们想让文本处在路径的中心位置,那么怎么办呢?其实我们只需要选中文本,单击鼠标右键,在快捷菜单中选择“Editor”打开文本编辑器,然后在其中调整文本的上下位置即可,如图15所示。
2 M' f3 w6 {: v1 L  v- o+ o8 E
8 ?. P7 w1 |7 j# M6 B6 f' n
7 Z# }' ], A# ^" L0 X; r2 |* I1 o 图15 调整文本上下位置8 _: V* f0 Q6 W4 h
  (16)调整好位置之后,我们单击“OK”即可,这时候我们发现“NANKAI UNIVERSITY”文本已经处在路径的中心位置了,如图16所示。4 A; b3 d9 N$ E1 k0 g5 L% [: \
8 S% s( R. G( Q; ^" n0 ]- j. ]

& v% r2 {  A6 e 图16 调整文本位置后的图像
. P1 ^6 Q6 t- ]6 G* L% j7 F* D  (17)同样方式我们添加“TIANJIN”文本并选择下面的路径,然后选择“Text”>>“Attach to Paths”,但是我们发现文本附加反了,如图17所示。
4 M" p9 t" x) d/ s
( H* M# s$ {* c3 R* ]
6 p+ e( f# L  ~# W9 V# B2 ?6 r 图17 再次附加文本到路径- \8 O/ p: X5 k: S* g' `
  (18)其实不要紧,只要我们选中上面的文本对象,然后点击“Text”>>“Reverse Direction”即可将文本倒置过来,如图18所示。
. _0 [+ @6 ?. u2 ?, u; i% c$ k1 w0 X0 r7 O/ V9 l
: B6 E+ \0 Q% ?% H: O0 {) ~8 r
图18 倒置文本后的效果
4 w+ c8 d6 _$ e& a/ V  (19)然后使用同样的方法,调整文本的上下位置,适当地在校徽上添加两个修饰的圆形图案,最终我们就得到图19所示的校徽图了。是不是很简单啊? .png文件下载
& M* Y5 L$ i( w; B! P$ b) T+ H/ d5 J# Z
( F0 h- K  f3 ?0 p& X7 c0 d9 x
图19 南开校徽

本版积分规则

精彩图文

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