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

有没有想过游戏如何彻底改变学习？ 我对融合创造力、技术和乐趣的想法着迷，促使我开发了一款教育视觉小说游戏。尽管缺乏游戏开发经验，我还是使用基于 Python 的视觉小说引擎 Ren'Py 踏上了这段旅程。 利用 AI 工具进行加速开发和 Azure Static Web Apps 进行部署，我构建了一个原型来教授 GitHub Copilot 的编码辅助功能。 十二月的节日主题增添了额外的享受。

这篇文章详细介绍了我的方法：

• 使用Ren'Py框架创建游戏。
• 使用 AI 工具（GitHub Copilot、Azure OpenAI 服务）来加快开发和视觉资产生成。
• 通过 GitHub Actions 和 Azure Static Web Apps 自动构建和部署。

感兴趣吗？在线玩游戏并访问我的 GitHub 存储库上的源代码（为简洁起见，省略了链接）。

创世纪

云技术有许多教育游戏，适合所有技能水平。 Microsoft 的 Microsoft Technical Quest（一种使用 Azure 服务的纸牌游戏）和类似的 AWS 产品体现了游戏化云学习。

受到 Microsoft Cloud Advocates 的“Azure Space Mystery”（一款带有视觉效果和互动问题的文本游戏）的启发，我的目标是创造类似的体验，通过带有测验和成就奖励的文本游戏教授技术概念。 GitHub Copilot 最近的流行使其成为我的中心主题，并辅以 12 月的节日氛围。

结果：Christmas Copilot Quest，一款引导玩家在 Visual Studio Code 中使用 GitHub Copilot 的游戏，并由 GingerBot（圣诞老人的 Copilot 支持的助手）提供交互式指导。

游戏截图：主菜单、对话示例、学习资源页面。

制作基于文本的游戏

技术堆栈：

我的要求包括非线性讲故事以及影响游戏流程的测验、UI 自定义、自定义组件灵活性和 Web 应用程序部署。 对 Python 的熟悉让我选择了 Ren'Py，它的脚本语言满足了故事、测验和 UI 定制的所有需求。 它的 Python 可扩展性和 Web 导出功能，以及用于自动构建和部署的 CLI，是关键因素。

游戏结构：

游戏由三个主要部分组成：

剧本：叙述（独白/对话）和测验，组织成带标签的部分。

游戏截图：对话示例、玩家问答。

图形用户界面 (GUI)： 屏幕、菜单和视觉元素。 Ren'Py 允许内置屏幕自定义（按钮、菜单）和新屏幕创建（成就通知、资源菜单）。

自定义游戏屏幕：角色选择、成就通知、成就屏幕。

自定义 Python 代码： 添加游戏特定功能（成就系统、角色定义、GUI 实用程序）。 为了可维护性，这些组件保持独立。 例如，直接从脚本调用确定玩家名称的 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： 对于导航 Ren'Py 至关重要。 虽然 Ren'Py 的有限数据可能会影响准确性，但 Copilot 在很大程度上帮助理解了 Ren'Py 组件，例如建议带有图像按钮的角色选择屏幕。

GitHub Copilot 的角色选择屏幕建议。

人工智能图像生成：为了快速创建视觉效果，我使用了人工智能工具。 DALL-E 3（Azure OpenAI 服务）最初提供了不错的图像，但事实证明保持一致的风格具有挑战性。 Microsoft Designer 提供了更好的一致性，特别是其头像文本到图像功能。 “低多边形”美学确保了一致性并符合游戏的风格。 提示示例：

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

使用滤镜处理生成的图像，以进行降噪、颜色平滑、背景去除和多边形边缘突出显示。 图像组合和重复创造了令人眨眼的效果。

结论和后续步骤

这篇文章演示了 Ren'Py 和 AI 工具（GitHub Copilot、Azure OpenAI Service、Microsoft Designer）如何创建教育游戏原型。 下一步是部署，利用 Ren'Py 的 CLI 和 Azure Static Web Apps 的 GitHub Actions 集成。 以下资源提供了有关 GitHub Copilot 和 DALL-E 3 的更多信息。（为简洁起见，省略了链接）。

以上是使用 AI 工具和 Azure 静态 Web 应用构建教育游戏（第 1 部分）的详细内容。更多信息请关注PHP中文网其他相关文章！