中国展示论坛

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

QQ登录

只需一步,快速开始

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

用Photoshop鼠绘漂亮的MP3播放器

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

先看一下最终效果:
: H3 F2 A% |1 m2 f; j: x# c
( B* E+ j8 [; U! L! T0 G) k 2011022411435114.jpg 4 H8 U: g6 k  D
1、第一步是我们创建一个黑色径向渐变的背景。在任何颜色的油漆层,添加一个如下所示的渐变图层样式。
3 B+ w$ p3 q7 H( y! s
# X: d1 P8 t3 H3 q/ W 2011022411435124.jpg
  P2 X  f# L' R
) b3 H! D" D6 J% V6 g9 F9 ^2、用圆角矩形工具(设置一个半径为20像素)创建一个该设备的主要元素,表现设备的形状图层(点击菜单上的第一选择)。 9 ~& E  U" T$ g1 W
4 T, \0 M( U" Q5 f
2011022411435204.jpg * L) U! s- g( K9 K+ X$ ^5 @
, g% `3 m7 m* r5 h5 Y
3、双击该图层上的向量,颜色编辑器将打开。我们可以选择一个#E1E0E0的浅灰色的颜色,进而可以增加表面的发光程度。 % E; O: g" S6 r

; D$ [) l# N3 W* p 2011022411435224.jpg & _+ L6 |: a7 K- f/ r5 g! U! V8 v

7 @4 h/ W/ l+ f( W4 V+ x2 z! V4 S6 T3 Z
4、现在我们要创建一个该设备周边的一个斜面。在此之前,我们需要用PS标尺创建一个参考标准。点击这两个统治者收敛角,通过拖动鼠标,我们在放置光标的位置放置光标,这将使我们能够创造一个外围设备周围等距离斜面。
. U% b2 g. A5 H. `
/ `# H4 \( W8 m* f' b 2011022411435236.jpg ! z) e) y8 ]/ q) W$ i( \; g

( k, O' Z$ z( N. @7 d8 B+ r5、我们把这个图层的不透明度调为0,因为我们只是想看到一个表面上2像素的斜面。 7 z" n0 _/ W5 A) A; c4 g$ O
, ^1 \( {- J  h: F- A
2011022411435302.jpg % k9 k# H  J9 x& i

8 t' b) b" ~1 x9 c+ x$ N0 o+ P6、套用一个1像素的描边,在设备的内部位置要使用比设备前面更暗的颜色。在这一步,我们要创建一个代表行之间的形状和播放器的前联合差距的线。 / Y" H- I9 m) p

. i. X! ~" k- k9 x& {$ \6 T 2011022411435316.jpg
, |- z& R) }& s( M7、设置2像素值以下的内发光。 ' _/ N0 r3 Y# a! \+ v& Q; M
7 D0 L8 _0 J0 k. A! \
2011022411435360.jpg
( O  D* J9 D) Y) r- w' d# T' b* {) o! q0 Y. F8 i( Q7 |
8、给设备的前部添加软梯度,让设备更有凸出感。
! @, ?8 L2 v; L& k2 X% H
' T: ]: O9 c6 [ 2011022411435365.jpg 2 l. a9 }8 C8 ]4 L6 }

( D/ c" }, c; }4 v9、现在,我们将突出这个MP3的优势。要做到这一点,需要添加一条有挤压感有三维效果的线。然后在MP3的外表面添加2像素灰度中风效果。
+ D  J7 ?/ \) Y# j3 H% v
1 x+ F; d. |* L! J4 I( M$ _ 2011022411435490.jpg % b* V/ l) G. [8 ?& A7 B8 f5 ^
10、利用锥与浮雕风格,我们在这条线的上部区域添加光效果。现在物品看上去像是从上面打光,下面变得更暗的挤压效果。 & M4 R9 `9 T  `) ^& Z0 e. Z
5 X7 W& p( \! _. p5 C, U; Q
2011022411435466.jpg
+ g" n; \2 m% x+ C9 I/ J  p' r; x& d. h- G) I' t
11、现在在这个图层上添加柔柔的,轻轻的内阴影效果,让播放器的前面更显突出。 8 D, T4 e$ f! S2 ~7 j, x

2 W7 @& p3 ^6 W3 T' T* Z, y" @" j 2011022411435560.jpg # ?5 n! Y9 ^% i& U8 d% o% L
8 e) e& p9 t, B- Z: N" @: P
12、通过复制和编辑前面的斜面层,我们创造更多的代表不同的控制按钮的斜面。 1 K- G' L, ]# ?' q# i

8 F# P* Q6 `5 Q5 Z! V 2011022411435531.jpg
3 V2 j1 f2 S3 d+ r: ]7 [
8 {1 P. i( j6 ~- @4 m: f13、现在通过编辑形状层来创建播放器的主播放/暂停按钮。重复第一个斜面,在边界以内画一个圆形物体。然后放大10%的水平,因为我们只需要那些斜面。 8 y, d6 ^( H$ v5 d! s) B
8 F, p- I3 {0 d
2011022411435598.jpg ) ]/ ?/ W4 N* @3 ~0 u

  v( B( i! z2 m/ ~! ?14、像下面这样在步骤13中创建的形状中应用软3像素面具。 ; A8 x+ ^; f: v. y

  F! w, z8 X$ @+ y4 W! e4 m 2011022411435668.jpg ( d6 k5 W4 L! {+ [
1 i% e1 t/ R  I( R% r% b
15、为了使面具隐藏对象和它的图层样式,在图层样式窗口单击选项“图层蒙版隐藏效果”。如果我们不选择此选项,这个面具只能隐藏形状,但是会把效果显示出来,而我们就是想要把它隐藏。
. {! K! H5 v: ~: L6 `4 Q% L$ F- u" |  \7 ?& M" j# R
2011022411435633.jpg
: i' k- D7 Z$ _, p% d16、相同的面具也将用于其他斜面,我们可以从之前的图层屏蔽掉。用鼠标右键点击图层里面的遮罩层的图标,选择“从选择减去层面膜”。这将创建一个和以前相同的选择。 - d9 b! E3 y7 H
% V/ G( H$ p7 F7 M
2011022411435767.jpg
' H7 i7 G7 i% O* H
: d, b  {1 l% O. r( a6 P$ l6 e17、在这一步,我们将重复选择转换图层的步骤。
6 n8 ~) m% ^9 g/ P& M& j
' l+ h0 R; Q$ N5 u+ T: D" I 2011022411435745.jpg
- w: D( d3 c2 x$ @6 ~+ l
) U: S/ w4 c6 g18、我们已经有了设置主按钮的斜面。现在我们需要给播放器创建一个显示器:黑色亚克力屏幕,在那里可以显示歌曲名字和播放时间。 / i: ~! O/ F6 h; f; [

. f$ z! w- a" ? 2011022411435730.jpg
/ A& f6 w' D. j1 r5 u- l4 _5 g/ c19、首先,我们使用阴影来创建一个光从上面射向底部的斜面。使用图片显示配置的风格,可以使图片显得锐利和清晰,而不是黑暗和模糊。 ( q7 U7 v# M" ~6 I. J9 p

1 d2 H4 n# f6 o* v8 m6 K 2011022411435876.jpg ) `' u. |7 b2 R# o
; |4 y% D: q/ ?
20、现在,我们需要建立一个径向渐变。把黑色和白色两种颜色尽量靠近中心附近,那样没有这么多两色的柔软性。黑色占49%,白色占50%。
, h! k# H7 H8 N  _& s" D- e1 J/ N9 j8 ^- k7 Y9 X
2011022411435857.jpg 0 Q7 A7 m5 f. @

, Z! p3 ?1 s' V: a21、取消点选该选项与层对齐。如果我们不这样做,梯度将只能从该对象的中心到边缘,我们希望梯度更大和更广泛。
0 T3 `/ l" b  R) z9 G( U. k% S* m( A6 ~
. j: H* j5 C8 z# g9 ]% h 2011022411435847.jpg
. @1 A5 D" H# Q7 [22、他出示您的镜面效果,使用两个类似于我们创建按钮那一步的斜面来做一个形状。使用一个一致行程内的黑色1像素中风。使用内部发光,2像素的大小设置为屏幕上的混合模式。
( Z! }/ s3 ^: b# a1 r% r/ S, v6 N& N) U  T8 z
2011022411435962.jpg 7 x8 C+ o& o, v9 n# O

3 Y" z5 o# V! c& |' L+ P; k8 T23、现在我们已经完成了我们的MP3播放器的前面。现在我们需要添加一些显示按钮和文本的图标。
( j; {) s1 Q) F- O; m/ ?: w8 z- `" L5 b2 {9 d
2011022411435932.jpg $ S' T( \3 ^" u' j1 L- k0 {/ q9 ^
3 X3 A/ Y% g: U7 o4 G+ F
24、现在,让我们在显示屏上模拟显示滚动文本。使用像素化的字体,我们需要添加将播放的翻译名称和歌曲名称。你可以使用这个免费的字体。记得把走样移出菜单上的文字工具窗口,以保持文本尖锐。
+ z5 D$ @6 ]5 w4 o
, l# ]6 \1 F) a# v" ]. w 2011022411435917.jpg - A" n/ J) E7 j! g
25、我们用其他位图字体创建计时器,指示时间的流逝。此字体也是免费的,你可以在这里得到它。 ( z2 r( [8 I0 s2 ^

* s5 Q/ o7 @, B7 j5 l; |5 H2 @ 2011022411440021.jpg
' N7 P( F" b4 I3 V3 T( U6 B$ n3 v! `0 S, {, @
26、使用通用的显示图标和音频或视频播放器符号的字体。你可以使用这一个。一旦它被安装用来创建播放器不同的按钮,在这种情况下,播放/暂停控制(随着播放器的发展,您将需要创建两个国家的按钮时,当按钮被按下时,播放按钮变成暂停按钮,反之亦然)。
5 D, Y9 M! w" x5 [+ m( ~9 z# |8 d( W. l" W0 p( W
2011022411440089.jpg
/ v9 r0 _, X0 Q0 T% c, ]% O6 H  l0 `# V1 w+ {/ V$ S# C9 r
27、对于这个符号,我们使用和前表面相同的颜色。用颜色选择工具,我们可以绘制文本。 ; Y% Z- i& K, k5 S5 z
3 t; T4 n3 u$ H2 e* T/ Z
2011022411440043.jpg
5 o# p' D8 `! d) t: y6 z8 w1 C
6 n% j3 y2 D! }9 `" {% H8 u' x1 b$ G1 @28、现在,我们可以包括各种不同的款式,让播放器外观看起来像浅浮雕标一样。使用内阴影下的相应值。
, t6 K) o$ _* y$ ^
4 ~, @. M: T2 b% M 2011022411440090.jpg # |. c1 w& y% z' }3 q  N+ s
' F# G7 C& c) Q( x5 o* s6 d: M
29、用这些操作可以减轻底部斜面。
9 k$ `* H$ o* v7 `# f6 N) `$ a
. }, d/ u$ \6 B 2011022411440166.jpg / u' Y. O) v9 d  h) i$ E
; \1 F7 |3 m8 J. Q! Y
30、使用柔软的宽度和坡度小的表面,让播放器看起来不是很枯燥。 & }4 r! b& v: A+ ~9 J

; i- w! G2 G  A3 [. _) f: a4 r+ x 2011022411440102.jpg
: U3 a% g. D" U0 U) b

最新评论

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

GMT+8, 2019-11-18 22:41 , Processed in 1.281250 second(s), 33 queries , Gzip On.

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

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