电商设计电子课件

第9章PC端活动专题页设计本章介绍：PC端活动专题页设计是电商设计任务中具备一定难度的综合型工作任务，通过精心设计的PC端活动专题页能够营造出活动的欢庆氛围，提升用户的兴趣。本章针对活动专题页的基本类型、表现形式以及版块设计等基础知识进行系统讲解，并针对流行风格与典型行业的PC端活动专题页进行设计演练。通过本章的学习，读者可以对PC端活动专题页的设计有一个系统的认识，并快速掌握PC端活动专题页的设计规范和制作方法，成功塑造出色精彩的PC端活动专题页。了解活动专题页的基本类型熟悉活动专题页的表现形式熟悉活动专题页的页面设计学习目标

活动专题页是指在各种节日活动主题下，进行商品促销的电商页面。根据服务对象，活动专题页可以分为平台专题页和店铺专题页。

平台专题页通常涉及大量的类目、品牌以及产品，因此整体布局更紧凑。头部Banner常设计为高度较短、小尺寸类型，以便能在首屏展示更多信息。而店铺专题页只需要呈现单一类目或单一品牌下的少量商品，因此整体布局较为宽松。头部Banner常设计为高度较高、大尺寸类型，以便能更好地体现主题和氛围。9.1活动专题页的基本类型矩形排列场景展示9.2活动专题页的表现形式根据活动专题页的信息呈现和商品陈列，专题页通常有矩形排列和场景展示两种表现形式，这两种表现形式各有干秋，被大量应用于各类专题设计中。9.2活动专题页的表现形式矩形排列即用矩形的形式将专题页的内容按照一定规则进行排列。这种表现形式能够清晰地展示信息内容，令画面整齐舒适。根据不同的设计风格，矩形排列又可以细分为扁平化矩形和拟物化矩形，扁平化矩形是将矩形刻画成轻量化的视觉元素，从而更好地凸显商品和信息。拟物化矩形则是将矩形刻画成立体感的视觉元素，使矩形成为画面亮点，让画面颇具美感。9.2.1矩形排列矩形排列效果图场景展示即用场景化的形式呈现页面中的内容。这种表现形式能够突出主题氛围，使信息和商品巧妙地融入场景之内，设计极具连贯性与创意度。9.2.2场景展示场景展示9.3活动专题页的页面设计活动专题页的设计尺寸活动专题页的页面结构活动专题页的设计要点PC端活动专题页的设计尺寸可以参考第七章PC端店铺首页设计的尺寸进行设置。通常将宽度设置为1920像素，重要的信息和商品建议设计在1200像素以内。高度不限，可以根据商家不同需要进行组合变化。9.3.1活动专题页的设计尺寸活动专题页通常由Banner、活动促销区以及商品陈列区组成，参考1.5.3栅格系统确立好活动专题页的栅格，根据主流电商设计活动专题页的版块尺寸，可以总结出紧凑型和宽松型共7种版块。设计时建议参考图中的比例，不然容易令版块在结构上失衡。9.3.2活动专题页的页面结构紧凑型模块宽松型模块1.商品陈列（1）商品展示形式9.3.3活动专题页的设计要点摄影扁平台面（2）商品展示角度9.3.3活动专题页的设计要点平视俯视2.内容分隔（1）版块分隔版块分隔即对专题页中不同的主题专区进行区分，常见的专区有活动促销区和商品陈列区。版块区隔的设计通常有分隔栏、颜色和表现形式三种。9.3.3活动专题页的设计要点分隔栏颜色表现形式（2）模块分隔模块分隔即对专题页同一版块中的不同模块进行区分，以实现每个模块都是一个相对独立的视觉单元。根据表现形式的不同，模块分隔有矩形分隔和场景分隔。9.3.3活动专题页的设计要点矩形分隔场景分隔使用“新建参考线版面”命令建立参考线，使用“置入嵌入对象”命令置入图片，使用“横排文字”工具添加文字，使用“矩形”工具、“直线”工具、“椭圆”工具和“圆角矩形”工具绘制基本形状，使用“添加图层样式”命令为图形添加效果，使用“创建剪贴蒙版”命令调整图片显示区域。9.3.4课堂案例-品质国货家电平台专题页设计效果图学习使用绘图工具、文字工具制作初春焕新家电平台专题页。