AI Vibe Game 2026.06.14

Gravity Ink Maze

Claude と遊びの芯を相談し、Image Gen でビジュアル方向を作り、Codex で Matter.js ベースの物理ゲームとして実装した実験作です。

Gravity Ink Maze screenshot

見どころ

  • マウス/タッチで描いたインクがそのまま物理地形になる
  • ブラシ、消しゴム、インク残量、ステージ解放まで動く
  • ネオン実験室風のUIを、静止画ではなく遊べる画面として再構成

作り方

  1. 01 Codex App の Product Design Plugin を活用し、プロダクトの方向性、画面構成、遊べるプロトタイプの組み立て方を整理。
  2. 02 Claude と相談しながら、短時間で遊びの芯が伝わるゲーム案を決定。
  3. 03 Image Gen で Luminous Nocturne 方向のUIモックと暗いラボ背景を生成。
  4. 04 Codex で React / Canvas / Matter.js を使い、描いたインクが物理地形になるゲームとして実装。
  5. 05 Playwright でデスクトップ、モバイル、主要操作を確認し、デザインQAを通過。