【前端比赛作品】项目 基于HTML5的交互式大学生反诈骗课件开发

视频介绍：

大学生反诈讲解视频

概要

`电信网络诈骗犯罪手段迭代更新快，对此类犯罪的追赃挽损难度大，因此，与其事后打击不如事前防范，开展全民反诈行动已经成为遏制此类犯罪多发高发态势的重要举措。大学生群体在通过社会实践、学习交往融入社会的过程中，显露出社会经验不足、防范处置风险能力有限的特点，在大学生群体中开展反诈宣传教育工作已刻不容缓。所以我们开发了这个平台为反诈骗教学提供支持平台，和更加丰富的学习方式。

作品目的

电信网络诈骗犯罪手段迭代更新快，对此类犯罪的追赃挽损难度大，因此，与其事后打击不如事前防范，开展全民反诈行动已经成为遏制此类犯罪多发高发态势的重要举措。大学生群体在通过社会实践、学习交往融入社会的过程中，显露出社会经验不足、防范处置风险能力有限的特点，在大学生群体中开展反诈宣传教育工作已刻不容缓。所以我们开发了这个平台为反诈骗教学提供支持平台，和更加丰富的学习方式。
我们的作品主要分为三部分，案例聚焦，知识检索，和”实战“演练。用户可以通过案例聚焦查看相关案例,了解到诈骗可能会出现的手段和话术，并观看相关的提示和视频分析加深印象，避免相关案例的出现。而知识检索里面我们运用游戏的方式，让用户更加趣味的教学和学习反诈的知识。同时我们还有”实战“演练，可以用题目的方式检测用户的学习情况，真正做到学会学懂。

作品重点亮点

总体亮点

我们的作品主要分为三部分，案例聚焦，知识检索，和”实战“演练（如图3-1）。用户可以通过案例聚焦查看相关案例,了解到诈骗可能会出现的手段和话术，并观看相关的提示和视频分析加深印象，避免相关案例的出现。而知识检索里面我们运用游戏的方式，让用户更加趣味的教学和学习反诈的知识。同时我们还有”实战“演练，可以用题目的方式检测用户的学习情况，真正做到学会学懂。
我们运用简洁页面，和趣味性的知识学习方式，让用户更好的去教学或者学习相关的反诈知识，并且我们把枯燥的文字教学分块并中加入图片游戏，让用户的阅读压力减少，更加有兴趣去学习这些案例知识，从而减少诈骗实现在大学生群体中开展反诈宣传教育工作。

案例聚焦

案例聚焦里面我们把大学生可能遭遇的诈骗分为三大部分，一部分是假装公务人员如假警察诈骗；第二部分是假装亲近的人如假老师的诈骗；第三部分是假装客服诈骗。并且运用立绘的方式使页面更加明了的同时也给反诈的学习增加趣味性。

当点击对应的人物会出来相关的知识介绍，和防止相关诈骗的口诀讲解（如图3-3）还有相关的趣味视频（如图3-4），让用户加深印象，避免相关案例的出现。

知识检索.

知识检索部分通过游戏的形式展现知识标语，在不是特别复杂的游戏运行下，知识点的横幅吸引人们的目光，让人们更加容易去记忆相关重要的标语和防诈骗的横幅。
在这里插入图片描述

“实战”演练

实战演练过渡页面总结了大学生受诈骗的严峻现状，引入答题。如图3-7所示。
3-7“实战”演练过渡页面

答题页面中的题目均以单选形式出现，题目围绕三种案例展开，题干主语均改为第二人称“你”，题目设置的场景均针对大学生的日常生活，使答题主体–大学生体验者更好，更真实。答对、答错或未答都会在用户点击提交后给出相应的反馈。如图3-8,3-9,3-10所示。

尾页两句标语表达祝福与祈愿，用户鼠标划过再来一次，会出现旋转30度的动态效果，点击出现提示“即将返回首页”，点击确定后即返回首页。如图3-11所示。

作品结构和框架

我们的作品主要分为三部分，案例聚焦，知识检索，和”实战“演练（如图4-1）。用户可以通过案例聚焦查看相关案例,了解到诈骗可能会出现的手段和话术，并观看相关的提示和视频分析加深印象，避免相关案例的出现。而知识检索里面我们运用游戏的方式，让用户更加趣味的教学和学习反诈的知识。同时我们还有”实战“演练，可以用题目的方式检测用户的学习情况。

作品简要介绍及使用说明

我们的作品主要分为三部分，案例聚焦，知识检索，和”实战“演练。用户可以通过点击案例聚焦的按钮进入立绘页，点击相关的立绘查看相关案例,了解到诈骗可能会出现的手段和话术，并观看相关的提示和视频分析加深印象，避免相关案例的出现。而知识检索里面我们运用游戏的方式，让用户更加趣味的教学和学习反诈的知识。同时我们还有”实战“演练，可以用题目的方式检测用户的学习情况。

开发心得

这次网页开发让我熟练掌握了HBuilder的使用，可以更加熟练的使用HTML5+CSS3+JavaScript布局技术，体验了软件开发过程，了解相关规范；锻炼了团队意识、交流和表达能力；掌握通用计算机技术学习方法的能力。