界面原作者链接：http://www.rokey.net/v2/Gallery_Show.asp?PhotoID=163

教程作者相关：http://www.rainoina.com

最终效果图：

1、打开ps，新建一个文档，300px*400px，填充黑色背景，依照下图打好参考线。

2、新建一个图层，沿参考线做一个选区，填充上灰色，然后缩选1px，删除多余的色块，创建出边框；也可以用描边的方式来完成。

3、复制边框图层，选择边框内的部分，填充上背景色，此时我们便有了三个图层：

4、建立一个“顶部工具条”的序列，在这个序列中新建一个图层，命名“绿色部分”，选取如图矩形框，填充上白色。

 5、对"绿色部分"添加图层样式,做"渐变叠加",设置如图:

6、效果如图：

经典论坛讨论：
http://bbs.blueidea.com/thread-2747670-1-1.html

出处：蓝色理想
责任编辑：elesa

上一页 下一页 ps制作手机UI教程 [2]

◎进入论坛Photoshop、Fireworks版块参加讨论