1、山东省大学生软件设计大赛命题HTML5 创意应用第十六届山东省大学生软件设计大赛命题HTML5 创意应用HTML5 创意应用命题评审专家组山东建筑大学建筑信息化研究所济南洋洋信息技术有限公司命题老师：杨磊联 系 方 式 ： HTML5 创 意 应 用 官 方 群 （ 群 号 ： 435641516）注 意 ：1、 参 赛 队 长 请 务 必 加 入 本 群 ， 否 则 失 去 评 审 资 格2、 作 品 必 须 提 交 到 大 赛 评 审 系 统 ， 否 则 失 去 评 审 资 格 。 评 审 系 统 的 网 址 将 在 本 命 题 官方 群 进 行 公 布 。3、 参 赛 作 品 在 评 审
2、 期 间 （ 一 般 是 9 月 20 日 10 月 30 日 ） 必 须 保 证 可 持 续 正 常 访 问 ，如 果 在 评 审 期 间 不 能 访 问 ， 将 直 接 淘 汰 。4、 演 示 视 频 、 演 示 PPT、 源 代 码 过 大 ， 导 致 在 评 审 系 统 无 法 上 传 ， 或 者 演 示 视 频 不 符合 评 审 规 定 ， 如 超 过 五 分 钟 或 者 无 法 在 常 用 视 频 释 放 器 中 无 法 访 问 ， 直 接 淘 汰 。5、 参 赛 队 长 的 电 话 、 QQ 号 在 评 审 期 间 要 确 保 畅 通 ， 如 果 因 此 联 系 不 上 ， 影
3、响 了 评 审 成绩 ， 责 任 自 负 。6、 请 提 醒 指 导 老 师 在 报 名 系 统 中 注 册 ， 请 同 学 们 选 好 指 导 老 师 。7、 同 学 们 在 报 名 时 一 定 要 对 自 己 的 信 息 负 责 ， 报 名 缴 费 后 ， 信 息 不 能 再 修 改 。8、 群 名 片 格 式 ： 院 校 简 称 +真 实 姓 名 ， 如 山 大 王 五 、 山 建 大 张 山 、 济 大 李 四 等 。群 名 群 号 成 员群 1： HTML5 创 意 应 用 2018 435641516 所 有 人 都 可 以 加 入一、 项目介绍HTML 标准自 1999 年 12
4、 月发布的 HTML4.01 后，后继的 HTML5 和其它标准被束之高阁，为了推动 Web 标准化运动的发展，一些公司联合起来，成立了一个叫做 Web Hypertext Application Technology Working Group （Web 超文本应用技术工作组 -WHATWG） 的组织。WHATWG 致力于 Web 表单和应用程序，而 W3C（World Wide Web Consortium，万维网联盟） 专注于 XHTML2.0。在 2006 年，双方决定进行合作，来创建一个新版本的 HTML。HTML5 草案的前身名为 Web Applications 1.0，于 20
5、04 年被 WHATWG 提出，于2007 年被 W3C 接纳，并成立了新的 HTML 工作团队。HTML 5 的第一份正式草案已于 2008 年 1 月 22 日公布。HTML5 仍处于完善之中。然而，大部分现代浏览器已经具备了某些 HTML5 支持。2012 年 12 月 17 日，万维网联盟（W3C）正式宣布凝结了大量网络工作者心血的HTML5 规范已经正式定稿。根据 W3C 的发言稿称：“HTML5 是开放的 Web 网络平台的奠基石。”2013 年 5 月 6 日， HTML 5.15正式草案公布。该规范定义了第五次重大版本，第一次要修订万维网的核心语言：超文本标记语言（HTML）。
6、在这个版本中，新功能不断推出，以帮助 Web 应用程序的作者，努力提高新元素互操作性。支持 Html5 的浏览器包括 Firefox（火狐浏览器），IE9 及其更高版本，Chrome（谷歌山东省大学生软件设计大赛命题HTML5 创意应用浏览器），Safari，Opera 等；国内的傲游浏览器（ Maxthon），以及基于 IE 或Chromium（Chrome 的工程版或称实验版）所推出的 360 浏览器、搜狗浏览器、 QQ 浏览器、猎豹浏览器等国产浏览器同样具备支持 HTML5 的能力。摘自百度百科二、 项目要求每参赛团队 3-5 人，要求采用 HTML5、CSS3、JavaScript、j
7、Query 、AJAX、Bootstrap等技术，设计实现某一创意应用，采用响应式布局，可同时满足 PC 机和移动终端访问，具体内容不限，但要求有一定实用性，要求尽量兼容流行的最新版的五大浏览器IE，Chrome，Firefox ，Safari ，Opera ，界面美观大方，交互友好。来自 http:/出题背景：大多数计算机专业对于后台程序设计比较重视，一般都有 JAVA、.NET 课程，但对于前台开发，课程设计往往比较弱，虽然也会讲一些 HTML、CSS 之类的知识，但往往离实际开发所要求的水平较远，对于一些新的前台开发技术了解不多，掌握更是不够深入，如 AJAX、jQuery、json、常
8、用的前台框架（jQuery UI、EasyUI、ExtJS 、YUI、MooTools 等）。希望同学们通过参加这个命题，能为企业培养出更多的前台程序设计师。另外，HTML5 是未来十年热门的技术，但现在已经应用非常广泛，也希望通过这个命题能引起同学们对新兴技术的兴趣。同时，也希望同学们结合实际应用，充分发挥自己的奇思妙想，充分利用 HTML5 中的新技术新特性，不要新瓶装旧酒，要做出新颖实用的优秀作品来。附加说明：山东省大学生软件设计大赛命题HTML5 创意应用1、为了进一步提升作品质量和 H5 技术的应用深度，我们将提升命题难度，对于普通网站、二手货市场、论坛、博客、常规电商平台、游戏等作
9、品，一般要淘汰，最多给完成奖。有重大创新的作品例外。2、建议与移动应用、微信平台结合，并发挥移动应用的特点，比如定位功能、拍照功能等；3、建议开发平台类、插件类作品，体现 HTML5 的新特性；4、建议采用响应式布局。5、凡是手机应用演示，一律要在真机上能运行，并把手机的画面投到投影仪上进行展示，不能在模拟器上运行，不能直接拿着手机给评委展示。新增创意建议（仅供参考，但不限于以下方向）：1、课堂点名 H5 APP2、H5 与 WebGL、Canvas 应用3、基于位置的应用（H5 地理定位）4、H5 与百度大脑、人工智能5、H5 与虚拟现实的结合应用6、H5 与硬件、物联网结合的应用7、H5
10、在 Web 存储、应用程序缓存、 WebSocket、SSE、音视频开发等深层次应用8、H5 开发平台设计、通用插件或接口开发9、H5 与桌面虚拟化技术10、通用慕课、微课平台、电子教材等典型创意网站案例：1、百万格子网：英国一个名叫亚历克斯-图学生的大胆创意。从小就喜欢奇思怪想的亚历克斯- 图为了筹集自己的大学学费而又不想跟银行借贷款，于是在 2005 年的 8 月 26 日突发奇想，只用 10 分钟就建立了一个名叫百万首页的网站 ,然后将这个网站的首页平均分成 1 万份，每一份只是一个小小的格子，他宣称每个格子卖 100 美元，于是一个几乎是零成本的网页在经过亚历克斯- 图的创意后，总价值
11、就变成了一个高达百万美元的网页。2、世纪佳缘交友网由北京大学文学学士、复旦大学媒介经营管理硕士龚海燕研二期间创办。龚海燕属龙，故网名小龙女，自幼家境清贫，好学上进，曾经因家贫和车祸而辍学打工三年，后重返高中校园，23 岁时以县文科状元成绩被北京大学中国语言文学系录取。本科毕业后被保送至复旦大学新闻学院读研，方向为媒介经营管理。研二时经过深刻的市场调查，创办世纪佳缘交友网站，欲为天下单身谋幸福。05 年 7 月获得复旦大学优秀毕业生之荣誉，毕业后放弃诱惑，将全部精力投入于世纪佳缘之幸福事业。3、创意字体：http:/ 4、在线拍照：http:/ 5、美图秀秀网页版：http:/ 作品提交规范1、
12、每个参赛队的作品需包含以下内容（具体提交方式、日期和要求请关注本命题官方QQ 群，如无意外情况则要求在 9 月 10 日教师节通过评审网站提交）：在根目录下建立四个文件夹，分别命名为“作品”、“源程序”、“文档”和“演示”，必要时自己根据情况建立二级文件夹并清晰命名。1)将作品的发布版及数据库备份文件放入“作品”文件夹中，还要将作品在网上发布，山东省大学生软件设计大赛命题HTML5 创意应用并确保提供在提交作品后直至评审完毕都能任意访问的正确网址。2)将作品的源程序放入“源程序 ”文件夹中；3)将完整的技术文档、管理文档和系统说明文档（必备软件安装和使用说明书）都放到“文档”文件夹中。注意在文
13、件中应逐条详细说明体现作品设计特色的功能；2、如果要求以光盘形式提交，则每个队的作品一式三份，即刻录三张光盘上交。光盘上做必要不可擦除的标识以防混乱，如“作品名”、“学校” 、“组长姓名”、“小组名称”等；3、请将光盘放在档案袋内，档案袋上贴以下标签。（请将下表填好后粘贴在档案袋外部）参赛题目 HTML5 创意应用 作品网址 http:/参赛学校作品名称团队名称 报名序号 队长姓名队长手机 队长邮箱 队长 QQ指导老师 参赛队员注意：联系方式要与网上报名完全一致，而且要确保在参赛时间内能保持联系，否则因无法影响参赛和评审的，责任自负！四、 作品上交时间：请关注大赛网站通知 及 QQ 群通知五
14、、 评比方式1、 提交的材料完整、齐全、可读性好。如果所提交的文档不完整，仍可以参加评比，但要适当扣分。2、 评比首先要看程序是否能正常运行，即运行中出现的错误不能使程序退出、陷入死循环或造成死机。如果出现上述情况，可以重新运行，但总尝试次数不能超过三次。3、 作品展示效果占比分的 20%，功能及创意为 80%。在正常运行基础上，以功能评比为主，在功能相近的情况下，考察程序的其他特色，重点看创意，以鼓励学生创新性思维。首先考察程序是否包含指定的基本功能，其次考察程序的其它创意功能和创山东省大学生软件设计大赛命题HTML5 创意应用意设计。若某项功能运行不正常，算做无此功能，不影响其他功能评比。
15、4、 作品要求至少要兼容最新版的 Google Chrome、Firefox 浏览器。5、 经过演示、报告、答辩后，给出参赛成绩。六、 参赛注意事项 多 关 注 大 赛 网 站 http:/ 多 关 注 大 赛 论 坛 加 入 本 命 题 QQ 群 加 入 相 关 专 业 开 发 群 参 加 巡 回 报 告 会 ， 与 命 题 老 师 和 往 届 获 奖 学 生 面 对 面 交 流 参 加 暑 期 训 练 营 ， 与 命 题 老 师 和 其 他 参 赛 同 学 直 接 深 入 交 流 多 与 往 届 获 奖 选 手 交 流 ， 知 道 一 等 奖 应 该 具 备 什 么 水 平 ， 是 如 何
16、 炼 就 的 主 动 与 指 导 老 师 交 流 组 建 一 支 最 有 战 斗 力 最 合 适 的 团 队 与 相 关 专 业 结 合 多 买 些 专 业 书 籍 看 多 上 网 看 一 些 高 水 平 论 文 多 上 网 查 询 一 些 相 关 资 料 认 真 审 题 ， 分 析 得 分 点 注 意 细 节 ， 细 节 决 定 成 败 注 意 参 赛 的 各 个 时 间 点 和 参 赛 的 所 有 信 息七、 参考资料1. W3SCHOOLEB/OL. http:/. http:/ HMTL5 移动 Web 开发指南M. 电子工业出版社:唐俊开, 2012.3. HTML5 中文网. http:/ HTML5 中国EB/OL. http:/www.html5cn.org/.5.jQueryEB/OL. http:/ UIEB/OL. http:/ http:/ 山东省大学生软件设计大赛命题HTML5 创意应用8. http:/9. http:/
