Photoshop设计网页丝带样式教程

2016-02-19 17:11 19 1 收藏

今天图老师小编给大家展示的是Photoshop设计网页丝带样式教程,精心挑选的内容希望大家多多支持、多多分享,喜欢就赶紧get哦!

【 tulaoshi.com - photoshop教程 】

最终效果图

Photoshop创建丝带样式教程

 

1.创建一个新文档(Ctrl + N)1000×450像素。丝带分为三个部分,边缘,褶皱,以及标题面。

Photoshop创建丝带样式教程

 

2.选择以下设置中的钢笔工具(P)。

Photoshop创建丝带样式教程

 

3.现在开始用钢笔工具绘制的丝带的边缘(1)左侧,边缘应该有弯曲褶边的边缘。

Photoshop创建丝带样式教程

 

Photoshop创建丝带样式教程

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com)

 

4.绘制主体部分的时候使用直线钢笔,会比较容易一点。

Photoshop创建丝带样式教程

 

Photoshop创建丝带样式教程

 

5.绘制褶皱的部分,记得使1和3看起来是连在一起的。

Photoshop创建丝带样式教程

 

Photoshop创建丝带样式教程

6.为了使丝带完整,我们所要做的就是复制和翻转。但是为了使主体在一个图层方便控制,我们选择形状3,然后选择钢笔工具,确保矢量蒙版被选中,现在进入编辑复制(Ctrl + C),编辑粘贴(Ctrl + V),最后编辑自由变换路径(按Ctrl + T)。我们现在翻转形状,进入编辑变换水平翻转,拉到你需要的长度。

Photoshop创建丝带样式教程

 

Photoshop创建丝带样式教程

 

Photoshop创建丝带样式教程

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com)

 

7.现在重复其他2形状。

Photoshop创建丝带样式教程

 

8.添加以下图层样式的两个带状年底层。

Photoshop创建丝带样式教程

 

Photoshop创建丝带样式教程

 

Photoshop创建丝带样式教程

 

9.为了褶皱层添加一个渐变叠加使用以下设置。

Photoshop创建丝带样式教程

 

Photoshop创建丝带样式教程

 

10.最后添加一个渐变叠加到您的主带的形状,使用下面的设置。

Photoshop创建丝带样式教程

 

Photoshop创建丝带样式教程

11.创建一个新的(按Ctrl + N)4 × 4像素的文件,选择铅笔工具(B)。你完成进入编辑定义图案,保存模式然后头回到原来的画布。

Photoshop创建丝带样式教程

 

12.选择形状1的选区,进入选择修改收缩5px。新建图层,选择你的模式,填充工具(G)。

Photoshop创建丝带样式教程

 

13.然后进入选择修改收缩的5px再次,然后删除中间部分,使用白色填充层使用叠加。

Photoshop创建丝带样式教程

 

Photoshop创建丝带样式教程

 

14.重复上边的步骤到形状3里。

Photoshop创建丝带样式教程

 

15.添加一些随机旧笔刷,然后设置图层不透明度为43%和混合模式为柔光。

Photoshop创建丝带样式教程

 

16.选择形状1的选区,新建图层,使用黑到透明的叠加,设置图层不透明度为40%左右。

Photoshop创建丝带样式教程

 

Photoshop创建丝带样式教程

 

Photoshop创建丝带样式教程

 

17.重复到另一边,添加文字。

Photoshop创建丝带样式教程

 

18.完成。

Photoshop创建丝带样式教程

来源:https://www.tulaoshi.com/n/20160219/1614443.html

延伸阅读
最终效果     第一印象很重要!令人惊叹的具有视觉吸引力的作品是每个设计者为之追求的。今天,我们将演示如何在Photoshop中使用照片,画笔。纹理和3D物体来 设计一个有创意的多媒体网站布局。让我们开始吧! 预计完成时间:2小时以上 资源: 在本教程中我们将使用到下面的资源: Classical camera Director’s chair TV ca...
来源:站酷 作者:kulama 网游页面设计要求是非常高的,要能根据tulaoShi.com游戏的特点,风格等来发挥创意。用最简练的画面来表现游戏的主题,用相关的素材来合成效果。 最终效果 1、我只要锁链和古城堡,不要的都擦除。 2、开始适当调整背景,这一步不用太注重细节,因为后期可以一并处理的地方很多。 3、把人物置入场景,位置比例...
最终效果 这里是作品预览图. 点击 此处 预览全图. 新建PSD文件 1 开始创建文档(Ctrl+N); 高和宽均为 1200 像素 . 使背景图层可编辑 2 按照默认设置, Photoshop将会锁定背景图层因此你不能进行编辑.为了使它可编辑, 在图层面板双击背景图层 (如果图层面板未激活,按下F7触发). 另外一种方法, 你可以在背景层上击右键,选择 “背景图层”...
标签: Web开发
在网页设计的认识上,许多人似乎仍停留在网页制作的高度上。认为只要用好了网页制作软件,就能搞好网页设计了。 其实网页设计是一个感性思考与理性分析相结合的复杂的过程,它的方向取决于设计的任务,它的实现依赖于网页的制作。正所谓功夫在诗外,网页设计中最重要的东西,并非在软件的应用上,而是在我们对网页设计的理解以及设计...
  最终效果如下   下面让我们用线框来着手布局。下图就是我们绘制的简单布局,这么做的目的是要确定每个元素的位置。确定主导航栏包含几个部分、以及最新增加的内容在主页面中的展示位置。 新建一个文件,宽960px、高1200px。这对于屏幕分辨率为1024*768的朋友来说是黄金尺寸。前景色设为#85848c,背景色设为#414048. 拉一...

经验教程

668

收藏

12
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部