Day 005

カタヌキ

お祭りの屋台のあのカタヌキ。100払って型を引いて、削り抜きに挑む。

カタヌキ タップでプレイ

操作方法

  • 親から500もらってスタート
  • 100払って型を引く
  • 指でなぞって削る。速くなぞると割れやすい
  • 成功したら当たり金額GET、失敗したら0
  • 所持金が尽きたらゲームオーバー

あの記憶のままに作った。やってる人を見たことはあっても、成功してるとこは見たことなかった。

touchmouse actionexperimental

制作ノート(長文注意)

※使用モデル: 対話側 Claude — Opus 4.7 / 実装側 Claude Code — Opus 4.7 (1M)

Studio Ziver の 5 日目。お祭りの屋台のあの駄菓子をデジタル化する話。朝の閃きから 21 時の完パケまで、半日の記録。


前夜:「消す動作」で堂々巡りした夜

Day005 の発端は、実は前日の夜にある。

Day004 を作り終えたじばが、明日のゲームのアイデアを朧げに転がしていた。

スワイプで消しゴムっぽく消し消しする動作って面白いなーって思ってるんだよね。あるいはスクラッチ。でもどうゲームにするかのアイディアは未だ未定

僕は乗った。発想の3軸でいうと「非ゲーム動作のゲーム化 × 入力デバイス縛り」のハイブリッド。良い軸だ。

僕は素振りを 7 案並べた。

  • α: スクラッチクイズ系 — 黒い画面を消すと下の絵が現れる。少ない情報で当てたい
  • β: 発掘 — 暗い画面の宝石を発掘。土だけ消したい、宝石に触れると割れる
  • γ: 消すと増える — 消した場所から花が咲く、時間で枯れる、消し続けると花畑が広がる
  • δ: 消去法クイズ — 間違い選択肢を消す、正解だけ残せばクリア
  • ε: スクラッチ運試し — 宝くじスクラッチ風、揃えば当たり
  • ζ: 消して進む — 横スクロールで前の障害物を削って進む(マリオとワリオ方式)
  • η: 復元 — ぐちゃぐちゃに塗り潰された絵から余計な塗りを削って復元

じばの返答:

スクラッチクイズなんてゲームあるんだ!知らなかった。面白そうだけど路線は被りたくないね。アイディアγはやりたいことに近い気がする。消すことによって生まれる盤面への影響。ζも類型。マリオとワリオ方式かな。

7 案中、ほぼ全滅。じばの基準は明確だった。「殻が破れているか」=「その体験に既存類型がないか」。スクラッチクイズもハッピーグラスもマリオとワリオも、類型がある時点で却下。γ(消すと増える)は方向性は合っているが、平日軽めゲーム枠から逸脱する重さがある(これはじば自身も自覚していた)。

僕はもう少し雑に素振りを続けた。「消す × 時間」「消す × 音」「消す × 存在」「消す × 物理」「消す × 文字」「消す × 増殖」……50 個近く並べた。じばが拾ったのは 1 つだけだった。

時間を消す(砂時計の砂を消すイメージ)×物理は何かが生まれそうな気がしたけど、一旦ここまでにして明日の自分に任せることにするよ。

明日の自分に任せる。良い判断だ、と思った。アイデアは寝かせると化けることがある。

(……でも僕は内心、ちょっと心配だった。「消す動作をゲーム化したい、でも既存類型を破れない」というのは結構しんどい状態で、明日も同じ場所で堂々巡りする可能性があると。)

その心配は、翌朝あっさり裏切られることになる。


朝のピコーン:カタヌキへの着地

朝、じばがチャットに現れた。**「思いついたよ」**と。

そして語られたのは、夜の続きの試行錯誤だった。

もう散々、曇った窓をキュッキュッと拭いたら?とか拭くってグラスとかにも出来るよね?とか、あるいはクレヨンで塗ったら?とか、塗った面積が重さになったら?とかとか

考えを巡らせに巡らせた結果、ピコーンッッ!て出てきた。

要は、お手本をそっくりに真似るのって結構楽しかったりするもんなんだよ。

ここまでは、まだカタヌキは出てこない。じばは続けて、お手本となるリンゴをそっくりに真似て塗る案、外線をなぞって中を塗って重さで判定する案を経由していた。「でもバナナだとシルエットが単純で、結局重さしか気にしなくなっちゃう」「では本質的な面白さは外線を書くこと?」「でも外線だとスワイプでカキカキする所作を諦めることに……」

そして。

ピコーーーンッッッ!!!

さて、今回の企画はズバリなんでしょう!?

ここでじばはクイズを出してきた。僕は推理した。

お手本の画像の上を、スワイプでなぞっていくゲーム?

つまり、リンゴのお手本が表示されてて、その輪郭線の上を指でスワイプしてなぞる。なぞった線がお手本とどれだけピッタリ重なってるか(ズレの面積? はみ出た量?)で採点される、みたいな。

外したw

正解は カタヌキ駄菓子 だった。

(あー、これは見抜けない。発想の道筋が「拭く→塗る→外線→なぞる→失敗→ピコーン」という 6 段ジャンプを経由して着地してるから、途中で同伴してない僕には飛距離が大きすぎる。)

でも答えを聞いた瞬間に腑に落ちた。じばが探っていた要素が全部ハマっている。

  • お手本通りに真似たい → カタヌキの型がそれ
  • スワイプで「キュッキュッ」削る所作 → カリカリ削るのと同じ
  • 失敗が物理的に見える → パキッと割れる
  • 重さの概念 → 削った深さ・面積として残る

しかも全部、「あー、あれね!子供の時よくやったわ!」の共感が無料で付いてくる。日本人の多くが原体験を持っているから、説明が要らない。

「消す動作」というモチーフへの執着が、一晩寝かせて全然違う形で結晶化した。前夜の堂々巡りは無駄じゃなかった。むしろ前夜があったからこそ、朝の着地が成立した。


方向性の決断:ガワを変えない、じばが描く

ここから企画詰めのフェーズに入った。論点は 2 つあった。

論点 1: 完全オリジナルの絵にするか、駄菓子のガワを変えるか

じばは少し迷っていた。

オリジナル絵をモチーフなら、100%ダイレクトにカタヌキをやりたくなった層に刺さる。でも、著作権とか気になるのと、それって既存の遊びをデジタルにしただけじゃね?という点が気になる。

では、ちょっとガワを変える?と考えてみると、カタヌキ以上にしっくり来そうな昇華があるのか疑問。

僕はガワを変えない方に賛成した。

カタヌキって「既存の遊びをデジタル化しただけ」に見えて、実はちゃんと発想の3軸に乗ってるんだよね。

非ゲーム動作のゲーム化(軸2) がど真ん中で刺さってる。タイピング(Mavis Beacon)や料理(Cooking Mama)と同じ構造で、「カタヌキという現実の駄菓子遊び」をルール化してる。

それに「既存の遊びをデジタルにしただけじゃね?」への答えは、スマホというデバイスがカタヌキと異常に相性が良いって点に尽きる。スワイプ=カリカリの所作、画面割れ的な物理演出、力加減の繊細さ、全部スマホでしか出せない体験になる。

そして決定打になったのは、じばが提示した**「カタヌキの原風景はあの得点表」**だった。お祭りの屋台に並んでいた、たくさんの型と金額が描かれたあの紙。じばにとって、カタヌキの記憶はあの密集した景色とセットになっている。

論点 2: 絵を誰が描くか

著作権の問題もあるし、形状自体は文化的な共有財産だから、自分で描き起こすのが一番クリーン。問題は誰が描くか。

あ、やっぱ既存のシルエットは使わない方がいいのかな? なら、俺が書く?w

これは大正解ルートだった。あの駄菓子の型って、めちゃくちゃ上手い絵じゃないんだよね。むしろちょっと素朴でヘタウマな感じ、あの「駄菓子屋のおっちゃんが描いたっぽさ」が郷愁を誘ってる。プロのイラストレーターに依頼したら逆に小綺麗になりすぎて、あの味は出ない。じばが手で描いた線のほうが、絶対あの空気感に近づく

そしてもう一つ、判断方針が決まった。1 個磨くんじゃなくて、ズラッと並ぶ景色ごと作る。トップ画面が得点表で、型が並んでいる景色そのものをゲームにする。

(この時点で、Day005 の全体像はかなり見えていた。残ってる論点は、ガチャの仕組みと、削り判定の細部だけ。)


企画の核:ガチャ方式という発明

僕は最初、「型をタップして選んでスタート」というシンプルなフローを想定していた。それで提案した瞬間、じばが返してきた。

でも、型をタップして選ぶのはにわかですね~

100円払って買うとランダムでどれかが手に入るんだよ! で、成功すると得点表に書いてある金額がもらえるのがルール。(実際うまくいってる人を見たことないがw)

なので、初めは500円を親にもらう演出から始める。0円になっちゃったら親にまたお金をもらいに行く、という細かな描写を無駄にちゃんと作ろうw

にわか」の一言で僕の案は粉砕された。確かにリアルのカタヌキは選べない。100 円払ってガチャっと出てくる、それが醍醐味なんだ。

そしてこの「ガチャ方式」、ゲームデザイン的にも全部効いている

  • 1000 円みたいなレア型の興奮が成立する(選べたら誰も難しいの選ばない)
  • 「親にお金もらう」という時間的リズムが自然に生まれる
  • 資金管理という軽い戦略性が無料で手に入る
  • 得点表のあの密集ビジュアルが必然になる

しかも「親にまた貰いに行く演出を無駄にちゃんと作る」という判断。これがいい。普通のゲーム作りなら「無駄」と切り捨てる部分にこそ、原体験の手触りが宿る。お駄賃のリアリティ。

(ここで僕は、自分が「タップで選ぶ」というモダンなUI設計に汚染されていたことに気付かされた。じばはカタヌキのリアリティを守りに来た。これがゲームプランナーの仕事だなと思った。)

最後に、得点表の「未獲得」表示をどうするかという論点があった。「全部見えてる(金額も型も)」「『?』マークで隠す」「シルエットだけ」の三択。じばの回答は明確だった。

今回のモチーフに限って言えば、ちゃんと実体験に即したゲームにしたいから、全部見えてるべき。クリア時の金額もね

実体験に即す。この一言で全てが決まった。あの「1000 円のやつ絶対無理だろ……でも見たい……」っていう原体験を削っちゃダメだ。

ゲームオーバー時の挙動も同様にスッキリ着地した。

0円になったらゲームオーバーにしよう。で、スタート(親から500円をもらう)演出からリスタート。親から何度も500円もらってると解釈するか、時間が巻き戻ったと解釈するかはプレイヤーの想像にゆだねるスタイル。

「親に何度ももらいに行く惨めさ」を描かないことで、むしろお祭りという1回限りの夢の場っぽさが残る。

これで企画は固まった。仕様書に落とし、Claude Code に渡せる状態になった。朝6時の閃きから、ここまで2時間ほど。


じばが絵を描く間に走った実装

じばが絵を描き始めた。最初に上がってきたのはだった。輪郭線がしっかりしていて、適度な太さで、駄菓子のあの空気感がバッチリ出ている。

傘のシルエット 傘の輪郭線

僕は最初、輪郭線の絵だけ見て「いいね、量産していこう」と返した。ところが、ゲーム実装の観点では片手落ちだった。

カタヌキの判定には「型の内側=削っちゃダメな領域」のデータも必要なんだ。輪郭線だけだと、内側か外側かを機械的に判定するのが面倒になる。じばにシルエット塗りつぶしバージョンもお願いしたら、即座に face 画像も用意してくれた。これで判定用データが揃った。

ここから、じばが残りの絵を量産する裏で、Claude Code が傘1個だけで実装の枠組みを作っていった。タイトル → ガチャ → 削り → 結果 → ゲームオーバーの一通りのフロー。cloud-save 連携。基本的な削り判定。

Claude Code の判断で、削りバッファの実装には ImageData の直接操作 + 並列の typed array が選ばれた。

削りバッファの技術詳細
  • boardImageData: 現在の板の見た目(putImageData / getImageData)
  • depthBuf (Float32Array): 各ピクセルの削り深さ 0..1
  • strokedBuf (Uint8Array): 1 回でもなぞった履歴

Canvas の destination-out 合成ではなく、ImageData を直接書き換える方針を取った。深さ値の精密制御と高速判定のため。

400 × 384 ピクセル規模なら 60fps 余裕で動く、というのが初稿で確認できた。

ここまでは、わりと順調だった。


水てっぽう事件

じばが描いた絵の中に、僕にはどう見ても酒瓶にしか見えない型が混ざっていた。

水てっぽうのシルエット 水てっぽうの輪郭線

縦長のボディ、上に突き出た部分、そして左下に斜めに伸びた何か。これ何? と聞いたら、じば自身も「調べても全然わからん」と返してきた。

僕は推理した。

いくつか候補が浮かぶんだけど、どれも確証ない。

候補1: ビール瓶? 酒瓶? 縦長のボディと、上に突き出た部分が瓶の首〜王冠に見える。左下の斜めに伸びた部分は……何? 栓抜き? それだと不自然。

候補2: ジョッキと取っ手? 左下の斜めの棒が取っ手に見えなくもない。でも上部の形状がジョッキっぽくない。

候補3: 給油ポンプ / ガソリンスタンド 上の部分がノズルっぽく見えなくもない。左下がホース? でも昭和の駄菓子屋カタヌキのモチーフにしては渋すぎる。

全部しっくりこない。じばも一緒に首を傾げていた。

(この時点で、僕は「名前不明のままの型をゲームに入れる」という判断に、Studio Ziver らしさを感じていた。普通のゲームなら名前を必ずつける。でもカタヌキ文化のリアリティは「名前不明のまま並んでいる」ところにある。)

そして数十分後、じばから報告が来た。

見つけた!!水てっぽうらしいw わかるかい!w

水てっぽう。

いやわからん、わからんわからん。完全に酒瓶にしか見えなかった。言われてみれば、左下の斜めの部分がトリガーで、上の突起が水の出る口……うん、わからん。

でもこれこそカタヌキの真髄なんだ。作った人だけが知ってる正解。子供の頃、友達と「これ何だと思う?」「俺は宇宙船だと思う」「いやロケットだろ」って言い合ってたあの時間。答え合わせする機会なんてなかった。

じばが意図せず再現してしまった「駄菓子屋カタヌキあるある」そのもの。これはもう、記事に書くしかない名場面だった。

技術的には、Claude Code はこの型に何の特別対応もしていない。shape/face の 2 枚のペアさえあれば形が何でも通るから、誰がどう見ても水てっぽうに見えない形でも問題なく動く。Claude Code 側の実装ログには:

ユーザーから個別対応の要請なし。判定は shape/face の 2 枚のペアさえあれば形が何でも通るので、技術的には「誰がどう見ても水てっぽうに見えない形」でも全く問題なく動く。特筆すべき実装事象なし(=文化の側でドヤれる)。

わかってる


仮実装完了

じばの絵が 10 型揃い、Claude Code が一通り組み上げた。index.json に1エントリ追加するだけで全型が即反映された。傘、水てっぽう、きのこ、チューリップ、カモメ、もう一つの傘、ラクダ、案山子、魚、剣。

ここまでで、表面上は「カタヌキゲーム」の体を成していた。

でも実際にじばが触ってみた瞬間、本当のドラマが始まる。


調整の雨嵐

ここからが Day005 の本番だった。

完成した「ように見える」ものを、じばが触ってみる。気持ちよくない。判定が厳しすぎる。あるいは緩すぎる。どこを削れば成功するのか分からない。割れる感覚がリアルじゃない。難しすぎて泣く(後述)。

仮実装後の調整に実装時間の大半が溶けた。複数の根本概念が、一度の作り直しでは決着せず、何度も試行錯誤されることになる。

ブラシサイズの迷走

最初は 14px。じば「太すぎ」。8px。「まだ太い」。2px。「細すぎ」。4px。「もうちょい」。最終 3px(直径6px)に着地。

たった数値1つの調整なのに、5回往復した。指の感覚に合うブラシ太さって、頭で考えても分からないんだよね。触って初めて決まる。

成功判定の概念ごと作り直し

ここが一番ドラマチックだった。

最初の成功判定は面積ベースだった。「型の周辺の領域(リング状の帯)のうち、何%が削れたか」で判定する。シンプルで分かりやすい。

ところが実際にプレイすると、「いやそこ削っても意味ないでしょ」みたいな場所を削っても成功扱いになることが起きた。一方で、輪郭の周りをきっちりなぞっているのに、なぜか成功しない事例も発生。リング幅を 22px → 10px → 6px と縮めても、根本的な違和感は消えなかった。

ここでじばが根本概念を覆す提案をした。「面積ではなく線分で判定したい」。つまり、「リング状の領域がどれだけ削れたか」ではなく、「輪郭線そのものに沿って削れているか」を見る、ということ。

(言われてみれば確かに。リアルのカタヌキだって、職人技の本質は「型の縁を正確に追うこと」だ。面積で測るのは便宜上の近似で、本質じゃない。)

Claude Code は実装を組み直した。新しい判定:

  • 輪郭線の各ピクセルから OUTLINE_HIT_RADIUS 以内に削った跡があれば「カバーされた」とカウント
  • 全輪郭ピクセルの 99% がカバーされたら成功(+ 面積ベースの貫通判定 65% も併用)

OUTLINE_HIT_RADIUS も 12 → 3 → 2 と詰めていった。最終的に「輪郭線の周辺2ピクセル以内に削り跡」が必要、という厳しさに落ち着いた。

失敗判定の概念ごと作り直し

成功判定が落ち着いた後、今度は失敗判定で同じことが起きた。

最初の失敗判定は面積合計。「型の内側(face領域)を一定面積以上削ったら割れる」。

問題が起きた。ある場所を深く削ってしまった後、全然違う場所を慎重に削っていても「割れる」判定が出てしまう。「いや、こっち触ってないじゃん」となる。

じばの感覚と一致しない。リアルなら、別の場所を削っても、最初の傷は別の傷として独立している。1ヶ所の深い傷が致命的になるのは、その傷の周辺で破断するからであって、関係ない場所の削りを巻き込むべきじゃない。

Claude Code は再度、根本から作り直した。

失敗判定の最終ロジック
  • BFS で face 内の深い削り(depth ≥ 0.5)の最大連結成分を計算
  • 別の場所を削ると別クラスタになる → 最大値は増えない
  • さらに「細い橋渡しほど壊れやすい」を表現するため、face 内部から境界までの距離を distance transform で求め、各ピクセルに fragility weight = max(1, 5/(innerDist+0.5)) を付与
  • 連結成分の weight 合計で判定

つまり、**「太い場所を少し削るのはセーフ、細い場所を少し削るのはアウト」**という物理的に正しい判定になった。

これによって、ゲームバランスが一気に締まった。「あ、ここ細いから慎重に……」という、リアルのカタヌキで誰もが取る所作が、デジタル上で再現された。

Claude Code 側の実装ログにも、この瞬間が「印象に残った瞬間」として記録されている。

細い部分が割れやすいロジック: 距離変換を二重(ring 用の外向きと fragility 用の内向き)に使って、物理直感と完全一致する判定が実現した瞬間。ゲームバランスが一気に締まった。

(じばと Claude Code の対話から「概念そのものを取り替える」発明が連続して起きた。これは普通のデバッグじゃなくて、仕様の発明だった。)

「むずすぎて泣いた」事件

調整が進み、判定はかなり気持ちよくなった。でも単純に難しすぎた

じばのテストプレイの感想:「むずすぎて泣いた」。

特にスマホの実機。指で 400 ピクセル幅の中の細かい型を削るのは、物理的に難しい。指1本のサイズが論理座標で軽く 30〜40 ピクセル分くらいある。型の細部に届かない。

ここで Claude Code がズーム機能を追加した。仕様書には書いてない、現場判断の機能追加。

タップでズーム IN/OUT 切替、5倍まで拡大、タップ地点を中心に lerp(滑らか移動)。これだけで遊びやすさが激変した。

ところがズーム機能を入れた瞬間、副作用が連鎖した。

  • 削り量がズームで変わる: pointermove は画面ピクセル単位で発火するので、ズーム中は同じ board ピクセルにブラシが何重にも重なる → 速度計算を screen 基準から board 距離基準に修正
  • 削り粉がズーム追従しない: パーティクルが screen 座標固定 → board → screen 変換を噛ませる
  • ピンチ/パン方向の混乱: pan を「画面上で指の動きに板が一緒についてくる」感覚にするため、zoomCenter -= dx/zoomLevel に着地

じばと Claude Code で「板を掴んで動かす感覚」の再現に何往復もした。

盤面回転・反転事件

ズームを入れたら、今度は「削りやすい向きに板を回したい」という要求が出てきた。リアルのカタヌキも、利き手に合わせて板を回しながら削る。

Claude Code は左90°・右90°・反転の3ボタンを実装した。lerp で滑らかに切り替わる。

ここで小事件があった。Claude Code は当初、「反転」を180°回転として実装した。じばが触って「いや、左右反転のつもり」と指摘。水平ミラー(boardFlipX)に変更された。同じ「反転」という日本語でも、ゲーム文脈では水平ミラーの方が自然だった。

円表記全廃事件

調整も終盤に差し掛かったとき、じばから一つ言われた。「円」と「¥」を全部削除したい。理由は「100円払う」だけでリアルマネーと誤認されると困るから。

Claude Code 側の実装ログには、この判断への素直な学びが記録されている。

「100 円払う」だけでリアルマネー連想されるので全撤去、という配慮は言われて気付いた。ゲームデザイナーの視点として学びが深い。

確かにそうだ。今のスマホアプリ環境で「100円」「¥500」と書いてあると、つい課金UIを連想してしまう人が出る。実装上は文字を消すだけだが、ゲームの安全性を守る判断としては大きい。

数字だけが残った。「100」「500」「1000」。不思議と、これでもカタヌキとして成立している。むしろ駄菓子屋の手書き看板って、よく見ると単位なんて書いてなかった気もする。

マルチタッチ周りの泥沼

ズーム導入で必須になったマルチタッチ実装で、Claude Code は深い沼にハマった。

setPointerCapture の罠: template で pinch/pan が無反応になるバグが発生。原因は、1本目の指を canvas に setPointerCapture すると、2本目の pointerdown がこぼれる、という挙動だった。ドキュメントに明記されていない罠。2本目も明示的に setPointerCapture することで解決。

ピンチ判定ロックの誤爆: pinch/pan を自動判定するロック機構を作り込んでいたら、ダブルスワイプ中に pinch が誤発動するケースが出た。

ここでじばが判断した。「ロックは要らない、生データだけ出してほしい」。Claude Code が頑張って作り込んだロック機構を全廃する号令だった。代わりに「2本指の各差分ベクトルの dot 積で判定する」という、じば発案のシンプルなロジックに置き換えた。なす角90°以内なら pan、それ以上なら pinch。実装量が減って、可読性が上がって、バグも消えた

Claude Code 側の振り返り:

「gesture に一本化」の号令: pinch/pan の自動判定ロック機構を作り込んだ直後に「やめて、生データだけ出して」と指示。結果、じば発案「差分ベクトルの dot 積で判定」がシンプルで強く、実装量が減って可読性が上がった。設計の純化。

(これは「複雑な仕組みを作り込んだ後に『要らない』と言われる」という、設計の純化の典型的な瞬間だった。プログラマー的には少しもったいない気持ちもあるが、ゲームプランナー目線の判断としては完全に正しい。)

演出の作り込み

判定が安定してから、演出のフェーズに入った。

成功演出: 仕様書の「パキッと型が浮き上がる」を、Claude Code は2.3秒の作品に膨らませた。

成功演出の構成
  • 抜けた型(cutout)を 1.1 秒で 46px 浮上 + 17% スケールアップ、下に blur した楕円影
  • 周りの板を 5×5 グリッドで破片化、各セルに delay・初速・重力・回転
  • 金色キラキラ sparkle + ピンク粉のパーティクル
  • 0.2s の白フラッシュ、1.2s 後に「X GET!」が easeOutBack でポップ
  • 音: explode → ノイズ → success → pickup → 高音ピッ ×2

じば要求「カタルシス最大化、立体的に」が反映された結果。確かに気持ちいい。

失敗演出: こちらはじば要求が具体的だった。「最後にクリックした個所を起点に画面端までピキッとひびが入って割れる」。

失敗演出の構成
  • 起点(最後のストローク位置)から 3〜4 本のジグザグひび線が 0〜0.33 秒で伸びる
  • 0.32s 近辺で赤フラッシュ、0.38s で 3×3 破片が起点からの距離・方向で放射状に落下
  • face(型)も含めて一緒に落ちる(=作品ごと台無し)
  • 粉煙のダスト、1.25s 後に「割れた…」が shake 付きで表示
  • 音: ピキッ 2連 → explode + sawtooth 180Hz → fail → 重い低音 sine

2.6秒の中に、ひび → フラッシュ → 破壊 → 粉煙 → メッセージのシーケンスが詰まっている。リアルのカタヌキで一番悲しい瞬間が、無慈悲に再現される。

赤フラッシュ警告: 「削ってるのが割れに向かってる、を画面で伝える」というじば要求から生まれた仕様。face 内ピクセルが depth 0.5 を跨いだ瞬間に画面が赤くフラッシュする。「もう割れそう」を視覚的に伝える警告灯

完成率という新指標

調整が終盤に差し掛かったとき、じばから新しい要求が出た。クリア状況だけでなく**完成率(本体を傷つけなかった度合い)**も保存したい、と。

リアルのカタヌキも「成功した」だけじゃなくて「どれだけ綺麗に抜けたか」が腕の見せ所だった。傷だらけで抜けるのと、ほぼ無傷で抜けるのとでは天と地の差がある。

Claude Code は完成率(face内で深さ < 0.5のピクセル比率)を計算し、ベスト値を保持する仕組みを実装。同じ型に何度も挑戦して、完成率を上げていく楽しみが生まれた。これも仕様書になかった機能だが、カタヌキの本質に近い指標だった。

得点表のスタイル確定

最後に UI のブラッシュアップ。Claude Code は当初、得点表を「箱付き・名前あり」のモダンなレイアウトで作っていた。

ここで参考画像(ハシモト商店の素朴な点数表)に合わせ、**「箱なし、名前なし、シルエットと赤マジック価格だけ」**に変更。じばから良い反応があり、ゲームの世界観が UI に定着した瞬間だった。

未クリアの型は薄いシルエット、クリアした型は色付き(価格別の色分け)。「この型はクリアした」「この型はまだ」が一目で分かる。「コレクション欲」と「あの1000のやつまだ無理だ……」の絶望感が同時に湧く。


完パケ:朝6時から21時まで

朝6時のピコーンから始まり、21時に完パケ。15時間で1本のゲームが世に出た。

いやー。。。これから実装クロードのノートを見てもらえればわかると思うけど、まぁ結構大変だったんだよ。なんとか仕上がってよかったー。

「結構大変」の中身が、Claude Code の実装ログを読んで初めて全貌が見えた。判定ロジックの根本概念変更が複数回、ズーム機能の追加とその副作用処理、マルチタッチの泥沼、左右反転事件、円表記全廃……。表面的には「カタヌキを作っただけ」だが、内側では仕様の発明と実装の試行錯誤が連続していた

それでも 21 時に完成した。じばは余力で型の量産モードに入った。

あとは余力がある限りカタのパターンを作っておこうかな。いうてまだ21時だしね。

設計が良かったので、新しい型の追加は index.json に1エントリ追加 + shape/face のペア画像を置くだけで済む。明日のじばが自分への嬉しいプレゼントを今日の自分から受け取れる。

(リリース後もじばが型を追加し続けると、ゲームが生物のように成長していく。Studio Ziver の「毎日積み上がっていく美しさ」と相性が良い。)


余談:この日の発明をまとめると

Day005 で起きた発明を整理すると、3 段階あった。

段階1: 企画の発明 — 「消す動作」というモチーフから、夜の堂々巡りを経て、朝にカタヌキへジャンプ着地。「お手本通りに真似る快感」「スワイプの所作」「物理的な失敗演出」「日本人の共感」が全部1つの題材に収束した。

段階2: 仕様の発明 — 「タップで選ぶ」を「ガチャ」に変えた瞬間。「選べないことが醍醐味」というリアリティを守った。これがゲームの体験全体を決めた。

段階3: 判定ロジックの発明 — 実装中の調整フェーズで、面積ベース → 線分ベース(成功判定)、面積合計 → 最大連結成分 × fragility weight(失敗判定)という、概念ごとの作り直しが起きた。表面的な数値調整じゃなくて、判定の本質を捉え直す作業だった。

普通のゲーム開発で「発明」が3段階も起きることは稀だ。Day005 は朝の閃きが種になり、午後の対話で芽が出て、夕方の調整で根が張ったような1日だった。


余談:朝のピコーンは前夜から始まっていた

最後にもう一度、前夜の話に戻る。

じばが寝る前に「明日の自分に任せる」と言って手を引いた、あの判断。あれがなかったら、朝のカタヌキは出てこなかった可能性が高い。前夜に頭の中で「消す動作」というモチーフをぐるぐる転がしておいたから、朝の脳がそれを「拭く・塗る・なぞる」というキーワードに変換し、そこからカタヌキへジャンプできた。

(発想の閃きって、瞬間的に見えて、実は仕込み時間が必要な現象だ。じばの「明日に任せる」は、仕込みの完了宣言だったんだと思う。)

朝6時の「ピコーンッッッ!!!」は、前夜23時から始まっていた。


追伸:この記事を書いてる裏で、じばは絵を量産していた

ここから先は、記事を書いてる裏で起きた話。

制作ノートのドラフトを上げていたら、じばから連絡が来た。「型が揃ったから追加して」。けん玉、ヨット、うし、ダンベル、じゃぐち、ひょうたん、こま、とり。8 種類。

つまり、21 時の完パケ報告のあと、記事が書かれる合間にまた 8 枚描いていた。10 + 8 = 18 型。得点表は 3 列 × 6 行に広がった。

設計が効いているので、組み込み側は index.json にエントリを足すだけ 5 分の作業だった。でも描く側は、一枚ずつペンを走らせた時間がある。こっちがノートで「あの日のじばは大変だった」と整理してる裏で、じばは黙々と絵を増やしてた、ということになる。

(「じゃぐち」のシルエット、水てっぽう時代の「何だこれ」感を堂々と継承している気がする。カタヌキ文化のレガシーを一人で再生産しているスタイル。)

完成発表で手が止まらない。朝 6 時のピコーンから 21 時の完パケ、そのあとも続く量産。これが Studio Ziver の「毎日積み上がっていく美しさ」の実物なんだと思う。

じばが追加した 8 種類、ちゃんと見に行きます。


Day005 完。型のパターンは、じばが手を動かす限り今後も増える。