• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • dedecms
  • ecshop
  • z-blog
  • UcHome
  • UCenter
  • drupal
  • WordPress
  • 帝国cms
  • phpcms
  • 动易cms
  • phpwind
  • discuz
  • 科汛cms
  • 风讯cms
  • 建站教程
  • 运营技巧
您的位置:首页 > CMS教程 >建站教程 > Photoshop设计国外木纹风格的网页模板

Photoshop设计国外木纹风格的网页模板

作者:站长图库 字体:[增加 减小] 来源:互联网

站长图库向大家介绍了等相关知识,希望对您有所帮助

邮件营销在现在的互联网中运用的非常广泛,很多电子商务公司都会对自己的用户进行定期的邮件传送,传送最新的产品信息等,好的邮件设计能大大的把转化率提高,让跟多的用户点击查看产品。邮件的设计有很多,接下来我们来做一个稍微特别一点的。

先来看下效果图:

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

素材包:MissYuan_教程素材.rar

1.新建一个12X12 PX的白色画布。用黑色1px大小的铅笔做出如图效果,然后 编辑--自定义图案

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

2.新建一个700X800 px的画布,填充#282828.然后新建一层,填充白色,混合模式设置为正片叠底,直线滤镜--杂色--添加杂色

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

3.用圆角矩形工具,圆角半径设置为15px,画出如图大小的圆角矩形

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

4.将木板纹理素材拉进PS里面,对圆角矩形做剪切蒙板,alt+ctrl+G,调整好大小和位置

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

5.给木板纹理添加一些图层样式

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

 

6.继续用圆角矩形工具创建一个小一点的圆角矩形,如图,模式改成正片叠底,然后傻un国际,给这个图层添加图层样式

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

7.新建一层,调出圆角矩形1的选区,用柔焦的笔刷,前景色设置为白色,在左下角点下,笔刷稍微大一点,然后选择矩形选框工具,注意一定要切换到矩形选框工具,然后方向键向上移动,然后删除选框内的内容,如图效果,最后将此图层混合模式设置为柔光

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

8.通用的方法,新建一层,调出圆角矩形1的选区,用黑色的柔焦笔刷,做出如图效果,切换到矩形选框工具,用方向键向上移动选框,然后删除选框的内容,将此图层混合模式改成柔光

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

效果如图:

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

9.用矩形工具,前景色设置为#eeeadc,做一个矩形,大小和位置如图,然后给此矩形添加图层样式

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

10.现在开始做内容部分,用素材包里面的字体,当然你也可以用其他的,打上如图的文字,你可以对Email做和我一样的蓝色到黑色的渐变,当然也可以直接用蓝色,这里就不多说了。

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

用了下面两种字体:

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

11.接下来做产品展示部分,用矩形工具,前景色设置白色,拉一个适当大小的矩形,设置图层样式,然后将产品图拖进来,对矩形做剪切蒙板

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

12.将矩形复制一层,然后旋转一定的角度

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

13.用Jenna Sue 字体和 Hand Drawn Arrow笔刷,将前景色设置为#929292,打上 Our New Product字样和刷上箭头,改变图层的不透明度,自己调,适合就行了。

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

14.用钢笔工具,选择形状模式,勾出如图形状,颜色设置为#16a5da,添加图层样式

Photoshop设计国外木纹风格的网页模板,PS教程,站长图库

分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

相关文章

  • 聊聊Bootstrap4中的网格系统
  • 宝塔面板批量设置站点404页面的方法(无需站点单独设置)
  • 详解Bootstrap中的手风琴效果
  • 总结laravel中$request获取请求信息用法
  • Photoshop制作卡通风格的3D立体字教程
  • 详解thinkphp怎么配合phpmailer实现发邮件功能
  • PhotoShop简单制作蓝色洁净星星文字效果教程
  • Photoshop制作超酷的设计类网页横幅
  • 宝塔面板 - 通过宝塔面板安装的mysql 默认密码是什么
  • Vue中Computed和Watch的用法及区别

文章分类

  • dedecms
  • ecshop
  • z-blog
  • UcHome
  • UCenter
  • drupal
  • WordPress
  • 帝国cms
  • phpcms
  • 动易cms
  • phpwind
  • discuz
  • 科汛cms
  • 风讯cms
  • 建站教程
  • 运营技巧

最近更新的内容

    • MySQL高并发生成唯一订单号
    • 织梦DedeCMS V5.7前台搜索打开慢的原因及解决方法
    • 企业网站在百度竞价中的费用问题
    • 帝国CMS下载地址不用弹窗修改方式
    • 如何解决php方法执行时间过长的问题
    • laravel-mix怎么自动压缩html模板文件
    • 一文搞定phpstorm+laravel+phpunit的配置
    • 微信小程序选择图片和放大预览图片功能
    • 详解如何提升WordPress打开前后台的速度
    • 织梦cms内容页调用评论数量的方法

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有