Deprecated: imwpcache\f884414bce24ee67f\f73723ec7b1919fa5::__construct(): Implicitly marking parameter $YECBGYFECGEAFWHA as nullable is deprecated, the explicit nullable type must be used instead in /www/wwwroot/www.chuangxiangniao.com/wp-content/plugins/imwpcache-dist/build/f884414bce24ee67ff73723ec7b1919fa5.php on line 2

Deprecated: imwpcache\f884414bce24ee67f\f73723ec7b1919fa5::__construct(): Implicitly marking parameter $BBWFDDBHHYHDXXAB as nullable is deprecated, the explicit nullable type must be used instead in /www/wwwroot/www.chuangxiangniao.com/wp-content/plugins/imwpcache-dist/build/f884414bce24ee67ff73723ec7b1919fa5.php on line 2
使用 AI 工具和 Azure 静态 Web 应用构建教育游戏(第 1 部分)_创想鸟

使用 AI 工具和 Azure 静态 Web 应用构建教育游戏(第 1 部分)

探索游戏化学习:一个使用ren’py和ai构建的教育视觉小说游戏

一直以来,将创造力、技术和趣味性融合于一体的理念都深深吸引着我。最近,我尝试通过开发一款教育性质的视觉小说游戏来探索这种可能性。虽然我缺乏游戏开发经验,但我渴望尝试新事物,因此我选择使用Ren’Py——一个基于Python的视觉小说引擎——作为我的起点。为了加快开发速度,我利用了AI工具,并使用Azure静态Web应用进行部署,最终创建了一个交互式游戏原型,旨在教授如何使用GitHub Copilot辅助编码任务。考虑到游戏开发的月份是12月,我还为游戏增添了节日氛围,以增强游戏体验。

本文将分享我的开发过程,包括:

使用Ren’Py框架构建游戏。利用GitHub Copilot、Azure OpenAI服务等AI工具来加速开发并生成游戏视觉素材。使用GitHub Actions和Azure静态Web应用自动化构建和部署流程。

想体验一下吗?您可以在线试玩游戏,并访问我的GitHub仓库查看源代码。

开发历程

市面上已存在许多关于云技术的教育游戏,涵盖从入门到高级用户的各个层面。例如,微软提供了Microsoft Technical Quest,这是一款基于纸牌的游戏,玩家可以使用Azure服务构建参考架构。其他云服务提供商,如AWS,也提供基于游戏的培训,帮助用户以一种趣味横生的方式学习云解决方案的构建方法。

几年前,我玩过一款名为Azure Space Mystery的游戏,该游戏由微软云倡导者为国际妇女和女孩科学日特别打造。这是一款基于文本的游戏,拥有丰富的图形,并通过关卡挑战来推进游戏进程。我们的目标是让微软学习内容以更具吸引力的方式触达开发者。

尽管缺乏游戏开发经验,我还是想尝试创建一个类似的游戏。我的想法是创建一个基于文本的游戏,教授技术概念,包含简短的测验,并在玩家取得进展时给予成就奖励。鉴于GitHub Copilot近期备受关注,我决定将其作为游戏的核心主题。由于游戏开发始于12月,因此我还加入了节日主题元素。

最终成果是圣诞Copilot任务(Christmas Copilot Quest),玩家可以在游戏中学习如何在Visual Studio Code中使用GitHub Copilot辅助完成编码任务。在圣诞老人风格的Copilot助手Gingerbot的引导下,玩家将以互动的方式了解GitHub Copilot的功能。

使用 AI 工具和 Azure 静态 Web 应用构建教育游戏(第 1 部分)

展示主菜单、对话示例和学习资源页面的游戏屏幕截图

基于文本的游戏构建

技术栈

市面上有很多优秀的工具可用于构建基于文本的游戏,但我有一些关键需求:

支持编写包含测验或选择分支,从而影响游戏流程的非线性故事。可自定义游戏用户界面。灵活编写自定义组件。支持将游戏部署为Web应用程序。

由于Python是我的首选语言,我自然而然地选择了Ren’Py,这是一个基于Python的视觉小说引擎。它满足了我的所有需求,提供了一种易于使用的脚本语言来编写故事、定义测验和自定义UI。它还允许使用Python扩展其内置功能,并将游戏导出到桌面、移动和Web平台。此外,Ren’Py命令行界面(CLI)的可用性使我能够自动化游戏的构建和部署流程。

游戏结构

游戏围绕三个核心组件构建:

脚本:包含游戏的故事和测验。叙述可以是独白或角色间的对话。故事被组织成由标签标识的部分。

使用 AI 工具和 Azure 静态 Web 应用构建教育游戏(第 1 部分)

游戏截图,展示对话示例和供玩家回答的测验

图形用户界面(GUI):涵盖游戏中显示的所有屏幕和菜单,以及使用的视觉元素。Ren’Py脚本语言允许自定义内置屏幕(例如按钮和菜单),并创建新的屏幕,例如:

向玩家显示成就解锁信息的通知屏幕。显示已获得成就和学习资源的菜单。

使用 AI 工具和 Azure 静态 Web 应用构建教育游戏(第 1 部分)

自定义游戏屏幕:角色选择(左)、成就解锁通知(中)和已获得成就屏幕(右)

自定义Python代码:提供根据游戏需求定制的附加功能。最新版本的Ren’Py支持使用Python 3.9编写自定义组件脚本。游戏中的自定义组件包括:

成就系统,允许玩家通过完成特定任务来获得奖励,并且成就会被持久存储。角色定义和实用程序功能,使玩家能够选择自己喜欢的角色和名称。GUI实用程序,例如图像转换(例如眨眼效果)以及用Python编写的自定义字体和文本样式。

为了保持游戏的可维护性和可扩展性,这些组件是相互独立的。脚本定义故事,而逻辑则被组织成Python模块,在Ren’Py中称为存储(store)。例如,可以直接从脚本调用根据玩家输入确定玩家姓名的Python函数,如下所示:

label introduction:    felix "Ah, you must be the new coder Santa called for! What's your name?"    $ player_input = renpy.input(        _("(Type your name and press Enter, or press Enter to use the default name, [character_name].)")    )    $ player_name = character_utils.determine_player_name(player_input)    player "I'm [player_name]."

AI工具的集成

使用GitHub Copilot辅助编码

我发现GitHub Copilot对于学习和理解Ren’Py非常有帮助,这是一个我以前从未使用过的框架。尽管Ren’Py并非一个广泛使用的框架,可用于训练的数据可能有限,但GitHub Copilot正确地回答了我的大部分问题,并帮助我理解各种Ren’Py组件的工作原理。一个例子是它建议实现带有图像按钮的角色选择屏幕。

使用 AI 工具和 Azure 静态 Web 应用构建教育游戏(第 1 部分)

GitHub Copilot建议的角色选择屏幕实现

这个建议非常准确,并提供了一个坚实的起点,使我能够快速开发屏幕。然而,Copilot并没有提供向屏幕按钮添加悬停过渡的正确实现。考虑到Ren’Py并非一种广泛使用的语言,这在某种程度上是可以预料的。

使用AI工具生成图像

为了快速创建一个简单的游戏,我没有时间自己设计所有图形。我使用人工智能驱动的图像生成工具来创建游戏中使用的角色和背景图像。我的关键需求是所有图像的风格一致以及节日主题。

我首先尝试了DALL-E 3模型,可以通过Azure OpenAI服务访问。虽然生成的图像质量不错,但我发现保持所有图像风格的一致性具有挑战性。

然后,我转向了Microsoft Designer,这是一个微软推出的基于人工智能的云端图形设计应用程序。它在不同的请求中提供了更一致的结果,更符合我的需求。对于角色创建,我使用了头像文本到图像功能,对于背景,我使用了默认功能。在尝试了多种风格后,我选择了“低多边形”的美学风格,因为它既能提供一致的结果,又能提供与游戏趣味性、游戏化本质相匹配的外观。以下是我用来生成角色图像的提示示例:

“一位棕色头发的风格化女性的低多边形3D肖像,穿着圣诞颜色的衬衫,具有干净的几何形状、平坦的颜色和柔和的灯光,采用白色背景的简约未来主义风格。”

我通过应用滤镜来处理生成的图像,以减少噪点、平滑颜色、去除背景并突出显示多边形的边缘。在某些情况下,我组合了两个图像来创建最终的角色设计,并生成了闭着眼睛的重复图像,以在游戏中产生眨眼效果。

总的来说,我发现这些工具对于快速生成视觉资产非常有帮助。虽然我为每个角色创建了数百个版本(好吧,也许我有点完美主义!),但人工智能工具对于生成符合游戏主题的图像来说非常宝贵。

总结

本文探讨了如何使用基于Python的视觉小说引擎Ren’Py,以及GitHub Copilot、Azure OpenAI服务和Microsoft Designer等AI工具来创建教育游戏原型。接下来是什么呢?我们需要部署该应用程序。幸运的是,Ren’Py提供了一个CLI工具来自动化游戏构建,并且Azure静态Web应用与GitHub Actions无缝集成。在下一篇文章中,我将向您展示如何设置GitHub Actions工作流程来自动化游戏的构建和部署过程。

同时,您可以查看以下资源以了解有关GitHub Copilot和DALL-E 3模型的更多信息:

GitHub Copilot基础知识 – 了解AI结对编程使用GitHub Copilot加速应用程序开发GitHub Copilot聊天食谱使用Azure OpenAI服务生成图像

以上就是使用 AI 工具和 Azure 静态 Web 应用构建教育游戏(第 1 部分)的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1355491.html

赞 (0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
PyTorch 中的 CocoCaptions (1)
上一篇 2025年12月13日 19:14:57
如何在 Python 中配置 VSCode 自动格式化和 Linting
下一篇 2025年12月13日 19:15:03

相关推荐

  • 如何设置Linux软件包更新排除 yum exclude和apt-mark hold

    如何设置Linux软件包更新排除 yum exclude和apt-mark hold如何设置Linux软件包更新排除 yum exclude和apt-mark hold如何设置Linux软件包更新排除 yum exclude和apt-mark hold如何设置Linux软件包更新排除 yum exclude和apt-mark hold

    要阻止linux系统中特定软件包更新,可针对不同发行版使用相应方法。对于rhel/centos系系统,可通过在/etc/yum.conf或.repo文件中添加exclude=包名来排除升级;对于debian/ubuntu系系统,则使用sudo apt-mark hold 包名命令锁定版本。这两种方式…

    2026年9月21日 • 用户投稿
    400
  • MySQL热点数据缓存策略_MySQL减少磁盘访问提升性能

    MySQL热点数据缓存策略_MySQL减少磁盘访问提升性能MySQL热点数据缓存策略_MySQL减少磁盘访问提升性能MySQL热点数据缓存策略_MySQL减少磁盘访问提升性能MySQL热点数据缓存策略_MySQL减少磁盘访问提升性能

    mysql热点数据缓存的核心在于将频繁访问的数据保留在内存中以减少磁盘i/o,提升查询速度并缓解数据库压力。1. innodb缓冲池是关键机制,需合理配置其大小(通常为服务器内存的70-80%)及实例数以优化性能;2. 应用层缓存如redis/memcached通过前置缓存逻辑减少对mysql的直接…

    2026年9月21日 • 用户投稿
    000
  • VSCode怎么更改解码方式_VSCode文件编码修改教程

    VSCode通过设置文件编码解决乱码问题,可手动选择“以不同编码重新打开”或“使用编码保存”,推荐统一使用UTF-8编码并启用files.autoGuessEncoding自动检测,避免编码错误。 VSCode更改解码方式主要通过设置文件编码来实现,以便正确显示文件内容。通常情况下,VSCode会自…

    2026年9月21日
    800
  • 如何在Krita导出AI生成的8K艺术图片?保存超高清图像方法

    答案是优先选择PNG格式导出8K AI艺术作品,确保画布为8K分辨率,嵌入sRGB色彩配置文件,并优化系统内存与硬盘性能以提升Krita处理效率。 ☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 免费无限量使用 DeepSeek R1 模型☜☜☜ 在Krita中导出AI生成的8K艺术图片,核心…

    2026年9月21日
    100
  • Laravel 8 登录后重定向到仪表盘的完整教程

    本教程详细介绍了在 Laravel 8 中实现用户登录后重定向到仪表盘的多种方法。我们将探讨如何利用 Laravel 内置的 $redirectTo 属性,以及如何通过重写 LoginController 中的 login 方法来实现自定义重定向逻辑。此外,教程还将重点讲解正确的路由配置和中间件使用…

    2026年9月21日
    000
  • safari浏览器怎么把标签页固定在最左边_safari浏览器标签页固定最左设置

    Safari可通过“固定标签”功能将常用网页保持在标签栏最左并随启动恢复;2. 手动拖动标签至最左可临时调整顺序但不永久保存;3. 结合书签栏添加常用网站并固定标签,可提升访问效率。 如果您希望在使用 Safari 浏览器时将常用网页始终保持在标签栏的最左侧位置,以便快速访问,可以通过以下方法实现标…

    2026年9月21日
    000
  • 争! 《英雄联盟》S15主题曲《Sacrifice》上线

    近期,国民moba游戏《英雄联盟》官方发布了2025年英雄联盟全球总决赛主题曲。这首名为《sacrifice》的歌曲由歌手邓紫棋演唱,并由亚历克斯·西弗(mako)和塞巴斯蒂安·纳詹德创作。 《Sacrifice》MV: MV一经播出便受到了国内外玩家们的热议,动画部分获得不少好评。MV再现了多个操…

    2026年9月21日
    100
  • 如何用Animoto制作AI营销视频?快速生成商业AI视频的教程

    如何用Animoto制作AI营销视频?快速生成商业AI视频的教程如何用Animoto制作AI营销视频?快速生成商业AI视频的教程如何用Animoto制作AI营销视频?快速生成商业AI视频的教程如何用Animoto制作AI营销视频?快速生成商业AI视频的教程

    Animoto通过模板与拖放功能,结合AI生成的文案和配音,帮助用户快速制作品牌统一、节奏合理、带明确CTA的高效营销视频,适用于多平台推广。 ☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 免费无限量使用 DeepSeek R1 模型☜☜☜ Animoto是一个非常适合快速制作AI营销视频的…

    2026年9月21日 • 用户投稿
    000
  • 使用本地HTML文件运行JavaScript脚本失败的原因及解决方案

    本文旨在帮助开发者理解在没有Web服务器的情况下,直接通过浏览器打开本地HTML文件时,JavaScript脚本可能无法正常运行的原因,并提供相应的解决方案。文章将深入探讨浏览器安全策略、相对路径问题以及如何正确引入和执行JavaScript脚本,确保你的HTML、CSS和JavaScript代码能…

    2026年9月21日
    000
  • VSCode怎么看效果_VSCode实时预览和调试代码运行效果教程

    VSCode通过实时预览扩展和内置调试器实现代码效果查看。使用Live Server可实时预览前端页面,保存即刷新;Markdown文件支持侧边预览。调试功能需配置launch.json,支持Node.js、Python、浏览器端JavaScript等,通过断点、变量监视、调用堆栈等深入分析代码执行…

    2026年9月21日
    000
  • 使用正则表达式检测字符串中的除零操作

    本文详细介绍了如何使用正则表达式精确检测字符串中潜在的除零操作。针对表达式中可能存在的变量引用(如<>)、数字、多余空格以及禁止包含引号等复杂情况,文章提供了一个高效的正则表达式模式,并深入解析其构成原理。通过具体的Java代码示例,读者将学习如何将此模式应用于实际编程场景,从而有效识别…

    2026年9月21日
    000
  • AI钉钉1.0联动雅里数科 共探“酒旅+AI”的工作新范式

    在数字化浪潮席卷全球的当下,人工智能正以前所未有的速度重塑各行各业,酒旅产业也正在迎来由ai驱动的深刻变革。10月11日,阿里巴巴钉钉再度走进雅里数科集团,开启一场关于“酒旅行业ai原生工作方式”的深度对话。此次交流标志着双方合作迈入全新阶段,致力于共同探索ai原生工作范式,引领酒旅行业迈向智能化发…

    2026年9月21日
    100
  • 如何从被调用类中获取调用者文件的命名空间

    本文探讨了在PHP中,如何在不通过参数传递的情况下,从一个被调用的工具类中获取到调用该方法的文件的命名空间。通过结合使用`debug_backtrace()`回溯调用栈以定位调用者文件,并利用`token_get_all()`解析文件内容来提取命名空间声明,提供了一种实用的解决方案。文章详细介绍了实…

    2026年9月21日
    000
  • 构建Spring自定义Kafka配置的注解式解决方案

    本文探讨了在Spring Boot应用中通过自定义注解实现Kafka配置自动化时遇到的挑战,特别是由于Bean注册时机不当导致的依赖注入失败。我们将深入分析问题根源,并提供两种核心解决方案:利用META-INF/spring.factories实现标准化的自动配置发现,以及通过ImportBeanD…

    2026年9月21日
    1100
  • 悟空浏览器开发者工具的控制台怎么用_悟空浏览器Console控制台使用入门教程

    首先启用悟空浏览器开发者工具并进入Console标签,可查看错误、警告等日志信息,通过过滤功能定位问题;支持执行JavaScript代码实时调试,监控网络请求失败及全局异常,还可清空或保存日志以便分析。 如果您在使用悟空浏览器进行网页开发或调试时,发现页面元素未按预期工作或脚本报错,则可以借助开发者…

    2026年9月21日
    700
  • 蝴蝶号无人直播中的AI角色控制技巧与注意事项

    蝴蝶号无人直播中的AI角色控制技巧与注意事项蝴蝶号无人直播中的AI角色控制技巧与注意事项蝴蝶号无人直播中的AI角色控制技巧与注意事项蝴蝶号无人直播中的AI角色控制技巧与注意事项

    要让蝴蝶号ai角色在直播中更具真实感和互动性,关键在于注入“人味儿”,打破“机器感”。首先,声音要有温度,选择有情感起伏的音色,并根据不同语境调整语调、语速,适当加入语气词增强亲切感;其次,确保视觉形象与行为模式统一,动作、表情、眼神与语音内容自然同步,强化人设一致性;第三,建立多层次互动逻辑,ai…

    2026年9月21日 • 用户投稿
    400
  • VSCode整个项目怎么导出_VSCode项目打包与导出为压缩文件的完整教程

    答案:导出VSCode项目可通过手动压缩、终端命令、插件或Git克隆实现,推荐使用终端命令排除node_modules并选择zip格式以兼顾兼容性与效率。 将VSCode整个项目导出,实际上就是将项目文件夹打包成一个压缩文件,方便备份、分享或迁移。下面介绍几种常见的打包导出方法。 解决方案: 手动压…

    2026年9月21日
    000
  • 百度网盘官方网页登录 百度网盘网页版入口快捷

    百度网盘官方网页登录入口是https://pan.baidu.com,用户可直接访问该网址登录账号,主界面布局清晰,支持文件上传下载、智能检索、跨设备同步及在线预览等功能。 百度网盘官方网页登录入口在哪里?这是不少网友都关注的,接下来由PHP小编为大家带来百度网盘网页版入口快捷方式,感兴趣的网友一起…

    2026年9月21日
    100
  • MAC系统磁盘空间不足怎么办_Mac磁盘空间清理与管理技巧

    Mac存储空间不足时,应先使用系统自带的存储管理工具分析并优化存储,通过“关于本机”进入“管理”界面,启用优化选项;接着手动删除不常用应用及其在Application Support和Caches中的残留文件;再进入资源库清理Caches和Logs中的缓存与日志;随后在“避免杂乱”中查找并删除大型无…

    2026年9月21日
    000
  • DALL-E的AI混合工具如何使用?生成创意图像的详细操作教程

    DALL-E的AI混合工具能将两张图片融合生成新图像,操作简单且支持权重调整与后期编辑,适用于创意激发与艺术探索。 ☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 免费无限量使用 DeepSeek R1 模型☜☜☜ DALL-E的AI混合工具,简单来说,就是把两张图“缝合”在一起,让AI帮你生…

    2026年9月21日
    000

发表回复

登录后才能评论
关注微信