1、网店美工设计项目实战网店美工设计项目01项目0203040506淘宝女装店铺首页设计淘宝食品店铺首页设计淘宝护肤品店铺首页设计淘宝婴幼儿玩具店铺首页设计淘宝瓷器店铺宝贝详情页设计淘宝运动鞋店铺手机端首页设计01项目0203040506淘宝女装店铺首页设计淘宝食品1淘宝女装店铺首页设计Partone1淘宝女装店铺首页设计Partone电子商务是凌架于互联网系统上的一个销售平台,是地面销售系统的一种延伸和互补,也是商家和顾客的一种有效的沟通途径。现今国内通过不同程序实现网上销售的企业或厂商约占78%,剩下的22%左右的企业和厂商,都在努力创造着网上销售的地面物质准备。鉴于电子
3、。当前服装产品流行周期短,款式和品种多变。整个消费市场正需要一种能满足不同层次消费者个性化需求的多品种小批量产品的供应方式,这就使得服装电子商务的迅猛发展成为必然。而淘宝网作为服装类电子商务行业的老大,是国内B2C及C2C电子商务网站中发展最快、最为成功的案例,以提供具有本土特色的电子商务平台服务为宗旨,并一直不断完善和发展。其在中国的C2C市场中可谓是一家独大,市场份额更是超过了90%,行业领先的地位暂时是无人能撼动的。目前,服装服饰类产品已经成为网络零售的第一大商品,无论从数量还是交易规模上都是如此。单是淘宝网上初具规模的卖家群体皇冠店铺就已达上万家之多,并且仍保持着快速增长的态
5、过任何电子工具共享非结构化商务信息、管理活动和消费活动中的各种交易。电子商务是利用计算机技术、网络技术和远程通信技术,实现电子化、数字化和网络化的整个商务过程。电子商务是以商务活动为主体,以计算机网络为基础,以电子化方式为手段,在法律许可范围内所进行的商务活动过程。电子商务是运用数字信息技术,对企业的各项活动进行持续优化的过程。2淘宝网简述伴随着互联网技术的迅猛发展,消费者的消费观逐渐成熟,到网上进行购物慢慢成为千家万户购物的重要选择。随之涌现的一些电子商务购物平台,如淘宝网、京东网、号店、唯品会、小红书、拼多多等也逐渐地成为大部分网民的购物选择,其中最受中国消费者欢迎的网购零售平
6、台当属淘宝网。技能点1电子商务概述1电子商务的定义淘宝网成立于2003年5月10日,由阿里巴巴集团投资创办。淘宝网分为淘宝C店和淘宝商城2种模式。淘宝C店是淘宝集市卖家所开设的店铺,这种店铺的门槛低,任何通过实名认证的人,只要发布10件宝贝就可以免费在淘宝上开店。淘宝商城(天猫)是亚洲最大的购物网站淘宝网打造的在线B2C购物平台,自2008年4月10日成立以来,吸引了Kappa、JackJones、苏泊尔、联想、惠普等在淘宝商城开设官方旗舰店,受到了消费者的热烈欢迎。一个清新美观、富有吸引力的旺铺能够吸引更多的买家前来购物,提升销售额,网店的迅速发展还催生出网店美工这样的职业。和
8、业企业,网店美工岗位要求平面设计类专业为主,要求有深厚的美术功底和设计理念,除了负责线上网店的网店美工,往往还要兼职线下企业宣传海报的设计。通过调查分析,互联网技术类企业重视技术,传统行业企业重视设计,电子商务类企业重视对电商知识的掌握。淘宝网成立于2003年5月10日,由阿里巴巴集技能点3网店美工基本知识1分辨率分辨率有两种:屏幕分辨率和图像分辨率。图像由一个个点组成,这个点叫作像素。像素是图像中最小的单位。每个像素是一个小点,不同颜色的点(像素)聚集起来就变成一幅动人的画面。2像素技能点3网店美工基本知识1分辨率分辨率有两种:屏技能点3网店美工基本知识3尺寸图像尺寸的长度和
9、宽度经常以毫米或厘米为单位,也通常以像素为单位。图片格式是计算机存储图片的格式,常见的存储格式有jpg、png、jif、psd、ai等。4常用图片文件格式技能点4网店美工必备软件技能要求1Photoshop软件2Dreamweaver软件3Illustrator软件技能点5淘宝网店设计原则1界面布局要美观合理2定位明确、主题突出3视觉统一性技能点3网店美工基本知识3尺寸图像尺寸的长度和宽2淘宝食品店铺首页设计Parttwo2淘宝食品店铺首页设计Parttwo随着电子商务在国内的迅猛发展,传统的店面式销售方式已经很难满足经济快速发展的需要。目前很多厂商、经销商都采用了
13、到促进商品销售、树立品牌形象的目的。在网店界面的设计过程中,经常使用的构图技巧有以下三种:1对比技能点2网店设计基本构图技巧技能点1网店美工设计制作流程1素材规划2对称3反复2对称3反复技能点3淘宝店铺装修常见图片尺寸技能点3淘宝店铺装修常见图片尺寸技能点4淘宝店铺首页布局要素1店招店招顾名思义是店铺的招牌。2导航条导航条可分为淘宝系统自带和自定义导航条设计,主要功能是可以快速链接到相应的指定页面。3全屏海报(banner)技能点4淘宝店铺首页布局要素1店招店招顾名思义是店铺的技能点4淘宝店铺首页布局要素4产品促销轮播海报产品促销轮播海报主要用于推广
14、产品的促销内容可以做成促销海报吸引买家。尺寸为950像素500像素(建议高度在500像素左右)。5产品分类产品分类方便买家根据自己的需求在店铺上快速找到产品。分类主要有按价格分类、产品功能分类、产品属性分类等。技能点4淘宝店铺首页布局要素4产品促销轮播海报技能点4淘宝店铺首页布局要素6优惠券设计优惠券是指淘宝店铺的一个营销服务,起到主动营销买家,提升回头客的效果。我们所说的设计,是通过平面图片的设计将优惠券展示在店铺的首页,让买家一目了然地看到。设计常规尺寸950像素200像素内。7客服旺旺客服旺旺是用于买家跟店家沟通的软件,设计在首页上可方便买家联系商家。技能点4淘宝店
15、铺首页布局要素6优惠券设计技能点4淘宝店铺首页布局要素8产品自定义主图展示产品自定义主图展示是指产品通过平面图片展示设计,更能突出产品的性价比,更能融合到店铺的风格里,极大提升产品的视觉展示效果。9店铺页尾店铺页尾主要展示的内容有:关于快递包装物流、关于售后等服务,尺寸950像素300像素内。技能点4淘宝店铺首页布局要素8产品自定义主图展示技能点4淘宝店铺首页布局要素10店铺背景一个店铺的风格确立,店铺的背景占据了大部分,背景主要设计的内容店铺的背景图片,店铺手机二维码或店铺一些重要的折扣信息都可以加入店铺上。以上就是淘宝店铺设计布局的主要内容。技能点4淘宝店铺首页
17、技的发展和深入,当下消费者购物方式发网店美工设计教学课件【情境导入】网购的迅猛发展对淘宝卖家的网店品牌视觉设计是一个极大的考验。由于人们的审美能力不断提高,对网站设计的概念已经不再局限在技术层面,网站的设计外观也逐渐艺术化,因此网店设计的艺术性被开发者重视。本次任务主要是实现淘宝护肤品店铺的首页设计。【功能描述】使用淘宝布局要素来设计护肤品店铺首页。头部包括店铺的logo、宣传标语、收藏按钮、首焦海报等。主体包括各个分类版块下的图片链接。底部包括店铺的各项服务图标及返回按钮。【情境导入】【功能描述】技能点1网店店招设计1店招设计思路(1)以品牌宣传为主的类型:一般有着雄厚的实力,
20、容易让人联想到黄色、橙色;环保产品容易让人联想到绿色;女性用品容易让人联想到粉色、紫色等。配色方案中所包含的颜色不宜超过3种。(4)规范字体店招设计中一般不超过3种字体,重点部分可以用字体加粗的方式来突显,并且字体大小使用要有主次之分。(5)Ps排版越是简约大气的页面,元素务必不要太多,清爽舒适的页面多留白。技能点1网店店招设计4店招制作规范、流程(1)技能点2网店导航设计1网店导航的作用导航如同现实生活中商场里楼层悬挂的指示牌、分类牌,起到指引消费者快速找到所需商品。导航在店铺首页,起到非常重要的作用,它能方便地引导消费者找到自己需要的商品。(1)店招导航店招导航是淘宝店铺中
21、默认存在,且不可删除的,它会在店铺的每一个页面(首页、详情页、专题页等)都进行展示。2网店导航分类(2)页中分类导航页中分类导航一般情况下出现在店铺首页,其目的是为了更好地引导买家在浏览店铺时及时找到所需商品。页中店招的设计形式多种多样,可以是图文显示,也可以是文字直接引导。技能点2网店导航设计1网店导航的作用技能点2网店导航设计(3)左侧分类导航左侧分类导航一般出现在两个位置,第一个位置是在店铺首页,会跟着页面的下拉而变动;第二个是出现在宝贝描述页面,通常作为宝贝分类出现。技能点2网店导航设计(3)左侧分类导航技能点2网店导航设计(4)页尾导航页尾导航在店铺首页,买家浏览到
22、底部可直接选择刚才看过的某一个商品类目信息。页尾导航有时也会出现在详情页最底部,目的也是引导买家再次浏览店铺商品,提升店铺的访问深度。技能点3网店页尾设计1网店页尾的作用网店的尾页设计让店铺页面的结构更加完整,可以起到宣传、告知、引发兴趣、引起注意等作用。页尾模块相对页头会少,因此利用好页尾能为店铺起到良好的分流作用,而且页头和页尾属于共同展示页面,无论打开哪个详情页都会显示。技能点2网店导航设计(4)页尾导航技能点3网店页技能点2网店导航设计2网店页尾设计技法(1)页尾设计要素一:客服联系方式客服联系方式很多店铺会设置在左右两边,而设置到页尾的目的就是页头和页尾属于共同页面
23、,增加展示机会,方便顾客咨询。(2)页尾设计要素二:购物保障及售后服务目的让顾客对店铺增加信任。从推销工作来看,售后服务本身同时也是一种促销手段。在追踪跟进阶段,店铺要采取各种形式的配合步骤,通过售后服务来提高店铺的信誉,扩大产品的市场占有率,提高推销工作的效率及效益。技能点2网店导航设计2网店页尾设计技法(1)页技能点2网店导航设计2网店页尾设计技法(3)页尾设计要素三:返回首页、购物流程人性化的设计能够使用户操作更加便捷,目的在于提升用户的购物体验。“用户体验”是直接影响用户是否下单以及用户能否成为回头客的关键。(4)页尾设计要素四:关于我们展示店铺的文化、特色、内涵、
26、安全性和可靠性。吸引消费者注意力最有效的方法就是优化网店的页面设计,所以婴幼儿玩具店铺只有通过优化页面设计,塑造网店品牌安全健康的视觉形象,提高视觉观感,増加真实度,展现消者的需求从而吸引消费者购买。本次任务主要是实现淘宝婴幼儿玩具店铺首页设计。【功能描述】使用淘宝布局要素来设计婴幼儿玩具店铺首页。头部包括店铺的logo、导航及收藏按钮。主体包括首焦海报、各个分类版块下的图片链接。底部包括返回首页按钮。【情境导入】【功能描述】技能点1网店海报设计思路1海报与背景色色调统一在设计海报(banner)时,先观察背景环境,海报设计尽量避免与主色调产生强烈对比,必须要用对比色设计海报时,
27、要考虑降低纯度或明度。参考图4.4.1中案例1(a)与降低纯度、明度后的案例2(b)的对比效果。技能点1网店海报设计思路1海报与背景色色调统一技能点1网店海报设计思路2观察产品亮点决定背景色背景的选择上不能单纯当海报设计,为了做出一张比较漂亮的图片,最好做到背景与产品的呼应。在海报设计中,大体分为两种风格:(1)将拍摄的图直接用作背景,版式排列活动文案技能点1网店海报设计思路2观察产品亮点决定背技能点1网店海报设计思路2观察产品亮点决定背景色(2)将产品提取出来,背景根据产品灵活变动,再配合版式技能点1网店海报设计思路2观察产品亮点决定背技能点1网店海报设计
28、思路3文案策划排版式在要明确自己的海报是给中国人看的,过度使用英文是不合适的,可将英文作为中文的辅助元素技能点1网店海报设计思路3文案策划排版式在要明技能点1网店海报设计思路4合理版式、突出主题产品图片展示与摄影图片展示不同。摄影作品突出原生态,添加文字是为了更好地突出画面。设计作品是画面烘托文案主题的,应将主题文案放在首位重点突出。技能点1网店海报设计思路4合理版式、突出主题产品图技能点2常见网店海报主题方案1店铺活动:促销活动(1)品牌团:官方活动聚划算,可提高品牌的曝光度。(2)官方季节性活动:双十一/双十二活动/年中大促。(3)店铺常规活动:换季、节日
30、案:名称、卖点、价格、其他。(3)产品信息。技能点3网店海报设计“三”原则1.内容三元素技能点3网店海报设计“三”原则1.内容三元素(1)海报背景。(2)文案:名称、卖点、价格、其他。(3)产品信息。2.三段文字主标题、副标题、附加内容。3.三种字体海报的文案所使用的字体不宜超过3种。4.三种颜色海报配色方案。70%主色,25%辅助色,5%点缀色。5.30%以上留白高端、大气的海报风格要多留白,最好可以让客户能在0.3秒读完。技能点3网店海报设计“三”原则1.内容三元素技能点4网店海报常见构图版式1左文右图字体上粗下细、上大下小,上下主次分明,形成对比。文案
31、四四方方架构非常稳重,非常平衡技能点4网店海报常见构图版式1左文右图技能点4网店海报常见构图版式2左图右文字体上粗下细、上大下小,排版结实、稳重技能点4网店海报常见构图版式2左图右文技能点4网店海报常见构图版式3两边图中间文字一般利用近景、远景的照片产生对比和呼应(多见模特海报)技能点4网店海报常见构图版式3两边图中间文字技能点4网店海报常见构图版式4背景为风景图利用半透明的底框,然后再在里面排文案,避免文字模糊与混乱技能点4网店海报常见构图版式4背景为风景图技能点4网店海报常见构图版式5展示多种产品当海报上要放置过多的促销产品时,可以采用这种版式。产
32、品平行排版,中间利用半透明的框展现文案技能点4网店海报常见构图版式5展示多种产品技能点4网店海报常见构图版式6斜切式构图斜切式构图会让画面显得时尚,动感活跃。但是画面平衡感不是很好控制。一般文案倾斜角度不超过30,文字往右上方倾斜便于阅读技能点4网店海报常见构图版式6斜切式构图5淘宝瓷器店铺宝贝详情页设计Partfive5淘宝瓷器店铺宝贝详情页设计Partfive随着电子商务的迅猛发展,淘宝网成为区别于实体店的互联网视觉营销,其网站运作完全依赖于互联网。网店产品价值的塑造是淘宝卖家装修网店吸引买家的一个非常重要的手段。所以网店产品价值的塑造同时具有科学性、艺术性,同其目
34、合理对消费者购买决策影响重大。在新媒体和新技术手段支持下,如何利用互联网与交互技术,结合产品自身的特点及优势,从而提升转化率,是淘宝美工应当掌握的职业技能。本项目将以淘宝瓷器店铺宝贝详情页设计为例,展示如何应用这些新媒介、新技术条件下的传播方式,实现全方位、多感官的信息传播,以便为消费者提供安全可靠的服务。【功能描述】使用淘宝布局要素来设计瓷器店铺宝贝详情页。头部包括产品的海报。主体包括产品卖点、属性、细节展示等。【情境导入】【功能描述】技能点1淘宝详情页的作用淘宝详情页是提高转化率的入口,激发消费者的消费欲望,树立消费者对店铺的信任感,打消消费者的消费疑虑,促使消费者下单。优化宝贝详情
36、消费者人群,分析消费者的消费能力,消费的喜好,以及消费者购买所在意的问题等。1进行市场调查通过阿里指数()可以清楚地查到消费者的一切喜好以及消费能力、地域等很多数据,学会利用这些数据对优化详情页很有帮助。另外“生E经”等付费软件也有一些分析功能。2了解消费者最在意的问题可以去宝贝评价里面找,在买家评价里面可以挖出很多有价值的东西,了解买家的真实需求以及购买后遇到的问题等。3调查结果及产品分析首先,据市场调查结果以及自己的产品进行系统的分析总结,罗列出消费者所在意的问题,同行的优缺点,以及自身产品的定位。然后,根据店铺产品以及市场调查的结果来确定本店的消费群体。最后,针对消费群体挖掘出本
37、店与众不同的卖点,关于产品卖点的范围非常广泛,比如。卖价格、卖款式、卖文化、卖感觉、卖服务、卖特色、卖品质、卖人气,等等。技能点2制作淘宝详情页的前期准备设计宝贝详情页之前要技能点3淘宝详情页的设计元素淘宝美工要根据消费者分析、自身产品卖点的提炼以及宝贝风格的定位来准备所用的设计元素。这些设计元素包括配色、字体、文案、构图、排版以及氛围。一般来说,详情页上半部分诉说产品价值,后半部分培养消费者的消费信任感。对于消费信任感不光通过各种证书,品牌认证的图片来树立。使用正确的颜色,字体,还有排版结构,这些对赢得消费者消费信任感也会起到重要的作用。详情页每一块组成都有它的价值,都要经过仔细的推
38、敲和设计。如何对详情页内容进行排版设计,是考验淘宝美工职业水平的地方。页面风格主要根据产品本身来定;素材搜集的渠道可以通过前期实拍或者素材库的搜集而获得;页面框架可以根据文案内容,结合实际产品,进行有效的布局建立;配色方案可以依据已有的店铺视觉规范直接延续使用,或者从产品本身、品牌logo、产品联想属性中提取;页面字体相当于一个桥梁,相当重要。他对产品起到解释说明,方便顾问阅读,同时也是重要信息的引导作用。所以字体的使用一般不超过三种,重点部分加粗突出,注意字体颜色的深浅不要太复杂,以免影响阅读。对于初学者而言,越是简约大气的页面,元素务必不要太多,清爽舒适的页面多是适当留白,参考优秀案例,
39、多多借鉴和学习。技能点3淘宝详情页的设计元素淘宝美工要技能点4淘宝详情页的设计原则1把所有的消费者都当作非专业人士不要理所当然的认为消费者应当知道关于产品的任何信息,要把所有的消费者都当作非专业人士,假设消费者对产品是一无所知的,关于产品的性能和细节都应在详情页条理清晰的展示清楚。2遵循3秒钟注意力原则每个消费者在寻找自己需要的产品的时候,面对的选择非常多。如果产品在开头的3秒钟不能给消费者留下深刻的印象,没有让他明确地感觉到这个产品可以满足他的需求,那么,有很大的可能就是在3秒钟之后,在消费者随便扫了2眼之后,觉得这个产品没有吸引力,就会关掉页面。所以,在详情页开头的3秒吸引
41、会大大提升。5消除一切使买家分心或者暂缓购买的内容不要在主推的商品里面加入太多的关联销售的内容。在开始主推单品的阶段,每一个流量都是宝贵的,不要让消费者分心,最好是不要在详情页里面加关联销售的内容,让消费者能够专心看完产品介绍,尽量促成主推产品的成交,否则太多的关联销售,会造成消费者分心,结果是大大降低成交率。6商品的卖点只有一个,而且要反复不断地告诉消费者一个人对一个事物的感觉,第一印象是非常重要的,网店美工要做的就是让消费者的第一印象尽可能的深刻,从而加深消费者对产品的认可度。不断重复强调产品的中心卖点,挖掘产品特别突出的地方,而且这个特点是优于竞争对手的。技能点4淘宝详情页的设
43、在淘宝琳琅满目的产品中脱颖而出,塑造产品自身价值,可以从以下几点入手:(1)产品本身的特点。原材料、大小、形状、颜色、款式、品质、原产地等。(2)附加值。赠品、包装、售后等。(3)品牌概念。自己独特的风格。(4)唯一性基点。技能点5淘宝详情页的设计技巧2产品价值技能点5淘宝详情页的设计技巧4速战速决速战速决就是通过活动的设计,比如限时、限量等,尽可能地促进转化。5突出特色有些商品的特色并不止一个,要将这些全都放上未免会太繁琐,而且消费者也记不住。那么就可以找出最为突出的特点,强化唯一的核心卖点,然后用辅助卖点进行扶植。比如。女装类目中A产品全篇在反复强调一点:衣服修身;而B产品则是