Google
      
发新话题
打印

Fireworks绘制精致立体IPOD

Fireworks绘制精致立体IPOD

(出自:天极网)& j; @% J& J* m( v
. L+ ~6 ^0 Q! j* e
- N8 Z# S3 r$ q3 G- h& w! @
小乖最近买了IPOD,时刻无不在吹嘘IPOD外观的漂亮、功能的强大。加上最近她学习Fireworks着魔一样,更扬言要把美丽漂亮的IPOD用FW画出来,可惜,她真是“才疏学浅”阿,这不,最后还是来找我帮忙,难得她能这么积极的学一个软件,这忙得帮,想想让她画平面的也学不到多少东西,网上搜一下,IPOD的图片还真不少,找了个侧视图,正好教她一下透视和光照得表现。 3 Y. r8 l5 H5 \
对于画许多实物的角度图(或叫画带立体感的图),对于我们这些“小菜”和像小乖一样的新手可能有些困难,前辈们的一些教程也给了我们好多启示,比如可以拿实物对照观察、可以像手绘一样先打些辅助线做草稿,可是对于我们这种没有美术基础,透视感差一些的人来说还是有些困难,其实我们可以找到简单的方法,将物体“拆”成简单的几个面,再组合起来,做出立体效果。文章末尾提供原文件供大家下载参考。
5 ]- H5 c) K  H; F8 g' G5 i" j: U
3 b4 A$ N6 {: C1 w' N" S) m+ O6 |8 Q( s% C/ Z8 T

) r& [# f  ]6 G7 i7 i  }/ ~, A& C- f: q8 s# G$ T5 J
完成效果
+ Q& \1 r# I" @: O3 t学习要点:钢笔工具,透视,高光,变形工具,扭曲工具 9 V; r7 W4 d- R
1.观察IPOD的照片,我们将它分为3个大的部分,这里需要我们对钢笔工具熟练些,如图,勾画出靠前的A面(图1),其次为B面(图2),再次为C面。4 i* h' J& L! `" ~. z7 Z

8 D+ {; x# I( s4 }6 F$ n+ z
, Z) z( P# u* G3 i0 L& _% s9 j/ t' `- ]' Y1 D
A面* F3 `- N" o3 m# V" ^

. `+ S! W1 o+ `' r( Y2 d" @6 A1 C* ^  U1 u& B  h! w
8 J4 U& d) t5 r# A0 N) f9 r7 z
B面
* o! f" c: I' [( J8 s! A' ^2.根据各层的前后关系,我们将它们组合好,我这里将3个单独勾画的路径用不同颜色表示出来(图3),比较容易明白,这里我们需要知道的是,只有最外面的面要仔细勾画,而下面的面,因为不用看到,覆盖下的地方我们简单连接好路径便可。
# W' O1 ~( h( T6 H" |+ k1 l3 \
' ?, b' g  S' t# u: h6 |  g! F) N- G1 S% U. S* R1 I- N2 Z3 k
2 P! k" D8 ]5 Q/ O0 v
图3
( s% @8 ]# ~2 V3.为了表现质感,我们开始对这3个路径进行填充。
5 j' M) T* c) h  t% _如图,A层路径我们用线性填充,颜色为左#A3C554,右#7FB249, B层路径直接实心填充,颜色为#F9FAFB,进行描边,颜色为#C1C2C6,笔尖大小为1,选择柔滑线段,C层路径为实心填充,颜色为#F4F5F7,进行描边,颜色#D8D9DB,笔尖大小选择2,柔滑线段。调整一下,为了增加效果,我们把A层路径复制一下,切割出左侧一部分,来加深颜色,效果如图4- P2 t, w8 B' k* K
4 K' l0 v  C& a7 H  T7 p: u8 \# c  d
) T/ P( l6 G0 z8 ?! U+ l! M

) `: _5 o3 p8 K, D4 I图4 $ x4 M9 ?' H4 X5 _
4.开始画IPOD的控制面板。* |# c; S& `. z& |: V9 z4 h) h6 t
这次我们用圆角矩形工具,画出IPOD的控制键盘,效果不对时用选取工具点选矩形调节点进行调节,直到出现我们满意地效果为止。调整好图形后我们进行线性填充,填充颜色从左至右为:#E4E7EB、#C5C8CF、#FFFFFF,为表现暗色和亮色,我们用3个颜色。颜色调节如图5所示。1 i7 h# H4 y+ d- o
* e8 ^2 g6 F, B$ }2 o" j5 G

. N) ]$ L, b- j# s7 [* c
+ a, F* {4 V# ?# ]6 N/ d图5
( g0 v! P+ q0 g$ i5.将此圆角矩形复制并缩小,或者用钢笔工具勾画一个内圆角矩形,再次进行填充,来丰富效果。依然为线性填充,填充颜色均为#CED7E1,这里需要注意的是,右侧颜色透明度为50,得到效果如图6。6 {# Z+ l' e, _6 {. N

1 Q* F# n. r& |# s8 I/ C& ?
1 b+ S5 K. ?& _% Q- ^0 n2 P1 P, B2 E. o2 Q6 L; H0 `. R6 Y9 s
图6, }! K  b, Z  ~6 b& O4 T- ^" N. V
6.用钢笔工具勾画出月牙形,椭圆工具画出扁圆型,进行高斯模糊,值为1,来达到高光效果,进一步丰富控制面板,圆角矩形和三角形添加图形。(注:其中三角形用多边形工具画出来,边数选择3)。完成效果如图75 o$ h" O1 F9 E8 ?$ {

7 N( {/ p6 c5 I( v- T6 ?
$ h! u* J. P! h4 E& j
5 [+ y4 z9 a9 f) q2 }2 E+ L图7
' A2 M1 F& g+ d. {$ w7.同理钢笔工具配合椭圆工具,高斯模糊来表现整体高光效果。如图8
% ^+ _2 z3 V7 u' d& y9 C& Y2 u" o$ P
% Y. I( j$ a" x: j9 h
! I) @, T3 y% d( ~. X/ l: }
图8
" C* G+ y6 Q4 O5 G- V; K! i; z8.钢笔工具画出其它控制按键 。
8 I/ v+ D- l9 N! L9 u, y( v4 _8 @% X- d( }' l' F/ P6 e

) B1 Y% r; v- l1 k' z
9 e8 r/ b7 k( Q$ R. s: I图9; e$ ~- o6 g# }% k
9.接下来用钢笔工具勾画IPOD屏幕,依然线性填充,颜色为:#196332、#6BB24B,描边为 黑色,笔尖大小为 1 ,选择柔滑线段。
* F' ^/ i% g: x4 ?( _' [7 G) T) F2 B0 f/ m  Y' A9 w7 \1 G
( U! s! c" v9 s1 `

4 ?4 u! G& ], E; D  `图10
9 a  {" M6 y1 f8 h$ `10.我们来给屏幕增加背景图片效果,很简单,具体步骤为:首先复制屏幕路径,并清空路径的填充颜色、描边颜色,选取合适图片,通过倾斜和扭曲工具,调整为和屏幕路径形状相似,选择粘贴于内部命令。得到效果。& L1 s' m; A3 B/ D. Q
7 \9 b) }6 b7 [: _
( N( ]  W# T8 J0 a0 H' Q

# E$ J! V7 a) g6 g, E9 m图11
2 P' G2 f* O3 p6 v3 N0 Z11.继续为屏幕增加效果,同过钢笔或者矩形工具来增加导航条,电池标识等,具体参数如图。
1 `7 W. `! s9 L7 y" E! \9 c; F3 @$ D- Z5 y( v" i$ V
$ D' o' M; ^( s4 H+ U

2 v; z3 e- U. H# V5 m& K图120 r6 i* p% E' b
12.添加字体效果。
- i. v/ C9 u  C) x: d8 B
/ {0 s5 L' Z3 j( [6 p  I$ y4 g6 r+ V3 M' V2 [0 }/ }

9 `0 H, |% s* F# L3 W4 X图13
1 U* L# q! o/ l7 \. d13.到这里,基本完成了IPOD的制作,我们可以通过旋转,来增加一个光照效果,图14 。通过修改源文件的配色,我们可以得到多个IPOD呢,图15,赫赫。(如果真能得到就好了,嘿嘿!!)点击下载源文件, H7 V4 S1 K8 o( x" R, K1 N

8 S' y/ @& G1 r/ M# c# T( N! B3 ^! \$ C

% V3 l  ^( v1 [4 D5 x! f4 K2 {图14   
7 b  j2 e/ i, |3 _! C; H
" Q# t, H2 t" I& v5 x& X# @8 _& M2 b4 P
图15


风往尘香花已尽,日晚倦梳头。物是人非事事休,欲语泪先流。
闻说双溪春尚好,也拟泛轻舟。只恐双溪舴艋舟,载不动,许多愁。

TOP

发新话题