3
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

AI × MCPで「チケット番号1回入力で開発が走る仕組み」を作った話 Backlog MCP × Figma MCP(現状共有編)

Posted at

1. はじめに

私は普段 フロントエンドの開発をしているのですが、

  • 課題を読む
  • ブランチを切る
  • デザインを探す
  • PR の下書きを作る

この“開発前の儀式”に、毎回それなりの時間と集中力を使っていました。

そこで、

チケット番号を1回入力するだけで、開発の初動が自動で整う仕組み

を作って運用しています。

本稿ではその中でも、

  • codex CLI で最適化する前の構成
  • Claude code を前提に作って、そのまま運用している状態

をまとめています。

次回は codex CLI での最適化について扱う予定です。


2. 仕組みの全体像

この仕組みのベースは MCP です。

  • Backlog MCP
    → 課題情報を取得
  • Figma MCP
    → デザイン情報を取得

チャットにスラッシュコマンドを入力すると、

  • 課題の取得
  • 要約とタスク分解の生成
  • 作業手順の提示
  • PR の下書き生成

といった流れを、プロンプト駆動で進められます。


3. 実際の運用フロー

ここからは、私が普段どのように使っているかをベースに、実際の流れを紹介します。

  1. チケット番号を入力する
  2. MCP が課題情報を取得する
  3. AI が内容を整理して提示する
  4. 作業の段取りが表示される
  5. 必要に応じて Figma 情報を取得
  6. そのまま PR 下書きまで生成

イメージとしては、

チケット番号を渡すと「今日やる作業の地図」が自動で出てくる

という感覚に近いです。


4. どんなプロンプトを使っているか

役割ベースで見ると次のようなものがあります。

  • dev-issue / dev-backlog
    課題取得 → 要約 → 実装計画 → 作業案内 → PR 草案
  • worktree-management
    create / create-pr / remove / list
  • commit
    コミットメッセージ生成・命名規約ガイド
  • test-runner
    lint / unit / e2e / all
  • pr-workflow / pr-review-fix
    PR 作成とレビュー対応
  • figma-extract / style-apply
    デザイン確認やトークン適用の補助

5. 擬似プロンプト(構成イメージ)

実プロンプト全文ではありませんが、雰囲気はこのような形です。

dev-issue のイメージ

  • チケットIDを渡す
  • Backlog MCP で本文取得
  • 要約・実装方針・受け入れ条件を生成
  • worktree / ブランチ作成手順を提示
  • Figma 情報を取得して参照リンクを提示
  • テスト方針やコミット方針を提示
  • PR 下書きを生成

プロンプト自体は、すべて日本語で「作業手順書」に近い文体で書いています。


6. 実際の使い心地

実際に運用してみて感じているのは、

  • 次に何をやればいいかまで出てくる安心感
  • worktree やブランチ作成で迷わなくなる
  • デザインリンクを探しに行かなくてよくなる
  • PR 草案が最初から用意される

結果として、

何から始めるかで悩む時間がほぼゼロになる

という体験に近いです。


7. 実際の内部構成(いまの正直な姿)

現在は、

すべて .codex/prompts 配下にまとまっている

という構成です。

  • 役割ごとに md ファイルは分けている
  • ただし共通処理は重複して存在
  • 増築を繰り返して徐々に大きくなった

という“運用しながら育ってきた構成”になっています。


8. 現状運用で見えている課題


8-1. Claude code 前提の設計をそのまま持ち込んでいる問題

当初の設計は Claude code 前提で作っていました。

Claude code では

  • プロンプトの中から
  • 別のスラッシュコマンドを
  • 入れ子でどんどん呼び出す

という前提で設計していました。

その前提のまま codex CLI に強引に移行した結果、

  • プロンプト側は「入れ子でコマンド呼ぶ想定」なのに
  • 実行環境側がそれに追いついていない

というズレが発生し、

実際には /commit /test などをそのまま呼べず
「.codex/prompts の md を見てください」と案内する

という“使いにくい状態”が生まれています。


8-2. プロンプト巨大化問題

  • 共通処理を複数 md にコピペ
  • 修正時に複数箇所を手作業で直す
  • さらにファイルが太くなる

という、巨大プロンプトあるある状態になっています。


9. ここからやりたいこと(次回予告)

今後は次の方向で改善していく予定です。

  • codex CLI への最適化
  • commands.json による正式コマンド定義
  • skills への共通処理切り出し
  • プロンプトの分割とテンプレ化

特に、

  • Claude code 前提の設計からの脱却
  • 入れ子コマンドの扱いの整理
  • 巨大 md の保守負荷の軽減

をテーマに、次回まとめる予定です。


この記事は第1回です。
次回は codex CLI 最適化編を紹介します。

3
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?