Google
      
发新话题
打印

[ps网页制作] photoshop网页设计: 圆形水晶按钮

photoshop网页设计: 圆形水晶按钮

最终效果/ C& }* d" o5 ~5 c! Q& J: r/ s
% J& {/ S/ l$ M, g7 l$ a+ S$ e* A9 a
1、新建一 个600 * 600像素的文件,背景填充颜色:#056338,新建一个图层在画布的中心位置用椭圆选框工 具绘制一个正圆,填充颜色:#FAE4B3,效果如图1。
# \9 H9 T- r* B2 m# F9 J% |: z/ N% K4 x3 ^8 L, T/ D; n" s
图1 2、以 正圆的中心为参考点拉出两条垂直的参考线,用参考线中点为圆心,用椭圆选框工具按住Alt + Shift画出图2所示的选区,按Delete删除,得到一个圆环。' c$ m* p* h0 K# d# U

0 l/ J0 X# B! x% ^: C$ m图2
9 A- I2 q9 F% z- n2 `4 j3 、双击图层调出圆环的图层样式,参数设置如图3-5,效果如图6。
4 z6 ?! S& T2 z; I. ?) h4 V+ X5 i0 X5 y# i+ |: o
图3 # N2 \$ _" C* d, \# h5 U
  k$ c# _+ G8 ~9 q4 i  r( s
图4 9 |9 u# T% T; ]; r. C" `6 t

. b' R" D# Z0 s. R  u/ Z, I图5
# O" U. b& N4 T; S1 U2 W) c4 w5 {4 j  h

3 g, J) m% Z7 d$ _# p* k6 G: x) p
0 N- U% |- w: U2 L7 x
  A( H. y! r% o2 y  u0 _& M( V# P& n: j. r/ {
2 {. p& R  ]1 ]8 T5 T0 \% O6 v3 L
图6 4、在圆环的下面新建一个图层,用椭圆选框工具画出 图7所示的选区,然后选择渐变工具颜色设置如图8,拉出图9所示的渐变。& Z3 v/ |% `4 L8 ?
( t5 w; ]- b* s
图7 7 [) x3 S( ?6 ]! H# _6 F

/ ~8 J" T, z& `# U% s7 E* f图8 9 A& Z2 N! d# g  x
* j- O5 G- E* e& U" N* d: G8 z
图9 5、新建一个图层,用椭圆选框工具拉一个比圆环稍小的正圆, 如图10,然后选择渐变工具,颜色设置如图11,绘制图12所示的径向渐变。
4 ]) ]/ ?" J8 C* n* I$ B  }& W  D7 W0 P' {( O
图7
4 y8 r* R& t$ Y+ B$ g4 `6 v$ H
, @  b* }8 z1 D/ C2 `7 e图8
9 U8 y4 \* P! Q0 R9 z" m' }, f) b% h; f  Y) [8 f# i/ v
7 B1 P8 S) G( b) I  k$ R

0 p! Y2 T& [' F图9 6、新建 一个图层,用椭圆选框工具拉一个稍小的正圆,如图10,然后填充白色,图层不透明度改为:15%, 加上图层蒙版用黑色画笔把下半部分擦掉,如图11。
- m4 T9 X2 B+ v6 q& a$ P$ ^0 K6 y" |) R- Z" \0 T) V9 h" {$ L
图10
$ ]% ]; c4 R+ u
3 J* d- Q& {6 o0 Z6 x6 A- d5 H/ F
$ C* i# b# ?6 e4 T" L/ ]  ]+ |3 C8 G, T1 q+ x/ V8 ~% E
图11 7、新建一个图层,前景颜色设置为:#B50207,用画笔工具随意的刷上一些小点,如图12, 执行菜单:滤镜 模糊 径向模糊,参数设置如图13,确定后再加上图层蒙版,把一些不要的地方 用黑色画笔擦掉,效果图图14。
/ T3 h0 u0 @8 O  r6 j3 C$ q$ W1 H1 m0 y& J+ N" D( ?+ K$ y" T9 ]; K
图12 , v+ y5 G5 p* `' ~# w- `

# Y  ~9 `/ M- ]/ ]+ Y$ F6 X
& A) H4 f( T: x& V9 H: O( B  Q7 A  Z' B* h( I# p0 P: P! R
图13
& d) ^8 i! H+ ^9 D. u+ r/ D2 c6 C. T
图14 8、新 建一个图层,填充黑色,执行菜单:滤镜 渲染 镜头光晕,参数设置如图15,确定后再执行菜单 :滤镜 扭曲 极坐标,参数设置如图16,效果如图17。
! X" V8 j( n& n2 a  w4 d: l! v$ E1 C# l+ M1 N! r' l) w( w
图15
' a8 @7 L! U% h- m# z% W& N
/ j- D3 ?$ s- [8 p2 Q- |( k图16
7 g" i7 V8 ~4 I3 F4 h/ V# V
0 j1 v, p& X) o5 C$ j. Z) o3 j/ G6 L% f0 i

9 s# |$ e( g5 G" V$ t( N: b图17 9、把滤镜后的高光图层模式改为变亮,适当的变形和角 度,放到正圆的右下角,加上图层蒙版把多余的部分擦掉,效果如图18。1 Q* S  o" M! F% L: E
* w  X, G& |, b; m9 i
图18 # z" A9 t8 v3 D! X2 f" a- @
9 j5 z6 F0 u' [

/ v9 S+ U  y! U0 R" H) E# [10、同样的方法制作出左 上角的高光。5 X1 Q1 D  s3 r- ~, B
+ J$ E1 |+ [* ~& U% w3 m0 e
图19 11、新建一个图层加上一些反光和星星笔刷,如图20。 ' N8 J1 u/ ]9 J4 g  g

  N1 b1 T# n( @% N3 g, A( N+ o8 w0 G图20 1 L; g; D  O" @
12、最后加上小装饰,再加上自己喜爱的照片,完成最终效果。* g- ]; V, H. @2 n6 I- \
1 O9 v. h# R8 m+ j, o2 i3 T  W
图21

中级会员可以在这里用文字签名,高级会员可以在这里用图片签名.

TOP

漂亮学习了...............

TOP

TOP

好美,一定要学会~~~~~

TOP

把滤镜后的高光图层模式改为变亮

把滤镜后的高光图层模式改为变亮4 K) }( x6 a& @3 M  T( O8 x
不明白

TOP

发新话题