1、第 1 章网店美工的基础知识网店美工实战教程（全彩微课版）1.1 什么是网店美工内容导航1.2 网店美工色彩搭配技巧1.3 页面中的文字设计1.4 网店美工文案策划1.5 网店页面的布局1.6 综合实例淘宝网店的色彩与布局欣赏31.1 什么是网店美工网店美工是指对平面、色彩、基调、创意等进行堆砌的技术人才，是一个产品级的平面设计师，通过针对性的对某一个产品或主题进行处理，使客户有购买的欲望，达到提高产品和店铺销量的效果。4网店美工是淘宝、京东、拍拍等一系列网店页面编辑美化工作者的统称，需熟练掌握各种制图软件，如Photoshop、Coreldraw、Illustrator等，熟悉页面布局，了解
2、产品的特点，并准确判断目标用户群的需要，以设计出吸引眼球的图片。网店美工不仅需要处理图片，还需要良好的理解能力，能够洞悉策划方案的意图，并在其中加入自己的创意。1.1.1 网店美工的定义51.1.2 网点美工的工作范畴 网店美工主要负责网店的店面装修，以及产品图片的创意处理。掌握店铺特色商品的美化店铺的装修与设计活动页面的设计推广的了解与应用6扎实的美术功底、良好的创造力，对美好事物有一定的鉴赏能力，图像处理与设计能力，熟练使用Photoshop、Dreamweaver、Flash等设计软件。通过图片、文字、色彩搭配准确地向客户表达出产品的独特性并挖掘客户潜在需求，从运营、推广、数据分析的角度
3、思考如何提升图片的点击率和转化率，引起卖家的购买欲望。1.1.3 网店美工的技术要求7 网店装修不只是将商品摆放到网页中，而是将产品的卖点、特征，以及产品的使用或穿戴效果都体现出来。装修的关键在于如何通过图片让卖家感受到实体店的体验效果。1.1.4 店铺装修应遵循的基本原则1234突出行业属性产品分类明确色彩搭配协调简洁时尚大方8 图像的分辨率决定了位图图像细节的精确程度，往往是图像的分辨率越高，成像后的尺寸就越大，对应的图像也就越清晰。 1. 图像分辨率1.1.5 网店美工需掌握的图像知识9PSD包含多种颜色模式，能够自定义颜色数并加以存储，还可以保存图像的图层、通道和路径等信息，是目前唯一
4、能够支持全部图像色彩模式的格式。一种基于LZW算法的连续色调的无损压缩格式，其压缩率一般在50%左右；适合以色块或单色为主的画面， 不适合用作高显示质量的图片。GIFJPEG在提供良好压缩性能的同时，具有较好的重建质量，被广泛应用于图像、视频处理领域，效果较GIF和PNG格式有明显的优势。PNG替代GIF和TIFF格式。存储灰度图像时，灰度图像的深度可多达16位；存储彩色图像时，彩色图像的深度可多达48位，并且还可存储多达16位的通道数据。1.1.5 网店美工需掌握的图像知识2. 文件格式101.1.6 网店美工需注意的问题 产品的信息、注意事项、卖点、劣端和怎么让劣端变成优势等，都是网店美工
5、需要注意的问题。风格与形式相统一做好文字与图片的前期准备突出主次装修时机的掌握思路清晰111.1 什么是网店美工内容导航1.3 页面中的文字设计1.4 网店美工文案策划1.5 网店页面的布局1.2 网店美工色彩搭配技巧1.6 综合实例淘宝网店的色彩与布局欣赏121.2 网店美工色彩搭配技巧色彩是卖家对网店好坏最直接的了解，也是网店统一设计风格的重要组成部分。一个网店的成功与否，在很大程度上取决于页面色彩的运用效果。色彩的搭配技巧包括色彩原理、色彩的分类、色彩的属性、色彩的对比以及色彩的搭配等方面的内容。131.2.1 色彩的原理 自然界中绝大部分的可见光谱可以用红、绿、蓝三种光按照不同比例和强
6、度的混合来表示，将它们混合在一起可以搭配出各种各样的色彩，如青、黄、洋红。光源（G）光源（B）光源（R）14白、亮灰、浅灰、亮中灰、中灰、灰、暗灰、黑灰、黑等颜色，常用于办公用品店铺。红、橙、黄、绿、蓝、紫等颜色，常用于服装、鞋包、珠宝、美妆等类别的商品店铺。（1）无彩色（2）有彩色1.2.2 色彩的分类151.2.3 色彩的属性01OPTION02OPTION03OPTION不同的颜色具有不同的明度，在一个画面中可以通过协调不同明度的颜色来表达画面的感情， 黄色明度最高，紫色明度最低，绿、红、蓝、橙的明度相近，为中间明度。明度色彩的不同是由光的波长的长短差别所决定的，而色相就是指这些不同波长
7、的色彩情况，各种色彩中，红色是波长最长的颜色，紫色是波长最短的颜色色相纯度指的是色彩饱和程度，光波波长越单纯，色相纯度越高，相反，色相的纯度越低。不同的色相不但明度不等，纯度也不相等。纯度161.2.4 色调对比色调对比主要指色彩的冷暖对比。除了色调的对比，还有明度对比、色相对比和纯度对比。123123明度对比色相对比纯度对比171.2.5 色彩的搭配白色系，结婚、卫生用品黑色系，相机类数码产品181.2.5 色彩的搭配绿色系，护理类蓝色系，家具类191.2.5 色彩的搭配红色系201.1 什么是网店美工内容导航1.4 网店美工文案策划1.5 网店页面的布局1.2 网店美工色彩搭配技巧1.3
8、页面中的文字设计1.6 综合实例淘宝网店的色彩与布局欣赏211.3 页面中的文字设计文字是设计中不可缺少的部分，与色彩相辅相成。文字的一切变化和形式都要同店铺页面的风格相结合，不要因一味的追求新潮，而让买家读不懂或是不能理解卖的是什么，那样会减少店铺页面的宣传力度，导致流量的流失。字体是为店铺服务的，让买家看的舒服、易懂其重要原则。221.3.1 文字的分类宋体黑体书法体美术体23根据风格选择文字字体增强文字的可读性增强排版的美观度1.3.2 文字在网店中的运用241.1 什么是网店美工内容导航1.5 网店页面的布局1.2 网店美工色彩搭配技巧1.3 页面中的文字设计1.4 网店美工文案策划1
9、.6 综合实例淘宝网店的色彩与布局欣赏251.4 网店美工文案策划网店与实体店一样会不定期举行促销活动，如聚划算、淘抢购、新品上线、满减等，这些活动不仅需要大量的图片来进行展示，还需要添加必要的说明文字和宣传文字，以便更好地突出产品的特点，达到一目了然的目的。在一些规模较大的网店中，文案策划是一个单独的职位，而往往很多中小卖家的店铺，网店美工也需要兼职文案的工作。26123突出卖点1.4.1 文案在美工中的重要性抓住买家的购买心理增强品牌力度271.4.2 文案的策划受众群体目的主体视觉表现281.4.3 文案的前期准备123从基本信息中找到卖点了解同行信息资料的准备291.4.4 文案的写作
10、要点写作要点彰显定位，增强消费信心低价产品，强调品质高价产品，强调价值巧妙对比，突显专业有的放矢，减少卖家困惑15432301.1 什么是网店美工内容导航1.2 网店美工色彩搭配技巧1.3 页面中的文字设计1.4 网店美工文案策划1.5 网店页面的布局1.6 综合实例淘宝网店的色彩与布局欣赏311.5 网店页面的布局网店页面主要包括首页和详情页，其中首页是店铺装修中必不可少的一部分，它几乎涵盖了店铺的所有信息，是店铺商品的展示页面，也是买家查看商品的主要途径，其好坏直接影响店铺的浏览量。详情页主要用于对产品信息进行详细介绍，对商品的转化率起着至关重要的作用。321.5.1 首页布局页头页中：轮
11、播海报与分类导航331.5.1 首页布局页尾：二维码、标语、返回首页等。341.5.2 详情页布局1. 购物区效果2. 商品基本信息351.5.2 详情页布局3. 模块区364. 商品描述区1.5.2 详情页布局371.1 什么是网店美工内容导航1.2 网店美工色彩搭配技巧1.3 页面中的文字设计1.4 网店美工文案策划1.5 网店页面的布局1.6 综合实例淘宝网店的色彩与布局欣赏38 通过对“三只松鼠”进行鉴赏，学习其色彩搭配方法，然后根据布局了解店铺的合理性，并通过对详情页的浏览掌握其吸引买家购买的方法。1.6 综合实例淘宝网店的色彩与布局鉴赏391.6 综合实例淘宝网店的色彩与布局鉴赏
12、（1）查看首页中的页头、页中和页尾，包括查看其对应的店招、导航等内容，并对其中的文字字体进行分析，掌握不同的字体应用的范围；完成后对图片中的促销术语进行了解，从术语中分析“三只松鼠”的卖点，并通过单个物体的摆放和处理效果，掌握美化图片的方法。 （2）通过详情页，查看详情页中留住买家的方法以及产品的卖点，该卖点可通过详情页中的描述区进行掌握，“三只松鼠”的描述区主要是通过可爱的松鼠，加上天然的产品和精良的制作工艺，体现产品的自然和卫生，从而促进购买。1. 设计思路402. 知识要点1.6 综合实例淘宝网店的色彩与布局鉴赏掌握三字松鼠搭配文字与色彩的方法，并从中得到启示，为后期的制作做好准备。掌握“三只松鼠”吸引买家购买产品的方法，从本质中找到卖点，从而促进销售。41（2）首页布局1.6 综合实例淘宝网店的色彩与布局鉴赏3. 操作步骤（1）Logo欣赏42综合实例（3）分类罗列（4）页尾，强调品质43综合实例（5）促销信息（6）品质卖点（7）安全、卫生44课后习题（1）鉴赏淘宝网中的店铺页面，如“妖精的口袋”，分析颜色和文字的排版与编辑是否合理。（2）分析店铺中产品的文案，并尝试自己进行编写，并对店铺页面的布局进行了解，掌握其布局方法。45谢谢观看网店美工的基础知识网店美工实战教程（全彩微课版）
