我为女儿开发了一个游戏网站

news2025/4/19 2:29:57

大家好,我是星河。

自从协助妻子为女儿开发了算数射击游戏后,星河就一直有个想法:为女儿打造一个专属的学习游戏网站。之前的射击游戏虽然有趣,但缺乏难度分级,无法根据女儿的学习进度灵活调整。而且,仅仅是数学游戏未免有些单调,语文和英语的学习也应该同步进行,寓教于乐才能事半功倍。当然,更重要的是,我希望能挑战一下自己,看看在完全没有网站开发经验的情况下,能否借助Cursor,仅凭自然语言,完成一个定制化网站的开发。这不仅是为女儿打造学习工具,也是一次探索AI辅助编程边界的尝试。

经过三天假期的奋战,这个网站总算搭建并部署完成了,网址是:http://47.122.68.201:3000/ 。欢迎大家体验。

图片

网站的源码星河也已经上传到GitHub,感兴趣的朋友可以在文末获取。

网站主要分为数学、英语、语文三个学习模块,每个模块都根据女儿的学习特点进行了定制设计。

  • 数学模块:

    沿用了之前算数射击游戏的思路,通过解答数学题目来发射子弹,击退小怪兽的进攻。这次我增加了关卡设置,随着关卡推进,题目难度会逐渐提升,循序渐进地锻炼女儿的数学能力。为了增加趣味性,我还特别设计了一个BOSS关卡,让学习过程充满挑战和惊喜。

图片

  • 英语学习模块:

    旨在帮助女儿记忆英文字母,并认识一些简单的单词。我把它设计成了一个小浣熊和僵尸先生的赛跑游戏。屏幕上方会显示一个单词和对应的图片,女儿需要在下方众多字母中找出正确的字母并拼写出单词。每拼对一个单词,小浣熊就会向前跑一段距离。僵尸先生则会匀速前进,我们需要让小浣熊比僵尸先生更快到达终点,赢得比赛。同样,我也设置了多个关卡,僵尸先生会越跑越快,而小浣熊每次前进的距离会越来越短,增加了游戏的紧张感和挑战性。

图片

  • 语文学习模块:

    侧重于帮助女儿学习生字,并了解一些简单的儿歌和古诗。它分为学习和游戏两个部分。在学习部分,会展示一个生字,并配以一首相关的儿歌或古诗,方便朗诵学习,加深记忆。游戏部分则以认字为主,女儿需要从飘起的气球中找到正确的生字并点击,获得分数。随着关卡推进,气球飘起的速度会越来越快,气球的数量也会越来越多,考验女儿的反应速度和识字能力。

图片

为了能够根据女儿的学习进度灵活调整游戏难度,星河还专门开发了后台管理页面,可以配置数学题目的难度、英语单词的范围、生字的范围等等。这样既能保证女儿在学习过程中感受到挑战和进步,又不会因为题目太难而打击她的积极性,真正做到寓教于乐。

图片

图片

图片

整个开发过程其实没什么特别之处,依然是遵循软件开发的通用流程:先明确需求,设计原型,然后根据原型进行功能开发。在完成初版开发之后,进行调试测试,持续的将发现的问题、错误连同日志反馈给Cursor,让它一步一步的进行功能完善。最终根据Cursor指导,将网站上线。

图片

图片

最后星河想分享一下最近使用Cursor开发一系列软件的感受。星河利用Cursor,通过纯自然语言的方式,已经成功开发了一个浏览器插件、一个桌面小游戏、一个媒体轮播软件Demo,以及这个简单的学习网站。目前来看:Cursor在大块逻辑编码上表现已经很好,但对于上下文以及前后事件的有机联系上还有待提高,这一块需要我们通过高质量的需求描述以及更全面的信息来补全。这儿星河举两个这次开发中遇到的问题作为例子:

  1. 开始在英语游戏和语文游戏里都碰到了音频无法播放的问题,但是英语游戏的问题Cursor很快就解决了,但是语文游戏的问题经过了好几轮对话都没有解决。这个时候星河提醒它,刚才在英语游戏中有相似的问题且它已经成功解决,可以参考相关代码。于是Cursor阅读了英语游戏的相关代码,很快就解决了语文游戏中音频无法播放的问题。Cursor在处理相似问题时,可能需要人为引导才能更好地复用已有的解决方案,这或许是未来AI编程工具需要改进的方向。

  2. 游戏图像涉及大小、位置、颜色等方面的调整,Cursor总是无法很好的帮我们修改。星河反思了一下,其实这儿是描述需求的问题。因为对这种问题,我们通常都会进行“更大一些”“更高一些,贴近屏幕上方”,“颜色更亮一些”这些模糊的描述,AI是很难直观的理解我们的意思的,于是只能一次一次尝试。其实更好的描述是“图像A按180*180像素的尺寸进行显示”,“将图像B放置距离屏幕顶端300像素的地方”,“将图像C的亮度调整至85”等,但这显然需要一定的设计和专业知识。这提醒我们,在使用AI编程工具时,需要尽可能地提供精确、量化的需求描述,才能提高AI的理解能力和工作效率。同时,也说明了设计师和专业知识在AI辅助编程中仍然具有重要价值。

目前来看,Cursor可以极大的扩展程序员的边界,让大家都能“全栈”,同时能极大的提高开发效率。对于完全不懂编程的人,通过Cursor来做一个小的软件应该也不算太难。但是想要开发一个产品级的软件,还是有一定的距离。一个产品可不光是简单的实现功能这么简单,UI界面、交互流程、产品性能、安全性等等问题,都是需要认真的打磨的。AI可以帮助我们快速实现功能,但产品的用户体验和商业价值仍然需要我们的思考和创造。

总的来说,Cursor等AI编程工具确实正在重塑软件开发流程,但它更适合快速原型开发、学习辅助和效率提升,而不适合完全替代人工编程。在一段时间内,AI与人类程序员的协作模式(“人机混合体”)会成为主流,也就是说星河暂时还不用担心被AI完全替代而丢了工作。

星河将最近利用AI开发的软件都提交了Github,包括这个儿童学习网站,需要源码的同学可自取:

https://github.com/lc-hanxi/AI-Program

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2332776.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【Spring Cloud Netflix】GateWay服务网关

1.基本概述 GateWay用于在微服务架构中提供统一的入口点,对请求进行路由,过滤和处理。它就像是整个微服务系统的大门,所有外部请求都要通过它才能访问到后端的各个微服务。 2.核心概念 2.1路由(Route) 路由是Spring Cloud gateWay中最基本…

Docker部署Jenkins服务

文章目录 1.下载Jenkins服务2.部署Java21(可选)2.1 安装Java21 3.Maven3.9.9安装4.启动Jenkins5.初始化Jenkins5.1 入门5.2 安装推荐的插件5.3 创建第一个管理员用户5.4 实例配置5.5 Jenkins已就绪5.6 开始使用Jenkins5.7 重启Jenkins 6.配置Jenkins6.1 …

[ctfshow web入门] web40

信息收集 怎么一下子多这么多过滤啊,我以为跳过了好几题 这又能eval了,但是连$也不能用了 不能用. * ?,所以打不出fla*或者fla?????了 不能用/,构造不出日志注入和伪协议包含 仔细观察,禁的是中文的括号&#x…

蓝桥杯c ++笔记(含算法 贪心+动态规划+dp+进制转化+便利等)

蓝桥杯 #include <iostream> #include <vector> #include <algorithm> #include <string> using namespace std; //常使用的头文件动态规划 小蓝在黑板上连续写下从 11 到 20232023 之间所有的整数&#xff0c;得到了一个数字序列&#xff1a; S12345…

Qt问题之 告别软件因系统默认中文输入法导致错误退出的烦恼

1. 问题 使用Qt进行研发时&#xff0c;遇到一个问题&#xff0c;当在系统默认输入法中文&#xff08;英文输入法或者搜狗就不会触发闪退&#xff09;的情况下&#xff0c;选中QTableWidget控件&#xff08;QTableWidgetItem有焦点&#xff0c;但是不双击&#xff09;&#xff…

AlDente Pro for Mac电脑 充电限制保护工具

AlDente Pro for Mac电脑 充电限制保护工具 一、介绍 AlDente Pro for Mac&#xff0c;是一款充电限制保护工具&#xff0c;是可以限制最大充电百分比来保护电池的工具。锂离子和聚合物电池&#xff08;如 MacBook 中的电池&#xff09;在40&#xff05; 至 80&#xff05; 之…

算法训练之动态规划(一)

♥♥♥~~~~~~欢迎光临知星小度博客空间~~~~~~♥♥♥ ♥♥♥零星地变得优秀~也能拼凑出星河~♥♥♥ ♥♥♥我们一起努力成为更好的自己~♥♥♥ ♥♥♥如果这一篇博客对你有帮助~别忘了点赞分享哦~♥♥♥ ♥♥♥如果有什么问题可以评论区留言或者私信我哦~♥♥♥ ✨✨✨✨✨✨ 个…

Navicat连接远程PostGreSQL失败

问题描述 使用本地Navicat连接Windows远程服务器上部署的PostGreSQL数据库时,出现以下错误: 解决方案 出现以上报错信息,是因为PostGreSQL数据库服务尚未设置允许客户端建立远程连接。可做如下配置, 1. 找到PostGreSQL数据库安装目录下的data子文件夹,重点关注:postgres…

新一代达梦官方管理工具SQLark:可视化建表操作指南

在数据库管理工作中&#xff0c;新建表是一项基础且频繁的操作。SQLark 的可视化建表功能为我们提供了一种高效、便捷且丝滑流畅的建表新体验。一起来了解下吧。 SQLark 官方下载链接&#xff1a;www.sqlark.com 新建表作为常见的功能&#xff0c;相比其他管理工具&#xff0c;…

什么是EXR透视贴图 ?

EXR透视贴图是一种基于 OpenEXR 格式的高动态范围&#xff08;HDR&#xff09;图像技术&#xff0c;主要用于3D建模、渲染和视觉特效领域。它通过高精度图像数据和透视映射功能&#xff0c;为场景创建逼真的光影效果和空间深度。 技术原理 高动态范围&#xff08;HDR&#xf…

每日一题(小白)数组娱乐篇21

由于题意可知我们是要将对应的数字转换为英文&#xff0c;我们要考虑两点一个是进制的转换&#xff0c;也就是类似于我们的十进制一到9就多一位&#xff0c;这里的进制就是Z进制也就是27进制一旦到26下一位则进位&#xff1b;另一方面要考虑数字的转换也就是1~26对应A~Z。解决上…

LINUX的使用(1)-挂载云硬盘

1.磁盘的挂载&#xff1a; 这个输出是来自 fdisk 或类似的工具&#xff0c;它展示了两块磁盘的分区信息。让我们逐个分析&#xff1a; 第一块磁盘 /dev/sda: 磁盘大小: 53.7 GB (约 53687091200 字节)&#xff0c;总共有 104857600 个扇区。扇区单位: 每个扇区大小为 512 字节…

GPT-4o-image模型:开启AI图片编辑新时代

在生成式AI技术爆发式迭代的今天&#xff0c;智创聚合API率先突破多模态创作边界&#xff0c;正式发布集成GPT-4o-image模型的创作平台&#xff0c;以“文生图-图生图-循环编辑”三位一体的技术矩阵&#xff0c;重新定义数字内容生产流程。生成图像效率较传统工具提升300%&…

使用pip3安装PyTorch与PyG,实现NVIDIA CUDA GPU加速

使用python3的pip3命令安装python依赖库。 # python3 -V Python 3.12.3 # # pip3 -V pip 25.0.1 from /root/.pyenv/versions/3.12.3/lib/python3.12/site-packages/pip (python 3.12)Usage: pip3 install [options] <package> ...pip3 install [options] -r <re…

Rust主流框架性能比拼: Actix vs Axum vs Rocket

本内容是对知名性能评测博主 Anton Putra Actix (Rust) vs Axum (Rust) vs Rocket (Rust): Performance Benchmark in Kubernetes 内容的翻译与整理, 有适当删减, 相关指标和结论以原作为准 在以下中&#xff0c;我们将比较 Rust 生态中最受欢迎的几个框架。我会将三个应用程序…

【QT】QT的消息盒子和对话框(自定义对话框)

QT的消息盒子和对话框&#xff08;自定义对话框&#xff09; 一、消息盒子QMessageBox1、弹出警告盒子示例代码&#xff1a;现象&#xff1a; 2、致命错误盒子示例代码&#xff1a;现象&#xff1a; 3、帮助盒子示例代码&#xff1a;现象&#xff1a; 4、示例代码&#xff1a; …

【结合vue源码,分析vue2及vue3的数据绑定实现原理】

结合vue源码&#xff0c;分析vue2及vue3的数据绑定实现原理 Vue 2 数据绑定实现整体思路详细实现1. Observer 类&#xff1a;数据劫持2. Dep 类&#xff1a;依赖收集3. Watcher 类&#xff1a;订阅者 Vue 3 数据绑定实现整体思路详细实现1. reactive 函数&#xff1a;创建响应式…

如何实现H5端对接钉钉登录并优雅扩展其他平台

如何实现H5端对接钉钉登录并优雅扩展其他平台 钉钉H5登录逻辑后端代码如何实现&#xff1f;本次采用策略模式工厂方式进行定义接口确定会使用的基本鉴权步骤具体逻辑类进行实现采用注册表模式&#xff08;Registry Pattern&#xff09;抽象工厂进行基本逻辑定义具体工厂进行对接…

LabVIEW真空度监测与控制系统

开发了一种基于LabVIEW的真空度信号采集与管理系统&#xff0c;该系统通过图形化编程语言实现了真空度的高精度测量和控制。利用LabVIEW的强大功能&#xff0c;研制了相应的硬件并设计了完整的软件解决方案&#xff0c;以满足工业应用中对真空度监测的精确要求。 项目背景 随着…

虚拟dom工作原理以及渲染过程

浏览器渲染引擎工作流程都差不多&#xff0c;大致分为5步&#xff0c;创建DOM树——创建StyleRules——创建Render树——布局Layout——绘制Painting 第一步&#xff0c;用HTML分析器&#xff0c;分析HTML元素&#xff0c;构建一颗DOM树(标记化和树构建)。 第二步&#xff0c;用…