超简单!用DeepSeek制做多功能课堂作业跟踪网页,真的太好用了

你好,我是蔚公子,毕业ALL in AI,专注于 AI 提效/教育

点击👇关注我,帮助 AI 小白轻松入门,一起 AI 创富

 

 

“蔚公子,能不能出一期赋能课堂作业的AI教程呀,真的好难管理,麻烦了~”一个班主任老早之前私我。

 

“这方面我研究下,之后出一期。”我当时回复。

 
为此,我精心整理了一套DeepSeek制作课堂作业状态跟踪网页方案,让DeepSeek帮我们制作所需网页,用于教学乃至是生活用途,让你轻松上手!

 

今天继续上干货,教大家,如何用 DeepSeek实现课堂作业检查/跟踪自

今天这篇帖子实用性极强,大家一定要好好收藏哦!
图片[1]-超简单!用DeepSeek制做多功能课堂作业跟踪网页,真的太好用了-AI Express News
一、一键生成基础版
首先我们生成一个基础版的页面 ,要完成这几个问题的思考,能够显示学生完成情况、拥有计时功能且能自动结束,对前几名学生有一定激励,促进整体积极性。
构思完成后,我们输入这个提示词:
你是一名代码大师,请我需要设计一个用于跟踪学生作业提交状态的互动网页界面,需求如下:网页左侧将展示一系列彩色的圆形标识,每个标识都标注着学生的姓名;右侧则设置一个透明的收纳区域。当学生完成作业后,他们可以将代表自己的彩色圆球从左侧区域移动至右侧的透明收纳区。对于最先完成作业的三名学生,其对应的圆球上会显示一个特殊的皇冠图案作为标识。网页还包含一个自动计时功能,当第一名学生提交作业时计时开始,直到最后一名学生提交作业时计时结束。整个页面的视觉风格将以柔和的蓝色为基础,有大海的意境,以html格式输出
图片[2]-超简单!用DeepSeek制做多功能课堂作业跟踪网页,真的太好用了-AI Express News
等待代码生成,点击右上角“运行”
图片[3]-超简单!用DeepSeek制做多功能课堂作业跟踪网页,真的太好用了-AI Express News
这个页面就相当OK了,不仅在布局上和提示词一致,而且还真做出了一点浪花的视觉效果。
图片[4]-超简单!用DeepSeek制做多功能课堂作业跟踪网页,真的太好用了-AI Express News
具体拖拽提交作业也都能达成:
图片[5]-超简单!用DeepSeek制做多功能课堂作业跟踪网页,真的太好用了-AI Express News
前三名浮现了皇冠图标,而且在最后一名拖入框内时计时结束,完全拿捏👌
二、继续完善功能
到这儿其实已经不错了,但我们还能再进一步,把功能做得更加完善。
要求在页面顶部再加上醒目的提示和能够显示学生是第几名完成的,同时更重要的一步是,我们得上传自己的学生名单。
好,想到就去做,输入提示词:
很棒,在页面顶部添加一个统计区域,动态显示如"已完成:15/40人"、"最快完成:李明-00:02:15"等信息,让老师对全局进度一目了然;同时,鼠标悬停到右侧人名时显示"第X名完成"的提示文字;最后,提供一个上传Excel的按钮,当上传完Excel后,右侧名单自动更换,依然以html格式输出
 
图片[6]-超简单!用DeepSeek制做多功能课堂作业跟踪网页,真的太好用了-AI Express News
 
等待一段时间,一个“学生作业提交状态跟踪系统(增强版)”的代码就生成完毕了,依然点击“运行”
 
图片[7]-超简单!用DeepSeek制做多功能课堂作业跟踪网页,真的太好用了-AI Express News
这次很明显的,上方多了一栏状态栏,底部也有“上传Excel更新学生名单”按钮
图片[8]-超简单!用DeepSeek制做多功能课堂作业跟踪网页,真的太好用了-AI Express News
选择好我们的学生名单,然后导入。页面上方就会弹出:
成功导入39名学生数据!
 
图片[9]-超简单!用DeepSeek制做多功能课堂作业跟踪网页,真的太好用了-AI Express News
诶,这不就对味了嘛👇
图片[10]-超简单!用DeepSeek制做多功能课堂作业跟踪网页,真的太好用了-AI Express News
40个学生名字直接排列整齐的出现在左框中,然后我们再来测试实际情况。
拖动列表里的人名,已提交作业栏就开始增加人数了。而且可以看到上方新增的状态栏里,所有数据都开始变动。
这是真nice!
图片[11]-超简单!用DeepSeek制做多功能课堂作业跟踪网页,真的太好用了-AI Express News
好,但是还是出现一个小问题,就是当我们的鼠标滑动在人名上时,“第几名完成”的显示内容被遮挡住了🤔
图片[12]-超简单!用DeepSeek制做多功能课堂作业跟踪网页,真的太好用了-AI Express News
没关系,我们直接让它修复,输入提示词:
很棒,不过当鼠标悬停时,非最后一排会被下一排的人名遮挡,这个再调试一下
 
图片[13]-超简单!用DeepSeek制做多功能课堂作业跟踪网页,真的太好用了-AI Express News
好,这次就相当OK了,直接浮现到了人名上方,完全无遮挡。
图片[14]-超简单!用DeepSeek制做多功能课堂作业跟踪网页,真的太好用了-AI Express News
三、补全下载功能
什么,你以为这就结束了?当然不!
每次提交完之后,难道还要一个个自己的手动统计吗,太麻烦了有点🥲
 
因此,我们完全可以再加一个下载结果Excel的指令,继续追问
很好,最后帮我生成一个下载Excel的按钮,要求能下载一个学生完成作业的最终排名表格(根据实际生成),方便老师汇总,依然以html格式输出
 
图片[15]-超简单!用DeepSeek制做多功能课堂作业跟踪网页,真的太好用了-AI Express News
诶,这次界面就很明显的做出了一个“下载提交排名Excel”的按键。
而且有意思的是,当我们没有将学生人名拖动时,它是灰色不能点击的,这块还有点智能化。
图片[16]-超简单!用DeepSeek制做多功能课堂作业跟踪网页,真的太好用了-AI Express News
全部拖动完毕之后,就变为蓝色。
图片[17]-超简单!用DeepSeek制做多功能课堂作业跟踪网页,真的太好用了-AI Express News
点击它,一个完整的Excel就下载下来了。
而且还有惊喜,不仅有完成作业的排名,还有具体的联网提交时间,具体完成用时,都有。
没得说,很全面了属于是✨
图片[18]-超简单!用DeepSeek制做多功能课堂作业跟踪网页,真的太好用了-AI Express News

好,我们来看看视频,更生动👇

四、蔚公子的感悟

 

以往我们布置课堂作业,总偶尔有小朋友偷偷溜掉,关键是,还不知道是谁。

 

我嘞个豆,这个确实头疼,那我们就用AI来帮我们分担。

 

而且把这个需求细细拆分,不仅能够看出个人答题的速度,还能够监督所有学生,关键是最后统计也不需要自己来了。

还是挺香的🤔

同时从AI编程的角度上来说,将一个看似简单的功能,不断放大,就做出了一个不错的小工具,这也是一个应该有的思路。

 

很多人都是做完第1步,就想不出第2步了,而后面的延伸,才是最精彩的点。

随着各类AI工具越来越强大,制作将慢慢变得不是问题,把我们延伸思考的能力,放到AI领域,或许更是重点。

未来千行百业的竞争,同样如此,不再只是某一单一领域的技能比拼,而是人与AI协作,到底谁更胜一筹✨

好,今天分享就是这些了~

 

也欢迎大家在评论区留下自己的思考,同时如果能点个赞和转发,就是对我最大的鼓励。

 

要是喜欢我的分享,不想错过每篇文章,可以设置⭐标,我们下期,不见不散✨

 

快收藏起来,慢慢探索,相信它能成为你提升效率的得力助手!

 

写在最后 

AI时代滚滚而来,不以任何人的意志为转移,而我们首先能做的,就是利用这些AI工具提高我们的效率:DeepSeek制作多功能课堂作业追踪网页就是如此。

 

与其抱怨 AI 不够聪明,不如学会用对方法,让 Al 成为你最得力的助手。

 

如果你觉得今天的分享对你有帮助,别忘了收藏起来,也欢迎分享给同样在职场/教育领域奋斗的伙伴们。下一篇,我们将分享更多让工作事半功倍的"效率秘籍",记得关注不要错过!

 

在评论区留下你最想了解的效率提升话题,下期内容说不定就是为你量身定制的!

 

如果有启发,别忘了给我点个赞、在看、转发~因为你的反馈真的很重要!

 

 

我是蔚公子,毕业后不上班,用 AI 打造一人企业。

 

近一年输出了大量 AI 实操干货,是一名小红书万粉博主,抖音播放100w+,视频号播放80w+,正在探索 AI 工作流赋能提效我的所有工作。

 

未来已来,职场人的分水岭会变得异常清晰——你是站在AI浪潮崛起的阵营内,还是沦为数字时代的局外人?

原文链接:https://mp.weixin.qq.com/s/kiGw5uDC2nxP8CGzE-IIIQ

© 版权声明
THE END
喜欢就支持一下吧
点赞15 分享
蔚公子说AI的头像-AI Express News
评论 抢沙发

请登录后发表评论

    暂无评论内容