ブラウザ上で、プログラミングからステージの構成・実行・公開まで可能な、統合型パズルゲーム開発エディタ「PuzzleScript」のご紹介！
すべて無料で使えるので、今すぐパズルゲームを作りたい！という人には最適なのですが、特徴的なのはプログラミングに使う言語…。
独自の仕様で作られた言語のようで、最初はよく分からず…かなりマニアック感が漂っていたのですが、分かってくると実はスゴイ仕様なのでは？と感じるようになりました。
と言うのも、簡単なゲームロジックならたった1行で書けてしまうのですから。。
使い方！
まずは、簡単なサンプルを見ながら、「PuzzleScript」の使い方に触れていこうと思います。
最初に、トップページにある「Make A Game」ボタンをクリックしましょう！
すると、メインのエディタ画面が表示されます。
このエディタを利用して、さまざまなパズルゲームを開発していくことになります。
試しに、画面上部メニューから「RUN」ボタンをクリックしてみます。
サンプルゲームが読み込まれるので、プレビュー画面を1度クリックしてから「エンターキー」を叩いてみてください。
すると、こんな感じの画面が表示されると思います。
これがチュートリアル的なサンプルゲームとなっており、ミニマルなプログラムが左のコードエディタに表示されているのが分かります。
プレビュー画面上で、キーボードの「矢印キー」を使うと、青色のキャラクターを操作できるので、オレンジ色のボックスを押して黒色の上に配置すれば「ゲームクリア」という単純なモノになっています。
このサンプルが、どのような構造で作られているのかを、「コードエディタ」を見ながら確認していきましょう！
独自言語をチェック！
「コードエディタ」をよーく見てみると、いくつかの大きな項目に分かれているのが確認できます。
今回のサンプルだと、「OBJECTS」「LEGEND」「SOUNDS」「COLLISIONLAYERS」「RULES」「WINCONDITIONS」「LEVELS」というキーワードを確認できるはず。
そこで、まずは「OBJECTS」を見てみると、以下のようになっているのが分かります。
======== OBJECTS ======== Background GREEN Target DarkBlue Wall BROWN Player Blue Crate Orange
先ほど見た青色のキャラクターが「Player」、オレンジ色のボックスが「Crate」という名称で登録されているのが分かります。
このような箇条書きにするだけで、オブジェクト構造が生成されるようになっています。名称の下に記載しているのは「カラー」で、そのまま色の名前を書くだけで適用されます。
次に、ゲームのロジック部分である「RULES」を確認してみましょう。
====== RULES ====== [ > Player | Crate ] -> [ > Player | > Crate ]
この奇妙な記法が1行書かれているだけですが、これだけでキャラクターがオレンジ色のボックスを自在に押して動かせるようになるのです。
もう少し詳しく説明するために、上記コードをざっくり簡単に書くとこうなります。
[ どういう状態の時に ] -> [ どのように動いて欲しいか ]
という感じでしょうか。
つまり、コードの左側部分は…、
[ > Player | Crate ] ※キャラクターとオレンジ色のボックスが隣同士の時に…
という意味になります。
さらに、「>」という記号がPlayer側に付いているので「オレンジ色のボックス方向へキャラクターが移動したら…」という意味になり、簡単に言うと「ボックスを押したら…」という解釈になります。
そして、右側部分のコードは…、
[ > Player | > Crate ] ※キャラクターもオレンジ色のボックスも、移動方向へ一緒に進む
という解釈になります。
コードの左側部分には、[ > Player | Crate ]と書かれているので、右方向にしか対応していないように見えますが、実際にはこの1行だけで上下左右すべてに対応するようになっているので便利です。
上記内容が分かってくると、逆にボックスを引っ張って進みたい場合には…、
[ < Player | Crate ] -> [ < Player | < Crate ]
このように、すべての「>」を「<」に変更するだけで実現するのが分かります。
さらに、こう書くと…、
[ > Player | Crate ] -> [ < Player | > Crate ]
ボックスを押した瞬間に、キャラクターが反対方向へ移動するのが確認できるでしょう。
このようなロジックの基本を学んでおくと、徐々に「PuzzleScript」の面白さが分かってくると思います。（少し慣れるのに時間が掛かりますが…）
応用として、例えば「3つのブロックが揃ったら消滅する…」みたいな、よくあるパズルゲームのロジックはこれだけでOK！(スマホの人は下記画像をタップすればGIFが見れます！)
late [ Crate | Crate | Crate ] -> [ | | ]
3つ揃ったら「消滅」するということなので、右側のコードの中身は空白にするだけというわけです。また、「late」キーワードを追記することで、揃った瞬間に消滅させる挙動を実行することができます。
さらに、対象のオブジェクトの間に「...」を挿入するだけで、敵に近づいたら追いかけてくる挙動を実現することも可能です。(スマホの人は下記画像をタップ！)
[ Eyeball | ... | Player ] -> [ > Eyeball | ... | Player ]
この時に、敵である「Eyeball」側に「>」が付けられているので、敵がプレイヤーを追いかけるわけですが、以下のように書くと…、
[ Eyeball | ... | < Player ]
今度は、プレイヤーが敵の方向に向かって勝手に近づいていってしまう挙動を実現することが可能になります。
このように慣れてくると、直感的にロジックを組み立てることが出来るようになるので、どんどん面白くなっていきますよ。
その他の機能をチェック！
ロジックの部分をメインに紹介しましたが、他にもユニークな機能が搭載されているので、いくつかピックアップして見ていきましょう！
まず、冒頭で少し紹介した「OBJECTS」の項目にあったオブジェクト生成機能ですが、カラーの指定だけでなく「5×5」のマス目で任意の場所に色を指定することも可能です。
これにより、簡単なキャラクター作りがサクッと出来るわけです。
ゲームのステージ構成などは、上部メニューから「LEVEL EDITOR」をクリックすることで、プレビュー画面上でクリック操作によるステージ制作ができるようになっています。
慣れてきたら、コードエディタの「LEVELS」部分に、直接ステージを構成する文字列を入力することで制作することも可能です。
さらに、上部メニューから「SHARE」をクリックすると、一発でゲーム公開用のURLが生成されます。
あとは、このURLを友人・知人に教えてあげれば、誰でも簡単にブラウザ上でゲームを遊べるようになるわけです！
ちなみに、「EXPORT」をクリックすれば、HTMLファイルを入手できるので、自分のサーバーに配置して公開することも可能だったりします。
また、エディタ自体に多数のサンプルゲームが収録されているので、さらにユニークなゲームを作りたい場合の勉強用としても活用できます。
このように、独自言語にさえ慣れれば、かなり効率よくパズルゲームを作って公開することが可能になるので、その潜在能力はなかなか高いように思っていますが、いかがでしょうか？
もし、ご興味湧いた方は、ぜひオリジナルのパズルを作って公開してみてください！
