电商-专题页设计

Share

专题页设计

（一）专题页设计：

  • 专题页也可以叫“活动页 并连页 承接页 ”
  • 平台专题：一般都会有平台活动主会场 ，参报活动成功的店铺 需要做承接页面（活动专题页），并且专题banner的左上角有专题活动标识
  • 自办活动专题：一般是在店铺内商家自己搞的店内活动（店庆 周年 回馈月 上新）
  • 常见的专题活动:情人节 焕新季（春天） 开学季 端午节 劳动节 儿童节 愚人节 三八妇女节 男人节 七夕 818 618 中秋节 国庆节 双十一 双十二 双旦 年终大促 年货节
  • 专题页的组成：店招 导航 banner 活动区域 爆款 产品列表
    1. 店招：1920X120px 包括LOGO 活动内容/爆款产品 展示机率大
    2. 导航：1920X 30px 包含主要产品分类和活动分类，导航类别不建议超过14个 ，如果类目太多可以选择复合类目
    3. Banner 全屏制作，高度不要超过800
  • 促销海报有三多，色相多 元素多 形状多
    专题页中常用的分割图形：一般选择有聚焦感的形状例如（圆形 菱形 倒三角）
  • 专题页制作：首先要分析产品定位群体，确认页面风格，主题色彩，页面布局（需要和运营沟通确认）
    店招版心990范围内可以添加链接，重点内容尽量放在990之内，
    页面版心1000左右

    （二）字体变形

  1. 连笔：使用基础的非衬线字体来进行变形，运用笔画的走势进行延长，或者添加笔画。
  2. 断笔：断笔会产生一定的层叠关系，一般实在两个相交的笔画处做断笔处理，最大程度保证文字的识别性。
  • 微立体的制作
    1. 获取文字的选区（ctrl+点击图层缩略图）
    2. 新建空白图层并填充颜色，不取消选区
    3. 按住ALT+上方向键 再ALT+左方向键 重复执行3次，产生文字的厚度
    4. 将文字面进行重叠即可

      专题页设计

      （一）爆款板块：

  • 爆款一般为店铺的主推引流产品，用来吸引消费者进入店铺，从而带动其他产品的流量，爆款产品一般都为性价比较高的产品。
    爆款产品一般会有2到5个
  • 专题页中的装饰元素
    1. 可以丰富版面，对版面中的空白区域做视觉补充
    2. 营造促销的热闹气氛
      一般都是将整体排版完成后，单独在背景层之上制作，颜色可以多样化 大小适中。
  • 产品列表
    产品列表一般横向要保持2-4个，2个的居多。

    （二）首页

  • 首页进入的方法：
    1. 搜索产品关键词—通过主图建立第一印象—点击主图查看详情和价位 建立店铺的信任度—有了信任度之后才有可能进入首页进行选购
    2. 品牌有较高的知名度，在搜索栏直接输入品牌即可进入
    3. 首页的实际转化率会明显低于详情页和专题页，但是店铺的企业形象和品牌信任是由首页来建立的。

      首页设计

      （一）通道调色

  1. 通道的亮度和颜色的含有量正比（哪个通道亮哪个颜色含有多 反之依然）
  2. 轮播图要调用div 或者CSS代码实现效果，设计中必须制作相应的海报缩略图以及轮播指示箭头，并独立建立图层和组，方便调用。

    （二）优惠券

  • 优惠券是刺激消费，提高客单价（标价）的手段。
    1. 优惠券形式：分为两种 自动满减 (给与顾客的在一定程度上消弱了优惠感） 先领后用（顾客主动领取的，已经说明了会用这个优惠券的可能性较大，客户群体明确，即使未达到也会产生凑单的想法）
    2. 优惠券制作特点：着重显示优惠价格，按照门槛进行排列，位置摆放显著。
  • 时尚类女装排版风格，要活泼富有对比（丛位置 线条 文字粗细 颜色深浅 文字间距 ），丛规范的排版中发生一点或者几个点来发生变化。
  • 赠品区域排版
    纯文字促销容易让人产生阅读疲劳，文字和图片要结合使用。
  • 版块分割
    同类版块之间要进行同一种颜色的分割，或者使用图案填充、图像填充。
  • 服装的分类
    可以分为款式季节型分类，和服装品类。一般会着重展示上新类目，服装品类可以用图标简洁表达，尽量制作图文表达，增加新品或者爆款的曝光率。
  • 排版过程中的版块变化
    1. 先将版块按照规则排版（3个） 将能合并的版块进行合并（右侧合二为一） 将重点内容放在版心范围内，图片的次要部分可以适当的超出范围，用来打破呆板的版面。
    2. 规范的排版中 要保证模特的高度 和比例尽量保持一致。
  • 服装详情
    1. 服装详情注重于模特的展示
    2. 一般都包括了服装的尺码 面料 洗涤说明 颜色 模特展示 产品细节

      无线端店铺装修

      （一）为什么要发展无线端

  1. 作用：可以随时随地的浏览店铺，不受时间和位置的限制。
  2. 可以短时间内浏览快速阅读，快速消费，快捷方便。
  3. 增加买家和卖家的黏性，线上线下的沟通互动十分方便。
  • 手机端店铺的设计原则 → 快速打开（图片不能过大）→ 信息简洁→ 风格统一（PC和手机端统一） 以图服人 分类清晰→ 色彩鲜亮
    手机端平台的装修多以模块化形式存在，（找模块 记尺寸 按需求制作）

    （二）无线端常用模块

  1. 店招：可编辑区域不多，只有背景，上传后会自动添加半透明黑，不建议在店招背景上展示文字信息（天猫店招尺寸：642X200）
  2. 常用模块为自定义模块
  3. 单列图模块：608X200-960之间（不支持GIF）
  4. 双列图模块：可以添加两个图片 每一个296X160
  5. 多图模块：一个手机端首页只能添加两个 每一个模块里面最多可以添加6张图片每一张248X146
  6. 轮播图模块：一个手机端首页只能添加两个 每一个尺寸为640X320 一个轮播模块里面可以放四张图片
  7. 自定义模块：一个手机端里面最多可以添加10个自定义模块
  8. 每个自定义模块里面包含10个可以添加链接的小块块
  9. 小块块最宽608 最小横向152竖向152
    • （小方法，将网格设置成和自定义模块同等大小网格的尺寸，例：天猫的将网格设置为152 子网格设置为2 ）
    • Iphone5/iphone6 尺寸：640X1136
    • 手机端常用正文字号不低于18PX并且用偶数字号
  10. 手机端的间距
    手机端常用模块之间自带间距，自定义模块里面。小块块与小块块之间没有间距，需要自己添加。