第6课 店铺装修(上)

课题第6课店铺装修（上）课时2课时（90 min）教学目标知识技能目标：1.了解店铺装修的基本流程2.了解店铺的风格管理3.了解店铺的布局设计4.掌握店铺装修的操作方法素质目标：领略中国前沿科技，增强民族自豪感和创新意识教学重难点教学重点：店铺装修的操作方法教学难点：店铺装修的操作方法教学方法问答法、讨论法、讲授法、练习法教学用具电脑、投影仪、多媒体课件、教材、文旌课堂APP教学设计考勤（2 min）→互动导入（5 min）→传授新知（22 min）→任务实操（36 min）→课堂实操（20 min）→课堂小结（3 min）→作业布置（2 min）教学过程主要教学内容及步骤设计意图考勤（2 min）⏹【教师】让学生使用文旌课堂app签到⏹【学生】班干部报请假人员及原因培养学生的组织纪律性，掌握学生的出勤情况互动导入（5 min）⏹【教师】讲述引导案例“开网店，‘门面功夫’也很重要”（详见教材），并提出问题大家在网购时一般会注意店铺的哪些方面？什么样的店铺容易激发你的购物欲望？⏹【学生】聆听、思考、回答通过对具体案例进行分析，激发学生的学习热情传授新知（22 min）⏹【教师】讲解新知：店铺装修的基本流程、店铺的风格管理、店铺布局设计的相关知识一、店铺装修的基本流程网店开设成功后，就可以对店铺界面进行装修了。

店铺装修的流程一般分为5个环节：①设置店铺基本信息；②选择店铺模板；③设置模板配色；④设置店铺背景；⑤设置店铺布局。

【多媒体】组织学生扫码观看“新版旺铺装修操作指南”视频（详见教材），让学生对店铺装修流程有一个更直观地了解二、店铺的风格管理店铺装修花样百出，如何吸引买家的眼球，是卖家关注的重点。

【师生互动】教师提出问题，并随机邀请学生进行回答通过教师讲解、师生互动、分组讨论与观看微课等方式，帮助学生了解店铺装修的基本流程、店铺的风格管理、店铺布局设计等相关知识如果让你来装修一家服装店，你会打造一个什么风格的？在设计时，你会注意些什么？【学生】聆听、思考、回答【教师】总结学生的回答，讲解店铺的风格管理通常来说，店铺装修最重要的是确定店铺的整体风格，不仅要注意与主营商品相符，还要注意色彩的协调搭配，同时还要满足消费者的心理和行为需求，以便更好地促进其消费。

另外，店铺的各个页面、元素最好也保持相同的风格，使店铺有整体感，以达到视觉营销的目的。

【知识延伸】讲解视觉营销的相关知识，拓展学生认知视觉营销属于营销技术的一种，它是一种视觉呈现，通过直观的视觉广告进行商品的营销。

视觉营销的目的是最大限度地促进商品与买家之间的联系，最终实现商品的销售。

对于网店而言，视觉营销就是利用店铺装修造成的视觉冲击力吸引潜在买家的关注，提升网店的流量，刺激潜在买家的购物欲望，从而使流量转变为销量。

1．商品与店铺风格店铺风格要与主营商品相符。

例如，女装类店铺适合采用插画、时尚可爱、桃心、花边等元素；男装类店铺适合采用黑白搭配、有金属质感的设计元素；童装类店铺适合采用卡通元素。

下面介绍几种经典搭配：【多媒体】展示”女装店铺”“潮流时装店铺”“儿童用品店铺”的图片（详见教材），讲解这些店铺的风格与搭配女装店铺：优雅风格，采用柔美简洁的首页，突出女性魅力，直接吸引买家眼球。

潮流时装店铺：时尚风格，采用现代潮流的首页，通过照片背景的选取、色彩色调的搭配与模特的时尚穿着，演绎现代风范。

儿童用品店铺：卡通风格，页面色彩明亮、形式丰富，突出儿童的活泼可爱。

2．色彩与店铺风格不同的色彩可以传达不同的情感，店铺装修时可以依据不同的店铺类型或风格选择相对应的颜色。

【多媒体】展示”色彩与店铺风格”的图片（详见教材），讲解不同类型店铺的色彩选择【知识拓展】讲解“新舱外航天服，颜色可辨航天员”的相关内容，拓展学生认知据中国载人航天工程办公室消息，北京时间2021年11月8日1时16分，经过约6.5小时的出舱活动，神舟十三号航天员乘组密切协同，完成出舱活动全部既定任务，航天员翟志刚、王亚平安全返回天和核心舱。

此次出舱，航天员的舱外航天服颜色成为亮点，人们可以通过舱外航天服的颜色辨别是哪位航天员。

身着带有红色元素舱外航天服的是 01 号航天员翟志刚，身着带有黄色元素舱外航天服的是 02 号航天员王亚平，还有一套带有蓝色元素的舱外航天服此次没派上用场。

中国航天员科研训练中心航天员系统舱外服总装主任设计师丁凌艳介绍，舱外服A 和舱外服B带有的颜色分别是国旗红和太空蓝，舱外服C带有的颜色国旗黄，就是国旗上星星的颜色，主要是为了让两名航天员有不同的标识，方便区分。

从神舟十三号航天员的出舱活动中，我们不仅领略到了中国航天事业的飞速发展和科技的腾飞，也感受到了科技与艺术相结合的魅力。

3．买家行为与店铺风格买家行为：买家购物时的行为活动是本身需要和客观影响的综合反映，店铺装修时应针对买家的一系列行为活动确定店铺的装修风格，使买家顺利完成购物行为。

认识过程与视觉心理：根据视觉心理学原理，卖家可增强商品与背景的对比度、掌握适当的刺激强度，合理地确定商品的标志、广告的数量与位置，以及布局的划分范围等。

【提示】消费潮流处于不断地变化中，所以卖家应及时调整店铺布局，以适应电商的不断发展。

三、店铺布局设计【师生互动】教师提出问题，并随机邀请学生进行回答同学们在网店购物时有关注过店铺的布局吗？分享一下你主要关注哪些地方。

【学生】聆听、思考、回答【教师】总结学生的回答，讲解店铺布局设计网店的店面是由店铺页面构成的，针对网店的布局设计就是对不同页面进行规划和功能设计。

在淘宝网上，店铺有三大页面，分别是店铺首页、宝贝列表页和宝贝详情页。

【多媒体】展示”店铺三大页面构成”的图片（详见教材），讲解店铺页面构成的具体内容【提示】不同的店铺装修模板中，店铺三大页面的内容布局会有所区别，但所包括的模块基本相同。

【课堂讨论】教师组织学生分组，围绕以下问题开展讨论假设你是一个网店经营者，请结合店铺的主营商品，谈谈你会如何装修店铺？【学生】聆听、分组、思考、讨论【教师】巡堂辅导⏹【学生】聆听、思考、理解、记忆任务实操（36 min）⏹【教师】讲解任务实操的相关内容任务实操一——装修个人网店一、设置店铺基本信息【多媒体】组织学生扫码观看“设置店铺基本信息”视频（详见教材），让学生了解设置店铺基本信息的具体方法通过具体的任务实操，帮助学生熟悉装修个人网店的具体操作，并能做到学以致用以淘宝网为例，店铺的基本信息包括店铺名称、店铺标志、联系地址等，具体设置方法如下：第一步：登录淘宝网，在首页中单击“千牛卖家中心”超链接。

第二步：打开“千牛卖家中心”页面，在左侧的导航栏中选择“店铺”→“店铺信息”选项，打开“基础信息”页面。

【多媒体】展示”‘基础信息’页面”的图片（详见教材），讲解设置店铺信息时的注意事项第三步：在“联系地址”设置区中填写淘宝店铺企业所在地址或店主个人的常用地址。

第四步：设置店标。

所谓店标，就是店铺的标志，也就是我们常说的logo。

默认情况下，淘宝会提供一个店铺标志，将鼠标指针移至该标志上方后，单击“删除”图标可删除默认店标，接着单击“上传图片”按钮，在打开的对话框中根据提示进行操作，可上传素材图片作为店标。

【提示】在淘宝网中，店标文件的格式一般为png、jpg、jpeg，大小不超过3 MB，最小宽度为120 px、最小高度为120 px，宽高比为1∶1。

【多媒体】展示”更换店标”的图片（详见教材），讲解更换店标的操作步骤二、选择店铺模板用户可以免费使用淘宝提供的店铺模板，也可以在装修市场购买模板，操作步骤如下：第一步：在“千牛卖家中心”页面的左侧栏中，选择“店铺”→“PC店铺装修”选项，在打开的页面中单击“装修模板”超链接。

第二步：打开“模板管理”页面。

系统自带3个模板，可以任选其一，单击其下方的“马上使用”按钮即可应用该模板。

第三步：单击“返回装修”按钮，打开“淘宝旺铺”页面，可以看到系统模板应用成功。

【提示】淘宝旺铺默认打开店铺首页的编辑页面。

三、设置模板配色选定店铺模板后，便可以为店铺模板设置配色了，具体操作如下：第一步：打开“淘宝旺铺”页面，单击左侧栏中的“配色”按钮，在打开的“配色方案”页面中选择任意一款配色方案，即可应用该配色方案，并在右侧的店铺预览窗格中显示最终效果。

第二步：单击“配色方案”页面右上角的“预览”按钮，可以预览店铺应用模板和配色方案后的整体效果。

第三步：单击页面右上角的“发布站点”按钮，在打开的对话框中单击“确认发布”按钮，淘宝店铺将应用所做的设置，单击“返回”按钮可返回配色方案页面。

四、设置店铺背景店铺背景分为页头背景和页面背景，下面介绍两者的设置方法：第一步：打开“淘宝旺铺”页面，在左侧栏中单击“页头”按钮，在打开的“页头设置”页面中勾选“显示”复选框，并单击“页头背景色”右侧的颜色块，打开调色器。

第二步：在调色器中选择页头背景色（可根据自身喜好进行选择），然后单击“确定”按钮，应用设置。

第三步：在“页头设置”页面中单击“页头背景图”区域中的“更换图”按钮，可以在打开的对话框中上传一张图片作为页头背景。

注意：页头背景图片的大小不能超过200 KB，图片的格式要求为gif、jpg或png。

第四步：在“页头设置”页面左侧单击“应用到所有页面”按钮，将当前页头背景设置应用到所有页面。

第五步：单击左侧栏中的“页面”按钮，参照页头背景的设置方法，设置页面背景即可。

五、设置店铺布局第一步：设置首页布局。

在“淘宝旺铺”页面中单击“布局管理”按钮，打开“布局管理”页面。

第二步：添加布局单元。

单击“添加布局单元”按钮，在打开的对话框中选择想要的布局，如选择“950/1920（通栏）”。

第三步：返回“布局管理”页面，可看到新添加的布局单元，如图4-18所示。

单击其右侧的“移动”按钮可拖动该布局单元到任意合适的位置。

【提示】卖家可以根据需要添加多个布局单元。

CSS是一种样式表语言，能够对网页中元素位置的排版进行精确控制，支持几乎所有的字体字号样式，具有对网页对象和模型样式编辑的能力。

淘宝旺铺的CSS功能需要购买才能使用，卖家可以根据自身需求决定是否订购该功能，此处不再赘述。

第四步：查看模块。

模块分为4类：一是通栏宽度为190 px的模块，有13种；二是通栏宽度为750 px的模块，有7种；三是通栏宽度为1 920 px的模块，有3种；四是通栏宽度为950 px的模块，有12种。

【提示】要使用通栏宽度为1 920 px的模块，需先将淘宝旺铺升级为智能版。

为此，可在“淘宝旺铺”页面左上角单击“升级到智能版”超链接，在打开的页面中根据提示进行升级操作。

第五步：选择所需模块，并拖动至合适位置。

本例在所有尺寸类型下，选择添加“自定义区”模块。