Skip to content

超革命的スクリプト言語 アトラスXの使い方 #1


やあみんな! shi3zだ。

電通の研修ではまあ予想通りとはいえ短時間のうちにみんなが自分のアイデアをゲームという形で表現できるようになって本当に良かった。

今回のと同形式のセミナーを今月末に仙台で実施予定だ!

“9leap” Game Programming Camp @仙台

でもぜんぜんお客さんがいないので、10人未満だったら延期になっちゃうかも。
東北地方でのイベントは僕たちもあまりやったことがないので、知ってる人が居たらぜひ誘ってみてほしい!

電通マンのなかでもさらに選ばれたエリートといえど、全角/半角の違いや、ファイルの上書きの方法がわからないなど、思わぬところで苦戦していたようだ。

しかしそんな彼らでも、終了時間までには無事、オリジナルのゲームを多数作ることができた。これはアトラスXがとても簡単だったことはもちろん、同じ場所でともにライバルをにらみながら戦ったことが大きいだろうね。

さて、そんな「超革命的ゲームスクリプト言語アトラスX」だけれども、この名前はどうも良くない。長過ぎるし
とはいえ、この文法の簡単さは一考の余地ありだと思うので、今日はみんなにこの「アトラスX」の使い方を解説するよ!

まずは以下のページから、アトラスXのサンプルとして作った「ガジェット診断」をダウンロードしてほしい



ZIPファイルをダウンロード

これは言わずと知れた診断ゲームをアトラスXで再現してみたものなんだ。
まずはちょっと遊んでみてほしい。

すると、アトラスXでだいたいどんなことができるのか、うっすらと解るハズ

アトラスXが得意としているのは、こういう、ユーザからの入力を待って進行するタイプのゲームだ。
実はそういうタイプのゲームであれば、ノベルゲームに限らずアトラスXだけで作ることができるんだ。

最初は難しく感じるかもしれないが、アトラスXで覚えなければならないコマンドはたったの5つだ。
五本の指で数えられてしまうくらいに簡単だ。

何万単語もある英語や他の外国語を勉強することに比べたら、アトラスXなんてたいしたことない。

この記事では順を追って説明するよ!

さて、まずはアトラスXで書かれたプログラムがどんなものなのか見てみよう。

アトラスXで書かれた部分はscenario.jsというファイルに入っている。
まずはこれを書き換えたりしながらアトラスXの動作を学んでいこう。

プロローグ = function(){
     台詞("・・・ここは、どこだ?");
     一時停止();
     台詞("気がつくと見知らぬ小部屋に居た");
     一時停止();
     台詞("「おかしい。確かいつものように家を出て・・・");
     台詞("ウッ・・・・!!!!!」");
     一時停止();
     台詞("ひどい頭痛がする");
     一時停止();
     台詞("なんてこった・・・");
     一時停止();
     台詞("なにも・・・・");
     一時停止();
     台詞("思い出せない");
   
     次へ(シーン2);
};

アトラスXのプログラムは殆どが日本語だ。
だから日本人にはとても理解しやすい。

とはいえ、使い始める前に、いくつかお約束を覚える必要がある。

「プロローグ = function(){」からはじまって、最後に「}」で閉じられるまでの一連の部分が、ひとつの場面、つまりシーンをあらわす部分だ。

「プロローグ」は当然、シーンの名前を意味している。
アトラスXは、最初にかならず「プロローグ」というシーンを呼び出すことになっている。

物語は常に「プロローグ」から始まるということだ。

次に「台詞」という文字がある。
これは「コマンド」と呼ばれる。システムに対する命令だ。

この台詞というコマンドは、画面上に文字を表示する。
表示できる文字はだいたい20文字が限界だ。

台詞のあとに続く (“〜”)で囲まれた部分。これが実際に表示される台詞の中身となる。
日本語のカギ括弧(「〜」)みたいなものだね。

で、行の最後に「;(セミコロン)」をつける。
行の最後にこれをつけないとうまく動かないから注意してほしい。

試しに、「プロローグ」を以下のように変えてみよう。

プロローグ = function(){
     台詞("こんにちは");
     一時停止();
     台詞("アトラスXです");
};

内容を変えたら、scenario.jsを上書きして、index.htmlをブラウザで開く。既に開いていたら「再読み込み」でリロードする。

ただし、最新のChromeやSafari、Firefox、InternetExplorer9のようなHTML5に対応したブラウザでないと正しく動作しないからご注意。もしうまく動かなかったら、最新のブラウザをどれかダウンロードしよう。

個人的にはChromeがお勧めだ。wise9読者の大半もChromeを使っている。

さて、以下のようにちゃんと表示できただろうか。

「こんにちは」と表示されたあとに、バナナの記号が出て来てユーザからのクリックを待つ。
ユーザがマウスやパッドをクリックするか、スマートフォンでタップすると、先に進むという仕組みだ。

これは「一時停止」というコマンドが実現している機能だ。

ここまでは簡単だね。

さて、アトラスXが想定しているのは、下図のように、複数のシーンから構成されるゲームだ。

こういう形態のゲームを、古くは「アドベンチャーゲーム」と呼んだ。
最近は「ノベルゲーム」と呼ばれる形式にこのタイプのゲームは多い。

「アドベンチャーゲーム」は、たとえば「ドラゴンクエスト」シリーズの原作者である堀井雄二氏の「ポートピア連続殺人事件」や「オホーツクに消ゆ」、そして「メタルギアソリッド」シリーズで有名な小島秀夫監督などが開発した「ポリスノーツ」や「スナッチャー」など名作も多い。また、「ファイナルファンタジー」シリーズで有名なスクウエア(現スクウエアエニックス)も、古くは「アルファー」「ブラスティ」などのアドベンチャーゲームの名作を作っている。

つまり今をときめくゲームクリエイターの巨匠たちも、アドベンチャーゲームで修行を積んでいた時代もあるのだ。

アドベンチャーゲーム(ノベルゲーム)は、アクションゲームやRPGと違い、プログラミングのテクニックで競うというよりも、物語の筋書きや面白さが勝負だから、プログラミングはちょっとニガテ、という人でも気軽にゲーム制作に入って来ることができ、しかも傑作を生み出すことができるという、珍しいジャンルなのだ。

ゲームの面白さを「謎解き」「物語」「世界観」に求める人にとって、アドベンチャーゲーム(ノベルゲーム)という形態は非常にとっつきやすい題材だと言えるだろう。

また、アトラスXは、JavaScriptという言語をベースとして作られている。
そのため、JavaScriptができることならなんでもできるという点が最大の特徴だ。

また、enchant.jsを使用しているので、PCやMacはもちろん、iPhone/Androidでも同じものが同じように動作する。
9leap.netにアトラスXで作った作品を投稿すれば、多くの人たちに作品を見てもらうことができる。

さて、話を続けよう。
アトラスXでは複数のシーンをつなげてゲームを作る、と説明した。

他のシーンへ飛ばすには、「次へ」というコマンドを使う

プロローグ = function(){
     台詞("こんにちは");
     一時停止();
     次へ(シーン2);
};

シーン2 = function(){
     台詞("シーン2です");
};

注意しなければならないのは、「次へ(シーン2)」と書いた時に、シーン2が存在しないと正しく実行されないということ。
必ず飛び先のシーンをダミーで作ってから「次へ」に書こう。

プロローグからシーン2への場面転換、これを専門用語で遷移(せんい)と呼ぶんだけど、これは簡単にできたと思う。

次はノベルゲームにはなくてはならないもの、選択肢を作ってみよう。

プロローグ = function(){
     台詞("どっちに行く?");
     選択肢("西へ",西);
     選択肢("東へ",東);
};

西 = function(){
     台詞("わー、関西にきた");
     次へ(プロローグ);
};
東 = function(){
     台詞("わー、関東にきた");
     次へ(プロローグ);
};

これはさっきの例より少し複雑だけど、実行してみればすごく簡単だと解るハズ。

さっきまで「次へ」と出ていた部分に「西へ」「東へ」
と表示されている。

これはもちろん、「選択肢」という新しい命令の効果だ。

選択肢のあとに続く括弧のなかで、「項目名」と「飛び先のシーン」を指定してあげると、こういう構成になる。

たとえば「選択肢(“西へ”,西);」では、画面に「西へ」と表示して、もしプレイヤーがこの選択肢をクリックしたら、「西」というシーンへジャンプしている。

西というシーンに行くと、「わー、関西に来た」と表示される、というワケ。
簡単でしょ?

今回は最後に「画像」というコマンドを覚えてみよう。
これは、文字通り画像を表示するコマンドだ。

プロローグ = function(){
     台詞("どっちに行く?");
     選択肢("西へ",西);
     選択肢("東へ",東);
};


西 = function(){
     台詞("わー、関西にきた");
     次へ(プロローグ);
};
東 = function(){
     画像("ending.png");   // ←ここを修正
     台詞("わー、関東にきた");
     次へ(プロローグ);
};

画像コマンドは、指定したファイル名の画像を表示する。
画像の最大サイズは320×320ドットで作る必要がある。
また、ファイル名に全角文字は使えないので全て半角英数字で書くこと。

ファイル形式はPNGかJPEGでOKだ。

このプログラムを実行すると、「東へ」を選んだとき、次のような画像が表示される。

うまく行ったかな?

アトラスXを使うときに覚えることは、ほぼこれだけだ。

たったこれだけでも、いろんなゲームを作ることができるぞ。

次回はフラグ変数を使ったより高度なゲーム作りに挑戦してみよう。
ではまた!

文・shi3z

このエントリーをはてなブックマークに追加
はてなブックマーク - 超革命的スクリプト言語 アトラスXの使い方 #1
Post to Google Buzz
Share on GREE

Related posts:

  1. たった9時間でド素人のサラリーマンがゲーム開発を覚え、作り出す超革命的開発手法

Facebook comments:

Post a Comment

Your email is never published nor shared. Required fields are marked *
*
*