Handoff VSCode 拡張 v0.12 から v0.14 までのアップデートをお知らせします。要件トレーサビリティの可視化が今回の主題です。

背景：データはある、でも全体像が見えない

handoff-mcp v0.36–0.42 で、要件・設計・テストの対応関係を Markdown 上で追跡する V-model トレーサビリティが入りました。コマンドラインや MCP ツールで「この要件のカバレッジは？」「変更の影響範囲は？」と聞けば JSON で答えが返ってきます。

ただ、要件が数十〜数百になると JSON を眺めていても全体像はつかめません。どこが手薄で、どこに suspect（上流変更で疑わしくなった項目）が溜まっているのか——こういう判断にはビジュアルが要ります。v0.12–0.14 の3バージョンは、そのための UI を作りました。

画面構成の刷新 (v0.12)

v0.12 で WebView を全面的に作り直し、5つのセクションに再編しました。

セクション	役割
Home	プロジェクト全体の KPI とアクティビティ
Work	タスク管理、ガントチャート、メトリクス
Specs	V-model マップ、要件テーブル、ドキュメント
Plan	計画書の管理と要件カバレッジ
Sessions	AI セッションの履歴と状態

これまではダッシュボードに機能を足していく形でしたが、V-model 関連の画面が増えたことで整理が必要になりました。各セクションに専用の画面を持たせ、右側に Inspector パネル、下部にコンテキスト情報パネルを配置しています。

パフォーマンスも見直しました。データ変更時にインクリメンタルリロードする仕組みと、Web Worker による非同期処理を導入しています。要件が多いプロジェクトでも画面がもたつきません。

V-model マップとトレースマトリクス (v0.12)

V-model マップは、要件→設計→テストの対応関係をノードとエッジで描くビューです。各ノードの検証状態が色で分かり、suspect の項目はハイライトされます。カバレッジトレンドチャートで推移も追えます。

トレースマトリクスは、左軸に要件、上軸にテスト項目を並べたマトリクス形式の表示です。セルの色で pass / fail / not run が分かるので、「どの要件にテストが足りていないか」が一覧できます。

以前あった 2D/3D グラフはこの2つに置き換えて廃止しました。

要件の一覧と操作 (v0.12–v0.13)

Requirements Explorer はサイドバーのツリービューで、カテゴリ・優先度・開発ステージ別にグループ化して要件を表示します。v0.13 でインライン操作が追加され、ツリー上から直接ステージ変更、タスク作成、ドキュメントへのジャンプ、stable ID の一括付与ができるようになりました。

WebView 側の要件テーブルでは、KPI サマリー（合計・実装済み・テスト済み・検証済み・P0 未着手）をヘッダに表示。P0 で未着手の項目があればアラートバナーが出ます。各行を展開するとコード参照・テスト参照・リンクされたタスクの詳細が見られます。

検証キャンペーンとレポート (v0.13)

handoff-mcp の検証キャンペーン（テスト実行をまとめて管理する仕組み）を VSCode 上で操作できるようになりました。チェック結果の記録、スクリーンショットやファイルパスのエビデンス添付が GUI から行えます。

Report Explorer でレポートの一覧と承認ワークフロー（draft → submitted → approved）を管理。テンプレートの編集と HTML エクスポートにも対応しました。

計画書との連携 (v0.13)

Plan セクションで計画書ドキュメントを専用画面から管理できます。各プランの要件カバレッジがバーで表示され、ステータスバーに suspect バッジが出るので、計画のどの部分に変更の影響が出ているかすぐに分かります。

ガントチャートにもプランフィルタとベースライン比較バーが追加され、計画時点と現在の差分が視覚的に確認できます。

Requirement Mindmap (v0.14)

v0.14 の目玉機能です。要件のツリー構造（handoff-mcp v0.41 で入った parent / kind / decision / select）を、インタラクティブな2D マインドマップとして描画します。

2つのレイアウト — 通常のツリーと放射状（ラジアル）。d3-hierarchy でレイアウト計算
ノードの形で種別が分かる — leaf（丸）、group（四角）、decision（ひし形）、select（六角形）。検証状態はリングの色で表現
ズームに応じた4段階表示 — 遠くから見るとノードの点だけ、近づくとタイトル→詳細→全属性と段階的に情報が出る
SVG + Canvas の自動切り替え — 小規模は SVG、大規模は Canvas に自動で切り替えて描画性能を確保
キーボード操作、右クリックメニュー、フィルタ、凡例、高コントラストテーマに対応

数百の要件がある場合でも、ズームアウトで全体の構造を俯瞰してからドリルダウンする使い方ができます。

変更一覧

v0.12.0 (2026-10-07)

5セクションシェル — Home / Work / Specs / Plan / Sessions に画面再編
V-model マップ — 要件→設計→テストのノード＆エッジ表示
トレースマトリクス — 要件×テスト項目のマトリクス
Inspector / 底部パネル — 選択項目の詳細表示
カバレッジトレンドチャート — 検証カバレッジの推移
suspect / stale 表示 — 上流変更による疑わしい項目のハイライト
diagnostics UI — 問題項目の診断
Requirements view — KPI、アラート、要件テーブル
Requirements Explorer — サイドバーツリー
パフォーマンス改善 — インクリメンタルリロード、Web Worker

v0.13.0 (2026-10-15)

Requirements Explorer 拡張 — インライン操作（ステージ変更、タスク作成、ドキュメント表示）
Plan セクション — 計画書管理、カバレッジバー、suspect バッジ
Project Status Dashboard — プロジェクト全体の俯瞰
Verification Campaign UI — チェック記録、エビデンス添付
Report Explorer — レポート管理と承認ワークフロー
テンプレート編集 + HTML エクスポート
Gantt 拡張 — プランフィルタ、ベースライン比較、suspect ハイライト

v0.14.0 (2026-10-18)

Requirement Mindmap — ツリー/放射状レイアウト、4段階 LOD、SVG + Canvas 自動切り替え
ノード形状 — leaf / group / decision / select を形で区別
検証状態リング — 各ノードの pass / fail / not run を色で表現
操作 — フィルタ、凡例、右クリックメニュー、キーボード操作、高コントラストテーマ

インストール・アップデート

VS Code の拡張機能マーケットプレイスで「Handoff」を検索するか、以下のリンクからインストールできます。

Handoff MCP Dashboard — VS Code Marketplace