当前位置: 主页 > 平面设计 > PS教程 > 入门基础 > 新手入门 > Photoshop制作风格化电子商务网站

Photoshop制作风格化电子商务网站

  • 2022-01-10
  • 来源/作者: OneGreen.Org    / 佚名    
  • 4 次浏览


选择圆角矩形工具,圆角大小为3个像素,绘制矩形,完成网站整体布局的架构~

按此在新窗口浏览图片

为这些矩形添加图层样式。图层 >> 图层样式 >> 投影:

按此在新窗口浏览图片

渐变叠加:

按此在新窗口浏览图片

渐变条设置如下:

按此在新窗口浏览图片

描边:

按此在新窗口浏览图片

我们将得到如下效果:

按此在新窗口浏览图片

现在,我们来为这些矩形添加一些细节。首先,按住 CTRL 键,并点击图层。

按此在新窗口浏览图片

得到相应矩形选区。

按此在新窗口浏览图片

创建新图层,选择椭圆选框工具,并将顶部状态栏设置为“交*选区”。

按此在新窗口浏览图片

在如下位置绘制一个圆。

按此在新窗口浏览图片

这是你将得到如下选区。

按此在新窗口浏览图片

选择油漆桶工具,用白色填充选区。图层 >> 图层样式 >> 投影。

按此在新窗口浏览图片

描边,这里我们将描边大小设为5像素,位置“内部”。

按此在新窗口浏览图片

描边类型设为“渐变”,渐变条设置如下:

按此在新窗口浏览图片

?这时我们得到如下效果:

按此在新窗口浏览图片

选择 >> 修改 >> 收缩,收缩量为5像素(同描边大小相同)。创建新的图层并用白色填充选区,图层 >> 图层样式 >> 投影:

按此在新窗口浏览图片

内阴影: >

按此在新窗口浏览图片

斜面和浮雕:

按此在新窗口浏览图片

颜色叠加:

按此在新窗口浏览图片

描边:

按此在新窗口浏览图片

效果如下:

按此在新窗口浏览图片

复制图层,通过改变颜色叠加和描边设置,得到如下效果:

按此在新窗口浏览图片

添加导航按钮和导航文字。

按此在新窗口浏览图片

将事先准备好的LOGO和素材图片添加到适当位置。 ;

按此在新窗口浏览图片

最终效果如下,本教程只是起到一个抛砖引玉的作用,希望大家都能做出具有各自风格的网页。。

按此在新窗口浏览图片