《跨境电商视觉设计-PPT演示文稿》由会员分享，可在线阅读，更多相关《跨境电商视觉设计-PPT演示文稿（63页珍藏版）》请在金锄头文库上搜索。
1、,跨境电商视觉设计,跨境电子商务 基础与实务,目录,contents,05,视觉设计认知,0 1,视觉设计认知,视觉规范化图片尺寸,要注意一些基本信息，如主图通常采用正方形，店招采用长条形等。当然系统的基础板块，与目前更新的第三方板块又有所区别，下面来看一下有哪些不同。,系统基础板块,视觉规范化的实施和应用,店招：,轮播海报：,视觉规范化的实施和应用,第三方板块,全屏海报：,视觉规范化的实施和应用,视觉规范化图片品质,前面已经了解了图片的大小，接着就来看一下图片应该使用的品质。在这一点上，速卖通与国内电商平台有稍许差别，因为需要考虑面对的客户来自世界各地，因此打开速卖通店铺的速度也是千差万别的
2、。但无论怎样，打开速度是一个不容忽视的关键。 那么如何在打开速度与保证产品清晰度上取舍呢？ 最佳建议是选择产品图80%的品质,这样一方面会降低产品图的大小，另一方面也完全可以应对客户的购物体验。,视觉规范化的实施和应用,视觉规范化图片命名,规范化命名，有利于我们对产品图片的使用和再次寻找。而往往因为图片量大的原因，一般鲜有卖家去操作。这里就展示一个简单的方法，告诉大家如何快捷地修改大量图片的名称。 首先按住“Ctrl+A”全选所有图片，如下所示：,视觉规范化的实施和应用,然后按F2键对图片重命名，直接回车即可实现对所有产品图片的统一命名即可，如下所示：,视觉规范化的实施和应用,视觉规范化其他,
3、在其他方面，需要注意一些视觉规范化的要求。例如，Logo的使用，团队名称的使用等，如下所示：,视觉规范化的实施和应用,文案策划,0 2,在视觉营销中，文案对图片起到一个相辅相成的作用。如我们经常所说的图文并茂，强调的也正是这一点。无论从产品详情的角度还是从店铺设计角度来看，在一个成功的案例中文案都是必不可少的一部分。,店招文案,店招最常见的文案方式，一般都采用团队名称或者店铺名称，当然也可以用一段口号、服务理念等。 改版之后的店招，又添加了关键词搜索功能，在这里也可以添加一些热门的关键词作为营销型文案。,除此之外，店招还可以使用店铺促销信息的文案、参加平台活动的文案，以及店铺内一些特殊优势介绍
4、的文案等。,店铺名称,设计店招要做好产品、品牌、买家的定位，要充分体现出店铺的优势，并辅以让人过目不忘的广告词。另一方面，店铺的卖点和优势也是店招中要体现出的重要元素，假如店铺经营的是品牌类商品，就可以考虑做一个个性化定制，比如支持海外仓发货或厂家直销等。最后，由于店招所处的页面位置视觉展示效果较好，也可以将一些促销活动元素假如店招图片和文字的设计中，如“年中大促”“双十一大促”“打折季”等。每年三月和八月速卖通平台有大促销活动，还可以根据不同的店铺性质自行设计一些促销活动，都可以在店招中体现出来。,店铺名称一定要通俗易懂，朗朗上口，多品类产品的店铺名称，店名可以用单一单词或简单词组，但一定要
5、简单大气。如果是经营单一的品类，则店名最好可以与产品有一定关联性，可以选择将产品的关键词包含在店名中。,海报文案,一张标准海报，一般包含一个主标题和一个副标题，如下所示：,当然，有时还会加入一些重要的参数文案或者营销性文案等，如下所示：,详情文案,详情文案有许多选择，可以按照部就班地做一个从产品实际属性角度出发的文案，也可以做一个更加灵活、富有创意、有略微故事情节的文案，或者其他更好的选择。详情页的文案直接关系到店铺内的成交转化，因此需要在此处多费一些功夫。 一是一个好的详情文案，能更好地体现产品卖点，打动顾客的心；二是好的详情文案也能提高访问深度，甚至还能起到引导购买、提高转化率的作用。,在
6、这里提别提醒一下，有一些文案可以做成图片的形式出现，但更多时候，还是建议卖家在上传详情的时候直接使用文字就好，这样才能真正算作图文并茂，有利于提高产品的搜索匹配度。,商品主图构建,0 3,商品主图构建,主图设计,当顾客在平台上进行搜索的时候，出现在他们眼前的就是产品主图。主图的作用是直接影响点击转化率。目前在速卖通平台上，主图可以分为3类。,（1）白底主图：,白底主图的优势在于：干净大气、简单明了、主体突出。还有一点是，便于我们报活动以及参加大促等。,无论是轮播海报、产品主图、还是直通车图，它们都是很重要的主图，它们设计得好与坏，甚至会直接影响转化率。,（2）边框主图：,（3）背景主图：,速卖
7、通整个平台底色都是白色，边框主图刚好能利用这一点，在众多产品中起到聚焦的作用，便于客户发现，吸引点击。,背景主图作为一个色块，吸引力还是非常大的。但往往很多卖家在使用的时候，不容易把握一个度，那就成了牛皮癣，反而会影响产品的排名。,商品主图构建,综上所述，我们就应该明白自己的店铺大致应该用何种主图，如果是报活动款，则尽量使用干净大气的白底主图，平时可以用一些简单背景主图和边框主图以增加点击转化。 同时，也应该注意避免首图容易出现的一些误区：,主体很多，没有重点。 画面杂乱，主体不突出。 图片很暗，主体不突出。 图片比例不一致，非正方形。 文字过多，遮盖主体。,商品主图构建,商品主图视觉标准,商
8、品主图构建,制作前需要准确把握速卖通平台对主图的要求，速卖通对产品主图的格式、大小等有硬性要求，具体如下： 图片格式JPEG； 文件大小5M以内； 图片像素建议大于800px*800px； 横向和纵向比例建议1:1到1:1.3之间； 图中产品主体占比建议大于70%； 背景白色或纯色，产品图片风格统一； 产品Logo建议放置左上角，不宜过大，不建议在主图上添加促销标签或促销文字。,商品主图构建,商品主图设计,（一）前期工作 1、确定主图成品标准和参考，确立拍照的姿势，为后续的照片调型找好参照物。 2、做好纠正图片偏色的准备，为后续纠正偏色放置灰卡。 3、注意拍摄细节，方便后期处理，为后续调型留出
9、衣袖和衣身的空间。 （二）主图制作的标准流程和操作方法,第一步 调整偏色,商品主图构建,第二步 调整中线,商品主图设计,CTRL+T键旋转图片，使中线与参考线平行，要注意旋转中心点的位置。,商品主图构建,第三步 抠图换背景,商品主图设计,服装通常可用选择工具结合调整边缘抠图，高要求可用钢笔工具抠图。,商品主图构建,第四步 调色,商品主图设计,a.提高亮度：添加亮度对比度调整图层。放大图片，适当调整,商品主图构建,第四步 调色,商品主图设计,b.提高饱和度：添加饱和度调整图层，调整。,c.锐化：直接滤镜锐化，或添加“复制图层-去色-高反差保留图层柔光模式”柔和锐化；,商品主图构建,第四步 调色,
10、商品主图设计,d.服装照片调色：可对照实物，通过曲线、色彩平衡等工具进行综和调色。,商品主图构建,第五步 调整服装大小,商品主图设计,调出参考图片，调整到合适大小，调整图片透明度，随后接着按CTRL+T键调出八点框，选择变形，参考调整，主要是大廓形调整。,第六步 调整细节造型,商品主图构建,商品主图设计,（三）成图 将完成标准流程处理好的图片，拉到原来做好的模板中，调整好大小。保存图片，存储格式为Web所用格式，图片选JPG格式，优化图片，保持图片大小在5M以内。,店招设计,0 4,店招设计,速卖通系统板块的店招尺寸宽度为1200px，高度可以在100150px之间，一般在设计店招的时候应该尽
11、量将店招区域充分的利用起来，将尺寸设计为1200px*150px。这样能够在尽可能大的空间展示店铺信息，店招也会显得相对大气，从而提高卖家的认可和购物体验。,在进行店招图片设计的时候首先要认识到两个问题: 1.目前速卖通系统的店招板块，只可以加入一个超链接； 2.在不同的时间段，有不同的促销方式和不同的重点推荐产品，因此店招也要随之改变。,店招设计,速卖通系统板块的店招尺寸宽度为1200px，高度可以在100150px之间，一般在设计店招的时候应该尽量将店招区域充分的利用起来，将尺寸设计为1200px*150px。这样能够在尽可能大的空间展示店铺信息，店招也会显得相对大气，从而提高卖家的认可和
12、购物体验。,在进行店招图片设计的时候首先要认识到两个问题: 1.目前速卖通系统的店招板块，只可以加入一个超链接； 2.在不同的时间段，有不同的促销方式和不同的重点推荐产品，因此店招也要随之改变。,首先进入店铺中心，单击“店铺装修及管理”，然后单击“进入装修”按钮，登录后台装修页面，如下所示：,店招设计,初次进入速卖通后台页面时，店招板块在整个页面最上方，如果之前不小心删掉了店招板块，则只需要将光标移动到最上方，右侧就会出现“添加模块”按钮，点击该按钮就可以添加店招模块。在“页面编辑”面板下出现了“基础页面”按钮，基础页面编辑最上面的模块，就是网店的店招，点击“编辑”，如下图所示：,店招设计,在
13、弹出店招编辑框内进行店招高度设置和店招上传：,店招设计,输入店招高度，点击“添加店招图片”，会弹出店招图片上传选项，选择自己制作的店招图片后上传，单机“使用这张图片”，选择“保存”，就可以成功保存自己制作的店招图片了，如图所示：,广告图设计,0 5,轮播广告海报在系统板块内的尺寸宽度为960px，高度为100-600px，对于960px宽度的广告图片来说，高度为400px在视觉效果上更加美观。图片要求无边框和水印，不允许拼图。另外，LOGO需统一放在图片左上角，约占主图的1/10。,广告图视觉标准,打开图片轮播的编辑页面，可以点击“点击添加图片”来上传图片，或者点击“添加新图片”来增加图片的数
14、量。,广告图上传,广告图设计,点击“点击添加图片”后，下方会出现上传图片的区域，您可以选择上传本机图片、从URL直接添加选择两种方式来进行。,广告图上传,广告图设计,图片上传成功后，您可以点击“使用该图片”。,广告图上传,广告图设计,可以给每张图片分别设置一个URL超链接（但必须是在速卖通网站下的链接地址），也可以通过点击右侧的箭头来调整图片的上下顺序，当然，如果您不需要某张图片或者想要替换掉，则可以直接点击右侧的X来删除这张图片。,广告图上传,广告图设计,全屏海报为店铺整个视觉效果提升了一个层次，以更大气的方式展现产品。打开全屏海报的编辑页面，复制图片url地址并粘贴在图片地址栏，复制产品链
15、接地址并粘贴在链接网址栏，操作简单明了。,全屏广告,全屏广告范例：,广告图设计,广告标签是一个已经规定好大小的板块，我们只需要按照板块的要求，制作出相应大小的图片即可。通常来说，我们会选择两个角度的图片，当鼠标划过时，第二个角度的图片会替换第一个，如图所示。图片的大小为提示的尺寸600*170。,广告标签,广告标签范例：,广告图设计,自定义模块设计,06,自定义内容区，排版灵活，可以更好地加入我们的营销想法，生动地展示产品和店铺，甚至能使店铺上升到艺术的层次，但操作难度系数比较大。 自定义板块并不局限于产品，它还可以在店铺内更直观地添加产品分组，引导消费，做一个良好的导购员，如图4-24所示。
16、,自定义内容,在基础板块中最多可以添加5个自定义内容区，在同一个自定义板块内，字符数不能超过5000个。 自定义板块的应用非常广泛，语言栏板块也属于自定义内容，首先将语言图标设计出来切片，然后加入语言链接，如图4-25所示。,自定义内容,语言链接代码如下。 意大利： 韩国： 阿拉伯： 德国： 西班牙: 荷兰语： 日语： 法国： http:/fr. aliexpress. com/store/123456 葡萄牙语： 土耳其语：http:/tr.aliexpress.eom/store/l23456 俄语： 泰语： 越南语：,自定义内容,(一)主区自定义规格,基础板块的自定义内容区的图片宽度最大为920px，高度不限，但建议不要超过3000px，如图4-26所示。原因：一是太高会影响网页展开速度；二是字符数太多容易超出规定限制。,（二）侧边栏自定义规格,在侧边栏添加一个自定义内容区，它的图片最大宽度为180px，高度不限制，
