ゲームづくりのヒント

ゲームを作って育てていくときの、ヒント集です。直して保存するたびに版が残り、「これまでの版」からいつでも戻せます。公開したあとに直しても、遊ぶ人に届くのは「更新を公開」を押したときなので、公開中のゲームも安心して手を入れられます。

1. ゲームを設計する

作りたいものを出発点に、何度も遊びたくなる対戦ゲームを設計しましょう。どんな遊びでもかまいません。形にする前に次のことを考えておくと、作る途中で迷いにくくなります。

• いちばん楽しい瞬間はどこか。点が入るとき、読みが当たったとき、ぎりぎりでかわしたときなど。ほかの部分は、その瞬間に向けて作ります
• 1試合の中で、何をくり返すか。狙う、打つ、結果を見る、のような流れです。これが気持ちよく回ると、ゲームの芯になります
• 2回目に遊ぶ人は、何を工夫するか。上手くなる余地があると、もう一度遊びたくなります
• 相手とどう関わるか。じゃまをする、読み合う、同じ物を取り合うなど。対戦の味はここで決まります
• 指で何をするか。スマホを縦に持って、指1本か2本です。1つの操作に強さや向きの意味を持たせると、ボタンを増やさずに遊びが深くなります

発想を広げたいときは、知っている遊びに変化や制限を1つ足したり、舞台や題材を変えたりしてみます。

2. 動くものを作る

骨組みでいいので、まず遊べる形にします。遊んでみると、考えていたときには見えなかったことが分かります。

• いちばん楽しい瞬間を、先に動かす。飾りや細かいルールは、あとから足せます
• 調整しそうな数字は、game.js の頭に定数でまとめる。速さ、時間、点数、CPUの強さなど。あとで1か所を変えるだけで試せます
• CPUは、最初は単純でかまいません。相手がいなくても、すぐ遊んで確かめられます

遊べる形ができたら、そこがスタートです。

3. 完成度を上げる

同じルールでも、細かい調整で、遊んだときの感じは大きく変わります。遊んでは直す、をくり返します。

手触り

• 入力した瞬間に、何かが起きる。動く、光る、音が鳴るなど。返事が遅れると、操作が効いていないように感じられます
• 当たった瞬間を、少し強める。一瞬光る、少しふくらむ、粒が飛ぶなど
• 速さを何度か変えて、比べる。ちょうどいい速さは、遊んでみないと分かりません
• 両方の側から遊ぶ。「2P として戦う(開発用)」で、反対側からの見え方と操作を確かめられます

釣り合い

• いつも同じことをすれば勝てる手がないか、見る。強すぎる手が1つあると、ゲームはすぐ単調になります
• 運と腕の割合を、狙って決める。運が多いと初めての人も勝てて、腕が多いと上達が効きます
• player1 と player2 の差を見る。先に動ける側や、画面の手前の側が得をしていることがあります。わざと差をつけるのでなければ、直せます

CPU

CPUの調整は、時間がかかりやすいところです。

• 弱いCPUから作る。強さの差は、meta.opponents に数字(反応の遅さ、間違える割合、先を読む深さなど)を持たせて、bot の中で読みます(ルール(game.js)の仕様 4.6)
• 人らしい弱さを入れる。反応を少し遅らせる、狙いを少しずらす、たまに別の手を選ぶなど。完ぺきなCPUより、遊んでいて楽しい相手になります
• 人に見えないものを、CPUに使わせない。CPUの席に見せた札は、g.peek で読めます
• 揺らぎは、tick か setup で g.random を引いて g.state に置き、bot で読む。bot の中では g.random を呼べません(ルール(game.js)の仕様 5.3)
• 重い読みは、数tickに分ける。1回の呼び出しで使える命令の数には上限があります(ルール(game.js)の仕様 2.7)

見た目

• 何が起きたか、自分がどちらかを、ひと目で分かるようにする。自分の側は snapshot.myRole で分かります(見た目(visual.js)の仕様 4)
• 遊ぶものと背景の明るさに、差をつける。色を増やすより、見分けやすくなります
• 光を2つ置き、形を組み合わせる。空からの柔らかい光と一方向からの強い光で、立体感が出ます。箱・球・円柱などを組み合わせるだけでも、駒や台はそれらしくなります
• 地面に影を落とす。物の高さと位置が分かりやすくなります。影は重いので、スマホでの軽さも見ます(見た目(visual.js)の仕様 8)
• 遊ぶ場所が、画面に大きく入るようにカメラを置く。スマホの画面は小さいので、余白が多いと遊ぶものが小さくなります
• 画像は大きめに作って、縮めて使う。持ち込む絵も、コードで描いて貼る模様も、画面に出る一番大きな大きさ(スマホの全画面で横800画素ほど)以上にします。縮めるぶんにはきれいですが、引き伸ばすと粗くなります。コードで作った形(箱・球など)は、毎回画面の細かさで描かれるので気にしなくて構いません
• 文字を描いた板は、画面の画素にぴったり重ねる。画像に文字を描いて板に貼るときは、板の画素数を、画面に出る大きさ × 細かさにし、縮めた版(generateMipmaps = false・minFilter = THREE.LinearFilter)を使わず、位置を画素の境目に揃えます。少しでも引き伸ばしたり、半画素ずらしたりすると、文字がぼやけます。PC は画素が粗いので特に目立ちます
• 速く動くものがあるなら、間を補う。ルールは1秒30回なので、ボールや走る人は30回のコマ送りに見えます。meta.interpolate: true にして、見た目で前の位置との間を補うと、なめらかに動きます(見た目(visual.js)の仕様 4.5)。初めの位置に戻るような大きな跳びは、補わずにそのまま置きます(1回で動けるより遠くへ跳んだら補わない、と決めるのが手軽です)。物理の体の向きの混ぜ方も、同じ節に例があります。駒を0.2秒かけて滑らせるなど、動きを見た目のコードで自分で描いているなら、要りません
• 出来事に動きを付ける。snapshot.effects で届く出来事に合わせて、光らせる、揺らす、粒を飛ばすなど(見た目(visual.js)の仕様 4.1)

パソコンでも遊べるようにするとき

meta.devices を "both" にするときです(ルール(game.js)の仕様 4.5)。

• 押して選ぶだけのゲームは、何も足さなくてよい。マウスの左ボタンが1本の指として届きます
• 動きながら押すゲームは、キーボードの操作を足す。WASD か矢印で動き、スペースで決める、が多くの人に通じます(ルール(game.js)の仕様 6.6)
• 操作は「操作」の欄に書く。スマホとパソコンの欄が別にあり、ゲームの紹介の画面には、遊んでいる端末のぶんだけが出ます(作って公開するまで 2)
• 画面のスティックやボタンは、パソコンでは消すことが多い。キーで動かすので要らず、見た目もすっきりします。出したままでもかまいません(見た目(visual.js)の仕様 4.4)

音

音は2通りで作れます。音の棚の録音を名前で選ぶか、数の並び(ZzFX)で作るかです。どちらも meta.sounds に書き、混ぜて使えます(ルール(game.js)の仕様 4.8)。音の試聴で、棚の音も数の並びも聞いて確かめられます。録音は手触りのある音に、数の並びは電子音に向いています。

• 当たった・取った・決まった・勝った負けた、などに音を付ける。まずはここからです
• 強さで音を変える。棚の重さちがい(impactPunch_heavy と impactPunch_medium など)を使い分けたり、数の並びの高さや長さを変えたりします
• 同じ音の連打を避ける。棚の番号ちがい(_000、_001…)や、少しずつ変えた数の並びを交互に鳴らすと、単調になりません
• 自分に起きたことと相手に起きたことで、音を変える。{ self, other } の形で書けます
• 鳴らしすぎない。毎tick鳴る音や、同時にたくさん鳴る音は、うるさく感じられます

素材

画像・音・3Dモデルのファイルを、作る人が作品のページから持ち込めます(見た目(visual.js)の仕様 7)。無くてもゲームは作れますが、駒やキャラクター、床の模様、効果音などを素材にすると、雰囲気を作り込めます。

• 探す。自由に使えて表示も要らない CC0 の素材を配っている所があります。Kenney(2D・3D・音)、Quaternius(3Dモデル)、Poly Haven・ambientCG(質感の画像)などです
• 使える条件を確かめる。素材ごとに使える条件があります。他人の権利を侵す素材や、条件に反する素材は使えません(利用規約)。作者の名前などの表示が要る素材は、その決まりどおりに、作品の説明やゲームの画面などに書きます
• 自分で作る。Blender などで作ったモデルは、.glb に書き出して置けます。Draco などの圧縮はかけずに書き出します
• 雰囲気をそろえる。作りの違う素材を混ぜると、ちぐはぐに見えます。同じ詰め合わせや同じ作者のものでそろえると、まとまります
• 軽さを見る。スマホで動くので、モデルの面の数や画像の大きさは控えめにします。1つの作品に置けるのは、合計20MBまでです。多いほど、遊ぶ前の読み込みが長くなります
• 素材と形を組み合わせる。目立つものだけを素材にして、床や壁は形と色で作ることもできます

AIに頼んで作るとき

この節は、作る人に頼まれてゲームを書くAIに向けたものです。

• 作る人の発想を、支えてください。何を作るかは作る人が決めます。AIは、その発想を広げたり、形にしたりする手伝いができます
• 遊べる形ができたら、作る人に遊んでもらい、感想を聞きます。どこで迷ったか、どこが楽しかったか、もう1回やりたいか、のように具体的に聞くと答えやすくなります
• 改善を、一緒に進めてください。ゲームは、動いたあとの調整で良くなっていきます。新しく作り直すより、いまあるゲームを3節のように磨いていくと、作る人のゲームが育ちます