Photoshop教程:制作漂亮的个人博客

作者:小鱼 出处:UCD博客 先看下效果吧 :) 您将学习如何建设一个时尚,专业的博客设计. 第1步: 新建文件 文件 新建(Ctrl + N),文件大小1184 x 1024px ,背景色填充#252424 第2步: 新建层,做网页的头部,选择矩形选框工具(M),随便填充#000000,然后选择图层样式 渐变

PS设计Wordpress博客模版以及切片(2)

作者:小鱼   出处:UCD博客

先看下效果吧 :)

您将学习如何建设一个时尚,专业的博客设计.

Photoshop教程:制作漂亮的个人博客插图

第1步: 新建文件 > 文件 > 新建(Ctrl + N),文件大小1184 x 1024px ,背景色填充#252424

Photoshop教程:制作漂亮的个人博客插图(1)

第2步: 新建层,做网页的头部,选择矩形选框工具(M),随便填充#000000,然后选择图层样式 Photoshop教程:制作漂亮的个人博客插图(2) > 渐变叠加 线性渐变从#005a9f到#00a1ee

Photoshop教程:制作漂亮的个人博客插图(3)

Photoshop教程:制作漂亮的个人博客插图(4)

Photoshop教程:制作漂亮的个人博客插图(5)

第3步: 新建层。使用多边形套索工具,填充白色,选择渐变叠加

Photoshop教程:制作漂亮的个人博客插图(6)

Photoshop教程:制作漂亮的个人博客插图(7)

Photoshop教程:制作漂亮的个人博客插图(8)

Photoshop教程:制作漂亮的个人博客插图(9)

第4步: 在第3步下面新建层,载入第3步选区,填充白色,在选择第3步层,把选区下右个移动1px ,选择移动工具再次向下右移动1px ,在选择白色层不透明度为58% ,图层样式为 > 色相

Photoshop教程:制作漂亮的个人博客插图(10)

Photoshop教程:制作漂亮的个人博客插图(11)

Photoshop教程:制作漂亮的个人博客插图(12)

第5步: 选择文本工具(T)输入文字,加上自己喜欢的图标

Photoshop教程:制作漂亮的个人博客插图(13)

第6步: 新建层,做发光效果的标,选择画笔#DA4D89 ,#06FA05 ,#fefb03 ,

Photoshop教程:制作漂亮的个人博客插图(14)

Photoshop教程:制作漂亮的个人博客插图(15)

Photoshop教程:制作漂亮的个人博客插图(16)

第7步: 选择文本工具,输入自己想要的文字,然后选择图层样式 > 投影 > 渐变叠加。

Photoshop教程:制作漂亮的个人博客插图(17)

Photoshop教程:制作漂亮的个人博客插图(18)

Photoshop教程:制作漂亮的个人博客插图(19)

Photoshop教程:制作漂亮的个人博客插图(20)

第8步: 在次选择文本工具,输入自己想要的文字,然后选择图层样式 > 外发光 > 渐变叠加。

Photoshop教程:制作漂亮的个人博客插图(21)

Photoshop教程:制作漂亮的个人博客插图(22)

Photoshop教程:制作漂亮的个人博客插图(23)

Photoshop教程:制作漂亮的个人博客插图(24)

第9步: 新建层,选择铅笔工具,大小1px,选择白色,画条直线不透明度为64%,混合模式为柔光。

Photoshop教程:制作漂亮的个人博客插图(25)

第10步: 新建层,选择矩形选取工具(M),选择图层样式 >>渐变叠加 效果如图

Photoshop教程:制作漂亮的个人博客插图(26)

Photoshop教程:制作漂亮的个人博客插图(27)

Photoshop教程:制作漂亮的个人博客插图(28)

第11步: 在第10步下方新建层,填充白色,载入选区,选着第10步图层,向右移动1px,如图所示:

Photoshop教程:制作漂亮的个人博客插图(29)

Photoshop教程:制作漂亮的个人博客插图(30)

第12步: 选择矩形工具,创建一个矩形,选择图层样式 >>

Photoshop教程:制作漂亮的个人博客插图(31)

Photoshop教程:制作漂亮的个人博客插图(32)

Photoshop教程:制作漂亮的个人博客插图(33)

Photoshop教程:制作漂亮的个人博客插图(34)

Photoshop教程:制作漂亮的个人博客插图(35)

Photoshop教程:制作漂亮的个人博客插图(36)

第13步: 选择矩形工具,创建一个矩形,选择图层样式 >>;输入文字

Photoshop教程:制作漂亮的个人博客插图(37)

Photoshop教程:制作漂亮的个人博客插图(38)

Photoshop教程:制作漂亮的个人博客插图(39)

Photoshop教程:制作漂亮的个人博客插图(40)

第14步:现在做右边内容,选择矩形工具,创建一个矩形,选择图层样式 >>

Photoshop教程:制作漂亮的个人博客插图(41)

Photoshop教程:制作漂亮的个人博客插图(42)

Photoshop教程:制作漂亮的个人博客插图(43)

Photoshop教程:制作漂亮的个人博客插图(44)

第15步:新建层,创建一个搜索框,效果如图:

Photoshop教程:制作漂亮的个人博客插图(45)

Photoshop教程:制作漂亮的个人博客插图(46)

第16步:在第14步层下方新建层,创建矩形,选择图层样式 >>

Photoshop教程:制作漂亮的个人博客插图(47)

Photoshop教程:制作漂亮的个人博客插图(48)

Photoshop教程:制作漂亮的个人博客插图(49)

第17步:新建层。使用画笔工具(B),创建一条白线,图层样式为 >>柔光

Photoshop教程:制作漂亮的个人博客插图(50)

第18步:做翻页按钮,选择矩形工具(U)选择图层样式 >>

Photoshop教程:制作漂亮的个人博客插图(51)

注意调节细节,加上自己喜欢的图标:

Photoshop教程:制作漂亮的个人博客插图(52)

小鱼已经完成Ps制作个人博客,您呢(*^__^*) 嘻嘻……

作者:小鱼   出处:UCD博客

先看下效果吧 :)

您将学习如何建设一个时尚,专业的博客设计.

Photoshop教程:制作漂亮的个人博客插图

第1步: 新建文件 > 文件 > 新建(Ctrl + N),文件大小1184 x 1024px ,背景色填充#252424

Photoshop教程:制作漂亮的个人博客插图(1)

第2步: 新建层,做网页的头部,选择矩形选框工具(M),随便填充#000000,然后选择图层样式 Photoshop教程:制作漂亮的个人博客插图(2) > 渐变叠加 线性渐变从#005a9f到#00a1ee

Photoshop教程:制作漂亮的个人博客插图(3)

Photoshop教程:制作漂亮的个人博客插图(4)

Photoshop教程:制作漂亮的个人博客插图(5)

第3步: 新建层。使用多边形套索工具,填充白色,选择渐变叠加

Photoshop教程:制作漂亮的个人博客插图(6)

Photoshop教程:制作漂亮的个人博客插图(7)

Photoshop教程:制作漂亮的个人博客插图(8)

Photoshop教程:制作漂亮的个人博客插图(9)

第4步: 在第3步下面新建层,载入第3步选区,填充白色,在选择第3步层,把选区下右个移动1px ,选择移动工具再次向下右移动1px ,在选择白色层不透明度为58% ,图层样式为 > 色相

Photoshop教程:制作漂亮的个人博客插图(10)

Photoshop教程:制作漂亮的个人博客插图(11)

Photoshop教程:制作漂亮的个人博客插图(12)

第5步: 选择文本工具(T)输入文字,加上自己喜欢的图标

Photoshop教程:制作漂亮的个人博客插图(13)

第6步: 新建层,做发光效果的标,选择画笔#DA4D89 ,#06FA05 ,#fefb03 ,

Photoshop教程:制作漂亮的个人博客插图(14)

Photoshop教程:制作漂亮的个人博客插图(15)

Photoshop教程:制作漂亮的个人博客插图(16)

第7步: 选择文本工具,输入自己想要的文字,然后选择图层样式 > 投影 > 渐变叠加。

Photoshop教程:制作漂亮的个人博客插图(17)

Photoshop教程:制作漂亮的个人博客插图(18)

Photoshop教程:制作漂亮的个人博客插图(19)

Photoshop教程:制作漂亮的个人博客插图(20)

第8步: 在次选择文本工具,输入自己想要的文字,然后选择图层样式 > 外发光 > 渐变叠加。

Photoshop教程:制作漂亮的个人博客插图(21)

Photoshop教程:制作漂亮的个人博客插图(22)

Photoshop教程:制作漂亮的个人博客插图(23)

Photoshop教程:制作漂亮的个人博客插图(24)

第9步: 新建层,选择铅笔工具,大小1px,选择白色,画条直线不透明度为64%,混合模式为柔光。

Photoshop教程:制作漂亮的个人博客插图(25)

第10步: 新建层,选择矩形选取工具(M),选择图层样式 >>渐变叠加 效果如图

Photoshop教程:制作漂亮的个人博客插图(26)

Photoshop教程:制作漂亮的个人博客插图(27)

Photoshop教程:制作漂亮的个人博客插图(28)

第11步: 在第10步下方新建层,填充白色,载入选区,选着第10步图层,向右移动1px,如图所示:

Photoshop教程:制作漂亮的个人博客插图(29)

Photoshop教程:制作漂亮的个人博客插图(30)

第12步: 选择矩形工具,创建一个矩形,选择图层样式 >>

Photoshop教程:制作漂亮的个人博客插图(31)

Photoshop教程:制作漂亮的个人博客插图(32)

Photoshop教程:制作漂亮的个人博客插图(33)

Photoshop教程:制作漂亮的个人博客插图(34)

Photoshop教程:制作漂亮的个人博客插图(35)

Photoshop教程:制作漂亮的个人博客插图(36)

第13步: 选择矩形工具,创建一个矩形,选择图层样式 >>;输入文字

Photoshop教程:制作漂亮的个人博客插图(37)

Photoshop教程:制作漂亮的个人博客插图(38)

Photoshop教程:制作漂亮的个人博客插图(39)

Photoshop教程:制作漂亮的个人博客插图(40)

第14步:现在做右边内容,选择矩形工具,创建一个矩形,选择图层样式 >>

Photoshop教程:制作漂亮的个人博客插图(41)

Photoshop教程:制作漂亮的个人博客插图(42)

Photoshop教程:制作漂亮的个人博客插图(43)

Photoshop教程:制作漂亮的个人博客插图(44)

第15步:新建层,创建一个搜索框,效果如图:

Photoshop教程:制作漂亮的个人博客插图(45)

Photoshop教程:制作漂亮的个人博客插图(46)

第16步:在第14步层下方新建层,创建矩形,选择图层样式 >>

Photoshop教程:制作漂亮的个人博客插图(47)

Photoshop教程:制作漂亮的个人博客插图(48)

Photoshop教程:制作漂亮的个人博客插图(49)

第17步:新建层。使用画笔工具(B),创建一条白线,图层样式为 >>柔光

Photoshop教程:制作漂亮的个人博客插图(50)

第18步:做翻页按钮,选择矩形工具(U)选择图层样式 >>

Photoshop教程:制作漂亮的个人博客插图(51)

注意调节细节,加上自己喜欢的图标:

Photoshop教程:制作漂亮的个人博客插图(52)

小鱼已经完成Ps制作个人博客,您呢(*^__^*) 嘻嘻……

作者: 791650988

为您推荐