学生作品

孩子们亲手完成的作品展示

教师端公开作品导入

已整理 53 个公开学生作品

以下作品均已整理为可直接打开的网页入口。点击卡片即可在新页面查看作品，官网只保留在线展示入口。

HTML网页 46 个 个人主页 7 个 统一缩略图展示
人群中平凡而不平凡的人 缩略图 个人主页 人群中平凡而不平凡的人 吴简熙
个人主页 83.7MB

人群中平凡而不平凡的人

"大家好，今天想给你们介绍一下我的个人网站，名字叫做'人群中平凡而不平凡的人'。 整个网站的入口非常克制——你第一眼看到的，是黑暗中一个微微跳动的小白点。它很小，不张扬，就像人群里的每一个普通人。但当你点击它，这个点会迅速展开、放大，变成一段视频，这是我为这个网站专门准备的视觉开场。 视频结束后，画面变成一张铺满屏幕的白纸。这张纸，就是整个网站的核心隐喻。你会看到几个颜色点漂浮在纸的下方，每一个颜色对应我的一个领域——蓝色是'关于'，橙色是'作品'，青色是'文学'，绿色是'游戏'，珊瑚色是'个性'，紫色是'互动'。 点击任何一个颜色点，白纸就会被染上对应的色彩，像水彩在纸上晕开一样。然后页面会像翻书一样，从不同的方向翻转过来，展开那个板块的内容。比如'作品'里，我分成了声乐、绘画、文学、科技和获奖五个领域。点击'绘画'卡片，可以看到我为原创小说《长夜寻梦》创作的系列插画——像《晓·日出》是第三册的封面，《晨·暗流》是第二册的封面，还有《日落时分的重逢》《梦的彼岸》这些插画。鼠标放上去，画作会轻轻上浮，底部浮现黑色渐变的信息栏，显示创作背景。 文学区收录了我自己写的歌词《迷子·时间悖论》，这是一首关于时间轮回和宿命相遇的作品。个性区里，有我现在在听的音乐、我的创作工具——画笔、AI、笔记本和耳机，还有一句话日记。互动区设计了留言墙、性格测试和随机金句，来访者可以在这里留下痕迹。 当你把六个颜色全部体验一遍之后，白纸就被染满了。这时会触发一段流动的色彩动画，然后全站解锁，你可以自由地在完整网站里浏览所有内容。 这个设计的核心理念是：每个人最初都是一张白纸，在生命不同阶段的浸染下，慢慢呈现出独一无二的色彩。平凡不是缺陷，它是所有非凡的底色。这就是我想通过这个网站表达的东西。 谢谢观看。

作者：吴简熙 查看作品
应急守护者 缩略图 HTML网页 应急守护者 麻艾晨
HTML网页 61KB

应急守护者

本作品是一款面向青少年的智能互动式应急科普平台，采用"知识百科—自救指南—实战演练"的递进式学习架构。平台涵盖地震、洪水、火灾等六大常见灾害，通过交互式生存挑战游戏模拟真实场景，用户在决策选择中掌握求生技能。系统内置智能题库引擎，可根据答题正确率动态调整题目难度与知识点分布，实现个性化学习路径推荐。采用纯前端响应式架构，适配多终端访问，帮助青少年在趣味互动中高效掌握防灾知识，提升应急自救能力。

作者：麻艾晨 查看作品
自然灾害应急场景模拟系统 缩略图 HTML网页 自然灾害应急场景模拟系统 朱佳熙
HTML网页 65KB

自然灾害应急场景模拟系统

本系统是一款面向自然灾害安全应急科普的数字化教育应用，采用纯前端离线HTML技术实现，双击即可在浏览器中直接运行，无需安装任何软件、无需联网、无需后端服务器。系统通过虚拟场景推演的方式，帮助用户掌握地震、洪水、台风、火灾、泥石流、滑坡、雷电、高温热浪、寒潮等常见自然灾害的正确避险方法。

作者：朱佳熙 查看作品
御风台 缩略图 HTML网页 御风台 小胡
HTML网页 113KB

御风台

本网页采用纯前端技术栈（HTML5 + CSS3 + JavaScript），无任何框架依赖，通过内联 SVG 矢量图形绘制台风螺旋、城市天际线、预警信息图等全部视觉元素，结合 CSS3 自定义属性、backdrop-filter 玻璃拟态、多层渐变、conic-gradient 锥形光效以及 13 种滚动渐入动画变体实现极致视觉表现，JavaScript 部分使用 IntersectionObserver 高性能滚动监听、requestAnimationFrame 平滑动画循环和线性插值鼠标跟随算法，配合 SVG 原生 animate 动画驱动雨滴、闪电、云层漂移、数字滚动等动态效果，整体零外部图片依赖，所有视觉内容均由代码实时生成。网页面向中小学生、家长、教师及普通公众，适用于课堂教育、家庭学习、台风季应急查询和科普宣传等场景，支持桌面端、平板和移动端自适应响应式布局。用户打开网页后首先看到全屏沉浸式台风场景首页，台风螺旋云系持续旋转，雨滴倾泻、闪电闪烁、城市天际线灯光闪烁，点击"开始了解"或向下滚动依次进入台风形成科普（SVG 动态图解配合四张步骤卡片）、居家避险指南（六张安全贴士卡片加 SVG 居家场景图）、四级预警信号（蓝黄橙红四色信息图加流程图）、台风过境纪实（城市受灾场景加数字滚动统计数据）、户外避险须知（五条安全提示加警示插图），最后到达全球台风实时查询板块，用户可通过 Tab 切换查看嵌入的官方台风路径实时发布系统、六个国内外权威气象数据源链接以及台风科普知识卡片，整个浏览过程中导航栏随滚动自动变色并高亮当前板块，顶部进度条实时显示阅读进度，鼠标移动时淡蓝色光晕跟随，点击页面任意位置产生涟漪波纹，所有卡片悬停时上浮缩放并发光，统计数据进入视口时从 0 滚动到目标值，右下角返回顶部按钮在滚动超过 600 像素后自动出现，整体形成一条从认知台风到掌握防灾技能再到实时查询的完整科普体验闭环。

作者：小胡 查看作品
房业辰的作品 缩略图 HTML网页 房业辰的作品 房业辰
HTML网页 89KB

房业辰的作品

本作品是一款趣味防灾减灾科普小游戏，聚焦火灾、地震、暴雨、泥石流四类常见自然灾害，将专业的防灾减灾知识融入轻量化游戏互动中。游戏摒弃枯燥的理论说教，以简单易懂的游玩形式，直观普及各类灾害的避险要点、应急自救及逃生方法。通过沉浸式体验，让玩家轻松掌握实用防灾技能，有效提升大众自然灾害防范意识与应急处置能力，助力防灾减灾知识的大众化普及。

作者：房业辰 查看作品
布莱克伍德家族的诅咒 缩略图 HTML网页 布莱克伍德家族的诅咒 代可人
HTML网页 1.5MB

布莱克伍德家族的诅咒

《布莱克伍德家族的诅咒》是一款单文件卡牌推理网页小游戏。1842年，你作为被诅咒家族最后的继承人，在10分钟倒计时内探索庄园的6个房间（需逐步解锁），收集5件圣物与多条线索，最终在小教堂选择三种仪式之一来决定家族命运。古庄园哥特风格、纯 HTML/CSS/JS 实现，零依赖，支持存档。

作者：代可人 查看作品
真假卡牌辩谎 缩略图 HTML网页 真假卡牌辩谎 麻艾晨
HTML网页 101KB

真假卡牌辩谎

这是一款校园题材的网页版真假卡牌辨谎推理游戏，采用 HTML+CSS+JS 编写，界面以蓝白为主色调，适配多端；游戏设有固定关卡与无限随机关卡，每局限定说真话人数，玩家根据角色证词推理并选出主犯与帮凶，支持卡片标记、两次线索提示、答案校验等交互，搭配选中、闪烁、抖动等视觉动效，同时配备首页、关卡选择、玩法说明、通关弹窗等完整功能模块。

作者：麻艾晨 查看作品
咨询