市场营销基础教学课件项目2 店铺图设计-任务1 设计店标电子课件 中职 电子教案 网店装修（第三版）.pptx

市场营销基础教学课件项目2 店铺图设计-任务1 设计店标电子课件 中职 高教版 网店装修（第三版）网店装修项目二 店铺图设计项目综述 晓玲通过项目1 的学习和实践，注册了淘宝账户和支付宝账户，成功开了网店。她还根据商品类型，确定了网店店铺的模板，设置了店铺页面的布局，网店首页有了基本架构。因为店铺所销售的女装意向顾客是高中学生，属于青春靓丽的风格，晓玲请教公司美工，决定设置网店的主色调为蓝绿色（R：44，G：141，B：140）。商品上架需要用到商品图片，因此，晓玲根据所卖衣服的风格、网店的主色调，合理设计搭配、布置场地、邀请适龄模特，精心为商品拍摄了一组图片，包括正面图、背面图、细节图、模特图、场景图等。一个好的网店，不仅要有好的店铺名，还要有好的店标、能反映风格及卖点的主图和能吸引顾客眼球的活动图，晓玲打算提前设计、制作这些图片，把店铺进一步充实完善好。项目任务任务一 任务二 任务三店标设计主图设计活动图制作知识目标任务一设计店标 了解淘宝店铺图类别 理解网店店铺图的作用 掌握各类店铺图的制作方法情景设计晓玲经过老师的指点，认识到店标是淘宝店铺的标志，是店铺形象和文化的最直接表现。开设店铺前，要先准备好店标。为了使店铺更吸引买家眼球，晓玲决定设计店标。店标设计任务步骤 对店标进行认识、设计制作静态店标、设计制作动态店标.【任务分解】晓玲找到老师，说明的自己的困惑。老师指点晓玲，可以先看看其他网店的店标，学习店标的类型。再根据自己网店的店名和主营商品、目标人群喜好来选择一个类型的店标进行设计制作。晓玲团队讨论确定了完成任务的步骤。店标设计活动实施：1.什么是店标店标是淘宝店铺的标志，也可以称为 Logo，一个制作精美的店标能够传达店铺的经 营理念，突出店铺的经营风格，彰显店铺的形象。店标在淘宝店铺中以两种形态显示：静态图像和动态图像。店标通常由店铺名称、商品图片、宣传文字等组合而成。淘宝规定，店标的尺寸宽度为 100 像素，高度为 100 像素，仅支持 GIF 和 JPG 两种 图片格式，图片大小建议限制在 80 kB 以内。初识店标店标设计活动实施：2.店标的表现形式主要有文字、图片、组合共 3 种形式。（1）文字。用文字或者拼音字母等形式表现店标。（2）图案。用图形的方式来表示店标，可以选择形象生动、色彩明快的图案，这样 选择的图案可以极易识别的，如图 2.1.3 所示。（3）组合。把文字和图案组合在一起，这种结合了文字和图案的优点，既形象又容易 识别。初识店标店标设计活动实施：3.店标设计原则（1）构图有创意。构图不能和其他店铺的一样，要新颖、富有个性化。（2）店标含义有内涵。能体现店铺个性特征、独特品质以及精神风貌。（3）店标一旦确定，最好轻易不要改动。（4）设计符合法律法规，注重国际化。初识店标店标设计活动实施：4.店标设计技巧（1）店标设计的时候一定要有识别性，让别人一看到就能识别出你的店铺。店标还 要展示店铺的独特性，标志要传递关键要素。（2）店标要保证统一性，要和网店的理念、文化、经营内容和特点统一，才能获得一 致的认可。（3）店标具有延伸性，可以运用最广泛和频率最高的要素来表达，也可以采用对应性、延展性的变体设计，切合最适宜的效果表现。网店装修 16 WANGDIAN ZHUANGXIU（4）店标设计要有造型，不管是什么组合形式，一定要保证优质的造型，这样能在 买家心中留下很好的形象初识店标店标设计活动二 活动三 活动一活动背景网店经营女装，店名为“拾光”。晓玲经过思考和设计，决定店标采用文字和图案的组合形式。店标中简单明了地写出“拾光”店名，以小花的图案表达花样年华，代表对“美”的追求。图标以蓝绿色为底色，代表一种甜美、温柔的女性特质，也和店铺色调相呼应。设计静态店标店标设计活动二 活动三 活动一活动实施步骤1：新建文件，颜色模式为RGB颜色，分辨率为72像素/英寸，背景 内容为透明，尺寸宽为100像素、高为100像素。步骤2：选择“椭圆选框工具”，设置样式为“固定大小”，宽度为 98像素，高度为98像素。绘制圆形，填充为蓝绿色（R：44，G：141，B：140）。步骤3：选择“钢笔工具”，绘制路径，如图2.1.6所示设计静态店标店标设计活动二 活动三 活动一步骤 4：新建组 1，在组 1 中新建图层 1。选择路径，按“Ctrl+Enter”快捷键，将路径 转为选区，填充为白色（R：255，G：255，B：255）。步骤 5：选择“钢笔工具”，绘制两个路径，分别如图 2.1.7、图 2.1.8 所示。步骤 6：在组 1 中分别新建图层 2、图层 3，分别按“Ctrl+Enter”快捷键，将路径转为 选区，分别填充为白色（R：255，G：255，B：255），效果如图 2.1.9 所示活动实施设计静态店标店标设计活动二 活动三 活动一步骤7：选择组1，按“Ctrl+J”快捷键复制组1成为组1副本，选择组1副本，按“Ctrl+T”快捷键，调整中心点，如图2.1.10所示。设置旋转角度为60，按方向键，向右移动2次，向下 移动2次，按“Enter”键确定。活动实施设计静态店标店标设计活动二 活动三 活动一步骤8：复制组1两次，分别旋转120、180，并按方向键，向右移动2次，向下移动2 次，按“Enter”键确定。步骤 9：复制组 1 两次，分别旋转-60、-120，并按方向键，向左移动 2 次，向下 移动 2 次，按“Enter”键确定。经过多次复制组、旋转和调整位置后，效果如图 2.1.11 所示。步骤10：选择“横排文字工具”，字体为字语文跃体，字号为40点，字体颜色为白色（R：255，G：255，B：255），输入店铺名“拾光”，保存图片，最终效果如图2.1.12所示。活动实施设计静态店标店标设计综合案例项目完成评价表 案例名称：文创产品店铺装修制作静态店标。案例背景：黄巧团队已完成店铺开设的所有工作，接下来，在商品上 架销售之前，她们要对店铺进行装修，首先要做的是给店铺设计一个店 标。实训目的：掌握撰写店标设计理念和制作静态店标。实训要求：挖掘文创产品的文化内涵，根据网店名称“艺尚”结合 店铺销售产品的内涵,创意设计静态店标，并写出设计理念。设计静态店标店标设计活动三 活动一 活动二 活动背景店标的作用在于展示店铺名称、风格和售卖的商品类目。晓玲设计完静态店标，还打算制作动态店标，以达到更好的效果。考虑到店标尺寸较小，决定设计简单的动画效果。设计动态店标店标设计活动三 活动一 活动二步骤 1：新建文件，颜色模式为 RGB 颜色，分辨率为 72 像素/英寸，背景内容为透明，尺寸宽度为 100 像素、高度为 100 像素。步骤 2：设置前景色为黄色（R：255，G：232，B：186），选择“矩形选 框工具”，设置样式为“固定大小”，宽度为 72 像素，高度为 100 像素，新 建图层，绘制矩形选区。步骤 3：选择“渐变工具”，在“渐变编辑器”中设置为从“前景色到 透明渐变”，选择“对称渐变”，为矩形选区填充渐变色，效果如图 2.1.15 所示。活动实施设计动态店标店标设计活动三 活动一 活动二步骤4：置入素材“练习素材/项目2/拾光静态logo.png”。步骤5：选择“移动工具”，将矩形选区拖到Logo文件处，按“Ctrl+T”快捷键，调整大 小，适当旋转，如图2.1.16所示，按“Enter”键确定。步骤 6：按住“Alt”键，在图层 0 和图层 1 之间单击，创建剪贴蒙版。步骤 7：选择“窗口”“时间轴”，单击第 1 帧，移动图层 1 中的矩形选框到左上角，效果如图 2.1.17 所示活动实施设计动态店标店标设计活动三 活动一 活动二步骤 8：在“时间轴”上单击“复制所选帧”，单击第 2 帧，移动图层 1 中的矩形选框 到右下角，效果如图 2.1.18 所示。步骤 9：在“时间轴”上单击第 1 帧，选择“过渡动画帧”，设置要添加的帧数为“20”，单击“确定”按钮。步骤 10：选择“件”“存储为 Web 所用格式”，选择格式为“GIF”，单击“存储”，输入文件名，选择格式为“仅限图像”，单击“保存”按钮，最终效果如图 2.1.19 所示活动实施设计动态店标店标设计综合案例项目完成评价表 案例名称：文创产品店铺装修制作动态店标案例背景：黄巧团队已完成静态店标的设计与制作，为了达到更好 吸引买家的效果，经过商讨，她们决定在静态店标的基础上设计一个动 态店标。实训目的：掌握动态店标的设计与制作。实训要求：在静态店标的基础上，创意设计动态店标。打开素材“综合案例素材/项目 2/艺尚静态 logo.psd”，根据效 果图设计文创产品网店的动态店标。设计动态店标谢谢