GitHubでログイン
JA

Claude CodeのJumPHPパネル

Claudeがゲームを書いている間、何をしているかを見られます。会話の隣のパネルに、実行中のテスト、Claudeが見ているゲーム画面が表示され、途中で介入することもできます。Claude Codeのmodであるjumphp-liveで、JumPHPに付属しています。

インストールする

Claude Code（ターミナル内）で、次のように入力します。

/plugin install jumphp-live --marketplace davidnurdin/jumPhp

yと答えてソースを追加し、次にスコープを選びます（「user」：すべてのプロジェクトで使えます）。シェルからなら：claude plugin install jumphp-live --marketplace davidnurdin/jumPhp。

使う

JumPHPプロジェクト（bin/jumphpがあるフォルダ）でClaude Codeを起動し、/jumphp <ゲーム>と入力します。たとえば/jumphp pong。パネルが右側に開きます（ウィンドウの幅が110桁以上必要です）。Claudeが初めてbin/jumphp testやbin/jumphp shotを実行したときにも、自動的に開きます。

表示される内容：

  • リアルタイムの検証：Claudeがbin/jumphp testを実行すると、出力がパネルに流れ、各ステップに順番にチェックが付きます：✔ php -l ✔ phpstan … phpunit smoke test。最後には、PHPUnitの要約と失敗したもの（失敗したテスト、PHPの警告とエラー）が表示されます。
  • リアルタイムのゲーム画面（● live）：bin/jumphp test（そのスモークテスト）やbin/jumphp shotがゲームを動かしている間、パネルにフレームごとのゲーム画面が表示されます（エンジンがvar/live/frame.pngを書き換えます。オプションJUMPHP_LIVE）。ウィンドウなしの実行はリアルタイムより速いので、JUMPHP_REALTIME=1でゲーム本来の速度に落とせます。このオプションが入る前に作ったプロジェクトは、git pull jumphp mainで取り込めます（元のJumPHPリポジトリはjumphpという名前で保持されています）。
  • 目の前で動くゲームテスト：ゲームをプレイするテストは、実行中に表示されます（⏳、そのあと✔ / ✘）。ライブ画面の上には、実行中のテストの名前が出ます。そのあとテストをクリックすると、最後のフレームが見られます。🐢 Game speed / ⏩ Fastボタン（r）で速度を選べます：ゲームの速度（初期設定。パドルが動くのが見えます）か、できるだけ速くか。
  • 画面：bin/jumphp shotやsiteshotが撮ったばかりのスクリーンショットや、Claudeがゲームを見るために開いた画像が、パネルに表示されます。
  • どのターミナルでも画像が見られる：初期設定では、小さな色ブロックで描画されます（▦ Blocks）。True Colorに対応したターミナル（GNOME Terminal、Konsole、Windows Terminal、VS Codeなど）ならどれでも表示できます。そのために、エンジンは各PNGの隣に小さな生データのコピー（.rgb）を書き出します。kitty、Ghostty、iTerm2では、パネルがPNGそのものを表示します（🖼 HD）。pキーで切り替えます。🖼 Openボタン（o）は、表示中の画像を、デスクトップの画像ビューアー（xdg-open、macOSではopen）で等倍で開きます。
  • playground：ClaudeがMCPサーバーを使っているときの、サイトのPHPUnitテスト（run_tests、get_test_run）と公開（sync_project）の結果。

できること：

  • ▶ Tests（tキー）と**📸 Shot**（s）：Claudeを介さずに、すぐにテストやスクリーンショットを実行します。出力はパネルに流れます。
  • 🛠 Ask Claude to fix（f）：失敗したあとに使います。Claudeは失敗した内容を受け取り、修正します。
  • Tell Claude：Claudeに書き込める欄です（「もっと高くジャンプさせて」「ボスが難しすぎる」）。Claudeは、いまのステップを終えるとすぐに読みます。

Claudeの作業を追跡するしくみ

Claudeが実行するBashコマンドのうち、bin/jumphp test、shot、siteshot、webshotを起動するものは、そのまま実行され、出力はパネルが追跡する一時ファイルにもコピーされます（{ export JUMPHP_LIVE=1; コマンド } 2>&1 | tee …。終了コードは保持されます）。ほかのコマンドには手を加えません。何も外部には送信されません。