もう殻つきひよっことはいえない殻つきひよっこです。
qnoteアドベントカレンダー25日目、クリスマス🎄です！

年末年始クリスマス、家で過ごす方も多いでしょう。
今回は、前にちらっと話題に出した、「ティラノスクリプト」を出そうかなと思います。

「ちょっとゲーム制作とか触ってみたいな…」って方は、よければゲーム🎮づくりにチャレンジしてみてはいかがでしょう？

主にどういうやつなの？？こういうことができるよ！という紹介なので、
毎度のごとく、バリバリつくるぜー！って方よりも、作ってみたいけどとっかかりがわからないな…って人向けです。
というか、ぶっちゃけ公式チュートリアルに沿って作れば、つくれちゃいます。
なので、今回の記事は本当に紹介です。

…………アドベントカレンダーラストがこれでいいのか？

ティラノスクリプトってなに？

簡単に言えば、こんなかんじの「ノベルゲームやADVを作成できる開発ツール」です。
HTML5形式のゲームが作れます。
WEBサイト上で動作するゲームだけでなく、AndroidやiOSで動作するようにアプリ化することもできます。しかもなんと無料！！商用利用でも無料です！！

公式サポートがめちゃくちゃ充実してるのと、チュートリアルがあるので、そこを追っていけば、プログラムにちょろっと触ったことのある人だったらすぐに作り始めちゃえます。

ゲームをつくりはじめる準備

ティラノスクリプトを用意する

ゲームをつくるには、ティラノスクリプトをDLする必要があります。
基本的には
https://tyrano.jp/usage/tutorial/ready_v5
ここのページに沿って、DLを進めれば準備完了です！

公式でも紹介されていますが、

ティラノスクリプト（本体。ここのファイルを編集していく）
ティラノスタジオ（開発ツール。なくてもいいけどプレビュー機能が使えたりするので、あった方が断然いい）

上記２つを用意しましょう。

ティラノスクリプトの書き方について

ティラノスクリプトは、〇〇.ksと呼ばれる独自ファイルを作成して、コードを書いていきます。

data > scenario フォルダのksファイルの中を見ると、中身はこんなかんじ。

;キャラクター登場
[chara_show  name="akane"  ]
#?
こんにちは。[p]
私の名前はあかね。[p]
#あかね
もしかして、ノベルゲームの開発に興味があるの？[p]

[glink  color="blue"  storage="scene1.ks"  size="28"  x="360"  width="500"  y="150"  text="はい。興味あります"  target="*selectinterest"  ]
[glink  color="blue"  storage="scene1.ks"  size="28"  x="360"  width="500"  y="250"  text="興味あります！"  target="*selectinterest"  ]
[glink  color="blue"  storage="scene1.ks"  size="28"  x="360"  width="500"  y="350"  text="どちらかと言うと興味あり"  target="*selectinterest"  ]
[s  ]
*selectinterest

[chara_mod  name="akane" face="happy"  ]
#あかね
わー。興味あるなんて、嬉しいなー。[p]

ティラノスクリプトは、独自のスクリプトタグを使用しています。
そのため、補完機能が使えるエディタが少ないです。

おすすめのエディタ

公式では、Meryエディタやサクラエディタ、Atomなどを紹介していますが、その中でも、入力補完プラグインが配布されているMeryかAtomがおすすめです。

個人的にはAtomがおすすめかな…と思っているので、ティラノスクリプトのDLとは別に、Atomエディタの準備を紹介しようかと思います。

Atomエディタの準備

エディタ側の準備では主に、以下の３つをご紹介します。

Atomをインストールする
ティラノスクリプト用の補完プラグインをインストールする
半角・全角を可視化する

Atomのインストール

Atomエディタは以下サイトからDLすることができます。
https://atom.io/

入力補完プラグインのインストール

ティラノスクリプト用の入力補完プラグインは、こちらの豆ノ帖様にインストール方法が載っています。
https://mamecho.com/archives/585

が、Atomがちょっと変わったのか、File > Setting > Installではプラグイン検索にたどり着きません。
PreferencesからSetting画面が開けるようになったので、そこのInstallからプラグインを検索してください。

半角・全角スペースの可視化

Atomでは、半角スペースの可視化はPreferences > Editorから行うことができます。
下にスクロールしていくと、Show Invisiblesという項目があるので、それにチェックマークを入れるだけでOKです。

しかし、全角を表示する設定はないので、プラグインを落としてくる必要があります。
いろんなプラグインがありますが、「show-ideographic-space」を入れておけば、全角スペースが見えるようになります。

作成

早速作っていきましょう！
とはいえ、チュートリアルをやっていけば、基礎的なことは教えてもらえるので、作り方はそちらをみてください！！
代わりに、自分でいじりはじめたときに知ってると便利な機能などを紹介します。

ティラノスタジオタグ機能

チュートリアルでは、基本的なタグは教えてもらえますが、
たとえばキャラクターの大きさを指定する…などと言った紹介は出ていません。
https://tyrano.jp/tag/
ここでどんなタグ一覧が使えるかも出てきますが、「ティラノスタジオ」の開発機能の一つ、「タグ」を利用するのもおすすめです。

ティラノスタジオ座標プレビュー機能

作っていくと意外と「画面のこの位置にキャラの上半身を表示したいけど、topにどれくらいの数値を指定すればいいのかわからない…」とかあったりして困ります。
が、ティラノスタジオの開発機能の「ゲーム素材」で、ゲームのプレビュー画面の画像を動かすことで数値がわかる機能があります！

まずは、「ゲーム再生」でゲーム画面を表示しましょう。

ここに、女の子の上半身だけ登場させたいと思います。
女の子の画像は、わたおきばさんからフリー素材をお借りします。

この子の上半身だけを画面に表示させたい…。
まずはデフォルトでどんな風に置かれるか、座標プレビューを押してみましょう。

なんかいい感じに出ましたが、もうちょっと大きく真ん中にずらそうかと思います。

この状態でティラノスタジオの画面に戻ると…。

なんと座標が反映されています！

この数値でキャラ表示させれば、プレビューと同じような大きさで表示されるようになります。

[chara_show  name="akane" width="510" height="1412" left="395" top="23"  ]

意外と画像の大きさなどの調整って、数値だけだとなかなか掴みづらいですよね。

さいごに

チュートリアルが終わったら

だいたいチュートリアルを進めれば作れるようになる、とは言いましたが、ティラノスクリプトのチュートリアルは基礎の基礎しか出ません。

チュートリアルが終わったら、いきなり作り始めるのではなく、まずはそれを好きなように改変していくのが、とっかかりには最適だと思います。
背景画像を変えたり、セリフを変えたり、選択肢を増やしたり…。
チュートリアルだけでは紹介されない機能もたくさんあるので、それを試しながらいじっていくと、だんだん作り方がわかります。

ノベルゲーが作れる開発ツールは色々ありましたが、ティラノスクリプトははじめてでも非常にわかりやすいツールだと思います。
ゲーム作ってみたいけど…という方は触ってみて損はないものだと思うので、ぜひ、まずは触れてみてください！

それでは、みなさんよいクリスマスを！
某ゲームのブロッコリーに苦しめられているひよっこでした。