卓球娘
夏のゲームイベント参加
やってきました「ニコニコ自作ゲームパーティー夏」の季節。今回は今までより大分早めに参加を決断してましたよー。ニコニコのゲームイベントはこれまでに「春」と「新人」2回参加してるんですが、どちらも3日前とかから作り始めてたのでまぁ大変でした。一応それにも理由はあって、冷静になって冷めちゃう時間を自分に与えないという効果がありました（勢いは大事😎）。とは言えもうちょい余裕があってもいいだろうということで今回はなんと締め切りの一ヶ月も前から準備を始めました。
ああでもないこうでもない
一ヶ月後の締め切りに向けて何が作れそうか、何を作りたいかぼんやり考え始めます。最初の方に固まりかけたアイデアは「鞭」のようなギミックを使った直感系ゲームです。ドラッグで鞭を振るうというアクションはまだニコ生ゲームにないんじゃないでしょうか？あるかな？滑らかに動く鞭の描画にキャンバス2D使っちゃおうかなとか悪だくみしつつ3ステージ構成で～とか内容もしっかり考えてたんですけど、最初に書いたようにじっくり考えすぎて「なんか違う気がする」と思い始めてしまい、結局試作版すら作らずにこのアイデアはボツになります。
そこで、次にネタ探しを始めます。無料ゲームランキングみたいのを見ていて、普通に面白そうだったのが「Twisted Tangle」というゲーム。
www.youtube.com
いわゆる紐解きゲームってやつらしいです。こういうの好きだし作りたい欲が刺激される！
でもこれもニコ生ゲーに合ってるかといわれると課題がありそうな気がします。今はまだどうまとめればニコ生ゲームになるか思いつきませんが、その内気が向いたら作るかもしれません（作らないかも）。
結局ニコ生ゲームって一見何でもありのバーリトゥードのようで*1遊ばれる傾向に制約を感じます。牛乳先生（なわとびずんずんの作者）がブログ（この記事切れ味鋭くて面白いです）で書かれているように説明読まずに遊べる定番ゲーなどが強いなというのは感じていました。もちろんそれ以外も結構遊ばれてますが、「圧倒的に」という意味ではトランプ系なんかが支配的です。この環境に風穴を開けるような新しいアイデアというのはまぁなかなか難しいんじゃないでしょうか？
こんな感じで、悩むだけ悩んでモノは1つもできずに時間だけが過ぎていきます。じゃあその間、全く手を動かしていなかったのかというとそんなことはなくひたすらブログを書いていました笑
実は6/2から1ヵ月以上止まっていたブログの更新ですが、7/6の投稿を皮切りに7/24までに5つも書きあげてしまいました。それも重い内容ばかりでよくこれだけ書いたなって感じですね。昔から忙しい時ほど関係ない作業が捗るタイプだったんですが、今回はそれがブログの執筆に向いてしまったようです😅
あきらめかけたその時
もう夏イベのアイデアも全然固まらないし今回はパスだな～、と半分あきらめてニコニコ迷宮のバージョンアップとかやってました。もう完全にそっちに集中しちゃってます。
しかし
ニコニコ迷宮もブログ執筆も一段落して一息ついていた7月28日。なんとなく昔やったことのあるゲームを思い返していたらふと、とある卓球ゲームを思い出します。
そのゲームとは・・・「嗚呼神速の卓球よ」です。
画像見つからなかったんで前作？の画面
結構覚えてる人いるんじゃないですかね？いないかな？このゲームをイイ感じに紹介してくれてるブログがあったので引用させていただきます。
「嗚呼神速の卓球よ」も疑似3D的な卓球ゲームで、モードが音速、高速、神速と速さ違いの対戦が３つとハイスコアを目指すラリーの４つのモードがありました。
ストレートやクロス打ちで返してロブが来たらスマッシュで打ち返す。単純だけど本当に卓球やってるみたいで面白かった。スマッシュを打った時に集中線が入る演出もあり決まるとめちゃくちゃ気持ちよかったんです。
ちょっとした暇つぶしや寝る前に１プレイなんてのにもってこいのゲームでしたが、私はハマリすぎて休日に朝からやってて気づいたら夕方になってたなんて事もありました。大げさに言ってるんじゃなくてこれマジの話なんです。
引用元：ガラケー時代このゲームがあったからauをやめられなかった話 - こうですか？わかりません
いやほんとこの通りなんですよねー。こんなシンプルな画面でしかもテンキー操作なのに卓球の気持ちよさが感じられる。神ゲーです。
「疑似3Dで作るのおもろそうだしアセットもあんまり要らなそうだし、恐らく遊び方もわかりやすい・・・。そして期限まであと10日・・・これだぁ！！」
思いついてから即決でした。振り返ってみるとやっぱ細かいこと考えずに勢いで走り出すのが大事だなーと思います。
とは言えだよ
そして7/29（土）。週末を利用して制作を進めていきます。しかし決まったのはあと9日で「操作が気持ちいい卓球ゲーム」を作るということだけ*2。ノウハウもアセットもまったくの0から作る新規ゲームです。製作期間はいつもより1週間くらい長いですけど、今回は0ベースなので余裕が無いのは一緒です。
「うーん、何から手を付ければいいんだ？しかし、動かないことには何も始まらない・・・。よし、まずアイコンから描こう！」
は？
え、そこから？と思われた方もいるでしょう。正直どこから始めたらいいかわからなかったんで一種のコンセプトアートとも言えるアイコンから手を付けました。ここを起点にゲーム内容も考えることにしたんです。このアイコンを描きながら決まったことは2つ。
- ドット絵スタイルのゲームにする
- 温泉♨
ドット絵スタイルは「嗚呼神速の～」のリスペクトですね。画像アセットの製作コストを下げる狙いもあります。温泉要素は「ゆる～く遊べるよ」という記号で敷居を下げる狙いがあります。また、卓球部のジメっとした感じや（卓球部の方ごめんなさい）競技卓球のとっつきにくさと違って明るいイメージもあるので、女性の方にもいいのかなーと思ってます。
とまぁ、こんな感じで今回の温泉卓球というゲームが生まれたのでした。
開発日誌
ここからは開発中に考えていたことなどを概ね時系列順に書いていきます。
画面レイアウト
怖い部屋3Dの記事でも書きましたが、自分の場合まず最大のボトルネックであるアセット制作から取り掛かります。今回必要そうな画像は
- 背景
- 卓球台
- ラケット
- 対戦キャラ
この辺りですよね。球は最初からキャンバスで描くつもりだったので含めてません。ラケットは1枚絵描くだけなのでどうにでもなるでしょう。背景と卓球台は画面レイアウト及びゲーム性に関わって来るので特に重要です。というわけで、まずレイアウトを切ります。
画面レイアウト
この時点で結構重要なことがいくつか決まってます。
まず解像度ですが、6倍表示くらいにしようと思うのでゲームのサイズは6で割り切れる1260×720を採用します。なので210×120の背景があればいいんですが、レイアウトでは260×120と横長にしています。これは球が激しく左右に振れたときにカメラがパンすることを想定しているからです。このことから結構激しい打ち合いもある、というゲーム性にまでつながってきます。
さらに独特なのが視点の向きです。卓球ゲームは世の中星の数ほどありますが、ここまで視点が水平なものは珍しいんじゃないでしょうか。これは偶然というか記憶違いというか・・・記憶の中の嗚呼神速の卓球よがこれくらい水平だったイメージなのでこうなったというだけなんですが調べたら全然違いましたね笑。ただ、1人称視点に近くなったおかげでより没入度が増したんじゃないかと思っているので結果オーライです。
ちなみに既に対戦相手（この時は腕まくりしてる男のイメージ）も描かれてはいますが、キャラまで描いたら作画コストやべーだろと思ってたので最悪ラケットが宙に浮いてるだけでいいかなとは思ってました。
レイアウト描き終えた時点で作業量の多さを察してげんなりしたのはここだけの秘密。
背景
レイアウトが決まったので背景のドットを打っていきます。しかし、背景に何を並べるか？これが悩ましい。ボツ案は手元に残ってないので文字とイメージ画像での説明になりますが、第1案ではリアルな温泉を想像して、自販機やゴミ箱、大浴場への暖簾などを入れようとしました。
大浴場入口の自販機などのイメージ
しかしあまりにもダサいデザインになってしまったので即ボツでした。センスの無さに絶望しつつ、画像検索で色々参考にしてみます。いっそ夜のテラスみたいなとこでやるオシャ卓球もいいなぁなんてデザインそっちのけで妄想し始めます。
夜のテラス
第2案として試しにテラス背景描いてみたんですが、視点が動いたときに屋根とかのパースがついてこないと不自然じゃん！という基本的なところに気づいてこちらもやめました。「奥行きのある背景はダメ」「別に露骨な温泉要素が無くてもいい」ということに気づけたので、それを活かして第3案をデザインしてみました。
温泉卓球の背景か？これが・・・しかしドット自体は結構上手く描けたしここらへんで妥協することにします。というのもこれ描き終わった時既に夜の8時越えてたのでいい加減切り上げないと先に進みません。コードもまだ一行も書けてないし！
ドット絵スタイルゲームのワンポイントテクニック
ここで一旦この背景を表示するプログラムを書きますが、今回のようなドット絵スタイルの場合小さい絵を拡大して表示するとぼやけたような見た目になってしまうので最初から拡大したドット絵を使っているゲームもあると思います。しかし本作では全てのドット絵は原寸のままで、実行時にスプライトのscaleで拡大していますがぼやけていません。キャンバスの拡大縮小フィルターの設定をちょちょいといじってやることで実現できます。手っ取り早く言うと最初に以下を実行するだけです。
g.game.renderers[0].canvasRenderingContext2D.imageSmoothingEnabled = false;
g.RendererのインスタンスがContext2DRendererである場合canvasRenderingContext2DプロパティでCanvasRenderingContext2Dオブジェクトを取得できます。これのimageSmoothingEnabledプロパティにfalseを設定することでスムージングがOFFになり、ドット絵がぼやけなくなります。上記だと全ての画像描画がスムージングされなくなってしまうのでそれがまずい場合はg.Eを継承してそのrenderメソッドで実行すればそのエンティティの子要素のみスムージングをOFFにできると思います（未検証）。
class NoSmoothing extends g.E {
render(renderer, camera) {
renderer.canvasRenderingContext2D.imageSmoothingEnabled = false;
super.render(renderer, camera);
renderer.canvasRenderingContext2D.imageSmoothingEnabled = true;
}
}
卓球台
さて、お次は卓球台なんですが、実は当初ここで変わったことをやるつもりでした。
それはwasmでソフトウェアレンダラを書いて3D卓球台を表示です。WebGLじゃなくて自前でポリゴン描くやつですね。個人的に今回の開発のお楽しみポイントとして考えてました。
実際途中まで実装してて時間を忘れて楽しんでたんですが、急に冷静になります。待てよ、と。「台だけ3Dにしてるけど後々他のものも結局3Dにしなきゃってなるかもしれない。それでほんとに間に合うのか？駄目なら秋イベに回してもいいと思ってたけどホントにやるか？いや投げるでしょ！」と。流石にイケるかわからないことをここで始めるのはまずいんでレンダラづくりはやめて疑似3Dでやることにしました。危ない危ない・・・。（今回諦めたけどどこかでやりたい・・・！）
とはいえ卓球台の天板は視点移動に合わせて変形させたい。そこで以前から何処かで使おうと思っていたせん断変形で実装しました。
Renderer.setTransform()の第2・第3引数がせん断変形に関わる引数になります。詳しい説明はしませんがこれを使えば疑似的にパースのかかった平面のスクロールを表現できるので面白いです。
See the Pen
ground by z0ero (@z0ero)
on CodePen.
ただ、これだと今回のような低解像度のドット絵ゲームと若干相性が悪くて、通常気にならないレベルのドットのズレが目立っちゃうんですよね。妥協しても良かったんですが、そもそもこの天板縦が7ピクセルしか無いのでラスタースクロールの要領で1行ずつ7回drawImageをしても全然問題ない。というわけで結局「ソフトウェアレンダラ」から「ラスタースクロール」へとずいぶん素朴な実装になっちゃいました😅
台のドット
球
30日（日）からは球の実装を始めます。ここもかなり鬼門です。
ひとまず、3D空間上に球を表示する処理を書いてみます。球は100×100のSurfaceを作成し、そこにキャンバスAPIで現在の「見た目の半径」で円を描いて遠近感を表現しています。それを3D→2D変換した座標に描画すれば疑似3D球の出来上がりです。3D座標系から2D座標系への変換は全て疑似的なパースで計算しています。卓球台周辺ではそれなりに正確なように見えますが、ちょっと奥へ行くと球が奇妙なカーブを描いているように見えたりと大分歪んでいます*3。本来先にパースを決めるべきなのに先にドット絵を描いてしまったので、ドット絵からパースを逆算しないといけなかったんですがそれだと難しい計算が必要なのでインチキパースでゴリ押してしまいました。ここは、完全に反省点で球のスピード感なども狂ってしまうのでちゃんとやるべきでしたね・・・*4
表示ができたので次に挙動を実装します。まず、物理的な運動計算はしたくないと思ってました。なぜならAI側の実装や難易度調整が難しくなりそうだから、と、物理挙動でバグられるとどっちに点が入ったか計算がおかしくなりそうだからです。なので、打ったタイミングで着地点を先に決めて軌道はベジェ曲線かCatmull-Romスプライン曲線あたりで適当に補間しちゃおうかなと思っていました。
そうすれば、コリジョン判定も要らないし（ネットにひっかからない前提）、AIの強さ調整も簡単なはずです。もちろん物理挙動じゃないので変な動きではありますが、ニコ生ゲームだし多少はね？
ところが、試験的に重力加速を実装して台の上で球が跳ねるようにして、、とやってる内に意外と物理挙動でも思ったように制御出来そうな感じがしてきました。CPUのサーブも案外ちょうどいい感じになったし球の動きも自然な放物線なのでしっくり来ます。極めつけに座標AからBへ時間tで到達するための初速vを算出する関数というのを実装したんですが、これ一つで相手も自分もいい感じに打ち返しが実装出来るじゃん！ということに気付いたので物理演算で行くことにしました。
class Ball
{
targetTo(x, y, z, frame) {
this.vec.x = (x - this.pos.x) / frame;
this.vec.z = (z - this.pos.z) / frame;
this.vec.y = (y - this.pos.y) / frame - GRAVITY * 0.5 * frame;
}
}
上記コードを2次元で可視化↓緑の点と紫の点をドラッグで動かせます。（右下のdesmosってところをクリックすると詳しく見れるよ）
コリジョンは最後まで手を抜こうとしたんですが、結局ネットにかかるかどうかの条件を考えるのが面倒過ぎたので普通に球vsAABBのコリジョン関数を実装し、卓球台とネットと対戦相手の当たり判定を行うことにしました。跳ね返りなども反発係数を設定して計算しているのでほぼ物理エンジンになってしまったわけですが、結果的にはバグ挙動も無く*5リアルな球の動きも得られたので早めの方針転換が功を奏したと思います。
コリジョン（クリックで展開）
gist.github.com
法線n、ベクトルiがあった時に反射ベクトルvは以下で求まる。
v = i - 2 * n * dot(i, n)
反発係数eも含めるとこう
v = i - (1 + e) * n * dot(i, n)
今回はAABBだけだったので自前で済ませましたがもうちょっと複雑になってきたら出来合いの物理演算ライブラリを使うのがいいと思います。
公式規格
卓球台や球のサイズはちゃんと規格のサイズに合わせています。台は274×152.5cm、高さは76cmで球の直系は44mmです。卓球詳しい人ならおや、と思うかもしれませんが、競技における球の直系は40mmとされています。44mmはラージボールと呼ばれる規格で初心者やお年寄り向けの言わば軟球テニスのような球です。今回は温泉卓球なのでラージボールのサイズにしています。（謎のこだわり）
ただ、ここまでやっておいてなんですがネットの高さが規格と違います。規格では15.25cmなんですがゲーム内では17.25cmで計算してます。これは規格とか考えずに描いたドット絵に辻褄を合わせるためです。ドットの方を直せばいいじゃんと思われるかもしれませんが、今回はレイアウト至上主義。レイアウトを守るために規格を曲げました。決してめんどかったからではありません(｀・ω・´)
操作感
平日はまとまった作業時間は取れないので、ひたすらCPUとラリーして気持ちいい操作になるようにちまちま調整する作業をします。記憶の中の「嗚呼神速の」は確か（ガラケーのテンキーで）456キーのどれかを押した後すぐ123キーのどれかを押すと打ち返せるとかだった気がします。つまりラケットで言えば下から上に振るうイメージになりますね。で4→3と押した場合は思いっきり右に6→1と押した場合は左に打ち返すといった感じで直感的にコースも決めれたと思います。今回はこのイメージに合うように操作感も調整しました。打ち返した瞬間以下のような計算で返球速度を決定します。
ball.targetTo(
球のX座標＋ラケット速度X×10,
0,
テーブルの長さ×(0.75 - ラケット速度Y÷80),
Math.max(20, 40 - ラケット速度));
奥行き方向は打った位置からの相対で決まるわけではないので手前に引きつけて打つほど速い球を返せるようになります。
返球時間はラケット速度で決まるので、速く振れば振るほど短時間で着弾します。
よって、このゲームでスマッシュのような球を打つには左か右に飛んできた球を十分引き付けてから思いっきり反対の奥へ打ち返すことです。
スマッシュのようなと書きましたがそれはこのゲームに明確なスマッシュがないからです。というか球種という概念がありません。ラケット捌きだけでいろいろな返球ができるようになってくるとその技術だけで勝ちたくなってきます。なので、”これをすればスマッシュが打てる”とか、”ゲージを貯めればフィーバーモードになる”とかそういう仕様も考えてたんですが、ゲーム性の純度が下がるなと思ってボツにしました。ただ、そうするとほんとに地味な打ち合いを楽しめる人だけが遊ぶゲームになってしまいかねないのでジレンマポイントですね。
この点に関してちょっと心強かったのは、最近「ビリヤード」というすごく渋いゲームがニコ生で流行ってるんですがこれも特別な技とかは一切無くほぼ技術で攻略するタイプのゲームなんですが、これが流行ってるなら卓球もありでしょと思えたのでそのまま行きました。
キャラデザ
8/1（火）ラリーの調整をする上でダミーでいいから相手の姿が欲しかったのでキャラデザも兼ねて立ち絵のドットを打ちました。ここではどういう思考でキャラデザを決めたのかについて書いていきます。
まずこの時点である程度ゲームの方向性を決めておきます。
- 操作感の話で書いたように基本的にはラリーの楽しさを活かしたい
- しかしラリーだけでは地味なので点を入れると高いスコアが入るようにする
- ただし、点を取るほど相手が強くなっていき、スコアを稼ぐのが難しくなっていく
こういうゲームにしようと考えていました。
そのため「点を取るほど相手が強くなっていく」というのを「絵」でどう表現しようか悩んでいました。最初は弱・中・強の敵キャラ3人くらい出そうかと思いましたがどう考えても作画コストがやばいです。ただでさえ1キャラで何枚描けば足りるかわからないのにキャラを増やすのは絶対にまずい！！「1キャラ」で「初心者プレイ」から「上級プレイ」までを違和感なく演じきれるキャラが欲しい！そこで行き着いたのが、涼宮ハルヒの憂鬱の長門有希さんでした。
捕球する長門
素晴らしくないですか？表情一つ変えずに強さを自由自在に変えれて動きも最小限！！作画コスト問題をその身一つで解決してくれました。というわけで、長門に浴衣を着せたようなキャラがここに爆誕したのでした。
「・・・」
ただ、この浴衣のデザイン未だに納得いってないです笑ホントはこれみたいなデザインにしたかったんですよね。
THE温泉浴衣
最初は柄付きでドット打ってみたんですが、如何せん解像度が低すぎて全く表現できない。解像度決める時にそこまで考えてなかった！しょうがないので柄なしにしましたがワンチャン入院服に見えるのが残念でなりません。まぁ半天でも着せれば大分マシになるんですが今回は「夏の」ゲームイベント、暑苦しそうなのでそれもできませんでした。
ちなみにゲームの感想を見ているとやたら綾波レイみたいなやつと云われてました。そっちか～、まぁ似てるっちゃ似てる？
あと関係ないですけど、すごい意外だったのが何気なく描いた谷間の4ピクセルに結構反響があったことですね。もはや手癖で描き込んでるのでお色気とすら認識してなかったんですが思った以上に効果ありましたねｗ
たまたまラケットで隠れてチラリズムになっていたのも大きかったのかもしれません。
ネットとエフェクト
打ち合いがいい感じになってくると、ギリギリを攻めるので球がネットに引っかかることも増えてきました。しかし、絵がシンプル過ぎてネットに引っかかったかどうかが分かりにくい！そこで、ネットに触れたときだけ専用のSEを流すことにしました。早速いい音が無いか探してみるんですが難しいです。ドンピシャなSEはもちろんないですし、代わりの音を流すにしても「卓球ネットに球があたった音」の代替なんてイメージすらできません。最終的に効果音ラボさんで見つけた「脱いだ服を落とす」*6という音を流しているんですが、さりげなさ過ぎて全然聞こえない！笑
そこで、大分手間は増えますが、球の接地点に煙エフェクトを出すことにしました。
めっちゃさりげないエフェクトですがやること多いです。
まず、パーティクルシステムを作ります。パーティクルの登録機能と、その更新・描画機能があれば良いです。更新時にパーティクルの寿命が来たら自動で削除も行います。描画はちょっとややこしくて卓球台の各パーツと共に奥行きソートして奥から順に描画してます。（球もパーティクルの1つとして処理することにします。）
次に、球がバウンドした時にパーティクルの発生位置と速度を求めます。
- 衝突地点の法線から従法線とタンジェントベクトルも求めます。それらを使って球を平面に投影した時の輪郭円上のランダムな位置にパーティクルを発生させます。（図の黒い円上）
- 球の反射ベクトル（赤い矢印）を平面上に投影したベクトル（青い矢印）方向に速度を与えます。
- これらを時間差空けつつ5個発生させます。色は白からグレーの3階調でランダムに選ばれます。
地味に面倒な作業が多くて疲れましたが、当初の狙い通りネットに引っかかったかどうかがだいぶ分かりやすくなりました。ネットだけでなく台との衝突時にも出すようにしたらいい感じの賑やかしになってゲームっぽさが増したのは想定外の効果でした。いっそ常に球からキラキラエフェクト出したらいいんじゃないの？と思って試したんですが、さすがに邪魔くさかったのでやめました^^；
ビットマップフォント
実は開発序盤からずっと気になっていたのがAndroidでの不具合でした。手持ちのAndroidでプレイするとなぜかフレームレートが10くらいしか出ないのです。怪しそうなところをコメントアウトしていって原因の特定をした結果ダイナミックフォントを使ったラベルがあると激重になるようでした。なので、恐らくビットマップフォントにしてしまえば大丈夫だろうと思いつつフォント画像を作るのがめんどかったので最終日までもつれこんでいました。
シンプルなフォント
後でもっとかっこいいフォントにするつもりでしたが結局モチベが出ず現在もこれのままです。Akashicのビットマップフォントは初めて作るので最初json部分をどう作ればいいか分かりませんでした。どうやら
BitmapFontGlyphInfo | Akashic Engineを満たすjsonを定義すれば良さそうと分かったのでjsで適当にスクリプトを書いて生成しました。これ皆さんはどうやってるんですかね？
ともかく、ダイナミックフォントをビットマップフォントで置き換えたことによってAndroidの不具合も直ったようです。原因は未だに分かってません。
モーション
最悪『空中ラケット』になるのを覚悟していたCPUですが、せっかく作画コストの低いキャラデザもしたことですし、何とか動かしてあげたいです。
CPUの手の届く範囲はかなり広いのでそれをカバーしつつ枚数を抑えることを考えると、、、もう思い切って左・真ん中・右の打ち返しモーションだけ作画することにしましょう。長門のように腕だけ動かして3つの差分と待機状態を作画しました。
ところが、実際にこれをゲームに組み込んでみたら動きがキモすぎる問題が発生！w
映像無いのでお見せすることはできませんが、なんか反射的に腕を伸ばすので虫みたいで可愛くない！キモい(´;ω;｀)。せっかく描いたのにマジかよ～と思いつつなんとかならないか調整を試みます。その結果、打つ直前に手を伸ばしてその0.5秒後に引っ込めるようにしたら大分自然になりました。ヒヤッとした〜・・・
ちなみに現在は中距離の打ち返しモーションも追加して計5枚の差分になってます。CPUをナーフした時に球を拾える範囲を小さくしたので長距離モーションを廃止して全部中距離モーションで打ち返そうと思ったんですが、遠くの球を追いかける時にこれまで腕を全力で伸ばしていたのが、すごい縮こまったポーズで追いかけるようになってしまってめっちゃ舐めプされてるように見えたので長距離も残した5段階モーションにしました。これもまたキモイというかウザい動きだったので思わず笑ってしまいました。
これだと舐めプに見える
次は足元です。この手の横移動するキャラの作画を減らす手法と言えば古のゲームでよく見る「ちょこちょこステップ」＋「カニ歩き」が定番です。浴衣でややサイドステップする足元の絵を描いて8ピクセル移動するたびにノーマル足と交互に表示すればそれっぽくなります。移動が速くなってくるとややキモいですが、そもそもプレイヤーは球に集中してるのであまり気になりません。
あと、かなり地味なんですが伏し目の表情は調整難しかったです。基本的に表情の無いキャラですが球を追いかける視線でわずかに表情を付けることで魅力が上がります。左右の目配せは特に問題なかったんですが伏し目を自然に見せるのがなかなか難しくて意外と時間かかりました。キャラとして自然な振る舞いをさせるのはコストの高い作業なので慣れてないなら覚悟しとかないと駄目ですね。
いつも後回しになりがちなサウンド関連。とは言え、ハマる音が見つからないとゲーム作り自体が詰んでしまう事もわかってるので作業の合間合間にちょっとずつ探し続けていました。
効果音はみんな大好き「効果音ラボ」様ですべて揃えました。いつもお世話になってます。大抵の音はサクサク決まったんですが、強打音が見つからない。しょうがないので今回はテニスの音で代用しました。バコッ！という音、よく聞くと完全にテニスです笑。あり得ない音ですが意外とハマったし気持ちいいです。
また小手先テクとして球が跳ねる音や打撃音は視点からの距離によって音量を変えています。ほとんど分からないレベルだと思いますが臨場感につながっていると思いたいです。
BGMはいつもお世話になっている「DOVA-SYNDROME」様から探させていただきました。頭の中ではがんばれゴエモンシリーズっぽい曲がイメージできてるんですが、なかなかそれっぽい曲が出てきません。検索条件を変えながら「和風」で検索した時に1ページ目にこちらがありました。
dova-s.jp
5秒聞いた時点で「ｷﾀｰｰｰｰ!!!」って感じでした（分かる人には分かると思う笑）。ループは非対応だけどクオリティ高いし全然OK。このゲームってハイスコアを目指そうとすると結構ストレスゲーになるんですが、それをできるだけ誤魔化してくれるこんな曲を求めてました。山本リョーマさんありがとうございます！
遊び方の説明
怖い部屋3Dでは画像一枚で済ましていた遊び方説明。ニコニコ迷宮では動く指とか出してややパワーアップし、今作では球をスワイプするアニメーションまで付けしました。かなり分かりやすくなったんじゃないでしょうか？いや、なったはず！もう十分だろ・・・！許してくれ！(苦痛)
個人的に1ゲームは全部含めて2分くらいがちょうどいいのかなーと漠然と思ってるんですが、今回は試合部分だけで2分あります。素直に2分30秒くらい確保すればいいんですが、説明画面と終了演出をギチギチに詰めて2分20秒にしてしまいました。おかげで遊び方の表示が（2ページで）6秒＋8秒しかありませんでした。ぶっちゃけあの文章量ならもうちょっと長く見せないと読み切れないですね。itch版では遊び方画面をタップでスキップ出来るんですがニコ生版は強制表示です。深い意味はないのでニコ生版も表示時間延ばしつつスキップありにして良かったかもしれないですね。
公開してから
怒涛の9日間を終えてなんとかゲームの体裁が整い、最終日の8/6 18時くらいについに公開しました。今までのゲームは日付変わるあたりまでやってましたが今回は夕方に終わりました！すがすがしいですね🍺
バグ
先に終わったからと言って調子こいて（まだ制作中だった）ふんすけさんの枠で新作を遊んでもらってたら、すぐにバグが発覚ｗ。てばてばもってぃさん（すあまちゃんゲームの作者）の環境で球とキャラのスプライトの描画順が逆になって
球が見えなくなる現象が起きていたらしいです。すぐに自分でも放送枠をとって修正作業に入ります笑。自分の所では起きないので結局根本的な原因はわかりませんでしたが、敵を必ず先に描画するようにして緊急回避。なんとか事なきを得ました。てばてばさんもお忙しいところありがとうございました。後日プレイ動画が上がっていたので見てみると、ネットの後ろに球が行ってるのに手前に描かれてしまっている様子が映っていました。「へ～これかぁ」と思いつつやはり原因はわからなかったので見なかったことにしました*7。とは言え今回それ以外では目立ったバグは無かったようなのでほんとに良かったです。
itch.io版
操作感に関しては個人的に結構いい感じに調整できたとは思いましたが、人によっては慣れるまで時間がかかりそうだなと思っていたので今は無きアツマールの代わりにitch.ioというサイトに練習用温泉卓球を公開しました*8。
isobeyaki.itch.io
itch.ioもゲームファイルをzipにしてアップロードするんですが、ランキングゲームであればニコ生版と全く同じzipで大抵動くので簡単に公開できます。最新のitch版はLV10から開始できる本番モードというのも実装していますので是非遊んでみてください。もうサーブからめっちゃ鋭い球が飛んできます笑。ニコ生版の方にはitch版のURLを表示するようにしたんですが、最初はDOMでリンク要素を載せて、ゲーム画面から直接itchに飛べるようしようかと思ってました。実際できることは確認したんですが、なんかイベント規約とかに引っ掛かられても面倒だなと思ったのでいったんやめました。どこまで許されるんですかね？
またitch.ioでもゲームアイコンを設定できるんですが、せっかくなのでアイコンを作り直しました。パネワンの時も反省しましたが、最初に描いたアイコンは既にゲーム内容と乖離していてよろしくありません。せっかくドット打って描いたので思い入れはあったんですが、そこは割り切ってゲーム内のドット素材を組み合わせて新アイコンを作りました。旧アイコンは公開1日で寿命を迎えるというセミの一生のような感じでしたが、コンセプトアートとしての仕事は全うしてくれたので成仏してもらいましょう。
🙏
飽きない？
公開してすぐ、ありがたいことに温泉卓球は結構人気なようでした。ただ、イベントは12日からなので今こんな速度で消費しちゃったら始まる前に飽きない？という一抹の不安が・・・
一応何かバージョンアップしようかなとは思ったんですが、今のゲーム性を壊すことなく追加できるコンテンツなんて全く思いつきませんでした。これって技術を磨くゲームであってコンテンツ消費ゲームでも運ゲーでもないので追加できる要素が無いです。しいて言えば女の子のサービスショット追加とか？いやいやいや、(ヾﾉ･∀･`;)ﾅｲﾅｲ
唯一途中でやったバージョンアップはナーフでした。自分では気づかなかったんですがLV1が結構強くなっちゃってたみたいで、「腕が長くね」「めっちゃ返すじゃん」という意見が出てました。なので結構思い切って弱体化させたんですが・・・あんまり変わらなかったかも？*9
夏イベ結果
ch.nicovideo.jp
なんと！！温泉卓球が夏のゲームイベントで優勝しました！！！🎉
これは予想外です。前回の投稿作「怖い部屋3D」は（個人的にはお気に入りなんですが）、恐らく下位だったでしょう。それを踏まえてある程度はプレイヤー層に寄り添った作りにはしてたんですが、まさかこうなるとは思いませんでした。分析って程じゃないですけど、今回の結果につながったところで自分なりに思い当たる節があるとしたら気持ちよさと世界観あたりですかね？気持ちよさというのは「嗚呼神速の卓球よ」を遊んだ時の感覚を頼りに調整した操作感のことですね。他の卓球ゲームはやらないんで知らないですが、卓球（というか球技？）特有の緩急やスピード感が出せたのが良かったんだと思います。世界観は温泉のまったり感やキャラなどですね。こんな子と温泉行きて～という想いがみんなにも届いたんでしょうか（真顔）。99%技術ゲーでありながら演出的には徹底的にゆるゲーを装ったという点で、パネワンと真逆のことをしてますね。やっぱりぷよぷよもパネポンもゆるゲーの振りをして女性ユーザーを獲得できたのが成功の鍵だったんでしょうか・・・？
あと、他のイベント参加作品の中ではメタル落としが気になりました。リズム天国とかメイドインワリオみたいなテンション高いコミカルな演出が珍しいなぁ、上手いなぁと思ってました。こういう個性的な作品が見られると面白いなぁと思うし、ニコ生ゲームを知らないクリエイターの人にも注目されるんじゃないかなぁと思いました（KONAMI感）。
総括
今回のイベントはやたら応募作が多くて最初は落選に怯えていました😨。これで落ちたらもう参加しないかなぁ・・・なんて思ってましたが、今回は運よく（？）通過できましたね。ツクールMVでも作れるようになったし、イベントの知名度も上がってきているだろうしで、きっと今後は更に応募が増えていくと思います。なので普通に落選することも出てくると思いますが、それはそれで通常の作品投稿はできてるわけですからイベント用と気張らずに、たまたま投稿時期がイベント期間だったから運試しにエントリーしといたわ～くらいのノリで作っていくのが大事になってくるかもしれませんね。
長々とここまでお読みいただきありがとうございました。
