织梦CMS - 轻松建站从此开始!

我的网站

Photoshop设计移动APP应用类型网站

时间:2014-06-25 14:21来源:站酷 作者:教程盒子 点击:
在今天的教程中教程盒子将指导您创建你自己的移动应用程序网站。本教程主要使用Photoshop设计黑色风格的APP网页界面模板。整体的设计风格黑色大气,喜欢的朋友让我们一起来学习吧。

最终效果

<a href='/design/photoshop/' target='_blank'><u>Photoshop</u></a><a href='/' target='_blank'><u>设计</u></a>移动APP应用类型网站

教程所需素材

所有素材打包下载:http://urlxf.qq.com/?JRbqE37

第一步

新建(Ctrl + N)一个 1200 x 1150 px,背景为:#FFFFFF的文档。使用“矩形选择工具”(M)画一个 1200 x 220px的矩形框,然后填充颜色(此颜色不做固定要求)。

<a href='/design/photoshop/' target='_blank'><u>Photoshop</u></a><a href='/' target='_blank'><u>设计</u></a>移动APP应用类型网站

接下来,我们把刚刚创建的图层命名为“header”。使用“圆角矩形工具”(U)并设置半径为20px。

Photoshop设计移动APP应用类型网站

画一个950 x 60px 的圆角矩形

Photoshop设计移动APP应用类型网站

命名圆角矩形图层“Navigation“。重新选择圆角矩形工具(U)然后在“Navigation“右上方再次拖出一个圆角矩形作为搜索框。把该层命名为 “Search”。

Photoshop设计移动APP应用类型网站

第二步

选择 “Header” 图层 按照如下设置添加”图层样式“

投影设置:不透明度:34%;角度:90度;距离:5px; 大小:5px;

Photoshop设计移动APP应用类型网站

渐变叠加

Photoshop设计移动APP应用类型网站

在“Header”图层上方建立一个发光图层并命名为“Header Glow”. 选择 “Header”图层并执行命令 “图层 >载入选区”选择 “渐变工具” (G) “镜像渐变”. 如图所示。

Photoshop设计移动APP应用类型网站

然后把刚刚设置的图层透明度降低为“15%”

Photoshop设计移动APP应用类型网站

(责任编辑:RGB)
织梦二维码生成器
顶一下
(4)
100%
踩一下
(0)
0%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 验证码:点击我更换图片
栏目列表
推荐内容