一日で作る自分だけのビジュアルノベルゲーム

React、Javascript、SpringAI、Springbootを使って自分だけのビジュアルノベルゲームを作ってみましょう。 SpringAIとReactを通じてWebベースのビジュアルノベルゲームを作る方法をお教えします! Neo + Essential

難易度 初級

受講期間 無制限

React
React
Spring Boot
Spring Boot
AI
AI
SpringAI
SpringAI
React
React
Spring Boot
Spring Boot
AI
AI
SpringAI
SpringAI

学習した受講者のレビュー

4.4

5.0

hellowaz

93% 受講後に作成

AIをゲームに適用する手法や、サーバーとフロントエンドを従来のゲーム開発方式であるC#ではなく、SpringとReactで実装する手法が印象的でした。

5.0

좋은사람이되자

33% 受講後に作成

いいですよ

5.0

bagps1

93% 受講後に作成

良い

受講後に得られること

  • Reactを活用したWebベースのゲーム(ビジュアルノベル)制作方法

  • シンプルなアニメーション・エフェクトの適用で没入感のあるウェブサイトを作る

  • SpringAI(GPT API)の活用方法

  • 独創性のあるアイデアの導出方法

たった一日で作る自分だけのビジュアルノベルゲーム

React、Spring Boot、人工知能(AI)、SpringAI

🚀 たった一日で、あなたのアイデアがビジュアルノベルゲームとして生まれます。

あなたが毎日触れるゲームたち、
そのうちの一つくらいは「私も一度作ってみたい」という考え、したことはありませんか?

しかし、いざ挑戦しようとすると…
「フロント、バックエンド?何から始めればいいの?」
「AIも組み込みたいけど、GPT APIは難しそうだし…」
「説明書を読むだけで疲れちゃうな…」

👉 この講座は、そんな迷い挫折感を終わらせるために作られました。


これから私たちが作るゲームのストーリーを一度見ていきましょう!

こんな方におすすめです

🥳

CRUDではなく独特なフロントを作ってみたくて

既存のCRUD以外の特別なプロジェクトを作ってみたい方

😘

サーバーとフロントを一緒に経験したい

フロントだけやっていた方やサーバーだけやっていた方も両方できるフルスタックWeb型ビジュアルノベルゲーム作り

🤩

AIを活用したプロジェクトをやってみたい

SpringAIでGPT APIを呼び出して自分だけのキャラクター応答値を作ってみましょう

🎮 この講義を受講すると?

  • たった一日で、自分だけのストーリーを持つビジュアルノベルゲームを完成させます。

  • Reactでフロントを直接組みながら目の前でキャラクターとシーンが動く体験をします。

  • Spring Boot + SpringAIでバックエンドを接続し、AIがセリフを作ってくれるゲームを実装します。

  • "AI + ゲーム + Webアプリ"という最新技術の組み合わせをポートフォリオに盛り込むことができます。

この講義の特徴

🎯 この講義の核心的特徴&差別化ポイント

  1. インフラーン初、Webベースのビジュアルノベルゲーム講座

    • 従来のビジュアルノベルゲーム講座は、ほとんどがUnityやゲームフレームワーク中心でしたが、
      この講座はReact + Spring Boot + SpringAIウェブ上ですぐに楽しめるゲーム制作を扱います。

    • 「Web環境でAIと連動したインタラクティブゲーム」を学べる独歩的な講義です。

  2. 実習中心、一日で成果物完成

    • 理論だけを羅列する一般的な講義ではありません。

    • 手を動かしながらコードを書き、シーンとキャラクターを目の前で動かしながら即座に達成感を感じることができます。

  3. 最新技術スタックの実践適用

    • ReactでUI実装、Spring Bootでバックエンド連携、SpringAIでGPT API活用まで実務の核心技術を同時に体験します。

    • ゲーム制作という興味深いテーマを通じて最新のWeb開発スキルを自然に学習します。

  4. AIと創作の融合

    • 単なるコーディングだけを学ぶ講義ではありません。

    • AIを活用してキャラクターのセリフを生成し、ストーリーを動的に変化させる体験を提供します。

    • 創作と開発を同時に体験できる唯一無二の講座です。

  5. ポートフォリオ及び実務連携可能

    • 単純な実習用プロジェクトではなく、ポートフォリオに載せられる完成度を提供します。

    • 「AI + Web + ゲーム」の組み合わせは、今後の就職、インターン、創作活動において強力な差別化要素となります。


こんな内容を学びます

作って学ぶSpringboot SpringAI

講義を進めながらChatGPT APIをSpringAIを通じて呼び出す方法を学び、簡単なプロンプトエンジニアリングの理論と実習を通じて自分だけのキャラクター応答を作る方法をお教えします。

React + JS で作る自分だけのビジュアルノベルゲーム

他では見られなかったアイデアであるReactで自分だけのウェブビジュアルノベルゲームを作りながら、皆さんの独創的なアイデアを表現する方法について説明します。

😱 この講義を見逃してはいけない理由

  • 今は「AI + 創作」がトレンドです。
    他の人より先に体験し、成果物を作ることが、競争力の始まりとなります。

  • React + Spring Bootという実務の核心スタックを、ゲームという面白いテーマで学ぶため、絶対に退屈しません。

  • この講座は理論中心ではありません。
    直接コードを書き、結果を目で確認し、完成作を手にすることができます。

「いつか学ぼう…」と先延ばしにしている瞬間、
すでに誰かがあなたが作りたかった自分だけのゲームを作っています。

こんにちは、知識共有者のNeoです!

  • Kotlinを主に扱うサーバー開発者として、サーバー開発、デプロイ、Spring AIなど様々な開発講座を作成しています。

  • シンプルで簡潔な短い講義で、理論よりも実践中心に講義を進めています。

  • 様々なプロジェクトを簡単かつ手軽に皆さんが真似できるように講義を制作しており、多くの方が経験したことのないものを簡単に体験できるようにすることが私のモットーです。

何か気になることはありますか?

Q1. コーディングが苦手ですが、本当に1日でゲームを作ることができますか?

👉 この講義は「大規模プロジェクト」ではなく、短くてインパクトのあるトイプロジェクトを目標としています。
プログラミングの基礎さえあれば十分についてこられるよう、直接コードを書きながら実習中心で進めます。
複雑なロジックは私があらかじめ準備しましたので、皆さんはゲームが目の前で完成する楽しさを感じることに集中していただければと思います。

Q2. わざわざReactとSpringBoot、そしてSpringAIまで一緒に学ぶ必要がありますか?

👉 実は「ゲーム1つだけ作る」のであれば、わざわざ全部使う必要はありません。
しかし、この講義は単に「ゲーム完成」が目的ではなく、実務で使われる核心技術スタック面白いプロジェクトで身につけることを目的としています。

  • React → フロントエンドの核心技術

  • Spring Boot → 安定したバックエンド構造

  • SpringAI → AIをサービスに接続する方法
    つまり、講義を終えると単純なゲームではなく、ポートフォリオに書けるAIベースのWebプロジェクトを持つことになります。

Q4. この講義を全て受講したら、どこに活用できますか?

👉 様々な方向性があります。

  1. クリエイターとして: 自分で書いたストーリーをWebベースのゲームとして配信できます。

  2. 開発者として: React + SpringBoot + AIを組み合わせた経験をポートフォリオに入れて実務でアピールできます。
    ゲームを作るということは「楽しい経験」ですが、同時に履歴書に確実に残る強みになるでしょう。

受講前の参考事項

実習環境

  • MacOS環境で講義を進めますが、Windowsの方もついてこられると思います。

  • 講義で活用するIntellij、Postman、GPTなどのセッティング&インストール方法をお教えします。

  • 講義のビジュアルノベルストーリーは、事前に作成されたスクリプト形式でNotion学習資料に提供されます。

学習資料

  • 学習資料(Notionリンク)を提供いたします。

事前知識および注意事項

  • 開発を経験したことがあれば無理なくついてこられます。

  • コンピュータが好きでプログラムのインストールについてこられるなら、無理なく開発を進めることができます。

  • 各言語の基礎について知っていれば便利ですが、知らなくても問題ありません。

こんな方に
おすすめです

学習対象は
誰でしょう?

  • 自分でストーリーを書いて、自分だけのビジュアルノベルゲームを制作してみたい人

  • Reactを実戦プロジェクトに適用してみたいフロントエンド開発者志望生

  • Webで動作するインタラクティブコンテンツ制作に興味のあるクリエイター

  • 短時間で完成度の高いWebアプリを作ってみたい初・中級開発者

前提知識、
必要でしょうか?

  • React

  • JavaScript

  • Kotlin

  • 基本的なコーディング技術

こんにちは
Neoです。

3,109

受講生

368

受講レビュー

59

回答

4.7

講座評価

33

講座

こんにちは!Inflearnで講義を行っているNeoです。

普段接することのできなかった開発技術を、多様な方々が体験できるようにすることが私の目標です。

ですので、私は単なる理論の羅列よりも実務中心のカリキュラムを構成し、トラブルシューティングなしで学べる実習中心の講義を提供したいと考えています。

初心者の方でも無理なくついてこられるよう、できるだけ軽やかで親切なアプローチで内容を構成しており、知識へのハードルを下げることに特に注力しています。
時には、志を同じくする方々と一緒に講義制作を行うこともあります!

コラボレーションおよびその他のビジネスに関するお問い合わせは、yeseong0412@gmail.comまでお願いいたします!

もっと見る

共同知識共有者

カリキュラム

全体

15件 ∙ (2時間 18分)

講座掲載日: 
最終更新日: 

受講レビュー

全体

8件

4.4

8件の受講レビュー

  • yeseong0412님의 프로필 이미지
    yeseong0412

    受講レビュー 33

    平均評価 5.0

    5

    100% 受講後に作成

    ウェブベースのビジュアルノベルゲームを作ってみることができます

    • bagps1님의 프로필 이미지
      bagps1

      受講レビュー 14

      平均評価 5.0

      5

      93% 受講後に作成

      良い

      • beagreatperson17325님의 프로필 이미지
        beagreatperson17325

        受講レビュー 12

        平均評価 5.0

        5

        33% 受講後に作成

        いいですよ

        • loward님의 프로필 이미지
          loward

          受講レビュー 24

          平均評価 5.0

          5

          100% 受講後に作成

          アイデアが斬新ですね、面白かったです〜

          • yeseong0412
            知識共有者

            ありがとうございます! さらに良い講義でお会いできるよう努力いたします!!

        • hellowaz님의 프로필 이미지
          hellowaz

          受講レビュー 12

          平均評価 5.0

          5

          93% 受講後に作成

          AIをゲームに適用する手法や、サーバーとフロントエンドを従来のゲーム開発方式であるC#ではなく、SpringとReactで実装する手法が印象的でした。

          Neoの他の講座

          知識共有者の他の講座を見てみましょう!

          似ている講座

          同じ分野の他の講座を見てみましょう!