ゲームがどのように學(xué)習(xí)に革命をもたらすのか考えたことはありますか? 私は創(chuàng)造性、テクノロジー、楽しさを融合するというアイデアに魅了され、教育的なビジュアル ノベル ゲームを開(kāi)発することにしました。ゲーム開(kāi)発の経験はありませんでしたが、Python ベースのビジュアル ノベル エンジンである Ren'Py を使用してこの取り組みに著手しました。 開(kāi)発を加速するために AI ツールを活用し、デプロイに Azure Static Web Apps を活用して、GitHub Copilot のコーディング支援を教えるプロトタイプを構(gòu)築しました。 12 月のお祝いのテーマにより、楽しみがさらに加わりました。

この投稿では私のアプローチについて詳しく説明します:

• Ren'Py フレームワークを使用したゲーム作成。
• 開(kāi)発を迅速化し、ビジュアル アセットを生成するための AI ツール (GitHub Copilot、Azure OpenAI Service) の使用。
• GitHub Actions および Azure Static Web Apps を介した自動(dòng)ビルドとデプロイメント。

興味がありますか?ゲームをオンラインでプレイし、GitHub リポジトリのソース コードにアクセスします (簡(jiǎn)潔にするためにリンクは省略しました)。

創(chuàng)世記

クラウド テクノロジーには、あらゆるスキル レベルに対応した教育用ゲームが數(shù)多く存在します。 Microsoft の Microsoft Technical Quest (Azure サービスを使用したカード ゲーム) および同様の AWS サービスは、ゲーム化されたクラウド學(xué)習(xí)の例です。

Microsoft Cloud Advocates の「Azure Space Mystery」 (ビジュアルとインタラクティブな質(zhì)問(wèn)を備えたテキストベースのゲーム) からインスピレーションを得て、同様のエクスペリエンスを作成し、クイズと達(dá)成報(bào)酬を備えたテキストベースのゲームを通じて技術(shù)概念を教えることを目指しました。 。 GitHub Copilot の最近の人気により、それが私の中心的なテーマとなり、12 月のお祝いの雰囲気によって補(bǔ)完されました。

結(jié)果: Christmas Copilot Quest。このゲームは、Visual Studio Code での GitHub Copilot の使用方法をプレイヤーにガイドし、GingerBot (サンタの Copilot を利用したアシスタント) が対話型のガイダンスを提供します。

ゲームのスクリーンショット: メインメニュー、ダイアログの例、學(xué)習(xí)リソースのページ。

テキストベースのゲームの作成

技術(shù)スタック:

私の要件には、ゲーム フロー、UI のカスタマイズ、カスタム コンポーネントの柔軟性、Web アプリの展開(kāi)に影響を與えるクイズを含む非線形のストーリーテリングが含まれていました。 Python に慣れていたため、Ren'Py にたどり著きました。ストーリー、クイズ、UI カスタマイズのためのスクリプト言語(yǔ)ですべてのニーズを満たしていました。 Python の拡張性と Web エクスポート機(jī)能、および自動(dòng)ビルドとデプロイメントのための CLI が重要な要素でした。

ゲーム構(gòu)造:

ゲームは 3 つの主要なコンポーネントで構(gòu)成されています:

スクリプト: ラベル付きセクションに編成された物語(yǔ) (モノローグ/対話) とクイズ。

ゲームのスクリーンショット: ダイアログの例、プレイヤーのクイズ。

グラフィカル ユーザー インターフェイス (GUI): 畫(huà)面、メニュー、および視覚要素。 Ren'Py では、組み込みの畫(huà)面カスタマイズ (ボタン、メニュー) と新しい畫(huà)面の作成 (達(dá)成通知、リソース メニュー) の両方が可能でした。

カスタム ゲーム畫(huà)面: キャラクターの選択、達(dá)成通知、達(dá)成畫(huà)面。

カスタム Python コード: ゲーム固有の機(jī)能 (実績(jī)システム、キャラクター定義、GUI ユーティリティ) を追加します。 これらのコンポーネントは保守性を考慮して分離されていました。 たとえば、プレーヤー名を決定する Python 関數(shù)はスクリプトから直接呼び出されます。

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]."

開(kāi)発における AI の統(tǒng)合

GitHub Copilot: Ren'Py をナビゲートするために重要です。 Ren'Py の限られたデータは精度に影響を與える可能性がありますが、Copilot は、畫(huà)像ボタンのあるキャラクター選択畫(huà)面を提案するなど、Ren'Py コンポーネントを理解するのに大いに役立ちました。

GitHub Copilot のキャラクター選択畫(huà)面の提案。

AI 畫(huà)像生成: ビジュアルをすばやく作成するために、AI ツールを使用しました。 DALL-E 3 (Azure OpenAI Service) は當(dāng)初、まともな畫(huà)像を提供していましたが、一貫したスタイルを維持するのが難しいことが判明しました。 Microsoft Designer は、特にアバターのテキストから畫(huà)像への変換機(jī)能により、より優(yōu)れた一貫性を提供しました。 「ローポリ」の美學(xué)により一貫性が確保され、ゲームのスタイルと一致しました。 プロンプトの例:

「クリスマスカラーのブラウスを著た、茶色の髪の様式化された女性の低ポリ 3D ポートレート。きれいな幾何學(xué)的形狀、フラットな色、柔らかな照明が特徴で、背景が白のミニマルな未來(lái)的なスタイルです。」

生成された畫(huà)像は、ノイズ低減、色の平滑化、背景の除去、およびポリゴン エッジの強(qiáng)調(diào)表示のためのフィルターを使用して処理されました。 畫(huà)像の組み合わせと重複により、まばたきするような効果が生まれました。

結(jié)論と次のステップ

この投稿では、教育用ゲームのプロトタイプを作成する際の Ren'Py と AI ツール (GitHub Copilot、Azure OpenAI Service、Microsoft Designer) を紹介しました。 次のステップは、Ren'Py の CLI と Azure Static Web Apps の GitHub Actions 統(tǒng)合を活用したデプロイです。 次のリソースでは、GitHub Copilot と DALL-E 3 に関する詳細(xì)情報(bào)が提供されています (簡(jiǎn)潔にするためにリンクは省略されています)。

以上がAI ツールと Azure Static Web Apps を使用した教育ゲームの構(gòu)築 (パート 1)の詳細(xì)內(nèi)容です。詳細(xì)については、PHP 中國(guó)語(yǔ) Web サイトの他の関連記事を參照してください。