用Photoshop的定义图案制作网页背景图

By
技术文档

Create awesome backgrounds using patterns

这个Mflat主题更新以来,一直是浅色调为主,最近突然觉得应该换个头部,偶尔来的同学可能发现了,从上上一个主题(vicuna-flat)开始,一直沿用的浅色调,可能出于对高科技的无知围观加上设计领域的好奇。浅色调的好处不言而喻,不伤眼睛;坏处也是显而易见的,从上到下(底部除外)一个颜色看起来没什么层次。所以昨天晚上花了几个小时做了个头部图片上来。旨在折腾一下,活跃垂死的脑细胞。

上个图留念,不知道几天之后就会被折腾下去了。

screenshot.png

之后是本篇的主题:如何做这么个带小洞洞的图片~~
需要的同学请看:Create an awesome background using patterns

工具PS,主要用到了的定义图案(define pattern)。

他的成品(恕我技术有限,差的太远):

教程比较长,图片太多,我用口水转载一下(单位pixel):

1、新建一个100×100的图片,名字随便。

2、用左边的画圈工具画个大概10×10的小圈圈,涂你喜欢的颜色。

3、(关键步骤)双击圈圈图层,添加内阴影(inner shadow),各参数如下:

Create awesome backgrounds using patterns

4、用ctrl+j多复制几个圈圈出来,之后排列位置。

Create awesome backgrounds using patterns

5、添加个背景颜色,之后用选择工具选择如上图的蓝色线中间的方块位置。

6、(关键步骤)点击编辑>定义图案(define pattern)。将上一个步骤选择的区域设置为图案。

7、新建一个图层,用图章工具或者图层样式>图案填充把区域填满。

8、成品如下图。

Create awesome backgrounds using patterns

9、(这是我自己搞的)根据图片样式进行切片,之后在需要的地方repeat就可以了。

参照这个模式,我们可以制作出各式各样的背景图案,比如满天大猩猩、满眼小心心、全屏小骷髅等等。只要你想得到~

Comments: 70

  1. 感觉大家都很专业啊,我的PS证书拿着吓人的。

    2010年04月21日
    • @郑永 永哥都有证书啦?很猛啊

      2010年04月21日
    • @阿修 是啊,毕业那年考的,后来又去考全国等级2证书。

      2010年04月21日
  2. :!: 都是英文看不懂
    我就用过中文的

    2010年04月21日
  3. 阿修的PS不能说很棒。因为阿修是很谦虚的人。我这样说会让阿修止于探索的。不过有一点可以肯定,你的PS技术效果很帅。。加油。一年后你就是大师了~~!!!!!!!!

    2010年04月21日
    • @虾 虾的夸奖还是这么的让我心潮澎湃

      2010年04月21日
  4. 这个,浅显易懂,每个步骤人人都会,只是,我们怎么就没那么聪明会这样利用呢?哎~
    这就是人和人的差距啊~~~~~

    PS.选择你这里的文字时,显示是红色的背景,怎么实现的??

    2010年04月24日
  5. PS水平好高哦。~~

    2010年05月11日
  6. thanks a lot for this magnificent article

    2010年09月16日

发表评论

电子邮件地址不会被公开。 必填项已用*标注

*

:razz: