HTML移动基础开发教程9

常州信息职业技术学院单元设课程：课程：内容：单元8综合项目制作学时：设计摘要教学 课题课程学时安排4学时年级高职二年级所选教材HTML5移动Web开发任务教程，叶品菊，人民邮电出版社，2023年1月一、教学背景创作思路：针对传统教学无法解决的教学难题进行设计，在工学结合模式下，采用案例教学法，依托信息化教学环境，整合数字化教学资源，优化教学过程。以学生为中心，教师为主导，在教学的各环节充分运用VSCode开发工具、在线教学平台等信息化手段解决教学重点难点问题。设计特色 ：1．教学过程成果导向化：根据“体验→探究→应用→创新”学生能力递进培养思路，构建“三阶六环，能力递进”教学模式。以“导→探→析→练→评→创”的形式实施教学活动，引导学生自主探究，降低了学习难度，提高学习兴趣和课堂参与度，教学过程实现“教、学、做、创”大融合；2．教学资源数字化：丰富的课件、经典作品、视频等资源可供学生在线学习；3．网络平台融合化：紧紧围绕VSCode开发工具，融入中国大学MOOC慕课堂、动画、在线教学平台等信息化手段进行教学完成教学目标，突破重点、难点；4．学习评价多元化：结合作品展示、小组汇报等多种方式，采用企业专家评价、学生自评、师生互评等多种手段形成动态化、多元化的评价体系，从技术创新等提升情况探索个性增值评价。二、学习目标与内容1.学习目标 知识目标：掌握Bootstrap的使用；掌握Bootstrap的布局方法；掌握项目答辩要点。能力目标：能使用Bootstrap框架；能使用Bootstrap进行网页的排版；能领悟答辩要点、熟悉评分标准；素质目标：培养学生高效利用时间进行自主学习的能力；培养学生善于收集信息和良好的自学能力；培养学生理论联系实际，善于发现问题并积极寻求解决问题方法的能力。2.学习主要内容 （1）Bootstrap框架的使用（2）Bootstrap的布局方法（3）答辩要点、评分标准3.学习重点及难点教学重点：（1）Bootstrap的布局方法；（2）Bootstrap框架的使用。教学难点：（1）答辩要点、评分标准。三、学情分析授课对象是高职二年级的学生，通过之前静态网页设计技术课程的学习，有一定的网页分析和编写能力，但搭建网页框架、复杂网页效果设置的高阶编程的能力还有所欠缺；学习过程中学习动机不足，自我效能感低，意志力待提升，喜欢形象有趣，能够动手实践的学习，适合“做中学”，并希望在学习中得到即时反馈和评价。四、学习环境选择与学习资源设计1.学习环境（1）教学硬件：多媒体教室；（2）教学软件：极域电子教室、课程在线教学平台等。2.学习资源类型（1）课程在线教学平台（2）教材（3）中国大学MOOC慕课堂3.学习资源内容简要说明爱课程（中国大学MOOC）平台《移动Web开发》在线开放课程有多媒体课件、微视频、试题库等多种数字化资源；使用教材是《HTML5移动Web开发》。五、学习情境创设项目开发是一项长期且不可间断的过程。通过课堂学习之外,在碎片时间多多利用互联网资源,沉浸于开发环境,也是很有必要的。项目有创意、功能完善会给项目加分，个性化的项目演示同样重要。六、教法学法设计（1）引导启发法：运用信息技术营造学习情境，设疑导入，激发兴趣；（2）案例驱动法：设置创设情境、知识探究、应用案例分析、实践操练、总结评价四个教学环节，学生根据掌握的知识和具备的技能来完成任务，并以此推动下一任务的操作；（3）协作讨论法：在设计过程中学生小组协作，互相探讨，直至任务设计的实现。

七、教学过程设计-购票网步骤1：课前准备教学内容师生活动教学方法教学手段教师学生提前告知学生课程学习内容及布置课前任务：Bootstrap基础Bootstrap布局答辩要点、评分标准通过爱课程平台发布通知及布置课前任务，告知学生即将学习的课程内容，并在平台发布与课程内容相关的授课录像、课件等资源，让学生提前预习。2、问题设疑（1）综合项目开发流程与要点？（2）如何通过个性化演示与答辩为项目加分？查看在线学习平台公告，提前通过平台观看微课程视频、阅读教材预习相关课程内容。通过信息化手段和技术发布告知学生学习内容。1、1、《移动Web开发》课程在线教学平台2、教材3、中国大学MOOC慕课堂设计意图教师通过信息化手段向学生提前发布即将学习的课程内容，意在让学生养成良好地运用信息技术手段进行知识获取及自主探究的习惯，培养自身信息素养，也为课程教学做好准备。步骤2：引例描述时间：5分钟教学内容师生活动教学方法教学手段教师学生引例描述：英语学习网首页。设疑：同学们，项目答辩要点是什么？如何紧扣评分标准？1、思考老师提出的问题，踊跃回答；2、分组讨论。1、教师讲解；2、头脑风暴；3、分组讨论。1、多媒体2、课件设计意图通过演示，引发学生思考，激发了学生的兴趣，学生一下子就投入到课堂中，这激发了学生强烈的学习愿望和高涨的学习热情。为接下来让学生积极主动地参与到学习活动中来做好了情感上的准备。步骤3：知识探究时间：35分钟教学内容师生活动教学方法教学手段教师学生1.1Bootstrap基础1.2Bootstrap布局1.3项目答辩要点、评分标准解析1、引导学生借助在线课程平台获取知识进行自主探究；2、组织学生讨论和分享；3、参数讲解和对比分析；4、通过课件进行归纳小结。1、学生登录在线课程平台获取知识进行自主探究；2、认真观察教师讲解演示，对于教师的归纳，仔细听讲、思考、记录笔记。1、问题引导；2、分组讨论；3、讲解演示；4、分析归纳。1、课程在线教学平台2、课件设计意图通过引例引入本节课所需要学习的知识点，为了让学生能够直观感性地理解知识点，由教师首先进行讲解演示，结合知识点讲解案例，为接下来的学生实践操练提前做好铺垫。步骤4：思政小课堂时间：5分钟教学内容师生活动教学方法教学手段教师学生展示思政小课堂思维导图：探究科学思维，通过挖掘程序设计中蕴含的实验思维，借助思维导图等工具帮助学生理清项目思路、进行汇报。勇于探索创新,不断提高自己各方面的能力。任何学习，都会让我们终身受益。1、展示思政小课堂思维导图，设问并提出思考，组织学生进行讨论和分享；2、通过课件进行归纳小结。1、思政小课堂讨论、分享；2、对于教师的归纳，仔细听讲、思考、记录笔记。1、问题引导；2、分组讨论；3、分析归纳。1、思维导图2、课件设计意图将思政内容融入到课程学习中，以“探究科学思维”为宗旨，使思想政治理论教育与专业教育协调同步、相得益彰，真正实现在课堂教学主渠道中全方位、全过程、全员立体化育人。步骤5：作品展示时间：95分钟教学内容师生活动教学方法教学手段教师学生学生展示：1、演示+介绍作品，介绍项目的设计思路和创新点。2、老师和同学提问，每位同学回答和作品相关3个问题。1、针对性提问；2、指出项目的优缺点。提出改进的思路。1、演示+介绍作品；2、回答问题。1、讲练结合；2、分组讨论；3、利用信息化手段寻求帮助，化解难点；4、动手实践。1、课程在线教学平台2、中国大学MOOC慕课堂设计意图教师和学生共同探讨项目，同学间互相提问，增加了交流互动，同时激发了学生对新知识的探索力。引导学生学会利用各种不同的信息化手段寻求帮助，使学生得到更多的启发，与此同时，让学生在自主探究中体验成功的乐趣，增强对新知识的索取能力。步骤7：评价总结时间：20分钟教学内容师生活动教学方法教学手段教师学生在线测验课堂总结1、组织交流；2、企业专家点评；3、课堂总结