ps中创建杂色背景图案 (‾◡◝)

实例制作 admin 5个月前 (05-12) 4次浏览 扫描二维码

这篇文章我们来说说如何在Photoshop中创建杂色背景图案。杂色背景图案看上去稀松平常,没什么出众的效果,但是如果将其应用到网页上以后就会发现这样的杂色背景给网页着实增色不少(如下图)。杂色虽然是很细微的效果,但却打破了单色背景的单调性,让网页看上去更富有质感。

一、设计作品

1、Billy Tamplin

Photoshop中创建杂色背景图案,PS教程,xuanloog.com教程网

2、DConstruct

Photoshop中创建杂色背景图案,PS教程,xuanloog.com教程网

3、Dribbble

Photoshop中创建杂色背景图案,PS教程,xuanloog.com教程网

4、Heyindy

Photoshop中创建杂色背景图案,PS教程,xuanloog.com教程网

5、Kennymeyers

Photoshop中创建杂色背景图案,PS教程,xuanloog.com教程网

 

二、创建方法

那么如何在Photoshop中创建杂色背景图案呢?方法很简单,步骤如下:

1、新建一个文档(Ctrl+N),尺寸为200像素乘以200像素大小。尺寸不能太小,最小不小于75像素,以防止在网页中平铺后看出背景的重复性。也无需太大,因为我们还需要考虑到页面载入的时间。

Photoshop中创建杂色背景图案,PS教程,xuanloog.com教程网

2、选择矩形工具(U),画一个完全覆盖背景图层的矩形。命名为”Base Color”,我们这里选择颜色为#EBEBEB,当然你也可以选择任何你喜欢的颜色。

Photoshop中创建杂色背景图案,PS教程,xuanloog.com教程网

3、再新建一个图层,命名为”Noise Layer”。

Photoshop中创建杂色背景图案,PS教程,xuanloog.com教程网

4、选择矩形选区工具(M),在”Noise Layer”上画一个覆盖整个文档的选区。然后在菜单栏选择Edit>Fill命令,或在文档上点击右键选择Fill命令,将选区填充为白色。之后按下”Ctrl+D”快捷键取消选区。

Photoshop中创建杂色背景图案,PS教程,xuanloog.com教程网

5、接下来我们要将”Noise Layer”转换为智能物件(Smart Object),你可以通过在”Noise Layer” 上点击右键,然后选择”转换为智能物件(Convert to Smart Object)”或者通过选择菜单栏的”滤镜(Filter)菜单中的”转换为智能滤镜(Convert for Smart Filters)”命令来完成。

将图层转换为智能物件的原因是智能物件应用滤镜后,你随时可以更改滤镜的参数值来调整滤镜的效果而不用一遍一遍重新做。接下来,我们选择滤镜(Filter)>杂色(Noise)>添加杂色(Add Noise)命令来给文档添加杂色,数量选择4.8%,高斯散布,勾选单色选项框。完成之后,点击确定。

Photoshop中创建杂色背景图案,PS教程,xuanloog.com教程网

6、将”Noise Layer”的图层混合模式更改为”图层叠加(Multiply)”,这样滤掉了白色后,背景颜色就显现出来了。现在你可以更改”Base Layer”图层的颜色为任何你喜欢的颜色。

Photoshop中创建杂色背景图案,PS教程,xuanloog.com教程网

以上就是杂色背景图层的基本样式,你可以将它保存下来直接用作网页的背景图片。当然你还可以按照下面文章中介绍的方法做一些修改和变化,设计出不同颜色和感觉的杂色背景图片。

这篇文章我们来说说如何在Photoshop中创建杂色背景图案。杂色背景图案看上去稀松平常,没什么出众的效果,但是如果将其应用到网页上以后就会发现这样的杂色背景给网页着实增色不少(如下图)。杂色虽然是很细微的效果,但却打破了单色背景的单调性,让网页看上去更富有质感。

一、设计作品

1、Billy Tamplin

Photoshop中创建杂色背景图案,PS教程,xuanloog.com教程网

2、DConstruct

Photoshop中创建杂色背景图案,PS教程,xuanloog.com教程网

3、Dribbble

Photoshop中创建杂色背景图案,PS教程,xuanloog.com教程网

4、Heyindy

Photoshop中创建杂色背景图案,PS教程,xuanloog.com教程网

5、Kennymeyers

Photoshop中创建杂色背景图案,PS教程,xuanloog.com教程网

 

二、创建方法

那么如何在Photoshop中创建杂色背景图案呢?方法很简单,步骤如下:

1、新建一个文档(Ctrl+N),尺寸为200像素乘以200像素大小。尺寸不能太小,最小不小于75像素,以防止在网页中平铺后看出背景的重复性。也无需太大,因为我们还需要考虑到页面载入的时间。

Photoshop中创建杂色背景图案,PS教程,xuanloog.com教程网

2、选择矩形工具(U),画一个完全覆盖背景图层的矩形。命名为”Base Color”,我们这里选择颜色为#EBEBEB,当然你也可以选择任何你喜欢的颜色。

Photoshop中创建杂色背景图案,PS教程,xuanloog.com教程网

3、再新建一个图层,命名为”Noise Layer”。

Photoshop中创建杂色背景图案,PS教程,xuanloog.com教程网

4、选择矩形选区工具(M),在”Noise Layer”上画一个覆盖整个文档的选区。然后在菜单栏选择Edit>Fill命令,或在文档上点击右键选择Fill命令,将选区填充为白色。之后按下”Ctrl+D”快捷键取消选区。

Photoshop中创建杂色背景图案,PS教程,xuanloog.com教程网

5、接下来我们要将”Noise Layer”转换为智能物件(Smart Object),你可以通过在”Noise Layer” 上点击右键,然后选择”转换为智能物件(Convert to Smart Object)”或者通过选择菜单栏的”滤镜(Filter)菜单中的”转换为智能滤镜(Convert for Smart Filters)”命令来完成。

将图层转换为智能物件的原因是智能物件应用滤镜后,你随时可以更改滤镜的参数值来调整滤镜的效果而不用一遍一遍重新做。接下来,我们选择滤镜(Filter)>杂色(Noise)>添加杂色(Add Noise)命令来给文档添加杂色,数量选择4.8%,高斯散布,勾选单色选项框。完成之后,点击确定。

Photoshop中创建杂色背景图案,PS教程,xuanloog.com教程网

6、将”Noise Layer”的图层混合模式更改为”图层叠加(Multiply)”,这样滤掉了白色后,背景颜色就显现出来了。现在你可以更改”Base Layer”图层的颜色为任何你喜欢的颜色。

Photoshop中创建杂色背景图案,PS教程,xuanloog.com教程网

以上就是杂色背景图层的基本样式,你可以将它保存下来直接用作网页的背景图片。当然你还可以按照下面文章中介绍的方法做一些修改和变化,设计出不同颜色和感觉的杂色背景图片。


声明:本站的文章、图片、资源等来自互联网或者站长原创;版权归原作者所有,仅作为个人学习、研究以及欣赏!如有侵权,请联系i@ki4.cn删除!本网站采用BY-NC-SA协议进行授权
转载请注明原文链接:ps中创建杂色背景图案 (‾◡◝)
喜欢 (0)