用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就可以了。

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

0

Comments: 70

  1. 英文的WP挖,看不懂

    2010年04月17日
    • @皓辰 我这不把大概内容翻译了~~

      2010年04月17日
  2. 我果然是对PS一窍不通 :grin:

    2010年04月17日
  3. 真厉害,我不会ps – –

    主题越来越大气了,黑色诱惑,黑色真的很好

    2010年04月17日
  4. 在ie6下本页面的footer离得很远
    http://i3.6.cn/cvbnm/d0/31/28/b8a0ce00cb938642c019a2eda32f02f9.png

    2010年04月17日
    • @宅男 我去改改。谢谢提醒!~

      2010年04月17日
    • @阿修 不要再为IE6费劲了吧 :grin:

      2010年04月19日
    • @wanjie 奇怪的是我用IE6测试完没发现问题…… :!:

      2010年04月19日
  5. 又换logo啊。。。貌似其他的也修改了不少
    真是能折腾

    可以叫做洞洞主题 :lol:

    2010年04月17日
    • @A.shun logo没换文字和字体,只变了下样式,嘿嘿。XX’s 洞洞 博客?好邪恶

      2010年04月17日
  6. 看来你是个ps高手了
    以后有问题找你了 :wink:

    2010年04月17日
    • @要饭的 我也是按人家的教程一点一点摸的

      2010年04月17日
  7. PS高手啊~~~~~~~膜拜一下,比我完全不懂的人高多了。

    2010年04月17日
  8. 不错学习了.

    2010年04月17日
  9. 学过点PS,一直没去整过。学习了。

    2010年04月17日
  10. 这个学了,支持

    2010年04月17日
  11. :roll: 对这个不懂,细节的东西就更难处理了。

    2010年04月17日
    • @朵未 对啊,关键就是细节~

      2010年04月18日
  12. 我最近倒喜欢加浓彩,呵呵。

    2010年04月17日
  13. ps高手。。。

    2010年04月18日
  14. 阿修用的是英文版PS? :?:

    头部做得不错吖~哪天有空帮我设计一个LOGO?哈哈~

    2010年04月18日
    • @Lazyyyyyyyyyyyyyy 是中文版的,但是他的教程用的是英文版,我直接CP下来的

      2010年04月18日
  15. 学习了。博主高手。果断订阅。

    2010年04月18日

大脚进行回复 取消回复

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

*

:razz: