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

[复制链接]
查看: 336|回复: 0
gggds 发表于 2009-12-27 03:26:39 | 显示全部楼层 |阅读模式
 本文实例主要和大家一起绘制南开大学的校徽。我们的思路是校徽中心放置“南开”两个字来代表学校的名字,文字的四周是个八角的星状图像,星状图外切一个圆形,圆形外围有个“NANKAI UNIVERSITY”和“TIANJIN”等文字,这些文字又是处在另外一个圆环之内的。下面我们就来看看校徽的具体制作步骤,从中熟悉Fireworks MX 2004中形状、文本、路径等工具的使用。文章末尾提供.png文件供大家下载参考。
9 J3 J( D* \9 L: m  绘制步骤    (1)新建一个大小为400×400的图像,我们首先绘制八角形。点击工具箱上的星状工具   x" f# [) ?! M# l
- g$ l; \  o  ~9 v! Q# a5 G, X
绘制一个五角形,并将填充设为无,笔触颜色为#865DA2,笔触类型为Felt Tip中的Dark Marker,并设置笔触大小为8,得到图1所示的图像。 ( y/ F; ?  a$ H4 s

4 D8 `2 ]9 t2 |6 p2 {3 P: H# N3 d$ W5 I+ c* j' D2 q) j
图1 绘制五角星形( {6 R0 W, {3 y* S
  (2)我们设计的校徽中的星状图形有八个角,那该怎么办呢?不要着急,在五角星中我们找到点5,也就是左下角的那个控制点。这个点是控制星状工具的角数的,使用选择工具选中这个点,按住鼠标右键不放,并旋转拖动鼠标,这时候我们发现五角星的角开始变化了。当出现八个角的时候我们释放鼠标左键就可以了,如图2所示。: M! F% ~& ~% k2 n+ i
  注意:在Fireworks MX 2004中增添了许多功能,其中这些新工具如星形绘制工具的控制点是一个特别的东西,需要我们逐步了解。。
9 d) @, \. c3 F3 y% U; B* j4 a, g4 R  @! I9 U% S0 N. W1 a

% S3 I, z5 x9 Z/ s% O5 v' g* Y1 k 图2 改变星形的角数
7 t+ ?: u/ W; X5 x! e  (3)虽然星形编程了八个角,但是我们觉得凹入的角度过于尖锐,需要将凹入的角度变大,这时候我们使用类似的方式,选择控制角度的控制点,按住鼠标右键向外拖动即可将凹入角度值调大,如图3所示。: W0 n% @, z" G
! p: G% r: N8 `
9 r4 n1 o& E% v3 j7 M1 M
图3 调整凹入角度( G1 f' v' n0 R
  (4)释放鼠标,我们就得到了图4所示的八角内部边框了,下一步的工作便是在图像内部添加“南开”两个文字并对文字进行调整了。
# o$ O5 a3 {1 \" |( ~* r) B. [# m6 P5 u% _2 x! i+ k  \: H8 t

0 e% E4 @6 Z" D3 A! ] 图4 校徽的八角内部边框
! C. C- P4 _% O (5)现在我们点击工具箱上的文本工具 / s- T& w$ l% l) t! y9 c  u- ~
6 a0 W2 a) M" q5 H0 l- z
添加“南开”两个文字,设置字体类型为“文鼎繁淡古”,颜色和内部边框颜色近似即可,如图5所示。
# G, }% V9 k! Y4 f+ x* R* H% t& Z0 d) [+ }2 S0 f

2 J1 X; E/ ^# S4 u; c+ K6 ]  o9 o6 K, X1 H" x4 j
图5 添加文本
% F& ~  C7 Q2 k+ z  (6)选择工具箱上的缩放工具
/ W$ I& X( A8 b- f$ I% r* Y# ^. R, T/ n3 ~) C; y3 e( T
对文本实行变形和缩放,调整文本的大小和长宽比,使得文本能够和边框匹配,如图6所示。
& s9 k' \) N$ ~5 g& @9 \: N; G: b3 v' Q4 A5 }$ l1 ~. @

( ]. T3 t* I0 c 图6 对文本进行调整
% I: X- m' }9 I% f$ W2 s  (7)我们还想对“南”字进行一定的调整,使得“南”字的横能够两端向上挑起来,但是没有这样的字体。难道我们没有办法了?其实我们只需将文本转换为路径就可以了。选中文本,右击鼠标选择快捷菜单的“Convert to Paths”即可,这时候我们发现原来的文本变成两组对象的组合了,如图7所示。# C2 a0 T) j! w9 o( W; c

8 |  E# L+ o, s. J3 l. d1 C& U% U  G$ D( C3 B0 |7 w% g. S: T" C
图7 将文本转换为路径
- O% E) u9 m' o. x5 P1 @3 C: R0 i  (8)文本现在已经不存在了,原来的文本现在变成两个路径的组合。由于我们只需要改动“南”字,所以需要将组合取消。选中上面的组合,右击鼠标在弹出的快捷菜单中选择“Ungroup”即可取消组合,得到图8所示的图像。9 r3 R6 |+ g. d7 L/ B1 F" c

$ I3 I2 C, A" {2 H: d8 M/ D" o  e1 g& t* r: M3 P& ^. A
图8 取消组合 (9)这时候我们使用选择工具只选择“南”字路径,切换到400%视图,适当的使用钢笔工具 # r# J/ s' F& S
: d+ i, J& v/ K, Z9 [( a0 j3 C4 [
增加控制点,使用次选择工具 % L; C) j' t; A
/ s( V( i+ r& ?7 V& V  O
调整路进,使得“南”字路径上面的一横的两脚上挑起来,如图9所示。
5 ^  K3 h+ A; W, ~
7 c" o) a' k# ~6 v* ^" g0 n0 R& K1 [; L( t& J! G. R0 X) \  U  k

9 M- O9 D9 m$ G- I! a 图9 修改路径; q; o% }$ X4 Z
  (10)切换到100%视图之下,我们发现“南”字横线两角已经上挑了,实现了我们需要的效果。接着我们使用工具箱上的椭圆工具同时按住Shift键绘制两个大小分别为216×216、276×276和333×333的三个正圆,并且放置到适当位置,如图10所示。
" e2 x- ~0 J+ N% B7 q: E% B8 v9 z0 }3 A! n: T  \; _. [: C' |
. V9 U, ]5 r* t* j( K
图10 绘制三个正圆
/ ]0 q, W8 ~- b5 M; @  (11)上面三个正圆中间的那个正圆是为了附加文字所用的。我们由于要附加“NANKAI UNIVERSITY”和“TIANJIN”两组文字,所以中间的圆形路径也要被切割成为上下两段,这样不同文字附加不同路径。选中中间的路径点击工具箱上的刀子工具对路径进行切割,如图11所示。8 D" G7 F6 Y1 Z3 J
! P. z8 W: K# P2 w1 P& }! F

% B/ H4 N) I) B9 W# n 图11 切割路径
: ?$ Z6 V; N- J+ {6 K  (12)方式我们切下路径对称的两段,然后使用选择工具选择这两段路径并将它们删除,最后剩下如图12所示的路径。
  b5 b1 F* P+ D- G" i2 Q& @& B4 s9 C/ h4 g) f
6 i& E9 K- Y# q6 d8 b
图12 删除路径后的图像, W3 s# f8 ^, D8 k- y. k! ?
  (13)现在为图像添加文本,我们首先添加“NANKAI UNIVERSITY”,然后按住Shift键同时选中上面的路径,如图13所示。
9 m/ l% z5 N- d1 {/ ~# ~4 P  x
0 n- D' w8 [! `- B, w& F% A$ z" }
* d' J9 P' S8 T% } 图13 添加文本并同时选中路径
+ V% V7 k7 ^$ \+ q7 q (14)点击“Text”菜单,选择下拉的“Attach to Paths”,这样文本就被附加到了路径之上了,如图14所示。
; @8 [( q. [3 j4 a" Y+ x! p9 y1 w. }, m6 u) p! `
, r' `: H* _! Q& S- L$ c

  F( Q# S" K4 B 图14 文本附加到路径6 \4 m1 O. s8 ~
  (15)我们发现文本在路径上面,我们想让文本处在路径的中心位置,那么怎么办呢?其实我们只需要选中文本,单击鼠标右键,在快捷菜单中选择“Editor”打开文本编辑器,然后在其中调整文本的上下位置即可,如图15所示。2 R) E8 F8 a! |1 r/ D' n8 Q

: z! L  y) y0 Q+ f' ]/ u$ u6 _# J! Q. {2 }
图15 调整文本上下位置
/ h. s8 p! S" N& H# [: C  (16)调整好位置之后,我们单击“OK”即可,这时候我们发现“NANKAI UNIVERSITY”文本已经处在路径的中心位置了,如图16所示。
) f& F+ ]2 B/ `" j/ f1 E8 ^9 C3 W# l, d# V) Q9 x
0 Y. F  v( m7 y
图16 调整文本位置后的图像5 e" U# P2 S0 C" W
  (17)同样方式我们添加“TIANJIN”文本并选择下面的路径,然后选择“Text”>>“Attach to Paths”,但是我们发现文本附加反了,如图17所示。; Z( {- t7 O) v
0 R+ `0 m8 w) B& P& s
& }& ]* d% C4 D% o$ T; ?
图17 再次附加文本到路径
8 B' R. Q: g6 v4 o" B9 F0 s1 j  (18)其实不要紧,只要我们选中上面的文本对象,然后点击“Text”>>“Reverse Direction”即可将文本倒置过来,如图18所示。; V" W" ?' t6 @

! t% t" b. h& T8 n5 K/ b4 E) p5 M7 ~* e; p
图18 倒置文本后的效果( M7 t& h, U/ O5 g. d8 ?
  (19)然后使用同样的方法,调整文本的上下位置,适当地在校徽上添加两个修饰的圆形图案,最终我们就得到图19所示的校徽图了。是不是很简单啊? .png文件下载
% o. |9 s6 a, E' T# w  |- C
( {* T5 i# n4 B5 A/ B+ r
; R) M  P5 h5 D- o) w3 N 图19 南开校徽

本版积分规则

精彩图文

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