Photoshop实例：微型精致界面

查查 · 发表于 2007-5-4 07:36:57

马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。

您需要登录才可以下载或查看，没有账号？注册

x

完成效果： 
<CENTER><IMG src="http://www.cgfancy.com/Article/UploadFiles/200608/20060810171550841.jpg" border=0></CENTER> 　　绘制步骤： 　　1.在Photoshop中新建一个文件，300×200像素，分辨率为72DPI，白色背景。
 　　2.新建图层1，选择圆角矩形工具，在画布中央拉出一个圆角矩形的路径来。并将此路径转换为选区。再选择渐变填充工具，在矩形选区中拉出如（图1）摸样的渐变色填充。

<IMG alt=001 src="http://www.cgfancy.com/Article/UploadFiles/200608/20060810171551263.jpg" border=0>
图1 　　3.将图层1复制一个为图层1副本。再回到图层1，将图层1中的矩形垂直向下移动5-6个像素，并用曲线或者明暗命令将其颜色加深至黑色（图2）。

<IMG alt=002 src="http://www.cgfancy.com/Article/UploadFiles/200608/20060810171552461.jpg" border=0>
图2 　　4.将图层1副本再复制一个为图层1副本2，回到图层1副本，将其垂直向上移动5-6个像素，并同样用曲线命令将起颜色加深，加深至深灰色即可（图3）。

<IMG alt=003 src="http://www.cgfancy.com/Article/UploadFiles/200608/20060810171552767.jpg" border=0>
图3 　　5.在图层1副本2上面新建一个图层2，再选择圆角矩形工具，在原先矩形位置的上半部拉出个稍窄的矩形，完成后按CTRL+T，此时矩形路径上会出现个变换框，然后再按住CTR+SHIFT+ALT将变换框下端两侧的任意一个角向中间水平移动（图4）。

<IMG alt=004 src="http://www.cgfancy.com/Article/UploadFiles/200608/20060810171553311.jpg" border=0>
图4 　　6.完成上述步骤后，将此变形的矩形路径转换为选区，再选择渐变工具，将深浅色两端的颜色都设置为白色，并将浅色端的不透明度设置为0。在此选区内至上而下垂直拖拉（图5）。

<IMG alt=005 src="http://www.cgfancy.com/Article/UploadFiles/200608/20060810171553599.jpg" border=0>
图5
    7.将图层1，图层1副本，图层1副本2及图层2合并为一个图层，再执行菜单-滤镜-模糊-高斯模糊，模糊1个像素（图6）。 

<IMG alt=006 src="http://www.cgfancy.com/Article/UploadFiles/200608/20060810171554834.jpg" border=0>
图6
 　　8.在合并后的图层上方新建一个图层，再选择圆角矩形工具，在原本矩形的中间位置拉出一个矩形路径，并转换为选区，并用原先的灰色渐变色填充，完成后双击此图层，在弹出的图层样式面板上钩选斜面和浮雕选项，取消全局光设置，将大小跟软化都设置为0，角度为-50度，高度为48，其他不变（图7）。

<IMG alt=007 src="http://www.cgfancy.com/Article/UploadFiles/200608/20060810171555411.jpg" border=0>
图7
 　　9.按住CTRL点击此图层，使其选区浮起，再执行菜单-选择-修改-收缩，将选区收缩3个像素，再按CTRL+U将其选区内图象的明度降低（图8）。 

<IMG alt=008 src="http://www.cgfancy.com/Article/UploadFiles/200608/20060810171555879.jpg" border=0>
图8
 　　10.不要取消选区，再执行菜单-选择-修改-收缩，将选区再收缩2个像素，同时在此图层的上方再新建一个图层，如上述第6步中所说的，将简便色相同设置，并在选区中拖拉（图9）。

<IMG alt=009 src="http://www.cgfancy.com/Article/UploadFiles/200608/20060810171556560.jpg" border=0>
图9
 　　11.回到原先合并的，图层，将其复制一个为副本，并下下面的图层水平象下移动4-5个像素，再回到上面的图层，用鼠标双击此图层，在图层样式面板中选内发光跟投影效果，投影的距离设置为10，扩展为10，大小为15，其它不变，再将内发光的发光色设置为白色，阻塞为0，大小为8个像素，并将等高线设置为第2排第5种样式（图10）。

<IMG alt=010 src="http://www.cgfancy.com/Article/UploadFiles/200608/20060810171556699.jpg" border=0>
图10
 　　12.此时，界面已经完成。若要在上面做别的修饰与美化，可以自由发挥（图11）。 
<IMG alt=011 src="http://www.cgfancy.com/Article/UploadFiles/200608/20060810171557886.jpg" border=0>
图11 <script language="JavaScript" src="http://www.16xx8.com/bbs/10.js"></script>

账号		自动登录	找回密码
密码			注册

[制作实例] Photoshop实例：微型精致界面

马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。