1、 1 教学设计方案 设计设计摘要摘要 教学题目 网店装修之 banner 设计 课 程 电子商务 学时安排 2课时 （80分钟） 年 级 高二级 人数 43 所选教材 高等教育出版社 赵志军主编 图片拍摄与处理 设计依据设计依据 依据计算机课程标准、学习者特征分析、现代教育技术理论及建构主义学习理论，课程课程 是是有生命力的，应该以就业为导向，以职业为载体的人的全面发展有生命力的，应该以就业为导向，以职业为载体的人的全面发展。中职课程以工作经验为 学习过程，以人才培养为核心，结合信息技术课程“开放、多元、动态开放、多元、动态”的特征，学生的学 习要体现“主动、开放、个性、持续主动、开放、个性、
2、持续”的特点，营造良好的信息环境，为信息技术教学活动 提供先进的学习平台；关注全体学生，建设有特色的信息技术课程；培养解决问题的能力， 倡导运用信息技术进行创新实践；注重交流与合作，共同建构健康的信息文化。 引导学生从课本的导航栏设计入手，以“超越教材、贴近生活、激活课堂超越教材、贴近生活、激活课堂”的为教学理 念，引入淘宝网店中的 banner 设计，与网店装修职业工位相对接，让学生学以致用，扩展所 学知识，引入 banner 模拟设计体验，从静态 banner 到动态 banner 的知识提升，从较难的软 件操作转移到简单好用的在线 banner 设计，使课本知识点在电子商务网店装修中得到
3、进一步 深化。 一、学习目标一、学习目标与内容与内容 1 1学习目标学习目标 （1）知识与技能：能够比较灵活地运用 PhotoShop、fireworks、imageready 等软件进行图 片处理及设计出个性化的 banner；能使用阿里妈妈 Banner Maker 设计动态 banner 并发布到 网店相应位置。 （2）过程与手段：采用图片、视频、淘宝网店平台等信息化手段，将常见的导航栏设计引入 到网店装修操作。 （3）情感态度与价值观：引导学生养成源于课本又高于课本的学习理念，同时对学生进行美 感的培养和自主探究学习的训练。 2 2学学习内容习内容 （1）教材分析：本课选自图片拍摄与处
4、理教材中模块五网店装修-巧饰“庙宇添“香 火的任务二“导航栏制作” 。整个网店装修模块中，主要介绍背景制作、导航栏制作、客服栏 制作、分类栏制作、商品区制作等操作，没有涉及到网店中的动态 banner 设计知识。 （2）学习形式：开展小组竞赛，合作协同方式。以小组为单位，展开“最美 banner”评比， 按照评价标准采用多元评价方式。 （3）学习结果：使学生学以致用，积极补充课外知识，提高网店装修职业岗位能力。 3 3学习重点及难点学习重点及难点 教学重点：1.掌握 banner 设计方法，及为突出主体而进行文字、图片等的表现手法。 2.了解网店装修岗位的职业技能。 教学难点：1.根据 ban
5、ner 设计需要进行图片、文字素材合理加工处理。 2.掌握 banner 的结构、色彩和动态效果的搭配。 4 4问题设计问题设计 2 （1） “我心中的最美 banner”环节：引导学生从观察的图片给 banner 下一个定义，什么是 banner？有什么作用？ （2） “banner 之意”环节：banner 最佳的视角是什么？引导学生分析一个合格的 banner 需 要具备那些元素 （3） “banner 初创作”环节：提问：你会设计 banner 吗？软件制作还是在线生成工具，各 有什么优缺点？哪位同学的作品最准确的表达了网店宣传作用？ （4） “banner 之魂”环节：静态 bann
6、er 有什么不足？分析现有不足，使学生产生提升的动力。 （5） “个性 banner 随心变”环节：如果你是一个服装网店店主，你会怎么去设计你的网店 bannner?发挥相像力 （6） “banner 再体验”环节： banner 的设计技巧有哪些？总结提升 二、学习者特征分析 教学对象是电子商务专业 2012 级的学生，有一定的 photoshop 和 fireworks 软件的学习 经验,具备一定的审美能力。喜欢竞争、有好胜心理，也喜欢信息化媒体，乐于接受感性的、 直观的学习方式。总体来说，学生主要表现如下： 1.自学能力差：学生对知识的学习往往是被动的，课堂中习惯于老师的言传身教，自主
7、探究能力不足，学习内容难于突破课本范围。 2.水平参差不齐：部分学生软件操作能力较差，对于利用图像处理软件进行 banner 设计 仍有较大的困难。 3.喜欢电子商务：由于近来电子商务的兴起，不少学生都参与到各种电子商务活动中去， 他们对网店运营有一定的认识，迫切需要大量的专业知识来提升自己。 三、学习环境选择与学习资源设计 1学习环境选择（打） （1）WEB 教室 （2）局域网 （3）城域网 （4）校园网 （5）因特网 （6）报告厅 2学习资源类型（打） （1）课 件 （2）工 具 （3）专题学习网站 （4）多媒体资源库 （5）案例库 （6）题 库 （7）网络课程 （8）仿真软件 其 他 3
8、学习资源内容、教具简要说明 学习资源：课前，需要到阿里妈妈（网址： ）注册帐号，以 便学生在上机操作过程中可以上传自己处理的图片素材。 教具：计算机机房，计算机上安装 photoshop 软件，教师机有广播软件。 四、学习情境创设 1学习情境类型 （1）真实情境 （2）问题性情境 （3）虚拟情境 （4）互动性情境 2学习情境设计 虚拟情境： 3 （1）采用多媒体课件、计算机、创设作为一名网店装修人员的工作情境。 问题性情境： （2）在教学的五个环节中，创设相应的问题情境，有序地启发引导学生探究、思考、提升。 五、教法学法设计 教学方法：活动探究法、情景体验法、启发式教学法、讲授法等。 学习方法
9、：小组合作法、情感体验法、自主探究法。 六、教学过程 教学结构流程的设计 环节 流程 内容 1. “我心中的最美 banner” 导入新课 浏览网店 banner，走入 banner 设计园。 2. “banner 之意” 浏览感悟 感受banner带给客户的信息，“评banner 亮点”活动。 3. “banner 初创作” 创作静态 banner B Banann nerer 模拟模拟设计设计体体验验，了解基本元素。 4. “banner 之魂” 鉴赏品味 “比 banner 设计”活动，分析评比。 5. “个性 banner 随心变” 拓展迁移 引入动态 banner 在线设计，提升品味
10、。 6. “banner 再体验” 提升总结 引入动态 banner 作品，发布 banner， “banner 点赞”活动。 4 教学环节 教学内容 课件展示 师生互动 教法学法 设计意图 媒体资源 导入新导入新课课 （5 5 分钟分钟） 学生学生浏览网浏览网 店店（1010 分分 钟）钟） 分析分析感悟感悟 （1010 分钟分钟） 一、一、 “我心中的最美 banner” 二、二、感悟感悟“banner 之意” 生：生： （自主探究法） 浏览网店 banner，选 择最喜爱的 banner，上交 给老师。 师：师： （启发教学法） 以电子相册展示学生 作业，激发学生兴趣，试 总结合格的 b
11、anner 图片 具备那些因素。 （引导语）（引导语）网店 banner 与经营商品种类、 品牌、 理念等有密切关系。 师：师： （示范） 1.播放作业图片。 2.教师指导、示范。 生：生： （讨论） 1.组员分析作业图 片，组内说出自己观点。 “评“评 bannerbanner 亮点”活动亮点”活动 2.每组选派代表，说 出本组最美 banner 的构 成元素” 。 【设计意图设计意图】根据学生 专业特点和兴趣，让学 生自行浏览网店 banner 资源。教师通过问题， 引导学生自主探究，总 结 banner 包含的元素。 【媒体资源】【媒体资源】通过截屏、 保存图片等方法，收集 自己最喜爱的
12、 banner 图 片。 【设计意图】【设计意图】分析 banner 样图，从中总结 设计者欲传达的信息， 从而得出所需要元素。 【媒体资源】【媒体资源】利用网络 进行知识搜索，通过自 身体会、他人经验分享 等途径理解 banner 之 意。 5 尝试练习尝试练习 （2 20 0 分分钟钟） 鉴赏意境鉴赏意境 （10 分钟） 拓展迁移拓展迁移 （5 5 分钟分钟） 三、三、 体验 “体验 “banner 初创作” 四、四、提炼“提炼“banner 之魂” 五、“五、“个性 banner 随心变” 师：师：示范 banner 设计： 1 根据样图进行快速 banner 设计。 2B Banner
13、anner 模拟模拟设计设计 演示演示，讲解操作步骤，演 示上机操作过程。 生：生： 尝试 banner 设计操作 练习，完成作品上交。 师：师： （启发点拨法） 1、广播展示学生上交的 banner 作品，点评较有代 表性的作品。 2、 结合素材， 分析 banner 的文字和图片的表现手 法，评价那个作品为“最 佳 banner 设计” 。 生：生： （小组讨论法） 讨论其它组作品的不 足之处，提出改进建议。 师：师： （拓展迁移法） 请学生思考。 1.使用 photoshop 等 软件设计的 banner 方便 吗？能设计动态 banner 吗？ 【设计意图】【设计意图】根据小组 讨论的
14、结果，结合教师 的操作演示，完成 banner 的初次设计。 【媒体资源】【媒体资源】提供图片 素材、banner 样例和操 作视频，让学生根据自 己的表现手法去处理素 材，提炼出精华部分， 最终完成 banner 设计。 【设计意图】【设计意图】他山之石， 可以攻玉。通过看看他 人，比比自己的讨论， 让学生加深对 banner 设 计的意境理解。 【媒体资源】【媒体资源】通过教学 广播系统讨论组可以实 现全班同学同时点评作 品，将有限的课堂时间 无限丰富延展。 【设计意图】【设计意图】让学生通 过对比，体会静态 banner 不够动感、功能 单一的不足，从而产生 设计动态 banner 的欲
15、 望。 6 深化提升深化提升 （1 15 5 分钟分钟） 小小结结（5 5 分分 钟钟） 六六、 “、 “banner 再体验” 2.如果有更快速的制 作工具，你会选用吗？ 生：生： 1 1、对比所设计的 banner， 提出便捷、美观的解决方 法， 完成知识的拓展迁移。 2、 在线动态 banner 设计， 再次上交作品。 “比“比 bannerbanner 设计”设计”活动活动 师：师： （总结归纳） 1.前后两个 banner 的蜕变，从便利性、易操 作性、美观性等方面进行 总结。 2.学生作品展评。 生：生： 1 1、对比 banner 效果，再 次感悟 banner 之美。 2 2、
16、发布设计， “bannerbanner 点点 赞”等活动赞”等活动 课程小结课程小结 banner 的设计技巧理解。 布置作业布置作业 【媒体资源】【媒体资源】利用网店 店主的装修利器阿 里妈妈 banner marker， 进行在线动态 banner 设 计。 【设计意图】【设计意图】通过在线 动态 banner 设计，让学 生的美感再次得到提 升，真正感受到 banner 的魅力。 【媒体资源】【媒体资源】借助阿里 妈妈的卖家专区，直接 将 banner 发送到网店， 或以设计者的身份进行 banner 的发布和销售。 七、学习评价设计 1测试形式与工具（打） （1）课堂提问 （2）上机操
17、作 （3）课堂表现 （4）平台销售评比 （5）合作完成 （6）其他 2测试内容 7 （1）每组选派代表进行作品介绍后，由学生和教师点评，选出“最佳 banner 设计” ，教 师进行鼓励性评价。 （2）对学生作品进行卖家专区营销，通过浏览数和购买量选出“最美 banner” 。 （3）课堂中练习的积极性、参与讨论以及帮助同学的情况，banner 完成情况； 八、板书设计及教学后记 1.板书设计 如何让 banner 通情达理？ 1、网店产品定位 2、分清主标与副标 3、色彩情感 4、抓住关键字 5、顺应浏览习惯 6、辅助视觉效果 做中做中学学学学中做中做理理实一体实一体 2.教学后记 教师要放眼课程建设与发展，在教学内容设计时要积极贴近生活，让学生善于去发现知 识、探究知识，以将来就业的职业岗位要求去培训学生，使学生具备相应工位岗位要求的能 力，做到以课本为起点，面向职业岗位实践为发展方向，做好课堂走向职场的学习培养，不 断完善书本知识，推动课程改革走向成熟。 Banner 设计技巧 1. 简约 2. 突出主体 3. 内容清晰 4. 正确搭配色彩 5. 结构合理 学学会会设计设计 设计中设计中理解理解
