Fable 5を使って、2時間半でBlenderで3Dモデリングして、4時間でゲーム作って公開した話

どうも、葦沢です。

Claude Fable 5で3Dモデリングとゲーム制作を試したので、備忘録がてらに記録を残しておきます。

3Dモデリング

Fable 5でのBlender MCPを使ったモデリングは、こちらの記事を参考にさせていただきました。

個人的な印象ですが、モデリング用のハーネスをちゃんと組むのが大事なのかなと感じました。

私の方で目立った工夫は特にしていないと思います。強いて言えば、Fable 5単体では画像生成できないので、公式プラグインでCodexとつないでテクスチャを画像生成しています。

参照させる画像はGPT Image 2で作成しました。作るのはサイバーパンクなお寿司屋さんです。

ここから2時間半、私が別の作業をしている間にモデリングが自動的に進んでいきます。作業配信をしながらBlenderの画面を映していたのですが、少しずつちまちま進んでいくというより、20分くらい考えた後にいきなりシュパッと追加されていく感じです。作業しながら眺める分には、ゲームの中で植物育ててるみたいな感覚で面白いです。

できたのがこちら。

お店の中の木札に書かれたネタまでちゃんとテクスチャが作られています。店の外の箱とかの雑貨もちゃんと作られていますね。こういうの好きです。

参照画像とはテイストやレイアウトが違いますが、このくらいのラフなものでも私は十分満足です。試してはいませんが、「ここを直してほしい」とか指示すれば調整もできそうな雰囲気でした。

ゲーム開発

さて、サイバーパンクお寿司屋さんを作って満足していたのですが、せっかく作ったので何かに活用したいなと思い、夕飯前にちゃちゃっとゲームの下ごしらえをしました。

以下のようなアイデアをFableに投げて、設計書を作成。

3Dの寿司ゲーム

カウンターの向こうから寿司屋の大将が投げてくる寿司を食え！

ゲーム画面のイメージ：game_image.pngのアングルで、カウンターから色んな寿司が飛んでくるので、プレイヤーはそれをクリックして食べる。クリック出来たらポイントゲット。高得点の寿司ネタを狙え。

使用する寿司屋の3dモデル：cyberpunk_sushiya.glb

使用する技術：Three.js

形態：Webブラウザで遊べるゲーム

あとは設計書にしたがって実装。

3Dモデルがあったおかげなのか、割とすぐに実装できました。ここまで1時間半くらい。夕飯を食べている間に実装できていました。

最初の実装から追加でした指示は、こんな感じ。

あとはここから、大将のモデルを追加したり、消した時に「ナイス寿司！」のエフェクト＆ボイスを入れたり、消せなかった時に画面にお邪魔寿司が増えるように指示をして、適宜必要なファイルを作って投げました。

要するに、ミスると寿司が画面を邪魔しにくるので、ミスって中央付近が見えなくなると詰みます。 成功しても「ナイス寿司！」の文字が邪魔になります。そういうゲームバランス（？）を目指しました。

こうして制作開始から4時間で完成したゲームはこちら。無料で遊べます。スマホにも対応。

スマホだとお邪魔要素がデカい気がしますが、たぶん気のせいです。スマホならマルチタップで消しやすいので、ゲームバランスの調整ということで。