3
2

ティラノスクリプトで作ったゲームを、IBM Cloud Code Engineで動かすまで

Posted at

概要

この記事は、ノベルゲームエンジンの「ティラノスクリプト」と開発ツールの「ティラノスタジオ」を使って作成したノベルゲームを、IBM Cloud Code Engineで動かすまでの手順をまとめたものです。「ティラノスタジオ」は、V6を使っています。
image.png

キャラクターは、生成AIで作成しています。やっつけ感が半端ないですが、とりあえずうごけばいいやーマインドです!

IBM Cloud Code Engineを使う理由

IBM Cloud Code Engineを使うことで、インターネットで公開するためのドメインやSSL/TLSサーバ証明書が自動で付与されるとともに、自動スケール機能があるため、ノベルゲームの公開に向いています。

ティラノスクリプトとティラノスタジオ

ティラノスクリプトは、ノベルゲームエンジンで、作成したゲームは商用利用ができます。Webブラウザゲームのほかに、スマートフォン向けやWindows向け、Mac向けのゲームを作ることもできます。ティラノスタジオは、ティラノスクリプトを用いた開発における開発サポートを行います。

公式Webサイト

ティラノスクリプトを用いたゲーム作成

ティラノスタジオのインストール

WindowsまたはMac環境が対象です。ティラノスタジオのサイトにアクセスします。お使いの環境に合わせたティラノスタジオをダウンロードし、ダウンロード後、解凍します。
「TyranoStudio」を起動します。Windows環境の場合は、ダブルクリックです。
image.png

プロジェクトの作成

起動したティラノスタジオで、「新規プロジェクト作成」をクリックします。
image.png

「タイプ選択」でゲームタイプを選び、「次へ」をクリックします。ここでは、「ADV・ノベルゲーム」を選んでいます。
image.png

「プロジェクト名」を入力します。「次へ」をクリックします。
image.png

画面サイズを指定し、「次へ」をクリックします。
image.png

「作成する」をクリックします。
image.png

「新規プロジェクトを作成しました。」と表示されます。「OK」をクリックします。
image.png

「マイプロジェクト」の画面に、作成したプロジェクト名が表示されます。このプロジェクトがノベルゲームになります。
「開発する」ボタンをクリックすると、ゲームの開発対象になり、「フォルダ」ボタンをクリックすることで、作業フォルダが表示されます。
image.png

プロジェクトは、ひな形が入っているので、「プレビュー」内の「ゲーム再生」画面で、「ゲームを再生する」をクリックすることで、実際の動きを見ることができます。
このひな形をカスタマイズする形で、ノベルゲームを作ります。
image.png

ノベルゲームの作成

作成したプロジェクトのフォルダには、ひな形が入っています。
image.png

プロジェクトのフォルダ内の「data」>>「scenario」内の「ks」ファイルを編集します。ノベルゲームの最初のシーンを編集するには「scene1.ks」の中身を確認し、編集してみましょう。
image.png

キャラクターのデータは、プロジェクトのフォルダ内の「data」>>「fgimage」>>「chara」フォルダにあります。キャラクター名のフォルダを作成、フォルダ内に背景を透明化した画像ファイル(PNG形式)を配置します。
下図のキャラクターは、生成AIを使いました。
image.png

今回は、下図のように表示される文章やキャラクターを変更しました。背景は変更していません。ティラノスタジオでプレビューを実行すれば、動作を確認することができます。
image.png

ゲームのエクスポート

ティラノスタジオの画面で、「エクスポート」>>「配布用パッケージング」にアクセスします。
配布形式に「ブラウザゲーム」を指定し、「エクスポート実行」をクリックします。
image.png

「出力成功しました。フォルダを確認しますか?」が表示されるので、「OK」をクリックします。
ブラウザゲーム向けにエクスポートされたファイルが格納されているフォルダが表示されます。
image.png

「tyranoproject」というフォルダです。
image.png

上記のフォルダの中身は、次のようなファイルとフォルダがあります。
image.png

ゲームのファイルを含めたコンテナの作成(ビルド)

WindowsもしくはMacにおけるターミナルアプリを使い、先ほどの「tyranoproject」フォルダに移動します。

Dockerfileの作成

「tyranoproject」フォルダ内に、Dockerfileというファイルを作成します。
image.png

Dockerfileの中身は次のように書きます。

FROM nginx 
COPY . /usr/share/nginx/html

コンテナをビルド

Dockerfileを使い、コンテナイメージとしてビルドします。ビルドの際に、ティラノスタジオでエクスポートした各種ファイルもコンテナイメージに複製されます。
次のコマンドを実行します。

docker build -t workuser1/1stnovelgame .

ビルドしたコンテナのイメージを確認するために、次のコマンドを実行します。

docker images

実行結果例 (IMAGE IDは、docker buildの実行毎に異なります。)

REPOSITORY               TAG       IMAGE ID       CREATED         SIZE
workuser1/1stnovelgame   latest    eb8533894944   5 seconds ago   199MB

コンテナレジストリに、コンテナを登録

コンテナレジストリのDocker Hubsに接続

Docker Hubに接続します。Docker Hubのユーザー名は、例として、workuser1 とします。
workuser1の部分を、各自のDocker Hubのユーザー名に読み替えて作業しましょう。

docker login --username workuser1

実行結果

Login Succeeded

コンテナ(コンテナイメージ)の登録

次のコマンドを実行し、ビルドしたコンテナを、Docker Hubに登録します。

docker push workuser1/1stnovelgame:latest

完了すると、次のように表示されます。docker.ioで始まる部分を指定することで、Godotからエクスポートしたゲームを含むコンテナイメージを、IBM Cloud Code Engineをはじめ、コンテナ運用環境で動かすことができます。

The push refers to repository [docker.io/workuser1/1stnovelgame]
e05c76d4c9c4: Pushed
11de3d47036d: Mounted from library/nginx
16907864a2d0: Mounted from library/nginx
2bdf51597158: Mounted from library/nginx
0fc6bb94eec5: Mounted from library/nginx
eda13eb24d4c: Mounted from library/nginx
67796e30ff04: Mounted from library/nginx
8e2ab394fabf: Mounted from library/nginx

IBM Cloud Code Engineでコンテナを動作

IBM Cloudにアクセス

IBM Cloud Code Engine にアクセスします。>> https://cloud.ibm.com/codeengine/overview

Projectの作成

IBM Cloud Code Engine 上で、「Projects」をクリックします。
「Create」をクリックし、Projectを作成します。
image.png

Projectは、アプリケーションを管理する場所です。次はProject内に、アプリケーションを作成します。

アプリケーションの作成

workuser1の部分を、各自のDocker Hubのユーザー名に読み替えて作業しましょう。
Project画面で、「Applications」をクリックします。その後、「Create」をクリックします。
image.png

「Image reference」に、コンテナイメージをプッシュした際に取得した、docker.ioから始まるURLを記述します。
image.png

画面下に移動し、「Min number of instances」を0インスタンスにします。「Max number of instances」を2インスタンスにします。
ノベルゲームは負荷が低いことが多いので、「CPU and memory」を「0.5 vCPU/1GB」に変更します。
image.png

「Optional settings」の「Image start options」を開き、「Listening port」に「80」を入力します。
image.png

「Create」をクリックします。
image.png

アプリケーション名の右隣が、「Deploying」から「Ready」になるまで待ちます。
image.png
「Ready」になった様子
image.png

画面右上の「Test application」をクリックします。
image.png

「Application URL」をクリックします。
image.png

新規タブで、ノベルゲームが起動します。
image.png

ゲームを進めると、生成AIで作成したキャラクターが表示されます。
image.png

このとおり、ドメインとSSL/TLSサーバ証明書が付与されていることがわかります。
image.png

まとめ

本記事では、ノベルゲームエンジンの「ティラノスクリプト」と開発支援ツールの「ティラノスタジオ」をつかって作成したノベルゲームをエクスポートし、コンテナとしてビルドし、IBM Cloud Code Engineで動かすまでの手順を確認しました。
ノベルゲームはゲームとして作りやすく、ビジネス向けのゲーム(シリアスゲーム)を作って公開する際に、実行環境として、IBM Cloud Code Engineが選択肢に入ればと思います。

3
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
2