项目6 任务3 活动2教案 多热区切图模块的使用_第1页
项目6 任务3 活动2教案 多热区切图模块的使用_第2页
项目6 任务3 活动2教案 多热区切图模块的使用_第3页
全文预览已结束

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

教师课时教学设计教学日期学习班级学习地点教学内容多热区切图模块的使用教学目标知识能力:1、了解多热区切图的定义、作用及尺寸要求。

2、熟练掌握多热区切图的设计要点和后台操作流程，能合理划分热区并添加链接。过程和方法:1.情景带入，导入新课；2.核心知识，探索新知；

3.任务驱动，实操应用；4.归纳总结，布置作业。情感态度和价值观:培养用户体验思维与页面优化意识。提高设计的实用性和后台操作的规范性。教学重点掌握多热区切图的尺寸要求、设计要点（热区划分、链接添加）及后台操作流程。教学难点能结合店铺运营需求合理设计热区范围与链接，独立完成多热区切图的制作与应用。课型实训课教具多媒体机房实训内容任务——结合店铺需求，在千牛后台完成多热区切图的设计、热区划分及链接添加操作。课堂组织形式1、教师主导，学生主体2、任务驱动的实训课程教师教的过程设计学生学的过程设计设计意图时间一、情景导入：店铺想通过海报实现“查看同款不同色”“领取优惠券”等多路径引导，但现有海报无点击入口，用户流失严重。如何利用多热区切图解决这一问题？多热区切图的设计和使用需要注意什么？探索新知：

1.多热区切图核心知识：

（1）定义：含多个可点击区块的图片，用于多商品/主题展示；

（2）作用：承载多元信息，分流用户，提升页面跳转效率与转化可能性；

（3）尺寸要求：宽度1200px，高度120px～2000px，支持jpg/png格式，大小≤2兆；

（4）设计要点：合理设置热区范围与链接，与店铺运营需求深度绑定，可添加多个热区。

2.任务一：根据尺寸要求和设计要点，判断案例合理性并说明理由。思考店铺海报引导问题的解决方案，明确本节课学习目标。学习多热区切图的定义、作用、尺寸及设计要点，完成任务一判断练习。引起学生思考，激发学生学习兴趣。通过理论讲解和案例分析，夯实基础，明确设计规范。。5分钟15分钟教师教的过程设计学生学的过程设计设计意图时间三、学以致用，实施任务

实训任务：多热区切图设计与应用实操

操作步骤指导：

1.入口进入：【千牛工作台】—【店铺】—【店铺装修】—【配置与装修】—【自定义页面】，首次设置需新建页面；

2.模块添加：点击【装修】，选择【多热区切图】模块拖至页面，填写模块名称；

3.图片上传：点击【上传图片】导入制作好的图片，调整尺寸后点击【保存】；

4.热区设置：点击【添加热区】，拖拽划分区域；如需等大区域可点击复制，点击图标添加链接；

5.链接配置：进入链接页面选择对应类型（如优惠券），勾选信息后点击【确定】。任务：结合店铺需求，在千牛后台完成多热区切图的设计、热区划分及链接添加操作。四、归纳总结，布置作业1.回顾多热区切图的定义、作用、尺寸要求及设计要点；

2.梳理后台操作关键流程（页面进入、模块添加、图片上传、热区设置、链接配置）。按照步骤在千牛后台实操，完成多热区切图的上传、热区划分与链接添加。梳理本节课知识点和操作步骤，明确作业要求。强化理论到实践的转化，提升后台操作与实际应用能力。巩固核心知识，强化操作记忆，促进知识内化与技能提升。20分

人人文库> 全部分类> 教育资料 > 课件下载

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论