Photoshop美工教程:WordPress卡通动漫主题设计

2016-02-16 08:37 12 1 收藏

下面请跟着图老师小编一起来了解下Photoshop美工教程:WordPress卡通动漫主题设计,精心挑选的内容希望大家喜欢,不要忘记点个赞哦!

【 tulaoshi.com - PS 】

最后结果

Photoshop美工教程:WordPress卡通动漫主题设计,PS教程,图老师教程网

步骤 1: 创建新的文档

Photoshop美工教程:WordPress卡通动漫主题设计,PS教程,图老师教程网

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

在ps中新建文档宽度为 1024px高度为height.

步骤 2: 焦外成像背景图片

Photoshop美工教程:WordPress卡通动漫主题设计,PS教程,图老师教程网

你可以点击此处或者点击此处学习教程 .

步骤 3: 绘制布局

Photoshop美工教程:WordPress卡通动漫主题设计,PS教程,图老师教程网

点击 圆角矩形工具(半径: 5px), 画一个 825x940在文档中间,透明度减少到60%.

Photoshop美工教程:WordPress卡通动漫主题设计,PS教程,图老师教程网

(字体: Daniel)

然后, 使用横向排版工具为你的主题添加名字(类似 My Personal Blog).

Photoshop美工教程:WordPress卡通动漫主题设计,PS教程,图老师教程网

再一次使用圆角矩形工具(半径: 5px), 在文档中间大的矩形里面画出 626x418 的图形,透明度减少到 75%. 增加 图层蒙版, 点击渐变工具, 选择 黑/白组合制作如下渐变.

Photoshop美工教程:WordPress卡通动漫主题设计,PS教程,图老师教程网

在一次使用 圆角矩形工具(半径: 5px) 画一个 81x39 的图形在坐上角. 然后, 透明度更改为50%.

Photoshop美工教程:WordPress卡通动漫主题设计,PS教程,图老师教程网

增加一些图标(类似Rss订阅和Twitter) 设置它们的 透明度为80%.

步骤 4: 绘制内容

Photoshop美工教程:WordPress卡通动漫主题设计,PS教程,图老师教程网

我们先从文章的日期开始. 点击矩形圆角工具(半径为: 5px), 画一个 76x29 的图形透明度为40%. 点击 图层  图层样式 阴影 参照如上设置.

Photoshop美工教程:WordPress卡通动漫主题设计,PS教程,图老师教程网

(使用颜色: #ffffff – #d4d4d4)

然后, 选择渐变叠加 如上设置.

Photoshop美工教程:WordPress卡通动漫主题设计,PS教程,图老师教程网

(字体: Antipasto)

增加日期数字和月份(类似 23 May).

Photoshop美工教程:WordPress卡通动漫主题设计,PS教程,图老师教程网

选择 圆角矩形工具(半径: 5px), 画一个 504x38 图形,在距离文章日期160px的下方,点击图层  图层样式 阴影. 使用如上设置.

Photoshop美工教程:WordPress卡通动漫主题设计,PS教程,图老师教程网

(Font used: Verdana)

点击 水平排版工具, 增加一些文字(像 评论, 分类, 作者) ,链接文字颜色#ffa200.

Photoshop美工教程:WordPress卡通动漫主题设计,PS教程,图老师教程网

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

(字体: Verdana)

最后, 使用横向排版工具, 增加帖子的标题(我使用意大利斜体) .

步骤 5: Adding Newset/Older Entries Links

Photoshop美工教程:WordPress卡通动漫主题设计,PS教程,图老师教程网

(Font used: Verdana)

最后一步我们写上 在文章最后面.

最终结果

Photoshop美工教程:WordPress卡通动漫主题设计,PS教程,图老师教程网

来源:https://www.tulaoshi.com/n/20160216/1570330.html

延伸阅读
标签: PS PS基础
最终结果. Lets get started 1.新文档 1100×1020. 2. 下一步我们要设置为我们的主题。 从本文顶部的资源列表中检索水下素材照片。 打开它并调整大小以适合您的模板,如下所示。 3. 使用您的圆角矩形工具半径为 10px,使类似以下内容的矩形。 我要去请参考此图层为返回内容。 您想要将它放在您的文档的中心 (参阅最终图像预览,如...
图片1 图片2 图片3 图片4 图片5 图片6 图片7 图片8 图片9 图片10 图片11 图片12 图片13 图片 14 图片15 图片16 图片17
标签: PS PS基础
最终效果图 ipad电脑图片 #3a3a3a,#111111。以增加背景的层次感。 新建图层,用矩形工具拉出一个矩形框,使用渐变来填充矩形框。 用矩形选择工具选中ipad显示屏区域,添加一些好看的图片进去 文本区域看起来很单调,最好的方法是加入一些按钮与图标等,这里先加入以个圆角矩形按钮 加入一些图标 ...
标签: 网页设计
这个Photoshop 网页设计的教程中,我们将学习设计一个整洁的具有现代气息的网站。这是设计和HTML/CSS模板转换系列教程的第一部分。     photoshop企业网页设计现代产品主题 第一部分: photoshop企业网页设计现代产品主题第二部分: 将现代产品主题企业网页由psd转换成XHTML/CSS模板 预览 以下是我们将要一些设计的页面预览,...

经验教程

517

收藏

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