前回、Claude と Gemini と5日間対話して、ブラウザ完結のボクセルエディタ「VoxoB」を作りました。
今回はその続編です。「作る」ではなく「直す・育てる」 を、Claude Code にほぼ丸投げしました。
本音
前回の記事で「出力されたコードは一流」と書きました。
一流のコードでも、呼ばれていない関数は働きません。それを今回知りました。
🧭 今回のスタンス:作った人ほど自分のアプリが見えていない
自分で作ったアプリは、自分の使い方でしか触りません。
PCで、いつもの手順で、いつものボタンを押す。だから壊れているところに気づけません。
そこで Claude Code には、最初にこう投げました。
https://github.com/ikemfr/voxob_webapp の改良、https://voxob.vercel.app/ で私が公開済み
これだけです。
本音
改良の中身は何も言っていません。
丸投げにもほどがある。
Claude Code はまずリポジトリを手元に持ってきて、PCとスマホの両方の幅で開き、こう聞き返してきました。
- スマホの操作性
- 初見の分かりやすさ
- 不具合・性能の総点検
- 拡散・検索対策
どれを優先するか、です。
全部選びました。
本音
選択肢を出されたら全部選ぶタイプです。
定食屋でも全部乗せにします。
🔍 プロセス1:まず「全部押す」
Claude Code が最初にやったのは、機能追加ではなく全ボタンの自動実行でした。
ブラウザのコンソールから、全機能を順番に呼んでいきます。
| 対象 | 数 | 結果 |
|---|---|---|
| ワンクリック生成 | 39種 | エラー 0 |
| アニメ生成 | 26種 | エラー 0 |
| 変形アクション | 16種 | エラー 0 |
| 書き出し(OBJ/MTL/STL/GLB/JSON/PNG) | 6ファイル | エラー 0 |
「エラーなし、優秀!」……で終わらないのが今回のハイライトです。
見つかったもの(エラーにならないバグたち)
1. 自動保存されていなかった
autoSave() という関数は、ちゃんと存在していました。
呼ばれているのは Ctrl+S を押したときだけ でした。
つまり、ページを再読み込みすると作品が消えます。
README には「作品はブラウザに保存」と書いてありました。
本音
書いたのは私です。
正確には、書かせたのは私です。
2. 生成を「元に戻す」と、元の作品が戻らない
生成ボタンは、まず今の作品を全部消してから新しい形を置きます。
その「全部消した」が取り消しの履歴に入っていませんでした。
Ctrl+Z を押すと、生成した形が消えて 空っぽ になります。
3. スマホで2本指操作をすると、勝手にブロックが置かれる
1本目の指が触れた瞬間に「置く」が発動していました。
2本目の指が来るころには、もう置かれています。
回転しようとするたびに、ブロックがひとつ増えます。
4. アニメ生成を続けて試すと、元の形が壊れていく
「積み上げ」の後に別のアニメを試すと、空のフレームを元に アニメを作っていました。
5. 言語設定を保存しているのに、読み込んでいなかった
書く処理はあるのに、読む処理がありません。
本音
5つとも、私の使い方では一度も踏んでいません。
PCでしか触らない、生成は一発で満足、再読み込みしない。
作った人ほど、バグを避けて歩いています。
🛠 プロセス2:直し方の哲学
Claude Code の直し方に、いくつか一貫したルールがありました。
① IDと関数名を変えない
VoxoB は 1ファイル・3,500行 の HTML です。
全部を書き直すのではなく、既存の関数を 外側から包む 方式で直していました。
// 生成の前に、消える作品を取り消し履歴に積む
const _gen = gen;
gen = function (id) {
const before = /* 今あるボクセルを全部記録 */;
_gen(id);
// 最新の取り消し手順の先頭に「消した分」を差し込む
};
onclick="gen(...)" のような既存の呼び出しは、一切書き換えていません。
② 「完了」は証拠で言う
修正のたびに、ブラウザで同じ操作を再現して数字で確認していました。
- 生成 → Ctrl+Z → 生成前のボクセル数に戻ったか
- 生成 → 1.2秒待つ → 再読み込み → 同じ数(63個)が残っているか
- 2本指のタッチを合成して、ボクセル数が増えていないか
本音
人間の「直しました!」より信用できます。
私の「直しました!」は、だいたい直っていません。
③ 言われていない「良さそうなこと」は、聞いてからやる
使い方ページの FAQ に、Claude Code は最初「作ったものは商用で使えます」と書きかけて、自分で消していました。
理由は「利用条件を決めるのは作者だから」。
本音
ちゃんとしてる。
私より私のアプリの権利に慎重です。
✨ プロセス3:目玉機能「次の一手」
改良の第2弾で頼んだのが、これです。
既存機能のボリュームアップ、UI向上、次の一手機能、あとあったらいい目玉機能を実装
「次の一手」は、ボタンを押すと 今の作品に合う工程をひとつ足す 機能です。
初版:ワンパターン
最初の版は「地面 → 屋根 → 窓 → 木 → 陰影 → 角」を順番に足すだけでした。
6回押すと「今の提案はここまで」で終わります。
そこで私は言いました。
次の一手機能がワンパターンなの修正、何かは提案し続けろ、
色を変化させたり、動きを追加したり、ブロックを理論に基づき追加したり...
本音
「何かは提案し続けろ」。
上司に言われたら転職を考えるやつです。
改良版:3種類を順番に回す
今の「次の一手」は、次の3種類を ブロック → 色 → ブロック → 動き の順に回します。
| 種類 | 例 | 一言の理由(画面に出る) |
|---|---|---|
| ブロック | 扉・小道・柵・花・石・灯り・旗・雲・左右対称 | 誘導線、奇数の法則、焦点、奥行き、対称性 |
| 色 | 差し色・上へ明るく・色相をそろえる・夕方の光・季節 | 補色、配色の 60・30・10、暖色と寒色 |
| 動き | 回転・弾む・呼吸・揺れ・波・公転 | ターンテーブル、重さの表現 |
- その中から、今の形に合うものだけ をランダムに選びます。
- 直近4回と同じ提案は出しません。
- 家の見本で20回押したところ、14種類の提案が出ました。
本音
押すたびに「花は3つか5つか7つで置くと自然です(奇数の法則)」とか言ってきます。
ボクセルエディタに美術の授業をされています。
でも実際、ちょっと良くなるのが悔しい。
ボツになったもの
最初、目玉機能として MagicaVoxel 形式(.vox)の入出力 も実装されていました。
途中で私が言いました。
MagicaVoxel形式の入出力やめて
すぐ消えました。
本音
AI は「あったら喜ばれそうなもの」を全力で作ってきます。
要らないものは、作った直後でも遠慮なく「やめて」と言うのが正解でした。
罪悪感はありません。相手は気にしていないので。
🎨 プロセス4:UI全改修(人間工学に基づけ、と言ってみた)
UI全改修リニューアル(より操作しやすく、配置もUX理論やプラクティス、人間工学に基づけ)
本音
「人間工学に基づけ」。
言っている本人が、人間工学をよく分かっていません。
返ってきた改修方針は、だいたいこうでした。
- 右パネル:縦に約2,800px続く1本のスクロールを、「作る・色・動き・編集・ファイル」の5タブに分ける(選択肢を減らすほど迷わない)
- ヘッダー:左に「戻す・やり直し・次の一手」、右に「書き出し」。設定類は ⚙ メニューにまとめる
- ボタンの大きさ:PCは約34px、スマホは44px以上(指で押せる大きさ)
- スマホ:親指が届く画面下に操作バー。パネルは下から半分だけ出して、作品が見えたまま操作できる
そして私の次のダメ出しがこれです。
エクスポートボタンが色的にチカチカしてアウト、目に優しい配色などにせよ
真っ青に塗りつぶしたボタンが、薄い色付きの落ち着いたボタンになりました。
本音
「主な操作を1つだけ強調する」理論で真っ青にされ、
「チカチカする」で地味にされました。
理論は人間の目に負けました。
💸 現実:週間使用量の壁
前回の記事では、5日目に Claude の上限に到達して Gemini に乗り換えました。
今回も来ました。
週刊使用料の上限に満たないように最低限の仕事をせよ
本音
「週刊」は誤字です。
毎週発売される使用料ではありません。
テキトーに誤字してもお構いなく進みます
知能が溶けるね...
Claude Code はこの一言で、残りの作業を「コードの3件だけ直して push、記事と動画は保留」に切り替えました。
- 「最低限」と言われたら、ちゃんと最低限にする
- やらなかったことは、やらなかったと報告する
ここが地味に一番助かりました。
🔭 今後
まだ手を付けていない、正直な残りです。
- 重さ:今はブロック1個ごとに描画しているので、64×64×64 のような大きいサイズで重くなる可能性があります。描画方式の変更は大工事なので、別ブランチで進める予定です。
- スマホ実機での確認:画面幅を切り替えた確認しかしていません。
- 「次の一手」の育成:提案の種類を増やす予定です。
本音
「今後」と書くと、やる気があるように見えます。
実際は、使用量が回復してから考えます。
まとめ
- 作った人は、自分のアプリのバグを避けて歩いている。全部押させるとすぐ見つかる。
- 一流のコードでも、呼ばれていない関数は働かない(
autoSaveは Ctrl+S 専用だった)。 - AI の「良かれと思って」は、要らなければすぐ「やめて」でいい。
- 「次の一手」は押し続けられる。人間の改良も、たぶん押し続けるしかない。
VoxoB はブラウザだけで動きます。登録も不要です。
本音
もう全部あいつ(Claude Code)一人でいいんじゃないかな
