VANNAN GAMES.

制作ノート

個人開発ブラウザゲームの制作の裏側です。バランス設計・AI画像生成・AI作曲・効果音づくり——開発でハマった話とその解決を、失敗した数値ごと一次情報で書いています。

読んで面白かったら、OFUSEでの応援も歓迎です。制作費(イラスト・音楽の生成環境)にあてます。

OFUSEで応援を送る
サイト全体

ルールを決めた8日後に、自分でそれを破った——AIへの指示を4つのレイヤーに分けた

禁止と書いた8日後に、AIに頼んだ作業のついでに禁止の形が復活していた。11,000行のメモのどこに書いても、AIは読まない。AIへの指示を、毎回読まれる短い入口・作業の種類で出てくる手順書・自分で打つコマンド・並列で走る監査役の4つのレイヤーに分けた記録。

みんなでわたる。

運が腕前を1万倍上回っていた

公開済みのゲームを測り直したら、同じ「常に正解を選ぶ」プレイでステージ8の結果が19人から197,904人まで散っていた。運を「機会」から「値」へ閉じ込め直して、振れ幅を1.3倍まで落とすまでの記録。

サイト全体

AIに読ませて、書かせない——監査で41件出たけれど、その報告にも嘘が混じっていた

開発メモと実装のズレを、1ファイルに1体ずつAIを当てて並列で洗った記録。41件出た一方で、報告の根拠そのものが作り話だった件がある。結論ではなく根拠を見るようにした理由と、書き込みを渡さない理由。

サイト全体

AWSでもGCPでもなく、Tencent Cloudで配信している話

静的サイトの置き場にEdgeOne Pagesを使い続けている理由を、ひと月あまりの実測で答え合わせした。Brotliの効き、HTTP/2が有効にできない件、AWS/GCPとの部品数の差。マイナーな置き場が学習として損だったかも書いた。

サイト全体

本番の画像43枚が全部404でも、誰も気づかなかった——AIへの指示より検査を書いた話

カードずかんの画像43枚が、本番で1枚残らず404になっていた。WebP変換のときの参照漏れに、何度も画面を開きながら気づかなかった話。指示を磨くより機械に見つけさせる側へ寄せた記録と、0件を走査して「全部OK」と答えた検査の失敗。

四十秒のオリ図鑑

WebPだから軽い、と思っていた——56pxの枠に512pxを79枚並べて図鑑が壊れた話

図鑑のオリが1体だけ絵の出ない状態に。原因は56pxのセルに512pxのWebPを79枚読ませていたこと。デコード後79MBという計算と、128pxサムネイルで4.9MBに落とすまで。

四十秒のオリ図鑑

ポケモン金銀の面白さを14要素に分解して、自作RPGを監査した話

いちばん好きなゲームの面白さを14要素に分解して、開発中の収集RPGを採点した。◎が6つあるのに薄く感じた理由は、数値に関係ない少数の穴だった。30分の表が数週間の実装の方向を決めた話。

四十秒のオリ図鑑

切り札演出を、画像部品の組み合わせで1体1つずつ作った話

収集RPGの技エフェクト55種を、部品画像の組み合わせと振り付けデータだけで固有化した方法。使い回しをやめる決心と、ポケモンBWのりゅうせいぐんから学んだ段構成について。

フルスタック!

16MBの画像が、1MBの音楽を5秒待たせていた

「初回だけBGMが鳴らない」の真因は再生処理ではなくネットワークだった。画像53枚16MBが帯域を占め、1MBのBGMの完了が5.6秒まで延びていた実測と、fetchPriorityでの直し方。

サイト全体

ブラウザゲームの音が鳴らない問題、全部踏んだので地図を描く

自動再生ブロック・iOSのマナーモード・Audio要素ごとの解錠。「音が鳴らない」報告に向き合い続けた結果たどり着いた、ブラウザゲームの音まわりの罠の全体像と対策。

サイト全体

小さなゲームサイトに「UI憲法」ができるまで

ターン終了ボタンが156px飛ぶ、絵文字が端末で化ける、スマホでボタンがはみ出す。事故のたびにルールを1条ずつ増やして、サイト共通のUI憲法に育てた話。

サイト全体

一人開発にも「レビュー」と「チェックリスト」を入れたら事故が減った話

チームのいない個人開発で品質をどう守るか。更新漏れから生まれたチェックリスト、リリース前レビューが実際に捕まえたバグ、「数字はgrepで突合する」という観点の話。

フルスタック!

初期デッキを「適性アンケート」で決める仕組みの設計

デッキ構築ローグライトの初期デッキを性格診断風の3問で抽選する仕組み。エンジニアがニヤリとする質問設計と、崩壊したバランスの立て直し。

サイト全体

フレームワークなしのHTML+JSだけで6本のゲームを運営している話

ビルドなし・フレームワークなし・素のHTML/CSS/JavaScriptだけでブラウザゲーム6本を作り運営している技術構成。この規模ならではの割り切りと、その代償について。

サイト全体

ゲームBGMを100曲、AIで作ってライブラリ化した話

個人開発の6作品のBGMをSunoで自作した記録。無料版の商用制限で全曲作り直した失敗、カテゴリ別プロンプトでの一括生成、ゲームへの割り当てまで。

サイト全体

音が鳴るようになったら、今度は遅れた——効果音の遅延と重なりを直した話

ファイル再生に統一したら今度は9〜100ms遅れて鳴るように。まずWAV22本の先頭無音を測って音源の無実を確かめ、再生経路を替えて0.1msにするまで。効果音だと思っていたものが22.8秒の曲だった話つき。

サイト全体

JSでは動くのにHTMLに書くと壊れる——リンクの入れ子とパーサの話

innerHTMLで組み立てていたカードUIをHTMLへ書き写そうとして手が止まった。aタグの入れ子は、JS経由なら生き残るのに静的HTMLではパーサに組み替えられる。同じ文字列が経路によって別のDOMになる。

四十秒の交差点

エンディングを6から9に増やすとき、数ではなく軸を足した話

既存の分岐が埋めていた格子を図にしてから、空いている方向に軸を足した。真相を全部集めると最良の結末には行けなくなる——その排他をあえて残した理由。

開発中の新作

「上手い人が勝てないゲーム」を、計測しながら作り直した話

開発中の新作TDで、上手いAIと無策AIの成績が全く同じに。被弾の帰属を計測して原因を特定し、実力が出る設計を13バリアントかけて探し当てるまで。

フルスタック!

ゲームバランスを「勘」でなくシミュレータで設計した話

「無策なら勝率7%、上手いと5割」を数千ランの自動プレイで作り込んだ過程。無制限にした1枚のカードで勝率が3%まで崩壊した話など、失敗した数値ごと公開します。

フルスタック!

9割が負けるゲームだから、負け画面をいちばん作り込んだ話

初見の9割がゲームオーバーになるなら、負け画面こそがゲームの顔。ランの一部始終を「障害報告書」にした設計と、キャリア診断が全員同じ称号になった失敗について。

フルスタック!

パチンコ風カットインの効果音を3回作り直した話(iOSマナーモードの罠)

「SEが聞こえない」という報告に3回向き合った記録。iOSのマナーモードではWebAudioの音だけが消音される——最終的にBGMと同じ経路に乗せて解決するまで。

AIに「まっすぐな横断歩道」を描かせるのに苦労した話

ゲーム素材はすべてAI画像生成。透過背景を頼むと市松模様を「絵として」描いてくる問題、遠近をつけたがる横断歩道との戦い、発注文を定型化して事故を根絶した話。

新作の公開情報やアップデート履歴は更新情報にまとめています。