《移动端店铺装修、运营与推广.html.pdf》由会员分享，可在线阅读，更多相关《移动端店铺装修、运营与推广.html.pdf（433页珍藏版）》请在三一文库上搜索。
1、前言 随着移动端设备的盛行，在网上购物的方式也发生了根本性的变化。智能手机的普及，使移动端购物远远超过了电脑端购 物。既然移动端店铺已经壮大并变为主流购物方式，那么对于移动端网店的要求也就越来越高，单纯的商品罗列已经不能吸引买 家的眼球，对其进行精致的装修至关重要。 对于买家而言，最能直接引起购买欲望的除了价格和产品特色以外，还有整体网店的装修格局和配色。这两点也可以大大刺 激买家的购买欲望。对于卖家而言，能够产生经济效益的店铺才是好的店铺。在价格与特点都大体相同的情况下，好的移动端店 铺装修界面是提升卖点的保证。 现在市面上流行的网店装修书籍，大多数是以理论和实例两种形态存在的，本书则是将两
2、者的特点合二为一，使网店经营者 不仅可以了解装修的理论，还可以通过书中大量的实例来完成实践操作的过程，在学习时少走弯路。 本书集作者多年丰富的电商教学经验及网店经营与装修的实际设计工作经验于一体，通过阅读本书读者可以快速学到网店装 修过程中的经验和技巧，解决开店装修中的难题，提高开店水平，快速成为网上销售高手。 本书特点 本书内容较为丰富，由浅入深，力争涵盖网上店铺装修中的全部知识点。主要特点如下： 内容全面，几乎涵盖了移动端网店装修所涉及的视觉图像、配色和整体店铺装修的各个方面。 理论与实践相结合，书中实例的运用都是以软件某个重要知识点展开，使读者更加容易理解和掌握，从而方便知识点的记 忆，
3、进而能够举一反三。 书中关键的功能及实例部分都配有相应的视频，可以让读者更快、更轻松地掌握网店装修知识。 配套PPT课件，让学习更加轻松。 本书章节安排 全书共9章，依次讲解了移动端网店前期企划、移动店铺设计要领、图像处理基础、移动端网店可装修区域的图像制作、移 动端店铺首页装修实战、自定义页面设计、自定义菜单的制作、微海报制作、手机公众号与微淘推广等。 云下载 本书的视频、素材、源文件和PPT课件的下载地址为： http:/ 若下载有问题，请发送电子邮件到，邮件主题为“移动端店铺装修、运营与推广”。 本书主要由罗庚、陆沁和葛久平编著，同时参与编写工作的还有王红蕾、时延辉、戴时影、潘磊、王君赫
4、、刘冬美、尚彤、 葛久平、孙倩、刘绍婕、殷晓峰、张叔阳、赵頔、张猛、齐新、王海鹏、刘爱华、胡渤、张杰、张凝、周荥、周莉、陆鑫、金 雨、刘智梅、黄友良、张希、蒋立军、蒋岚、蒋玉、苏丽荣、谭明宇、沈桂军、关向东、刘丹、王凤展、卜彦波、袁震寰、田秀 云、霍红等。由于作者水平有限，书中疏漏之处在所难免，敬请读者批评指正。 编者 2017年11月 第1章 移动端网店前期企划 随着移动端设备逐渐普及，在移动端开设电子商务店铺已经不是什么新鲜事了，随时随地不受限制的方便模式，也正好符合 现在年轻人的使用观念。开设并装修一个属于自己风格的移动端淘宝店铺，不但可以方便浏览者进行随时随地进行购买，还可以 为卖家增
5、加一部分不可小觑的收入。 重点提示 什么是移动端店铺 移动端店铺的组成元素 移动端店铺的制作流程 正所谓市场有需求就会有供给，既方便买家又方便卖家的移动端店铺不仅仅是电脑端淘宝店铺的一个补充，很多时候这种微 运营的收入已经超过了淘宝店铺的收入，如图1-1所示。 在进行移动端店铺企划前，首先要对移动端店铺中的相关知识、制作流程、页面组成及一些专有名词有初步的认识。虽然现 在的店铺装修设计都是强调专业分工，可是若团队中的每一位成员都能具备上述的基本知识，对于团队的合作效率绝对有加分的 作用。本章主要对移动端店铺流程中的各个部分做重点式的讲解说明，以便让初次进入移动端店铺装修领域的用户有遵循的依 据
6、。 图1-1 移动端店铺与电脑端店铺占有比例 1.1 什么是移动端网店 移动端网店顾名思义就是，随身携带的手机、ipad等移动端设备中经营的网店，与电脑端相比最大好处就是方便。无论是 手机还是ipad，如果想装修一个个性十足的店铺的话，必须要在电脑端进行操作，之后再通过移动端设备进行管理，淘宝网专 门为移动设备开启了一个手机淘宝店铺功能。 移动端店铺有着其他微店所不具备的资源，即它有淘宝“这棵大树”作为后盾，本身在淘宝店铺中就已经有一些固定的客户 了，再通过手机的便利条件绝对会增加更多的流量并带来经济效益。 当所有的宝贝界面装修完成后，接下来就要让客户通过移动网络连接到我们设计的网店上浏览，此
7、时放置宝贝及相关元素的 页面就是移动端网店店铺了，如图1-2所示的图像，便是网络、移动端店铺，以及各个装修页面之间的关系。 图1-2 移动端店铺的关系 其中的内容说明如表1-1所示。 表1-1 移动端网店组成名称与内容 温馨提示 为了减少买家与卖家使用手机产生的流量费用，建议大家在WIFI环境中进行浏览及管理。 1.2 移动端店铺的组成元素 移动端店铺页面中的主要组成元素有图片、文字及超链接等，其中文字和图片是用来表达手机网上店铺的商品资料内容。当 然，移动端店铺中不能只有一个页面，此时页面与页面之间的相互链接就担负起了整个网店的串联工作。 1.2.1 移动端店铺中的图片 图片是移动端店铺中的
8、重要组成元素，主要用来宣传店铺、吸引买家眼球及展示店铺中宝贝效果等，宣传部分可分为店标、 店招等，吸引眼球部分可分为单列图像、双列图像、焦点图、新客与老客图像、活动头图像、多图片图像、左文右图等，如图1- 3所示。 图1-3 移动端店铺中的图片 1.店标 在开张的淘宝移动端店铺中，店标通常指的是网店的核心标识，也就是店铺的Logo，文件格式有gif、jpg、png，文件大小 保持在80K以内，建议尺寸为80像素80像素。 对于一个店铺而言，店标有着相当重要的地位，大到国际连锁品牌，小到零售网店，都会有自己的独特标志。标志能够代表 一个品牌，一种形象，更能够给顾客留下深刻的印象，并稳定扩展自己的
9、客户群，淘宝店标正是担当这一重要目标的载体，代表 着店铺的风格。移动端淘宝店标与电脑端淘宝店标使用的是同一个，在移动端店铺中通常放置在店招的左下角位置。如图1-4所 示的图片为移动端网店店标，如图1-5所示的图像为一些参考Logo。 图1-4 店标 图1-5 参考Logo 温馨提示 店铺中的店标规格大小为80像素80像素，如果直接在Photoshop软件中设计，图片太小，放大处理会出现像素块效果，为 了更好地编辑图像，我们可以新建一个与80像素80像素等比例缩放的图像文档，如500像素500像素，制作完毕后，再将其缩 小为80像素80像素即可，优点是便于编辑。 2.店招 移动端店铺店招与电脑端
10、淘宝店铺的店招作用一样不需要门面，所以店招就是店铺的门面，即虚拟店铺的招牌。店招一般都 有统一的尺寸要求，以淘宝网中的移动端店铺来说，大小为642像素200像素，格式为jpg、png。对于自己的门面当然是越吸 引人越好，所以移动端店铺同样需要网店美工，一个好的店招完全可以体现出本店的特点和所售产品，如图1-6所示。 图1-6 店招 3.宣传店铺商品的广告 在移动端店铺中起广告宣传作用的当图片莫属，在细分的各种图片模式中，目的还是为了吸引买家的目光，从而增加店铺的 流量，好的图片广告效果绝对会直接或间接地增加店主的收入，如图1-7所示。 图1-7 宣传店铺商品的广告 1.2.2 移动端店铺中的文
11、字 文字作为移动端店铺中的重要组成元素，主要用来对宝贝图片进行辅助说明、担任店铺公告或者参与图片进行美化主题等， 如图1-8所示。 图1-8 移动店铺中的文字 1.2.3 移动端店铺中的链接 如果移动端店铺没有链接，那么最终显示给消费者的就是一个主页，其他的页面都不会被浏览者看到，换句话说，没有链接 的网店就是一个失败页面，根本就不能称之为网店。正确的方式是要有页面来作为浏览者最先看到画面，接着再利用此页面中的 超链接来继续浏览其他页面，浏览者最先看到的网店页面称为首页，其他的页面则是在首页的基础上出现的自定义页面，自定义 页面之间也是存在链接交互的，如图1-9所示。“首页”也是一个单纯的网店
12、页面，只是首页具有给浏览者最先接触的特性，因 此设计者通常会对首页上的美化及网店主题性特别下功夫，以便给人良好的印象，从而为店铺增加流量和利益。 图1-9 移动端店铺中的链接 1.3 移动端店铺的制作流程 移动端店铺制作流程是指从设置主题、整体风格、建立网站架构、店铺页面组件设计，一直到最后的店铺维护与更新等一系 列的步骤。如图1-10所示为移动端店铺设计与装修的主要流程架构及其细部内容。 图1-10 移动端店铺设计与装修流程图 1.3.1 规划时期 规划时期是移动端店铺在搭建之前的作业，无论是针对企业或个人网上店铺，都少不了这个时期。其实对于移动端店铺设计 而言，就好比为客户做项目一样，必须
13、经过事先的详细规划及讨论，然后才能凭借团队合作的力量，将用于移动端的店铺成果呈 现出来。 1.设置移动端网店的主题及客户群 “移动端网店主题”是指移动端网上店铺的内容及主题诉求。以服装移动端店铺为例，具有时尚女装主题、将时尚女装作为 主题，针对年轻女性而展现的全方位服装店铺为网店客户群诉求，如图1-11所示。 图1-11 主题鲜明的移动端网店 至于“客户群体”可以解释为会进入移动端网店页面的主要对象，就好像商品交易的市场调查一样，一个越接近主客户群的 产品，其市场的接受度也就越高。同样的宣传主题，但是针对的人群不同，在设计时就要考虑不同的页面风格，只有这样才能更 加贴近客户群体，从而使自己制作
14、的移动端网店更加具有竞争力。如图1-12所示为针对儿童服装的移动端店铺。 图1-12 针对儿童服装的移动端店铺 其实为移动端搭建网上店铺也算是商业行为的一种，要怎么让移动端店铺具有高浏览率是在设计之前的规划重点，虽然我们 不可能为了设计一个移动端店铺而进行市场调查，但是若能在移动端店铺建立之前，先针对“网店主题”及“客户群体”多与客 户及团队成员讨论，以取得一个大家都可以接受的共识，必定可以让这个移动端店铺更加成功。同时也不会因为移动端店铺内容 不符合客户的需求，而导致人力、物力及财力的浪费。 2.绘制移动端网上店铺的页面规划 移动端网上店铺页面规划架构图是整个移动端店铺的组织结构，也可称之为
15、店内中页面的分类方式，我们可以根据“网店主 题”及“客户群体”来设计出移动端网上店铺中需要哪些页面来放置商品及数据。这里按照“户外商品”的移动端网上店铺作为 规划，为其设置一个“首页”和4个二级页面，如图1-13所示。 图1-13 移动端店铺的页面规划 3.链接交互设计 浏览导航就像是商场中的不同店铺，这些导航会导引大家到想要去的地方而不会走错。不过微网页上的链接就不能这么直观 地来引导浏览者，此时链接按钮的设计就显得非常重要。 垂直链接顺序 垂直链接顺序是将所有的导航功能放置于首页页面，用户必须回到首页之后，才能继续浏览其他页面，优点是设计容易，缺 点则是在浏览上比较麻烦。如图1-14所示图
16、像中的箭头符号就是代表浏览者可以链接的方向顺序。 图1-14 垂直链接顺序 垂直与水平链接顺序 水平链接指的是在可以同级页面之间互相链接，同时具有水平及垂直链接顺序的导航设计，优点是浏览容易，缺点是设计比 较复杂，如图1-15所示。 图1-15 水平与垂直链接顺序 温馨提示 不管采用哪种设计，都要经过详细的讨论与规划，在每个页面中都放置可直接回到首页的链接。 4.设置移动端店铺的整体风格 页面风格就是移动端店铺页面的美术效果，这里可再细分为“首页”及“二级页面”的画面风格，其中“首页”属于移动端 店铺的门面，一定要针对“移动端店铺主题”及“客户群体”两大需求来进行设计；至于“二级页面”，因为是
17、放置移动端店铺 中的各项内容，所以只要风格与“首页”保持一致即可，界面不需要太花哨，否则会让浏览者感觉无所适从，找不到重点。 在移动端店铺图像广告设计中颜色搭配最好保持在三种色系以内，这样的页面看起来会非常轻松，使浏览者不会产生厌烦 感。 另外，各个页面中的链接文字或图片数量则是依据“移动端店铺主题”进行设计的，在此建议先在纸上绘制相关草图，再由 客户及团队成员共同决定，最后将其设计成微网站效果。这样可以减少反复修改的麻烦，也会让客户有一种被重视的感觉。 5.前期预算 预算费用是移动端店铺设计中最不易掌控的部分。无论是移动端店铺布局、图像编修，还是请专人设计相关组件、视频动 画、店铺动态等，都
18、是必须支出的费用。无论如何，大家都要将可能支出的费用及明细详列出来，以便进行预算费用的掌控，这 样做的好处是尽量避免后期与客户产生经济纠纷。 6.工作分配及制定时间表 专业分工是目前市场的主流，在设计团队中每个人依据自己的专长来分配移动端店铺开发的各项工作，除了可以让移动端店 铺内容更加精致外，还可以大幅度缩减开发时间。 不过专业分工的缺点是进度及时间较难掌控，因此在分工完成后，还要再制作一个开发进度的时间表，将各项设计的内容与 进度做详细规划，同时在团队中也要有一个领导者专职进度掌控、作品收集及与客户的协调工作，以确保每个成员的作品除了风 格一致外，也可以满足客户的需求。 7.关于主题移动端
19、店铺的资料收集 以建构一个户外商品移动端网上店铺为例，商品照片、文字介绍及店铺Logo等，必须由客户提供。大家可以根据移动端上 店铺架构中各个页面所要放置的数据内容，列出一份详细数据清单，然后请客户提供，此时可以请团队中的领导者随时与客户保 持联系，作为成员与客户之间沟通的桥梁。如图1-16所示为“户外商品”移动端网上店铺。 图1-16 移动端网上店铺 1.3.2 设计时期 设计时期己经进入到移动端店铺实际制作的部分，这里最重要的是后面的整合及校正错误，如何让客户满意整个移动端店铺 的作品；如何呈现整个移动端店铺中页面的功能；如何掌握微页面之间的链接，都会在这个时期决定。 1.移动端店铺设计稿
20、 最初的移动端店铺设计版面，应该先与客户沟通完毕后设计一个最原始的版面，与客户达成共识后，再进行页面中各个组件 的精确设计。 2.店铺页面组件设计 在进行移动端店铺设计之前，可以先将移动端店铺店招、素材图案、用于宣传的广告图像及视频动画设计好，最后进行移动 端店铺效果组合。其实这个部分就算是各个成员的工作内容，而分工的目的也在于此，每个人因专长的不同来设计移动端店铺组 件，同时也将客户所提供的照片进行调整，文字作文案的修饰，等一些素材都完成后，最后就是页面的整合。 3.店铺页面设计以及校正错误 到此步骤才能算是移动端店铺设计，也才会真正运用到手机淘宝装修功能。我们在手机淘宝装修中装修首页、新建
21、自定义页 面及店铺动态页面等，然后将各个成员设计好的部分在此进行整合，以完成整个移动端店铺的搭建。手机网上店铺完成后，还必 须按照客户的意见进行进一步的修改，以及针对手机网上店铺中所有的功能内容进行测试，确保整个手机网上店铺内容都正确无 误。 因此，在设计工作时间表时，要记得将测试时间加入到时间表中，免得移动端店铺设计完成后，却没有测试的时间了。 1.3.3 保存与发布时期 保存与发布时期就简单很多，这里只是将整个移动端上店铺内容在淘宝装修页面中进行保存并发布，再通过手机扫描二维 码，就可以将手机网上店铺中的效果到展示在手机中。 1.在电脑端保存并发布 在淘宝网上装修的移动端店铺，绝大多数还是
22、在电脑中进行保存并发布操作的。 2.在移动端淘宝中可以查看店铺效果 在淘宝网上装修的移动端店铺，可以直接在手机淘宝APP中扫描二维码进入当前的手机网上店铺，也可以在手机淘宝中直接 查找店铺的方式来进入手机网上店铺进行浏览。 将生成的二维码打印出来，或者将其与其他的平面媒体放在一起，好的广告及营销手法可以增进商品的市场占有率。 1.3.4 维护更新时期 定期对移动端店铺做内容维护及数据更新，是维持移动端店铺竞争力和宣传自己的不二法门。我们可定期或是在特定节日 时，改变移动端店铺的风格样式，这样可以维系移动端店铺带给浏览者的新鲜感。而数据更新就是要随时注意的部分，避免商品 在市面上已流通了一段时间
23、，但移动端店铺上的数据却还是旧数据的状况发生。 另外，移动端店铺内容的扩充也是更新的重点之一。移动端店铺创建初期，其内容及种类都会较为单一。但是时间一久，慢 慢就需要增加内容，让整个移动端店铺数据更加完备，关于这方面，建议大家多去参考其他同类型的移动端店铺，或是相关数据 书籍，勤做笔记与多下功夫，才能真正让自己的移动端店铺源远流长，立于不败之地。 第2章 移动端店铺设计要领 移动端店铺设计是设计作品的一种，除了内容主题的文字与图像之外，同时也要考虑到页面布局及配色的美观性，让每位浏 览者都能对移动端店铺印象深刻。本章主要对有关页面的内容布局、配色，以及一些注意事项作说明，同时介绍使用于移动端网
24、 店设计的几种图像格式类型，以加强对移动端网店制作的知识。 重点提示 页面内容整体布局 布局组成图像中的文案编辑 图像在设计中的应用 页面图像配色与编修要领 店铺页面安全色 常用移动端网店图片格式 装修导览图 2.1 页面内容整体布局 页面内容布局是指在整个页面中，各种元素的比重分配与摆放位置。按照不同店铺的风格，不同的主题就有不同的编排方 式，只要是能呈现主题风格与方便浏览者阅读，就是一个好的编排方式。 2.1.1 移动端页面固定区域与可编修区域 在对移动端网店进行布局设计时，大体的布局可分为固定区域和可移动区域，固定区域就是网店中的店标和店招，虽然可以 对内容进行设计，但是在店铺中的布局摆
25、放位置是不能变的；可移动区域指的是店铺中进行宣传的焦点图或广告图、吸引客户的 销售排行、增加客户购买欲望的店铺活动或优惠券等。移动端页面固定区域与可编修区域的大致规划如图2-1所示。 图2-1 固定与可移动区域 2.1.2 非固定区域布局 目前的布局版式主要有在一屏内先显示“排行榜”再依次排入其他内容；也有先排入“焦点图”的，以动感的画面吸引买 家；还有将制作的广告画面直接用于一屏的，目的是通过视觉快速吸引买家的目光，以此来提升店铺的流量。不同的版式排序在 整体布局中都会按主题的不同，而各自出现相应的变化，如图2-2所示。 图2-2 移动端店铺版面布局 温馨提示 有些移动端网店会使用其他形式的
26、设计分类页面，例如双图或多图模块、自定义模块等都能作为首屏进行布局开头，如图2- 3所示。 图2-3 其他模块布局 2.2 布局组成图像中的文案编辑 一个合格的网店美工不但要懂得将图像进行美化，还要掌握整个作品中文案的作用，在设计时可以将文案当成一个设计元素 参与到整体效果中。 好的文案不但能为商品本身带来详细的介绍，还能兼顾整体广告创意的一部分。从广告上来说就是将你的产品卖点通过文字 渗透入买家的思维中，让他接受你认同你从而购买你。 而要做好一个网店美工的文案，你可能不仅仅要懂得文字上的知识或者技巧，你还要了解一些网店中图像的处理知识。要能 和美工更近的沟通，让美工将你的文案想法成为图片展示
27、出来才是成功的关键。 2.2.1 为什么要做文案 移动端店铺中涉及的文案通常都会与商品本身图片进行相辅相成。店铺的推广不仅仅在于一些网店推广方法的运用，文案也 是其中一条重要的影响因素。华丽而不失浦雅、自然而不失人气的店铺文字，可以大大提高宝贝的转化率。优秀的文案策划，不 仅仅要做文字功，还要用文字来引导销售，与主体图像相呼应。完全融入整张图片中，作为整体创意的一部分，同时起到吸引眼 球的作用，如图2-4所示。 图2-4 文案 2.2.2 文案怎样写 首先就是说要清楚为什么要写与图相对应的文案？必须符合产品的整体营销战略。是单独使用还是和其他文案组成一个系 列？在整个广告活动中我写的这篇文案担
28、负着什么样的任务？是前期概念宣传？还是直接推动卖货？还是传达促销信息提高销 量？ 对自己提出以上的疑问后，已经了解写文案的目的就是卖货，文案的作用就是与消费者进行“深度沟通”，让每一句话说到 消费者心坎里。文案的主题就是市场营销策略围绕消费者展开，软文要配合营销战略，针对消费者猎奇、治疗、健康、美容等心 理展开。每篇软文只能有一个主题，我们常常用一个系列、一个阶段的软文围绕一个主题（在一定阶段内），用各篇软文组成一 个系列，围绕一个主题进行话题炒作，如图2-5所示。 图2-5 文案 2.2.3 文案在图像中的布局 对于网店美工的文案布局大体可以分为对齐布局、参照布局、对比布局及组合布局4种，每
29、种布局都有自己的特点，下面就 看看这4种布局的具体使用。 1.对齐布局 文案对齐布局在常规中通常会以边对齐和居中对齐两种形态存在，每种对齐方式都是与产品本身图片作为依据的。 边对齐在淘宝美工中使用通常会以文本的一端作为对齐线，使文本与整体看起来给人以稳重、力量、统一、工整的感觉，是 淘宝中最常见的一种文案布局方式，如图2-6所示。边对齐比较适合新手操作，只要掌控画面整体，文本部分在主体边上只要注 意对齐即可。 图2-6 边对齐 居中对齐在淘宝美工中使用通常会以文本的水平居中位置作为对齐线，或者文本与整个画面进行居中对齐，使文本与整体看 起来给人以正是、大气、高端、有品质的感觉。在淘宝海报中居中
30、对齐通常要把文字直接打在商品上面，文案部分的遮挡会与主 体部分形成一个前后的感觉，看起来更加具有层次感，在不遮挡主体时，单纯的文字居中对齐，同样会使整张海报具有大气上档 次的感觉，如图2-7所示。 图2-7 居中对齐 2.参照布局 参照布局通常是指根据美工得到图片的类型，将文本部分与图片特点进行合理位置布局的方法，根据主图的特点文本在图像 中主要起到平衡整体的作用，如图2-8所示。此布局方法不适合初学者。 图2-8 参照布局 3.对比布局 在一幅作品中如果不体现对比，那么就不能说此作品中存在设计，人们是不喜欢欣赏平淡无奇的东西的。 使用有对比效果的排版技巧，可以瞬间增加画面的视觉效果，对比原则
31、包含的内容很多，比如虚实对比、冷暖对比、字体粗 细对比等，如图2-9所示。 分析：在两张海报的对比中，可以发现第二张图片运用了对比原则，使画面更加吸引人，文案的组织结构也是一目了然，更 便于浏览者阅读。 图2-9 对比布局 注意 找出文案中重点的语句，运用大小对比和粗细对比，加强文字的强调和区分。 字体部分如果要对比就要选择对比较分明的字体，既然要对比就要显示出大的够大、小的够小、粗的够粗、细的够细，让 浏览者更加容易记住。 对比不光增加视觉效果，而且还加强了文案的可读性，不要担心字小而错过浏览者的阅读，只要强调的部分吸引住了顾 客，下面的小文字会下意识的进行阅读。 对比还可以通过文本以背景的
32、高反差效果进行显示，背景如果按不同的颜色形状进行绘制，上面的文字与背景色作为对比 参照物，这样更能吸引浏览者，加强整体视觉效果。 4.分组布局 在图像中如果存在的文案过多时，就不能单纯地使用对齐加对比等布局效果了，此时只要将文本进行一下分类，将相同的文 本信息文案摆放在一起，这样不仅使整个画面看起来有条理，而且也非常美观，更加有利于浏览者阅读。每个分类可以作为一个 元素进行重新的布局，如图2-10所示。 图2-10 分组布局 2.2.4 活动文案 网店美工的活动文案与纯文本的软文文案不同，需要与素材图片相结合配合当前活动的要求，设计上还要与整体相呼应不能 有违和感，例如店庆活动、节日活动等等，
33、既要简练又要凸出主题，对于网店美工来说是比较考验设计能力的，如图2-11所示 的效果即为融入整体的活动文案。 活动文案的目标就是为了带动流量、提升销量、增加知名度等。在撰写活动文案时要体现以下几个要点。 1.活动介绍 活动介绍包括活动主题、活动时间、活动地点、目标人群、活动目标、活动背景介绍（如主办方、协办方）等。 2.活动规则 活动规则包括活动具体的参与办法、面向人群、具体的奖项设置、评选规则和办法等。 图2-11 活动文案 3.活动实施 活动实施要说明活动的具体实施步骤、具体的时间及大概折扣或奖项内容。 4.趣味性要强 活动的趣味性越强越好，只要活动好玩有趣，参与的人才会多。活动的氛围烘托
34、起来之后，自然就达到了活动文案的目的。 5.得到实惠 只有在文案中，让买家看到本次活动中的让利力度，才能真正调动起买家的积极性。销量增加了，卖家同样也就会得到属于 自己的那部分利益，互利互惠才能更好地将活动持续下去。 2.3 图像在设计中的应用 移动端网店对广告图像进行设计时，通常会起到在视觉中传达第一视点的作用，从传统的整体图像参与设计到局部参与设 计，再到多视角参与以及超出范围进行设计制作，无论是哪种，最后的目的都是为了吸引买家的注意，从而增加店铺的流量。 2.3.1 商品整体参与整体设计 整个商品全部进入到设计中时，可以让浏览者看到商品的整体，在视觉中不会出现丢失部分，这种设计方法常被用
35、到传统的 设计中，好处就是可以看到商品本身的样貌，缺点是缺少的买家对商品本身的一些遐想，如图2-12所示。 图2-12 商品整体参与的设计 2.3.2 商品切断式参与整体设计 被切断的商品在整体作品中，是完整图像的对立面，视觉上的不完整性，会使买家看到后在大脑中自动填补其完整形态，这 种设计不但为店铺带来新的视觉感受，还为买家预留了现象空间，如图2-13所示。 图2-13 被切断商品参与的设计 技巧 切断图片时，切记不要把图片中的代表区域切掉。保留局部后的图像在固定图像中可以更大化地显示商品的重要部分，这样 可以更好地吸引买家目光。 2.3.3 不同视角参与整体设计 常规视角的图片在设计中已经
36、司空见惯了，并且大多数的网店都是以传统视角作为主图设计的，这样的图片看多了就会产生 审美疲劳，即在视觉上对买家的吸引力逐渐降低，按照此逻辑，我们可以在商品视角的运用上进行一下大胆的尝试，使买家产生 新鲜感，从心理上感觉眼前一亮，无形中就会对店铺的流量产生推动力，如图2-14所示。 图2-14 不同视角参与的设计 2.3.4 超出范围参与整体设计 超出范围指的是冲出束缚的版面，也就是素材本身的某个部分在规划设计区以外，如图2-15所示为模特的头部探出了设计 区的框架。此种设计方式打破了原有的物体封闭性，给买家一个新的视觉冲击。 图2-15 超出范围参与整体设计 2.4 页面图像配色与编修要领 移
37、动端网店页面中的页面配色通常是指各图像区域的色调，将整体色调进行统一，使主题更加鲜明。色彩搭配要合理，并与 产品相符合，这样给人一种和谐、愉快的感觉。在搭配时一定要避免容易使人产生视觉疲劳的纯度过高的单一色彩。 2.4.1 色调搭配 色彩与人的心理感觉和情绪有一定的关系，利用这一点可以在设计时形成自己独特的色彩效果，从而给浏览者留下深刻的印 象，提高产品的售出概率。不同的色系在网店中也会拥有自己的独特之处，在网店色调分类时主要按照色相分类、按印象分类和 按色系分类三种。 1.按照色相分类配色 常见的色彩搭配是按照色相的顺序归类。每类都以该色相为主，配以其他色相或同色相的，应用对比和调和的方法，
38、并按照 从轻快到浓烈的顺序排序。 红色 红色的色感温暖，性格刚烈而外向，是一种刺激感很强的颜色。红色容易引起人的注意，也容易使人兴奋、激动、紧张、冲 动、还是一种容易造成视觉疲劳的颜色。 在网页颜色的应用概率中，根据网页主题内容的需求，单纯使用红色为主色调的网站相对较少，多用于辅助色、点睛色，以 达到陪衬、醒目的效果。通常都配以其他颜色调和。 在众多颜色中，红色是最鲜明、最热烈的颜色，因此红色也是代表热情的情感之色。常见的红色配色方案如图2-16所示。 应用红色系的网店多数以婚庆产品为主，还会出现在女装、美容化妆品或店庆页面中，主要目的是醒目，提醒大家注意，从而吸 引买家目光来产生交易。通过配
39、色产生的红色页面会给人一种喜庆的感觉，如图2-17所示。 图2-16 红色搭配 图2-17 红色系移动端网店 温馨提示 红色可以和蓝色（带红的蓝）混合成紫色，可以和黄色混合成橙色，红色和绿色是对比色，红色的补色是青色。红色是三原 色之一，它能和绿色、蓝色调出任意色彩。 橙色 橙色又称橘色，为二次颜料色，是红色与黄色的混合，得名于橙的颜色。在光谱上，橙色介于红色和黄色之间。 橙色在空气中的穿透力仅次于红色，而色感较红色更暖，最鲜明的橙色应该是色彩中感受最暖的色，给人一种庄严、尊贵、 神秘的感觉，基本上属于心理色性。历史上许多权贵和宗教界都用以装点自己，现代社会中往往作为标志色和宣传色，不过也是
40、容易造成视觉疲劳的颜色。橙色明度高，在工业安全用色中，橙色即是警戒色，如火车头、登山服装、背包、救生衣等。红、 橙、黄均为暖色，是注目、芳香和引起食欲的颜色。橙色可作为餐厅的布置色，据说在餐厅里多用橙色可以增加食欲。常见的橙 色配色方案如图2-18所示。由于橙色也是积极活跃的色彩，除了食物，还会经常用在家具用品、时尚品牌、运动及儿童玩具等 网店中出现，如图2-19所示。 图2-18 橙色搭配 图2-19 橙色系移动端网店 温馨提示 橙色在HSB数值的H中为30，是正橙色。橙色的对比色是蓝色，当这两种颜色彩度倾向越明确，对比强度就越大。除了正 宗的对比色橙蓝色外，橙色和绿色随着纯度的升高，达到的
41、对比效果也很强烈。 黄色 黄色代表光明、希望、高贵、愉快，浅黄色表示柔弱，灰黄色表示病态。黄色的亮度最高，和其他颜色搭配很活泼，具有快 乐、希望、智慧和轻快的个性。黄色也代表着土地，象征着权力，并且具有神秘的宗教色彩。常见的黄色配色方案如图2-20所 示。黄色与某些食品色彩相似，可以应用于食品类的店铺。黄色是一种骄傲的色彩，代表权利和财富，因此很多店铺都会使用黄 色来体现自己商品的高档与华贵，如图2-21所示。 图2-20 黄色搭配 图2-21 黄色系移动端网店 温馨提示 黄色能和多种颜色相配，唯独不能和白色搭配。另外，深黄色最好不要与深紫色、深蓝色、深红色相配，会使人感觉晦涩与 失望；淡黄色
42、也不要与明度相当的色彩搭配，要拉开明度上的层次关系。黄色与红色搭配，可以营造一种吉祥、喜悦的气氛；黄 色与绿色搭配，会显得有朝气，有活力；黄色与蓝色搭配，会显得美丽、清新；淡黄色与深黄色相配，可以衬托出高雅。 绿色 绿色在黄色和蓝色（冷暖）之间，属于较中庸的颜色，这样使得绿色的性格最为平和、安稳、大度、宽容，是一种柔顺、恬 静、满足、优美、受欢迎之色，也是网店页面中使用最为广泛的颜色之一。 绿色与人类息息相关，是永恒的，欣欣向荣的自然之色，代表了生命与希望，也充满了青春活力。绿色象征着和平与安全、 发展与生机、舒适与安宁、松弛与休息，有缓解眼部疲劳的作用。 绿色能使我们的心情变得格外明朗，黄绿
43、色代表清新、平静、安逸、和平、柔和、青春。常见的绿色配色方案如图2-22所 示。绿色通常与环境意识有关，也经常被联想到与健康有关的事物，所以绿色系经常会用在自然、健康有关的网店，还经常用于 生态特产、护肤品、儿童商品或保健健康食品网店，如图2-23所示。 图2-22 绿色搭配 温馨提示 在绿色中黄的成分较多时，其性格就趋于活泼、友善，具有幼稚性；在绿色中加入少量的黑，其性格就趋于庄重、老练、成 熟；在绿色中加入少量的白，其性格就趋于洁净、清爽、鲜嫩。 图2-23 绿色系移动端网店 蓝色 蓝色是色彩中比较沉静的颜色，象征着永恒与深邃、高远与博大、壮阔与浩渺，是令人心境畅快的颜色。 蓝色的朴实、稳
44、重、内向性格，衬托那些性格活跃、具有较强扩张力的色彩，运用对比手法，同时也活跃页面。另一方面又 有消极、冷淡、保守等意味。蓝色与红、黄等色运用得当，能构成和谐的对比调和关系。 蓝色是冷色调中最典型的代表色，是网店页面中运用得最多的颜色，也是许多人钟爱的颜色。常见的蓝色配色方案如图2- 24所示。蓝色会给人很强烈的安稳感，同时还能够表现出和平、淡雅、洁净、可靠等，多用于科技产品、家电产品、化妆品或 旅游类型的网店中，如图2-25所示。 图2-24 蓝色搭配 图2-25 蓝色系移动端网店 温馨提示 在蓝色中添加少量的红、黄、橙、白等色，均不会对蓝色的性格构成较明显的影响力；如果在蓝色中黄色的成分较
45、多，其性 格就会趋于甜美、亮丽、芳香；在蓝色中混入少量的白色，可使蓝色的知觉趋于焦躁、无力。 蓝色表达着深远、永恒、沉静、无限、理智、诚实、寒冷的多种感觉。蓝色会给人很强烈的安稳感，同时蓝色还能够表现出 和平、淡雅、洁净、可靠等。多用于科技产品、家电产品、化妆品或者旅游类型移动端网店，如图2-25所示的图像就是蓝色系 移动端网店。 紫色 紫色可以说是最具优雅气质的颜色，紫色给人成熟与神秘感，是女性的专属色之一。从T台秀场到街拍，紫色都出现在了人 们的视线中，这些紫色有的优雅、高贵，有的极具街头范儿，大家的精彩搭配，显示出了紫色的百变魔力。然而紫色并不好驾 驭，如果搭配不当，则会显得过于老气。紫
46、色的明度在有彩色的色料中是最低的，其低明度给人一种沉闷、神秘的感觉。常见的 紫色配色方案如图2-26所示。紫色通常用于以女性为对象或以艺术品为主的网店，另外紫色是高贵华丽的色彩，也很适合表现 珍贵、奢华的商品，如图2-27所示。 图2-26 紫色搭配 图2-27 紫色系移动端网店 温馨提示 在紫色中红色的成分较多时，其感觉就趋于压抑、威胁；在紫色中加入少量的黑色，其感觉就趋于神秘、难以捉摸、高贵； 在紫色中加入白色，可使紫色沉闷的性格消失，变得优雅、娇气，并充满女性的魅力。 2.按印象的搭配分类配色 色彩搭配看似复杂，但并不神秘。既然每种色彩在印象空间中都有自己的位置，那么色彩搭配得到的印象可
47、以用加减法来近 似估算。如果每种色彩都是高亮度的，那么它们叠加，自然会是柔和、明亮的；如果每种色彩都是浓烈的，那么它们叠加，就会 是浓烈的。当然，在实际设计过程中，设计师还要考虑到乘除法，比如同样亮度和对比度的色彩，在色环上的角度不同，搭配起 来就会得到千变万化的感觉。因此，色彩除了按色相的搭配外，还可以将印象作为搭配分类的方法。 柔和、明亮、温柔 高亮度的色彩搭配在一起就会得到柔和、明亮、温和的感觉。为了避免刺眼，设计师一般会用低亮度的前景色调和，同时色 彩在色环之间的距离也有助于避免沉闷，如图2-28所示。此色彩常用于与女性有关的网店。 图2-28 柔和、明亮、温柔 柔和、洁净、爽朗 对于
48、柔和、清洁、爽朗的印象，色环中蓝到绿相邻的颜色应该是最适合的，并且亮度偏高，可以看到，几乎每个组合都有白 色参与。当然，在实际设计时，可以用蓝绿相反色相的高亮度有彩色代替白色，如图2-29所示。此色彩常用于与厨卫有关的网 店。 图2-29 柔和、清洁、爽朗 可爱、快乐、有趣 可爱、快乐、有趣印象中的色彩搭配特点是，色相分布均匀，冷暖搭配，饱和度高，色彩分辨度高，如图2-30所示。此色 彩常用于与儿童有关的网店。 图2-30 可爱、快乐、有趣 活泼、快乐、有趣 活泼、快乐、有趣相对于前一种印象，色彩选择更加广泛，最重要的变化是将纯白色用低饱和有彩色或灰色取代，如图2- 31所示。此色彩常用于与儿
49、童有关的网店。 图2-31 活泼、快乐、有趣 运动、轻快 运动的色彩要强化激烈、刺激的感受，同时还要体现健康、快乐、阳光。因此，饱和度较高、亮度偏低的色彩在这类印象中 经常登场，如图2-32所示。此色彩常用于与运动有关的网店。 图2-32 运动型、轻快 轻快、华丽、动感 华丽的印象要求页面充斥有彩色，同时饱和度偏高，亮度适当减弱则能强化这种印象，如图2-33所示。此色彩常用于与户 外运动有关的网店。 图2-33 轻快、华丽、动感 狂野、充沛、动感 狂野的印象空间中少不了低亮度的色彩，甚至可以用适当的黑色搭配，其他有彩色的饱和度高，对比强烈，如图2-34所 示。此色彩常用于与户外运动有关的网店。 图2-34 狂野、充沛、动感 华丽、花哨、女性化 女性化的页面中紫色和品红是主角，粉红和绿色也是常用色相，一般它们之间要进行高饱和的搭配，如图2-35所示。此色 彩常用于与女性有关的网店。 图2-35 华丽、花哨、女性化 回味、女性化、优雅 优雅的感觉很奇特，色彩的饱和度一定要降下来，一般以蓝、红之间的相邻，调节亮度和饱和度进行搭配，如图2-36所 示。此色彩常用于与女性有关的网店。 图2-36 回味、女性化、优雅 高尚、自