成都东软学院小学期《电子商务网站前端设计》项目教学大纲

《电子商务网站前端设计》项目教学大纲 一、 项目基本信息 1．项目代码：

2．项目名称（等级）：电子商务网站前端设计项目（2级） 3．项目英文名称：Design and build Business Websites 4．授课对象：电子商务 本科 二年级 5．开课单位：信息技术与商务管理系（电子商务与市场营销专业教育团队） 6．教学时间安排：第6学期（技能实习） 7．先修项目： 商务网站网页设计、商务网站美术设计、电子商务专业导引 8．后续项目：B2C商务网站设计2级项目、淘宝网店运营基础、商务网站运营与管理 商务网站推广； 9．项目学时、学分：共4周80学时4学分 10．项目涉及的主要课程： 课程序号 课程名称 学时 学分 学年度学期 开课单位 代码 商务网站网页设计 1 48 3 电子商务团队 2 商务网站美术设计 2 48 3 1 电子商务团队 电子商务专业导引 3 48 3 1 电子商务团队 电子商务综合模拟实训 4 80 5 3 电子商务团队 二、 项目地位及作用 1. 项目的基本理念 该2级项目主要是以商务网站前端设计为载体，掌握商务网站建设的一般性原则；掌握商务网站策划（网站的盈利模式、互联网市场环境分析、网站定位、网站页面策划、内容策划、网站推广）的方法和技巧；掌握商务网站界面设计原则、方法和技巧；掌握商务网站页面设计原则、方法和技巧等。培养学生熟练地运用所学专业理论知识及专业技能的实际运用技能。着

重培养学生的网站策划、网站布局和网站设计的能力和技巧，并具备一定的独立设计能力。 2. 项目在课程体系中所处的位置

电子商务网站前端设计项目是2级项目，在第6学期中实施，

是一个承上启下的项目，它借助于商务网站网页设计和商务网站web界面设计能力的初步掌握，结合电子商务专业导引项目进行综合实践，又可以对后续课程以及项目淘宝网店运营基础、商务网站运营与管理、动态商务网站基础、商务网站推广、B2C商务网站设计2级项目有一个先期的项目实践经验。 3. 项目培养的能力 电子商务网站前端设计项目培养学生商务网站策划的能力，培养学生商务网站界面设计的能力，培养学生商务网站前端设计的能力，培养学生利用现代信息技术与网络技术实施电子商务的能力。 三、 项目教学目标及教学任务 （一）教学目标 1．教学目标的总体概括 本项目以商务网站前端设计为载体，掌握商务网站建设的一般性原则；掌握商务网站策划（网站的盈利模式、互联网市场环境分析、网站定位、网站页面策划、内容策划、网站推广）的方法和技巧；掌握商务网站界面设计原则、方法和技巧；掌握商务网站页面设计原则、方法和技巧等。培养学生熟练地运用所学专业理论知识及专业技能实际构建电子商务网站的实际运用能力。培养学生的主动学习和终生学习的能力，学生个人人际交流能力和团队交流能力，以及对电子商务事业充满激情和使命感！ 它借助于商

务网站网页设计和商务网站web界面设计能力的掌握，结合电子商务专业导引项目进行综合实践，又可以对后续课程以及项目淘宝网店运营基础、商务网站运营与管理、动态商务网站基础、商务网站推广、B2C商务网站设计2级项目有一个先期的项目实践经验，使得理论学习与实践操作相辅相成，有助于提高教学效果。通过本项目的学习和训练，培养学生电子商务应用能力，为后续课程的学习打下牢固的基础，并对学生职业岗位能力培养和职业素质的提高起到坚实的支撑作用。 2．教学目标列表 目标内容 具体目标 （1）掌握商务网站策划（网站的盈利模式、互联网市场环境分析、网站定位、网站页面理论知识 策划、内容策划、网站推广）；

（2）掌握

Photoshop网页图像设计基础、网页色

彩基础知识、网页设计中的色彩应用 （3）掌握商务网站页面设计原则、方法和技巧（网站建设的流程、CSS盒子模型和CSS选择器、盒子的浮动与定位、页面布局和完善高效的网站导航系统） （1）具备电子商务网站策划能力 （2）商务网站页面效果图、商务网站元素（导航banner、图标、网络广告）设计的能力 专业技能 （3）具备根据网站策划方案，进行电子商务网站网页设计的能力 1.敬业、爱岗 职业道德 2.了解基本的职业规范 3.具备正确的职业价值观，对电子商务事业充满激情和使命感！ （二）项目培

养能力体系

TOPCARES（1级能力

TOPCARESTOPCARES（3级能力指标） 项目培养能力指标 指标） （2级能力指标） 1.Technical 1.2核心基1.2.2掌握电子商务基础技掌握电子商务网站策划知识；掌握 knowledge and 础知识 术知识 商务网站页面效果图设计、商务网 reasoning 站前端设计 技术知识与推理能力 1.3高级基1.3.1掌握电子商务高级管掌握网络营销的工具与方法，运用础知识 理知识 网络营销的工具与方法对网站进行推广 2.1.4解决问题时的妥协、判找到系统的紧张关系和用妥协方法2.Open minded and 2.1系统思断和平衡 去解决问题的因素；选择并使用解innovation 维 决问题的办法，通过平衡各种因素开放式思维与创新 消除紧张关系， 优化整体系统 具有电子商务领域相关的综合和通2.3 创造性2.3.2具有综合和通用化能用化能力 思维 力 学习新技术的能力； 2.4创新能2.4.1引进、消化、吸收再创消化、吸收再创新能力 力 新能力 提出逻辑和具有说服力的论点 4.Communication and 4.1交流能4.1.2交流内容的构建 建立概念之间合理的结构和关系 teamwork 力 选择相关、可信和准确的有利证据 沟通表达与团队合作 采用简练、明了、精确和清晰的语言 ；分析修辞因素（如考虑听众的偏

好等）；理解跨学科和跨文化的交流 展示报告内容的连贯性和流畅性 4.1.3书面的交流

4.1.4

电子及多媒体交流 能制作电子演示材料 4.1.6

口头表达和人际交流 能够使用适当的语言、风格、时间和流程准备报告和相应的支撑媒体 应用适当的非语言交流方式（手势、眼神接触、姿态）能有效回答问题 分清团队的作用和责任 ；分析每个4.3团队工4.3.1组建有效的团队 成员的目标、需求和特征（工作风作 格、文化差异等）；分析团队的强项和弱点 选择目标和议程；实施计划和组织4.3.2团队工作运行 有效会议；执行团队基本规定；实施有效交流；进行正面和有效的反馈；实现项目的规划、安排和执行；形成问题的解决方案；谈判并解决冲突 5.Attitude and 5.2职业态5.2.1敬业（自信、有激情、对于电子商务事业充满自信与激情 manner 度与习惯 热爱事业） 积极参加与专业相关的各种竞赛活态度与习惯 动；积极参加与专业相关的各种社团活动；积极参加与专业相关的SOVO公司 （三）项目培养目标与项目内容映射表 见附件1《电子商务网站前端设计项目培养目标与项目内容对应mapping图》。 （四）教学任务 电子商务网站前端设计项目需要每个学生团队完成《商务网站策划报告》和《电子商

务网站前端设计实训报告》，商务网站页面效果图一套和商务网站（前端设计部分），按照学生团队进行电子商务网站前端设计项目答辩。

项目实施进度安排表四、 能力 课次 项目单元 项

目单元时间 项目内容 知识点与技能点 项目成果 学实施方法 考核实践场所 指标代码 名称 （教学时 方式 周） 1 PU(1) 项目概况1 1、电子商务网站前端1.1 网站的定位； 1.2.2 商务网站策划20 TM(1,1) RT、 课堂/网与商务网设计综述 1.2网站的内容策划； 1.3.1 文档 TM(1,2) ST、MT 络环境/ 站策划 2、商务网站策划 1.3网站页面策划； TM(2，3) 2.4.1 1.4 网站运营 4.3.1 4.3.2 5.2.1 2.1 掌握网站按钮设计； 1.2.2 商务网站主要2 PU(2) 商务网站2 1、商务网站基本要素20 TM(1,1) PRT、 课堂/网 2.2 掌握网站按钮设计； 2.1.4 页面效果图 页面效果设计； TM(1,2) ST、MT 络环境/ 2.3掌握网站导航菜单设计； 图设计 2、商务页面主要页面TM(2,1) 2.3.2 2.4 掌握网站banner广告设计； 效果图设计 TM(2,3) 2.4.12.5掌握网站页面效果图设计 TM(5,1) 4.3.2 5.2.1 TM(5,6) 3 PU(3) 商务网站3 1、商务网站站点规划3.1 掌握网站站点规划与设计； 1.2.2 商务网站前端20 TM(1,1) PRT、 课堂/网网页设计 与设计 3.2掌握商务网站导航菜单设计2.1.4 设计 TM(1,2) ST、MT 络环境 2、商务网站导航菜单3.3掌握商务网站首页设计； TM(2,1) 2.3.2 设计 3.4掌握商务网站二级页面设计TM(2,3) 2.4.13、商务网站页面设计 程 TM(5,1) 4.3.2 3.5掌握商务网站产品详情页面5.2.1 TM(5,6) 设计 3.6 掌

握商务网站注册与登陆页面设计

4.1.2 4 PU(4) 撰写项目4 1、 撰写项目报告； 4.1 掌握项目报告的撰写； 项目报告 TM(1,2) ODT、 20 课堂 4.1.3 报告与实2、 学生总结与交4.2完成项目总结； TM(5,3) RT、 4.1.4 训项目教流； ST、MT 4.1.6 学总结与3、 教师总结与分析 4.3.1 分析 4.3.2 5.2.1

五、 教学方法及组织形式 1．基于

TOPCARES-CDIO

工程教育理念，以培养实践能力为目标组织教学，将电子商务网站前端流程引入教学过程中。 2．教学过程中，以学生为主体，鼓励学生自主学习，团队协作等、加强职业能力的训练，运用以下多种互动式教学方法，完成课程教学任务： 1）讲授教学法：教师通过口头语言向学生描绘业务情境，借助视频和图片搭建业务场景，解释相关业务内容。 2）演示教学法：教师通过商务网站策划、效果图设计和页面设计的操作演示，配合适当讲解，使学生掌握其操作方法和程序。 4）角色扮演教学法：在商务网站前端设计的项目实施中，学生承担不同的电子商务从业人员角色（策划师、UI设计师、页面设计师、企业需要方等角色），帮助学生加强对相关岗位职能及业务的理解。 3．教学实施过程中，提供丰富的教育资源，如课件、录像、网络资源等等。 4．结合课

程实施过程，从知识掌握、能力水平、态度表现等方面，对学生进行全方位的考核。 六、 教学环境 1. 课堂环境：投影仪、幕布、运行正常音响系统、安装教学平台的教师机、通畅的局域网。 2. 网络环境：每个学生需要人手一台笔记本电脑 3. 多媒体教学：投影仪用于教师进行系统演示交流。 4. 教学软件：Dreamweaver cs6 和Photoshop CS6 七、 教学资源 1．教材及参考资料 1、《网站策划九步走》 黄亮新著 电子工业出版社 2008年7月。 2、《Photoshop 商业网页设计》 水晶石教育编著 人民邮电出版社 2013年1月 3、《Photoshop cs5 网页设计与配色实战攻略》 方宁等编著 清华大学出版社 2013年1月 4、《精通DIV+CSS网页样式与布局》 曾顺著 人民邮电出版社 2007年8月

八、形成性考核与终结性考核 1.百分制 满分100分，项目成

绩由平时成绩和项目报告与答辩考核成绩两部分构成。平时成绩占总成绩的70％，平时成绩按照商务网站策划、商务网站页面效果图设计、商务网站网页前端设计分阶段考核，各阶段的成绩占比为30:30:40。实习报告与答辩考核成绩占总成绩的30％，其中，实习报告与答辩的成绩比例为50%：50%。 2．项目考核内容及安排 考核及评考核时间类别 考核项目 考核主要内容 所占权重 价方式 安排 商务网站策划模块完成情况及RT、

21% 商务网站策划 第1周 相关知识的掌握情况 ST、MT 商务网站WEB页面效果图实践商务网站页面PRT、 形成性考核 21% 模块完成情况及相关知识的掌第2周 效果图设计 ST、MT 握情况 商务网站前端商务网站网页设计实践模块完PRT、 28% 第3周 设计 成情况及相关知识的掌握情况 ST、MT 集中小组内部智慧，结合实验报ODT、 15% 答辩 第4周 ST、MT告进行经验、教训总结情况 终结性考核 叙述简洁完整，有见解；结论严谨合理，论述充分；设计思路清 RT 项目报告 晰，分析处理效果好；文字通顺，第4周 15％ 技术用语准确；格式正确、排版规范，图表完备、整洁、正确；

3．总成绩评定标准 等级 评定指标（定性与定量结合） 熟练掌握商务网站策划的方法与原则，能够根据网站策划文档的内容，进行商务网站页面效果图设计和商务网站前端设计，网站富有创意和网站有很好的界优秀（100-90） 面设计和用户体验，并出色地完成答辩以及项目文档撰写；熟练掌握商务网站策划的方法与原则，能够根据网站策划文档的内容，进行商务网站页面效果图设计和商务网站前端设计，网站比较富有创意和网站也有较良好（89-80） 好的界面设计和用户体验，并较好地完成答辩以及项目文档撰

写； 掌握商务网站策划的方法与原则，能够根据网站策划文档的内容，进行商务网站页面效果图设计和商务网站前端设计，网站有的界面设计和用户体验一般，中等（79-70） 并完成答辩以及项目文档撰写； 掌握商务网站策划的方法与原则，能够根据网站策划文档的内容，进行商务网站页面效果图设计和商务网站前端设计，并完成答辩，项目文档撰写； 合格（69-60） 掌握商务网站策划的方法与原则，不能根据网站策划文档的内容，进行商务网站页面效果图设计和商务网站前端设计，或者没有顺利完成答辩，项目文档没不合格（60以下） 有完成撰写； 说明： （1）可以针对个人表现给定成绩； （2）可以根据项目团队表现给定团队成绩，团队成员均以此成绩记录。 九、 项目评价与持续改进 1、评估组织 由项目负责人黄文富对项目的实施进行评估。 2、评估形式 项目评估包括项目教学过程监控和项目教学效果评估两方面内容。 1) 项目教学过程监控，主要指任课教师自查在项目教学过程是否严格按照项目教学大纲所规定的教学任务、进度、教学

方法、实施环境、考核方法等各项要求进行落实，同时收集并保存相关资料。 2) 项目教学效果评估，主要评估本项目的学习效果与项目教学目标的达成度，收集自查数据并保存相关文档。

3、评估周期与时间 1) 项目教学过程监控。本项目会每周对各

教学环节的执行及完成情况等进行自查与改进。 2) 项目教学效果评估。项目考核结束后，对教学效果与项目教学目标的达成度进行一次综合评估与分析。 4、评估内容 1) 项目教学过程监控的内容 项目负责人将监控项目教学各环节的执行情况。如项目教学大纲所规定的教学任务、进度、学生学习情况、考核方法等环节的实施及完成情况。 项目负责人将监控过程资料存档情况。包括是否对教师教学过程与指导资料（如教学大纲、项目指导手册等）、学生学习过程与学习效果资料（如实验报告、方案等）、自查文档、学生反馈或投诉意见等一系列项目相关文档的存档情况进行检查。 2) 项目教学效果评估内容 在项目考核结束后，以班级为单位，对项目教学目标中各项TOPCARES能力指标的达成度进行评估。撰写总结分析报告，针对不足之处，要制定改进措施，并做好总结报告的存档工作。 十、 大纲管理 大纲版本号：Ver1.1 制定人签字：胡晓飞 审核人签字：林敏 责任教研室：电子商务团队 教学主任签字：黄文富 制定日期：2014-6-3

方法、实施环境、考核方法等各项要求进行落实，同时收集并保存相关资料。 2) 项目教学效果评估，主要评估本项目的学习效果与项目教学目标的达成度，收集自查数据并保存相关文档。

3、评估周期与时间 1) 项目教学过程监控。本项目会每周对各

教学环节的执行及完成情况等进行自查与改进。 2) 项目教学效果评估。项目考核结束后，对教学效果与项目教学目标的达成度进行一次综合评估与分析。 4、评估内容 1) 项目教学过程监控的内容 项目负责人将监控项目教学各环节的执行情况。如项目教学大纲所规定的教学任务、进度、学生学习情况、考核方法等环节的实施及完成情况。 项目负责人将监控过程资料存档情况。包括是否对教师教学过程与指导资料（如教学大纲、项目指导手册等）、学生学习过程与学习效果资料（如实验报告、方案等）、自查文档、学生反馈或投诉意见等一系列项目相关文档的存档情况进行检查。 2) 项目教学效果评估内容 在项目考核结束后，以班级为单位，对项目教学目标中各项TOPCARES能力指标的达成度进行评估。撰写总结分析报告，针对不足之处，要制定改进措施，并做好总结报告的存档工作。 十、 大纲管理 大纲版本号：Ver1.1 制定人签字：胡晓飞 审核人签字：林敏 责任教研室：电子商务团队 教学主任签字：黄文富 制定日期：2014-6-3

本文来源：https://www.bwwdw.com/article/iop.html