PS设计教程网欢迎你!

Photoshop从零开始设计漂亮的网页模板(5)

文章来源于 优设,感谢作者 Joe 给我们带来经精彩的文章!
设计教程/PS教程/设计教程2013-05-06
最后我们加点细节。在切换菜单下方画一个1px的灰线。然后如上一步一样用蒙版的方式使左右两端渐变。现在我们就得到一条比较时尚好看的线了。 现在切换菜单就像这样。 第二十五步 现在开始设计第一个切换按钮的内容

最后我们加点细节。在切换菜单下方画一个1px的灰线。然后如上一步一样用蒙版的方式使左右两端渐变。现在我们就得到一条比较时尚好看的线了。

Photoshop从零开始设计漂亮的网页模板

现在切换菜单就像这样。

第二十五步

Photoshop从零开始设计漂亮的网页模板

现在开始设计第一个切换按钮的内容。我们需要一个精准设计的图像(有好看的标题和一些文字内容)。首先我们得创建这个精准的图片。这里我认为我们最好打破这个图片尖锐的棱角设计,从而创造一个多彩的效果。因此我现在画一个白色有1像素灰色边框的长方形,再给它加上细微的阴影效果。

Photoshop从零开始设计漂亮的网页模板

复制这一层并用变形工具稍微旋转。重复这个操作几次

Photoshop从零开始设计漂亮的网页模板

把你选好的图片导进来,放在白色长方形上面。不用担心图片会溢出,我们会修整它。选中最上层的长方形,按选择->修改->收缩 ,输入5px,确认,然后在图层管理区下方点击添加图层蒙版,这样图片就只显示选区范围。

Photoshop从零开始设计漂亮的网页模板

这就是你现在图层的状态。

第二十六步

Photoshop从零开始设计漂亮的网页模板

不要忘记整理图层,这里新建图层夹把图层归类。

Photoshop从零开始设计漂亮的网页模板

增加一个漂亮的标题、一些文本和列表,我们的设计工作又完成一部分。现在继续下一步吧。

Photoshop从零开始设计漂亮的网页模板

再组织一下图层。

第二十七步: 感谢信

Photoshop从零开始设计漂亮的网页模板

我认为这一个部分要比较大的,因此我把范围限定在主区域上的一个大的盒子里面。首先创建一个大的淡灰色的大概高220像素的长方形。设置其有1像素的灰色边。

Photoshop从零开始设计漂亮的网页模板

然后再画一个上下左右都比它小10像素的另一个长方形。同样设置其1像素的淡灰色边框。

Photoshop从零开始设计漂亮的网页模板

最后写上文本就可以了。

第二十八步

Photoshop从零开始设计漂亮的网页模板

版权所有PS设计教程网公安备案:苏公网安备 32058302001023号工信部备案:沪ICP备09005587号
aaa