电商视觉设计第4章店铺首页视觉设计.pptVIP

4.4商品陈列区视觉设计1营造视觉动线①浏览初期，视线水平移动，且浏览范围最大。刚开始浏览时，消费者对商品展示图充满了新鲜感和好奇，很可能将第一排图片全部浏览完毕，并根据从上到下的浏览经验，转向对第二排图片的浏览。②水平浏览范围缩短。此时图片的布局没有任何变化，消费者对于图片浏览的新鲜度就会降低，开始失去浏览的耐心，于是对第二排图片的水平浏览范围便会缩短。③失去耐心，开始进行垂直浏览。当消费者看到第三排仍然是一成不变的图片排列后，浏览的耐心就会减少，还可能会想图片怎么这么多，大概地往下看看吧，于是形成对左边的垂直浏览。F形浏览模式4.4商品陈列区视觉设计1营造视觉动线商品海报展示图：将重点推荐的商品以单张海报的方式呈现，较为丰富的表现形式能很好地让消费者注意到商品信息。单张商品展示图：较为重要的商品以单张图片形式排列，较大的展示面积更能获得消费者的瞩目。三张商品展示图：非重点推荐的产品可以三张并排展示的效果呈现。单张图片：除了商品展示图片以外，还可以搭配一些与展示商品相关的商品组合图片，进一步吸引消费者的购买兴趣。4.4商品陈列区视觉设计商品布局艺术化4.4商品陈列区视觉设计2商品布局艺术化4.4商品陈列区视觉设计2商品布局艺术化4.5化妆品店铺首页视觉设计案例标题文字设置的字号较大，利用斜面和浮雕、投影等效果来点缀标题文字，使其更加精致文字选用不同的颜色、字号，并分成两行，显得更有层次感，并通过一些小图案对价格进行修饰和点缀，营造出一种清新的视觉感受风格一致的文字与图像，营造出一种清新、简洁、充满文艺气息的氛围采用不规则图形作为背景图的点缀，使商品的排列既整齐又不死板，提升其观赏性和设计感4.5化妆品店铺首页视觉设计案例01填充背景色4.5化妆品店铺首页视觉设计案例02设置文字属性4.5化妆品店铺首页视觉设计案例03添加商品图及优惠券4.5化妆品店铺首页视觉设计案例04绘制导航条背景为导航条添加文字4.5化妆品店铺首页视觉设计案例054.5化妆品店铺首页视觉设计案例06添加文字并设置图层样式添加文字并设置图层样式064.5化妆品店铺首页视觉设计案例模板来自于/*模板来自于/*第4章店铺首页视觉设计了解首页视觉水平的四大指标掌握店招的设计规范及技巧掌握首焦轮播区的设计技巧了解商品陈列区的布局方式掌握商品陈列区的布局技巧学习目标目录首页视觉水平的四大指标4.1店招视觉设计4.2首焦轮播区视觉设计4.3商品陈列区视觉设计4.4化妆品店铺首页视觉设计案例4.54.1首页视觉水平的四大指标12344.1首页视觉水平的四大指标1首页跳失率进入店铺首页的渠道首页跳失率，指买家通过某种渠道进入店铺，只访问了一个首页就离开的访问次数占该入口总访问次数的比例。4.1首页视觉水平的四大指标两类店铺首页排版首页点击率首页点击率是宝贝在首页展现后的被点击比率，即：首页点击率=首页点击量÷首页展现量）。124.1首页视觉水平的四大指标首页人均点击次数首页人均点击次数，指在一段时间内人均点击了多少次，如下图所示。假设某日点击该网店的唯一访问者数为150人，在此期间内点击本店铺首页的总访问数为600次，那么首页人均点击次数为：600次÷150人=4次/人。人均点击次数4.1首页视觉水平的四大指标首页平均停留时间首页平均停留时间=访店铺首页的所有访客总的停留时长÷访客数（单位：秒），多天的平均停留时间为各天人均停留时长的日均值。和首页人均点击次数一样，首页平均停留时间也可以用来判断一个店铺首页是否能留住访客。4.2店招视觉设计店招视觉设计规范店铺名称的艺术化处理图层样式的应用4.2店招视觉设计1店招视觉设计规范店招高度设计规范淘宝后台的店招高度为120像素，建议设计时设定店招尺寸为950×120像素，加上导航条高度30像素，共150像素，可避免发布后导航不显示的问题4.2店招视觉设计1店招视觉设计规范店招元素设计品牌宣传语移动端二维码清晰的店铺名称4.2店招视觉设计1店招视觉设计规范店招和导航条风格统一风格的统一及修饰元素的设

计，突出店铺的品牌形象4.2店招视觉设计2店铺名称的艺术化处理4.2店招视觉设计2店铺名称的艺术化处理1不同字体字号的组合将店铺名称的首个英文字母放大，并使用不同于其他字体风格的手写体，让店铺名称文字的版式更加醒目、更具艺术感4.2店招视觉设计2店铺名称的艺术化处理2为了将