网店基础与制作 6

项目6任务一认识手机淘宝店铺装修实训指导书专业：班级：学号：姓名：课程名称：项目合作者：实训时间：第周地点：工位号一、实训目标知识目标：了解手机淘宝店铺装修的基本流程、平台规范及各模块的功能作用掌握手机淘宝轮播图、单图海报等核心视觉模块的尺寸标准和设计原则掌握手机淘宝优惠券设置和多热区切图模块的使用规则能力目标：能对手机淘宝店铺进行装修，完成轮播图、单图海报等模块的设计与制作能根据店铺定位优化页面布局，通过页面装修提升页面吸引力和加载效率素养目标：形成以用户需求为导向的设计思维培养学生创新与创新素养任务1认识手机淘宝店铺装修活动1认识手机端与电脑端店铺装修的区别【活动目标】让学生初步感知手机端与电脑端店铺装修的直观差异，为后续学习奠定基础。引导学生在国货品牌案例的解析中深刻感悟文化传承和技艺创新的力量，建立对“中国智造”的认同感与自豪感。【活动实施】

以国产包pmsix旗舰店的店铺装修为例。登录pmsix旗舰店的手机淘宝店铺及电脑端淘宝店铺，观察两种店铺的店铺装修视觉效果。任务1pmsix旗舰店双端口对比观察填表操作要求：电脑网页登录pmsix旗舰店（PC端）、手机淘宝APP搜索pmsix旗舰店，分别观察屏幕布局、导航形式、轮播图内容，完整填写下表，国产包pmsix店铺观察任务单观察项目电脑端展示手机端展示初步结论屏幕布局导航形式轮播图内容表6.1.1任务2差异截图采集与标注操作要求：（1）截取PC端、手机端店铺关键差异截图，共3-5张；（2）在每张截图上用方框标注差异区域,并附简短文字说明该位置PC与手机的区别；截图粘贴区：【活动评价】评价维度评价细则分值学生自评得分教师自评得分对比任务单填写三大观察项目描述完整，对比结论精准，抓住移动端轻量化核心特点40截图实操作业截图数量3-5张，差异标注清晰，文字说明简洁准确30拓展任务完成度完整完成小米旗舰店对比表格，自主分析到位30【活动拓展】观察“小米官方旗舰店”PC端和手机端店铺装修的异同。按照图6.1.1的要求完成相应的任务单。任务1认识手机淘宝店铺装修活动2初探手机淘宝店铺的装修【活动目标】了解手机店铺结构和常用模块的操作流程,并能正确上传素材，查看预览效果。【活动实施】

任务1装修后台进入操作记录按步骤完成操作，填写每一步关键操作要点，完成后打“√”操作步骤操作内容操作关键记录是否完成1打开电脑端千牛工作台，扫码登录卖家账号登陆方式：2找到【开店入驻】功能入口入口位置：3点击页面右下角【装修】按钮进入手机旺铺装修进入后页面分为：左侧模块区、____、右侧编辑区任务2轮播图模块完整实操记录表以素材“白色包”完成整套操作，填写全部信息。操作步骤实操内容填写实训信息是否完成1左侧找到【图文类】-【轮播图海报】模块拖拽目标区域：2拖拽模块至中间预览画布拖拽后页面变化：3右侧编辑栏填写模块名称自定义模块名称：________4上传素材文件夹中“白色包”图片上传图片数量：5点击保存按钮完成编辑保存后预览区效果描述：6测试模块上下移动、删除功能模块调整操作按钮位置：任务3实操问答题（上机完成后书面回答）1.拖拽多个模块后，如何调整模块上下展示顺序？2.若添加多余无用模块，该如何删除？3.上传图片后未点击保存，刷新页面会出现什么现象？【活动评价】通过本活动的学习，小可依据操作评价表，检测自己对手机店铺装修模块认知、模块操作和图片上传等操作是否正确。学生操作评价表序号内容评价要点分值自评诊断情况1模块认知正确认识手机端店铺核心区域的名称和常用模块352模块操作完整对各个模块调整、删除、编辑353图片上传能正确上传图片并完成预览效果30合计100表6.1.1【活动拓展】对店铺装修的常用模块调整、删除、编辑，打开6.1.2文件夹，上传文件夹中“条纹包”素材并预览效果。任务2装修手机端淘宝店铺首页活动1手机端淘宝轮播图海报的设计与制作【活动目标】1、熟练掌握手机淘宝轮播图的尺寸规范，并运用设计工具（如PS、在线设计平台），独立完成至少3张符合箱包类商品推广需求的手机端淘宝轮播图海报的设计与制作。2、理解轮播图海报对店铺流量、转化的作用，培养以用户视角优化视觉营销素材的思维，提升店铺装修视觉设计能力。【活动实施】

任务1轮播图海报设计流程记录根据课堂操作，完成下表填写。表格设计步骤具体操作内容学生填写记录完成情况√/×1新建画布画布尺寸：____px×____px2导入商品素材导入素材名称：____3调整商品位置构图方式：____4设置背景效果背景风格：____5添加装饰元素添加元素：____6添加品牌标识logo位置：____7添加卖点文案文案内容：____8保存文件文件名：____格式：____9上传并预览预览方式：____任务2白色包轮播图海报设计设计要求：画布尺寸：1440px×800px。商品主体：以“白色包”为核心，采用中心构图。背景风格：浅色渐变或清爽干净背景。画面元素：商品主体、背景、装饰、阴影、品牌标识、卖点文案。文案要求：简洁明了，突出白色包的风格、用途或卖点。保存格式：JPG或PNG。上传要求：上传至手机端店铺轮播图模块，并进行手机端预览。我的设计思路：请从商品、色彩、文案、构图四个方面说明设计思路。商品主体处理：背景与配色：构图方式：文案设计：任务3卖点文案设计为白色包轮播图设计3条不同风格的卖点文案。文案序号文案内容文案侧重点文案1突出外观风格文案2突出使用场景文案3突出购买理由任务4手机端预览与优化上传轮播图后，通过手机淘宝扫码预览，并思考以下问题。手机端预览时，商品主体是否清晰突出？文案在手机屏幕上是否容易阅读？背景和装饰是否影响商品展示？你会进行哪些优化调整？【活动评价】通过本次活动，小可依据任务评价表，从尺寸规范、卖点呈现、视觉美观、风格适配等维度，对自己的作品打分并给出具体评价建议，从而更好地掌握了轮播图海报的设计要点，并进一步优化设计。学生作品评价表序号内容评价要点分值自评诊断情况1轮播图设计内容突出产品主体15核心卖点提炼15品牌标识102轮播图设计技术构图技巧10色彩搭配10文案排版10特效与细节优化103轮播图设计效果尺寸规范合理10风格统一10合计100表6.2.1【活动拓展】根据评价表要求，继续优化轮播图海报设计，并使用素材中其他颜色和款式的皮包制作2张轮播图海报，上传淘宝旺铺后台。任务2装修手机端淘宝店铺首页活动2优惠券的设计与制作【活动目标】掌握手机淘宝优惠券的构图与排版，并运用设计工具（如PS、在线设计平台），能独立完成优惠券的设计与制作。【活动实施】

任务优惠券的设计与制作按照操作步骤填写实训信息，完成打√操作步骤实操步骤学生填写实训信息是否完成1新建画布并确定优惠券构图画布尺寸：____×____px；构图方式：左右各一张，横版，可借助参考线2确定配色方案背景色：（暗红色）；边缘色：（蓝色互补色）；文案底色：____（白色3文字排版与内容设计字体大小/粗细调整重点：突出“优惠面值”；宣传文案内容：____4完善细节装饰点缀元素：（形状工具绘制）；补充色块：白色色块下方添加（蓝色色块）【活动评价】通过本活动的学习，小可掌握了优惠券的设计要点，包括构图布局合理，选用商品图片或者文字，文字编排与设计能有效吸引注意力，整体颜色搭配效果好。并依据作品评价表对自己的学习效果进行评价检测。学生作品评价表序号内容评价要点分值自评诊断情况1优惠券设计内容优惠信息清晰（面额、使用门槛等）15活动主题突出15元素呈现102优惠券设计技术版式布局合理性10色彩视觉吸引力10文字信息易读性10装饰元素适配性103优惠券设计效果尺寸规范合理10风格统一10合计100表6.2.2【活动拓展】为店铺设计优惠券：5元无门槛优惠券；满199减10、满299减20、满799减100优惠券。要求主题突出；构图合理，配色运用得当。任务2装修手机端淘宝店铺首页活动3单图海报的设计与制作【活动目标】1、掌握手机端淘宝皮具包包单图海报设计原则、制作工具操作，能独立完成符合产品特色与店铺需求的海报。2、提升学生电商视觉营销实践能力，助力日后从事相关工作或店铺运营。【活动实施】

任务1海报设计流程记录表按照操作步骤填写实训信息，完成打√操作步骤实操步骤学生填写实训信息是否完成1新建PS画布画布尺寸：____×____px2导入卡其色包素材商品缩放+旋转角度：3添加浅灰磨砂背景背景素材特点：4添加阴影、绿植装饰装饰元素作用：5添加宣传文案文案内容：6保存设计文件文件命名：____格式：____7千牛上传+手机扫码预览手机预览整体感受：任务2设计思路分析题结合本次单图海报，从4个维度书写设计思路设计维度设计思路构图设计（斜角构图）：画面细节（阴影、绿植、留白）：色彩搭配（浅灰背景+卡其皮包）：文案定位（新品通勤主题）：任务3文案创意设计为箱包单图海报创作3组差异化短文案文案序号文案内容文案定位方向文案1新品主推款文案2通勤日常场景文案3质感牛皮卖点任务4预览优化问答题上传海报扫码后，结合手机屏幕效果作答1、斜角摆放的包包在手机小屏里是否清晰突出？2、绿植、阴影装饰会不会遮挡箱包主体？3、文字大小在手机端是否清晰可读？存在什么问题？写出2条优化海报的调整方案：①____________________________________________________②____________________________________________________【活动评价】通过本次活动，小可依据作品评价表，从尺寸规范、卖点呈现、视觉美观、风格适配等维度，对自己的作品打分并给出具体评价建议，从而更好地掌握了轮播图海报的设计要点，并进一步优化设计。学生作品评价表序号内容评价要点分值自评诊断情况1单图海报设计内容突出产品主体15核心卖点提炼15品牌标识102单图海报设计技术构图技巧10色彩搭配10文案排版10特效与细节优化103单图海报设计效果尺寸规范合理10风格统一10合计100表6.2.3【活动拓展】根据评价表，继续优化单图海报设计，并根据店铺提供的其他颜色和款式皮包，针对“优惠券”“促销活动”

核心信息，设计制作单图海报，并上传淘宝旺铺后台。任务3手机端多热区切图的使用活动1优惠券的设置【活动目标】了解手机优惠券设计方法，能掌握正确设置和上传优惠券的方法。【活动实施】

任务优惠券的设置按照操作步骤填写实训信息，完成打√操作步骤实操步骤学生填写实训信息是否完成1

进入页面装修，添加店铺优惠券模块路径：【页面装修】→【官方模块】→【基础模块】→【营销互动类】→【店铺优惠券】；拖放至轮播图下方；样式可选“官方样式”或“鹿班样式”2选择优惠券样式本案例选择【官方样式】；也可选【鹿班样式】并点击“去鹿班选择”调用设计样式3新建优惠券活动路径：【千牛后台】→【营销】→【营销工具】→【优惠券】；点击“新建店铺优惠券”进入创建页面4完善优惠信息填写【基本信息】和【优惠信息】；完成后点击【提交风险校验】返回列表5管理优惠券在【管理优惠券】列表查看活动；可点击【修改】编辑，或先【结束】再删除6完成上传并手机预览在页面装修的【店铺优惠券】右侧点击选择图标，勾选对应优惠券，点击【确定】；手机浏览最终效果7

进入页面装修，添加店铺优惠券模块路径：【页面装修】→【官方模块】→【基础模块】→【营销互动类】→【店铺优惠券】；拖放至轮播图下方；样式可选“官方样式”或“鹿班样式”【活动评价】通过本活动的学习，小可依据操作评价表，在手机淘宝页面进行的优惠券设置时，从基本信息的完整性、优惠券使用规则正确性和优惠设置力度的可行性这几个方面进行评价。学生操作评价表序号内容评价要点分值自评诊断情况1优惠券基本信息设置完整性优惠券基本信息是否完整（包括券名称、面额、使用门槛、有效期）352优惠券使用规则的正确性优惠券使用规则设置是否正确（如满减金额与门槛匹配、有效期是否合理）353优惠力设置力度的可行性优惠券的优惠力度是否合理（如“满200立减30”）20合计100表6.3.1【活动拓展】在以上步骤（2）中为优惠券选择【鹿班样式】，在【样式装修】中点击【去鹿班选择】，选择一些设计好的样式，查看效果。在以上步骤（3）中新建【商品满减券】并设置优惠信息，查看效果。任务3手机端多热区切图的使用活动2多热区切图模块的使用【活动目标】1、理解多热区切图的定义、在手机淘宝购物场景中的作用。2、掌握多热区切图设计制作的关键技巧，合理划分热区，提升设计的科学性与实用性。3、能够独立完成符合店铺需求的多热区切图设计与应用。【活动实施】

任务多热区切图模块的使用按照操作步骤填写实训信息，完成打√操作步骤实操步骤学生填写实训信息是否完成操作步骤实操步骤关键操作/填写信息1进入店铺装修自定义页面路径：【千牛工作台】→【店铺】→【店铺装修】→【配置与装修】；点击【自定义页面】，首次设置需新建页面2添加多热区切图模块点击【装修】进入页面；将【多热区切图】模块拖至所需位置，并填写模块名称3上传设计图片并保存点击【上传图片】导入制作好的图片；调整合适大小后点击【保存】4添加热区上传优惠券图片后，点击【添加热区】5调整热区区域及链接拖拽热区至所需大小；可点击复制图标复制等大热区，或