中国展示论坛

 找回密码
 注册中国展示论坛

QQ登录

只需一步,快速开始

搜索
中国展示论坛 门户 查看主题

用Photoshop鼠绘漂亮的MP3播放器

发布者: gggds | 发布时间: 2014-11-8 21:17| 查看数: 4585| 评论数: 0|帖子模式

先看一下最终效果:
8 d; m# t( _9 |# p" p. b* ]  A9 K$ C+ ~5 W# Q
2011022411435114.jpg
+ ^% K3 ^% Z- o2 |1、第一步是我们创建一个黑色径向渐变的背景。在任何颜色的油漆层,添加一个如下所示的渐变图层样式。 , E6 R- U" ]! e0 u" D3 m/ v; U
+ p/ n+ |  S( I- K: ~8 q# R+ J  K: j
2011022411435124.jpg
) P% a+ ], R& P0 Z3 ~9 p$ h3 l6 O& J* S8 i  H* [) H( N
2、用圆角矩形工具(设置一个半径为20像素)创建一个该设备的主要元素,表现设备的形状图层(点击菜单上的第一选择)。 $ T, b. w% B' j' t+ f! t4 }: i

! _* d  T9 V; l9 [5 S 2011022411435204.jpg
% Z. t3 j4 Q0 @, s
" a4 I( k9 h- V; m0 T; }1 X3、双击该图层上的向量,颜色编辑器将打开。我们可以选择一个#E1E0E0的浅灰色的颜色,进而可以增加表面的发光程度。 . @) g8 R3 ]. d' W7 O/ X: I

8 L$ {3 {+ r9 `' d! z 2011022411435224.jpg
5 K1 x  B7 t6 ^- [8 x. P6 ?
8 t/ D$ F# j( ?) I! f) G4 k4 d& p) I& y
4、现在我们要创建一个该设备周边的一个斜面。在此之前,我们需要用PS标尺创建一个参考标准。点击这两个统治者收敛角,通过拖动鼠标,我们在放置光标的位置放置光标,这将使我们能够创造一个外围设备周围等距离斜面。
: a  X# d2 Y4 q: ~
0 {: ~9 }5 |- H8 T& a% {9 V 2011022411435236.jpg . w$ z5 n! F4 e* e  u/ V% }. H

& b/ ]9 _: j3 R& t+ a8 L3 G5、我们把这个图层的不透明度调为0,因为我们只是想看到一个表面上2像素的斜面。 * D# s0 _; h3 `0 l8 H4 E
: {% r+ |* B, g# c) u+ E
2011022411435302.jpg 0 A2 _" n4 `6 a! w0 @3 O

; A. `1 y+ D6 q0 t6、套用一个1像素的描边,在设备的内部位置要使用比设备前面更暗的颜色。在这一步,我们要创建一个代表行之间的形状和播放器的前联合差距的线。
; `# o% q" l" X$ t9 F6 ~+ |+ n
% H, ~! B! H) ? 2011022411435316.jpg : ]$ ~0 M" [' E) L
7、设置2像素值以下的内发光。 $ J& ~& j! \+ n! m" }0 W: T
+ A! V, `! K6 C, j* B9 T: |
2011022411435360.jpg / `2 k! R6 z0 ?' ^' H, L

; g% t+ j' c8 S; n# p$ c! X8、给设备的前部添加软梯度,让设备更有凸出感。 9 B' y. j; ~& q3 c$ V0 |* c

7 ^4 i0 ~3 k5 m, w, Z 2011022411435365.jpg
! m5 l! k2 [" L7 D- x' \- L0 G( _! y; q
9、现在,我们将突出这个MP3的优势。要做到这一点,需要添加一条有挤压感有三维效果的线。然后在MP3的外表面添加2像素灰度中风效果。
/ i  F. M8 f' d! @4 @! O8 k
' W: D  A7 _5 ^! G 2011022411435490.jpg # G' B% U* x* [# k& b( a" n
10、利用锥与浮雕风格,我们在这条线的上部区域添加光效果。现在物品看上去像是从上面打光,下面变得更暗的挤压效果。 % J8 p; A) C: q+ T4 ^

1 j, }) G! V' O5 h* Y 2011022411435466.jpg
9 e# r  p( X6 K! w8 ^4 v& f5 c
1 A4 F8 r# Y1 |11、现在在这个图层上添加柔柔的,轻轻的内阴影效果,让播放器的前面更显突出。
" y2 L0 y6 E$ f/ w4 y2 U8 Z$ n! O3 U2 U- C4 ?: `9 {4 P
2011022411435560.jpg
6 G( i7 }. P0 m0 O, i# Z# t  E$ |2 Y3 Y/ t! {# L
12、通过复制和编辑前面的斜面层,我们创造更多的代表不同的控制按钮的斜面。
( e8 ~' d- S, ]0 Y) N4 t/ T0 A  q5 H! ?. Q7 C) p: I+ w
2011022411435531.jpg * A  d6 Y2 B6 x# }

  t8 ?+ W$ n* I  g/ G, S& {2 _13、现在通过编辑形状层来创建播放器的主播放/暂停按钮。重复第一个斜面,在边界以内画一个圆形物体。然后放大10%的水平,因为我们只需要那些斜面。   R# F& ^7 I5 d9 `( Y
0 u) q% B5 l- _4 _1 B
2011022411435598.jpg
7 S7 E3 V# Q& x, g+ \8 H% d: O2 b& O. _' O& x* {' Q9 B
14、像下面这样在步骤13中创建的形状中应用软3像素面具。
' A; p9 m% S$ t' x# e) w1 i9 D; k# g2 G! Y
2011022411435668.jpg ; }+ ?/ F7 A* K% D' n

; Q5 @6 F+ z3 G- c$ h15、为了使面具隐藏对象和它的图层样式,在图层样式窗口单击选项“图层蒙版隐藏效果”。如果我们不选择此选项,这个面具只能隐藏形状,但是会把效果显示出来,而我们就是想要把它隐藏。
) e0 F5 F4 p2 [  `9 g5 H) [3 P: P/ }6 J- H: z- z& K
2011022411435633.jpg
5 o# U1 y4 [2 b. z' t2 |4 @16、相同的面具也将用于其他斜面,我们可以从之前的图层屏蔽掉。用鼠标右键点击图层里面的遮罩层的图标,选择“从选择减去层面膜”。这将创建一个和以前相同的选择。   J+ w: }. L+ H+ f9 W' w8 R3 }& Y

; f' c3 N# e7 E) I4 j 2011022411435767.jpg
1 M6 i& _# i# q1 E* a( H( C, Y- W1 V$ R& q( g* ~
17、在这一步,我们将重复选择转换图层的步骤。 " G8 g- q: r0 K, `& I! p/ p
6 N# ^- v; _$ c+ U' Q
2011022411435745.jpg & \5 N$ [% X! Y% I

4 l: ^; ?6 C  E3 A! I18、我们已经有了设置主按钮的斜面。现在我们需要给播放器创建一个显示器:黑色亚克力屏幕,在那里可以显示歌曲名字和播放时间。 ! M( |4 Z' ]; C2 h$ \6 p
3 a' h( Y) H' V/ A5 u
2011022411435730.jpg $ ~  Z; Q+ w* h5 P0 _, g" O2 z0 O
19、首先,我们使用阴影来创建一个光从上面射向底部的斜面。使用图片显示配置的风格,可以使图片显得锐利和清晰,而不是黑暗和模糊。
9 e7 y* [! [5 M" i3 J+ W* g% O( z! X9 o7 J! N/ j
2011022411435876.jpg
2 S) X0 V) r; a4 F
2 ~0 o( [. x7 i2 S: @20、现在,我们需要建立一个径向渐变。把黑色和白色两种颜色尽量靠近中心附近,那样没有这么多两色的柔软性。黑色占49%,白色占50%。
6 Y; ]' t9 [! q; z
: H8 k7 J9 w- g. [ 2011022411435857.jpg
, `$ @% _4 P8 b+ A# `& [0 b3 w; |
& y9 ?+ }! O1 Z$ R( |! e+ c7 N21、取消点选该选项与层对齐。如果我们不这样做,梯度将只能从该对象的中心到边缘,我们希望梯度更大和更广泛。
9 ]  S& ]1 |$ J" I" G) M9 M, J; @2 h* U' d  Y- ]
2011022411435847.jpg ! G- k( o$ |4 V% F9 Z
22、他出示您的镜面效果,使用两个类似于我们创建按钮那一步的斜面来做一个形状。使用一个一致行程内的黑色1像素中风。使用内部发光,2像素的大小设置为屏幕上的混合模式。 6 B0 Y! U( X( i& w$ }* C

" w0 i/ Q  {, y 2011022411435962.jpg ) S+ L. r8 R" @4 d
' h3 _: E5 T9 d; J4 E4 O2 B8 k. j
23、现在我们已经完成了我们的MP3播放器的前面。现在我们需要添加一些显示按钮和文本的图标。 & f6 [3 J: c$ X3 \& x& {- a
0 V: ?: c0 B6 W
2011022411435932.jpg # u: O9 j) z8 l
% s) A6 a* p, p8 q& i
24、现在,让我们在显示屏上模拟显示滚动文本。使用像素化的字体,我们需要添加将播放的翻译名称和歌曲名称。你可以使用这个免费的字体。记得把走样移出菜单上的文字工具窗口,以保持文本尖锐。
7 a# t7 _$ k' x1 h+ p* ]5 V4 f; k, n. p3 Z
2011022411435917.jpg
% w# T& ~! i  \25、我们用其他位图字体创建计时器,指示时间的流逝。此字体也是免费的,你可以在这里得到它。 : _- F# ^- s6 X' g- o% R: d

  ~. ^0 ^! i5 V- P) K& V) P 2011022411440021.jpg
7 M0 c! D; v& i. @" @  ]" }( D6 I) i9 J( v+ `! ~: N- Y0 S
26、使用通用的显示图标和音频或视频播放器符号的字体。你可以使用这一个。一旦它被安装用来创建播放器不同的按钮,在这种情况下,播放/暂停控制(随着播放器的发展,您将需要创建两个国家的按钮时,当按钮被按下时,播放按钮变成暂停按钮,反之亦然)。 ) [: M5 F) R" Q& m
% D* W% U4 A6 l
2011022411440089.jpg # t7 d% K5 x9 ], M' v0 {% }% x

" I) J9 I1 b7 m# y) q27、对于这个符号,我们使用和前表面相同的颜色。用颜色选择工具,我们可以绘制文本。
& F* L( t7 N! m2 y9 Z8 E: |! o5 I6 X0 p8 e0 Q
2011022411440043.jpg
9 I# t4 p6 R! T5 }9 p5 _! w4 C, q$ d" S/ V; A6 q( h
28、现在,我们可以包括各种不同的款式,让播放器外观看起来像浅浮雕标一样。使用内阴影下的相应值。
8 i% u1 d; H  s/ ^: G, Z7 G; _5 [5 v8 Z7 l# f
2011022411440090.jpg - v0 G$ R+ ?- W# S. G& B
' }" j* i, \8 j
29、用这些操作可以减轻底部斜面。
% {4 y2 z. s  {' S4 f0 M( @1 a; ^6 x8 z+ h. c& C+ }, e  V0 C
2011022411440166.jpg " L8 \9 z* `1 e2 l% k# A
1 c# S# |4 ~* @/ }
30、使用柔软的宽度和坡度小的表面,让播放器看起来不是很枯燥。
. \5 h( R  l- `, v6 r
; t, M- J) P' U: w  [% O0 t 2011022411440102.jpg

8 d9 X+ \5 |; r7 R: \9 n1 F

最新评论

QQ|小黑屋|手机版|Archiver|中国展示论坛 ( 粤ICP备14065977号

GMT+8, 2019-7-17 05:14 , Processed in 1.140610 second(s), 31 queries , Gzip On.

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表