photoshop电商设计(电子商务ps软件教程)-东辰网

photoshop电商设计(电子商务ps软件教程)

本文主要介绍photoshop电子商务设计(电子商务ps软件)，下面跟着东辰网详细了解一下吧。

简介:建立商业网站的简单快速教程。在本教程中，我将告诉你如何用时尚的布局方法制作一个电子商务网购网站。你可以用这个布局做任何你喜欢的电商购物平台和CMS系统。

1.开始步，你需要下载这张纹理图。

2.在PS中打开纹理图片，然后点击编辑定义模式，为图案命名，然后单击“确定”。准备工作完成后，您可以关闭文件。然后新建一个文件，大小:1100*1300px。

3.使用油漆桶工具设置图案，并选择刚刚制作的图案的纹理。点击画布得到如下图的效果；

4.使用页面顶部的圆角矩形工具创建一个圆角矩形，如下图所示。参数值半径5px，大小:330*45px。

5.将下面的图层样式添加到矩形。你可以找到渐变的颜色值。

6.请记住这个矩形图层样式，因为在下面的步骤中会多次用到。接下来，您需要创建一个搜索框，如下所示。我们开始再次使用圆角矩形工具。

7.添加下面的图层样式到这个图层。为了以后使用，您需要保存该图层样式的配置信息，并将其添加到样式库中。

8.现在你可以点击新风格按钮，并将其应用到下一个矩形样式，并添加一些文字和图标。

9.接下来，创建一个黑。

10.导航条使用下面的图层样式。并保存这种样式。

11.在导航栏中创建另一个形状，并将其栅格化。我选择使用橡皮擦工具，删除上面的形状，然后添加黄色。

12.有时候，在对页面进行切片时，需要一些焦点状态来指示当前的鼠标操作时间。这是我们接下来要做的。我们将使用矩形工具来创建按钮，并继续使用黄层样式。

13.向导航添加一些文本。如下图所示。

14.制作横幅。随着苹果网站UI设计的成功范例，越来越多的网站使用大版面横幅图片来吸引大家的关注。因此，我将在导航栏中添加一张MacBookPro笔记本电脑的图片。

15.然后在横幅图片上添加一些圆角矩形工具按钮。

16.在横幅下，创建一个白域，用于添加一些产品。

17.展示你想在这个区域展示的产品的图片。我随机整理了一些图片作为例子。

18.用直线工具在每个产品之间画一些线进行划分。这些线条可以是浅灰色的。

19.接下来，开始在左侧进行垂直导航。用圆角矩形工具制作黄色标题，在黄色标题下制作一些灰色形状。形状。如果你仔细看我的PSD文件，你会发现这些灰色的形状实际上是

It它是一个黑色的形状，

但是:的透明度很低，只有20%。您可以在图层面板中更改透明度值。

20.使用圆角矩形工具创建一些按钮，并在其中添加一些文本。

21.创建一个简单的页脚。

22.最后一步是创建一个Logo样式，如下图所示。一般情况下，网站的logo下都会有相应的标语，具体看个人需求。

23.这是最后的结果。我希望你会喜欢这个电子商务网站的布局。你可以使用本教程为不同类型的CMS创建自己的商店，如Prestashop、Oscommerce、reloaded、Magento等。