Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
C4モデル×LLM~アーキテクチャ図を”共通言語”とする
Search
福永健悟
May 26, 2026
70
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
C4モデル×LLM~アーキテクチャ図を”共通言語”とする
福永健悟
May 26, 2026
Featured
See All Featured
Kristin Tynski - Automating Marketing Tasks With AI
techseoconnect
PRO
0
280
The #1 spot is gone: here's how to win anyway
tamaranovitovic
3
1.1k
The SEO Collaboration Effect
kristinabergwall1
1
500
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
35
2.5k
Intergalactic Javascript Robots from Outer Space
tanoku
273
27k
So, you think you're a good person
axbom
PRO
2
2.1k
Why Our Code Smells
bkeepers
PRO
340
58k
Odyssey Design
rkendrick25
PRO
2
710
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.8k
More Than Pixels: Becoming A User Experience Designer
marktimemedia
3
460
Amusing Abliteration
ianozsvald
1
210
Tell your own story through comics
letsgokoyo
1
980
Transcript
C4 モデル × LLM アーキテクチャ図を " 共通言語" にする 福永健悟 /
ユニークビジョン株式会社 2026/5/25
アーキテクチャ図、こんな課題ありませんか? フォーマットがバ ラバラ PowerPoint 、Google ス ライド、draw.io… ツールが異なり、編集で きる人が限られる 粒度がバラバラ
シンプルな図と詳細な図 が混在 「どこまで書くか」の基 準がない 図が巨大化 システム連携が増えると 1 枚に詰め込み 読めなくなる これらの課題を解決するアプローチが C4 モデル “ “ 2
C4 モデルとは アーキテクチャを 4 つの階層 で表現し、抽象 度・粒度を統一する技法 コンテキスト図 ― システム全体の位置づけ
コンテナ図 ― 内部の構成要素 コンポーネント図 ― モジュール構成 コード図 ― クラス・関数レベル サポート図: システムランドスケープ図 / ダイナミック図 / デプロイメント図 3
各図の役割(上位層) システムランドスケープ図 コンテキスト図 4
各図の役割(下位層) ― コンテナ図 システム内部の構成要素を詳細 化 アプリケーション、データス トア、外部サービスとの接続 を描く デプロイ環境に依存する要素 は含めない
開発者が日常的に参照する中 心的な図 5
各図の役割(下位層) ― デプロイメント図 実際のインフラ構成を表現 CloudFront 、VPC 、ECS 、 RDS 等のAWS
リソースを配 置 本番・開発など環境ごとに作 成 コンテナ図の要素がどこにデ プロイされるかを示す 6
C4 モデルのメリット 抽象度・粒度が揃 う 4 階層で 「どこまで描く か」の判断基準が明確 に なる
コードとして管理 PlantUML 等で記述し、 Git で差分レビュー が可 能 AI 相性が良い テキストベースなので LLM で生成・編集が容易 どの図をメンテナンスすべきか 推奨 場合による 非推奨 システムランドスケープ図 コンポーネント図(自動生成を検 討) コード図(エディタ機能で代替) コンテキスト図 / コンテナ 図 ダイナミック図(ワンショットで作 成) デプロイメント図 7
LLM 時代のアーキテクチャ図
LLM 時代に起きていること バイブコーディングの台頭 LLM に自然言語で要件を伝えるだけで「とりあえず動くもの」が手に入る時代 「コードを全部読ませればいい」の限界 コーディングエージェントはリポジトリ構造を把握してコードを生成する しかしコードから読み取れるのは 「今どうなっているか」 だけ
「なぜそう設計したか」 「今後どう発展させたいか」 は分からない コンテキストウィンドウにも限りがあり、大規模コードベースの俯瞰は困難 チームの各メンバーがLLM を使って高速に実装 → いざ統合すると 同じ機能が複数モジュールに重複 していた “ “ 9
アーキテクチャ図は人間と LLM の共通言語 自然言語は 曖昧、コードは 詳細すぎる その間をアーキテクチャ図が埋める 人間 → LLM
図を添えて指示すれば、システム全体の中 での位置づけが明確になり、LLM は 適切な 箇所に手を入れられる LLM → 人間 生成コードを図に落とし込めば、数千行の コードを読まずに 設計判断の全体像を俯 瞰 できる 10
C4 モデルがLLM 時代に適している3 つの理由 1 テキストベースだから双方向のやり取りが成立する PlantUML / Structurizr DSL
→ プロンプトに含めてLLM に渡せる / Git で差分レビュー 2 階層構造がLLM に渡すコンテキストを制御する 3 LLM の出力をレビュー可能な形に変換できる LLM が生成したコードを図に落とし込み、設計判断の全体像を俯瞰してレビュー 11
実践ユースケース UC1: ゼロから生成 自然言語の概要からC4 図 を生成 帳票出力・メール通知 システムのコンテナ図を PlantUML で作成して
UC2: 差分で更新 変更意図を伝えて既存の 図を更新 - "PDF 生成・保存を行い - 通知イベントを発行" + "PDF 生成ジョブを + キューへ投入し + 通知イベントを発行" UC3: レビュー 図をLLM に読ませて改善 循環依存の検出 単一障害点の指摘 責務分割の妥当性 MCP サーバーで自動化も 12
まとめ アーキテクチャ図には フォーマット・粒度・巨大化 の課題がある C4 モデルは 4 階層 で抽象度を統一し、これらの課題を解決する LLM
時代、コードだけでは 設計意図や将来像 は伝わらない C4 モデルは テキストベース・階層構造・LLM が読み書き可能 なため、人間とLLM の 共通言語 として機能する LLM による 生成・更新・レビュー で実践的に活用できる 13
記事のご紹介 この発表の内容は以下の記事をもとにしています 前編 アーキテクチャ図、コードで書こう - C4 モデル入門 C4 モデルの基本と各図の具体例を解説 zenn.dev/uniquevision/articles/625e00
137b75af 後編 「アーキテクチャ図はもう要らない」は 本当か? ── LLM 時代のC4 モデル再考 LLM とC4 モデルの組み合わせと実践ユ ースケース zenn.dev/uniquevision/articles/1ddf3a 6ecb0ad7