{
  "id": "team-structure-joint-pmo",
  "schemaVersion": 2,
  "title": {
    "ja": "体制図 — 決める場を頂点に、合同の窓口を 1 つに絞る",
    "en": "Team Structure — One Place to Decide, One Joint Desk"
  },
  "summary": {
    "ja": "意思決定・合同 PMO・作業チームの 3 段。人名ではなく会議体と開催頻度を載せ、窓口の 1 つを塗る",
    "en": "Three tiers — decision body, joint PMO, working teams — named by forum and cadence rather than by person"
  },
  "capturedAt": "2026-09-15",
  "categories": [
    "presentation"
  ],
  "tags": [
    "minimal",
    "typography"
  ],
  "useCases": [
    "org"
  ],
  "format": "slide-16x9",
  "density": "medium",
  "layout": {
    "kind": "tree",
    "canvas": {
      "w": 1920,
      "h": 1080
    },
    "margin": {
      "top": 100,
      "right": 140,
      "bottom": 100,
      "left": 140
    },
    "emphasis": {
      "row": 2,
      "via": [
        "fill",
        "rule"
      ]
    }
  },
  "type": {
    "title": {
      "size": 46,
      "weight": 700,
      "tracking": "0.01em",
      "leading": 1.3
    },
    "lede": {
      "size": 19,
      "weight": 400,
      "leading": 1.8
    },
    "role": {
      "size": 15,
      "weight": 500,
      "tracking": "0.12em"
    },
    "who": {
      "size": 26,
      "weight": 700,
      "leading": 1.35
    },
    "cadence": {
      "size": 15,
      "weight": 400,
      "numeric": "tabular"
    },
    "tname": {
      "size": 22,
      "weight": 700,
      "leading": 1.4
    },
    "tside": {
      "size": 14,
      "weight": 500,
      "tracking": "0.12em"
    },
    "heads": {
      "size": 15,
      "weight": 400,
      "leading": 1.8,
      "numeric": "tabular"
    },
    "foot": {
      "size": 16,
      "weight": 400,
      "leading": 1.8
    }
  },
  "colors": {
    "ground": "#FFFFFF",
    "surface": "#F4F6F9",
    "ink": "#131820",
    "muted": "#667183",
    "accent": "#1F5FA8",
    "rule": "#DBE1E9",
    "series": []
  },
  "rules": [
    {
      "ja": "節には人名ではなく会議体を置く。人を書いた体制図は、要員が 1 人替わるたびに古くなる",
      "en": "Name forums, not people — an org chart made of names goes stale the first time someone rotates off"
    },
    {
      "ja": "窓口は 1 つだけ塗る。2 つ塗ると、実際には窓口が無いのと同じになる",
      "en": "Fill exactly one desk. Two filled desks means there is no desk"
    },
    {
      "ja": "各節に開催頻度を書く。月 1 回の決裁と週 2 回の相談は、体制図の中で別の性格を持つ",
      "en": "Give each node its cadence: a monthly decision and a twice-weekly consultation are different organs"
    },
    {
      "ja": "枝の渡り線は端のチームの中心で止める。版面の端まで引くと、外側にも何かあるように読まれる",
      "en": "Stop the connector at the outermost team's centre — run it to the margin and the chart implies more teams off-page"
    },
    {
      "ja": "チームの主管（御社／弊社／合同）を必ず書く。主管の書かれていない箱は、後で誰も引き取らない",
      "en": "Say who leads each team. A box with no lead is the one nobody claims when it matters"
    }
  ],
  "cover": "https://design-vault.pages.dev/_astro/cover.C1EcvadY.png",
  "assets": [],
  "shortlist": false,
  "status": "published",
  "relations": {
    "similar": [
      "architecture-3tier-stack",
      "wbs-gantt-six-phases",
      "status-report-rag-rows"
    ]
  },
  "license": "Original",
  "publishedAt": null,
  "reproduction": {
    "spec": {
      "format": "slide-16x9",
      "density": "medium",
      "layout": {
        "kind": "tree",
        "canvas": {
          "w": 1920,
          "h": 1080
        },
        "margin": {
          "top": 100,
          "right": 140,
          "bottom": 100,
          "left": 140
        },
        "emphasis": {
          "row": 2,
          "via": [
            "fill",
            "rule"
          ]
        }
      },
      "type": {
        "title": {
          "size": 46,
          "weight": 700,
          "tracking": "0.01em",
          "leading": 1.3
        },
        "lede": {
          "size": 19,
          "weight": 400,
          "leading": 1.8
        },
        "role": {
          "size": 15,
          "weight": 500,
          "tracking": "0.12em"
        },
        "who": {
          "size": 26,
          "weight": 700,
          "leading": 1.35
        },
        "cadence": {
          "size": 15,
          "weight": 400,
          "numeric": "tabular"
        },
        "tname": {
          "size": 22,
          "weight": 700,
          "leading": 1.4
        },
        "tside": {
          "size": 14,
          "weight": 500,
          "tracking": "0.12em"
        },
        "heads": {
          "size": 15,
          "weight": 400,
          "leading": 1.8,
          "numeric": "tabular"
        },
        "foot": {
          "size": 16,
          "weight": 400,
          "leading": 1.8
        }
      },
      "colors": {
        "ground": "#FFFFFF",
        "surface": "#F4F6F9",
        "ink": "#131820",
        "muted": "#667183",
        "accent": "#1F5FA8",
        "rule": "#DBE1E9"
      },
      "rules": [
        "Name forums, not people — an org chart made of names goes stale the first time someone rotates off",
        "Fill exactly one desk. Two filled desks means there is no desk",
        "Give each node its cadence: a monthly decision and a twice-weekly consultation are different organs",
        "Stop the connector at the outermost team's centre — run it to the margin and the chart implies more teams off-page",
        "Say who leads each team. A box with no lead is the one nobody claims when it matters"
      ]
    },
    "prompt": {
      "ja": "以下の仕様でスライドを 1 枚作ってください。\n\n- 版面 1920 × 1080\n- 余白 上 100 右 140 下 100 左 140\n\n## 強調\n2 行目のみ。手段は 塗り + 罫 だけ。ほかは変えない\n\n## 文字（版面 1920px に対する px）\ntitle  46px / 700 / 字間 0.01em / 行送り 1.3\nlede  19px / 400 / 行送り 1.8\nrole  15px / 500 / 字間 0.12em\nwho  26px / 700 / 行送り 1.35\ncadence  15px / 400 / 等幅数字\ntname  22px / 700 / 行送り 1.4\ntside  14px / 500 / 字間 0.12em\nheads  15px / 400 / 行送り 1.8 / 等幅数字\nfoot  16px / 400 / 行送り 1.8\n\n## 配色\n地 #FFFFFF / 面 #F4F6F9 / 文字 #131820 / 補助 #667183 / 強調 #1F5FA8 / 罫 #DBE1E9\n\n## 外すと崩れる点\n- 節には人名ではなく会議体を置く。人を書いた体制図は、要員が 1 人替わるたびに古くなる\n- 窓口は 1 つだけ塗る。2 つ塗ると、実際には窓口が無いのと同じになる\n- 各節に開催頻度を書く。月 1 回の決裁と週 2 回の相談は、体制図の中で別の性格を持つ\n- 枝の渡り線は端のチームの中心で止める。版面の端まで引くと、外側にも何かあるように読まれる\n- チームの主管（御社／弊社／合同）を必ず書く。主管の書かれていない箱は、後で誰も引き取らない\n\n内容は［ここに自分の内容を書く］に置き換えてください。寸法と配色はそのまま守ってください。\n正確に再現する場合は、この HTML をそのまま使ってください: https://design-vault.pages.dev/designs/team-structure-joint-pmo/pattern.html",
      "en": "Produce one slide to the following specification.\n\n- Canvas 1920 × 1080\n- Margin top 100 right 140 bottom 100 left 140\n\n## Emphasis\nrow 2 only, by fill + rule and nothing else\n\n## Type (px against a 1920px canvas)\ntitle  46px / 700 / tracking 0.01em / leading 1.3\nlede  19px / 400 / leading 1.8\nrole  15px / 500 / tracking 0.12em\nwho  26px / 700 / leading 1.35\ncadence  15px / 400 / tabular numerals\ntname  22px / 700 / leading 1.4\ntside  14px / 500 / tracking 0.12em\nheads  15px / 400 / leading 1.8 / tabular numerals\nfoot  16px / 400 / leading 1.8\n\n## Colour\nGround #FFFFFF / Surface #F4F6F9 / Ink #131820 / Muted #667183 / Accent #1F5FA8 / Rule #DBE1E9\n\n## Constraints — dropping these breaks it\n- Name forums, not people — an org chart made of names goes stale the first time someone rotates off\n- Fill exactly one desk. Two filled desks means there is no desk\n- Give each node its cadence: a monthly decision and a twice-weekly consultation are different organs\n- Stop the connector at the outermost team's centre — run it to the margin and the chart implies more teams off-page\n- Say who leads each team. A box with no lead is the one nobody claims when it matters\n\nReplace the content with [your content]. Keep the measurements and colours as given.\nFor an exact reproduction, use the verbatim HTML at https://design-vault.pages.dev/designs/team-structure-joint-pmo/pattern.html."
    },
    "code": {
      "html": "<!doctype html>\n<meta charset=\"utf-8\">\n<title>体制図 — 決める場を頂点に、合同の窓口を 1 つに絞る</title>\n<meta name=\"dv-font\" content=\"Zen Kaku Gothic New:400;500;700\">\n<link rel=\"stylesheet\" href=\"./font.css\">\n<style>\n  /* この版そのもの。index.md の layout / type / colors は、この HTML を\n     scripts/render-pattern.mjs で実測した結果であって、別に書いた説明ではない。 */\n  :root {\n    --ground: #FFFFFF;\n    --surface: #F4F6F9;\n    --ink: #131820;\n    --muted: #667183;\n    --accent: #1F5FA8;\n    --rule: #DBE1E9;\n  }\n  * { box-sizing: border-box; margin: 0; }\n  html, body { width: 1920px; height: 1080px; }\n  body { font-family: \"Zen Kaku Gothic New\", \"IPAGothic\", sans-serif; }\n\n  .artboard {\n    width: 1920px; height: 1080px;\n    background: var(--ground); color: var(--ink);\n    padding: 100px 140px;                 /* → layout.margin */\n  }\n  .content { height: 100%; display: grid; grid-template-rows: auto 1fr auto; }\n\n  .head { display: grid; gap: 16px; }\n  .title { font-size: 46px; font-weight: 700; line-height: 1.3; letter-spacing: .01em; }\n  .lede { font-size: 19px; font-weight: 400; line-height: 1.8; color: var(--muted); }\n\n  .chart { align-self: center; display: grid; justify-items: center; }\n\n  .node { border: 1px solid var(--rule); padding: 24px 34px; text-align: center; background: var(--ground); }\n  .role { font-size: 15px; font-weight: 500; letter-spacing: .12em; color: var(--muted); }\n  .who { font-size: 26px; font-weight: 700; line-height: 1.35; margin-top: 10px; }\n  .cadence { font-size: 15px; font-weight: 400; color: var(--muted); margin-top: 10px; font-variant-numeric: tabular-nums; }\n\n  /* 頂点は「決める場」。人の名前ではなく、決議が出る会議体を置く。 */\n  .top { min-width: 520px; }\n  /* 合同 PMO は 1 つだけ。窓口が 2 つある体制図は、実際には窓口が無い。 */\n  .joint { min-width: 720px; background: var(--surface); border-color: var(--accent); }\n  .joint .role,\n  .joint .who { color: var(--accent); }\n\n  .drop { width: 1px; height: 46px; background: var(--rule); }\n  /* 渡り線は端の枝の中心で止める。版面の端まで引くと、4 つの外側にも\n     何かあるように読まれる。列幅は (100% - gap*3)/4 なので、\n     両端の半分ぶん = その列幅ちょうどを引いた長さが端から端になる。 */\n  .bar { width: calc(75% + 24px); height: 1px; background: var(--rule); }\n  .legs { width: 100%; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; justify-items: center; }\n\n  .teams { width: 100%; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; }\n  /* 枝はチーム名に直接刺す。ここに罫を足すと、渡り線と平行な線が 2 本になり\n     どちらが枝でどちらが囲みなのか読めなくなる。 */\n  .team { padding: 22px 4px 0; }\n  .tname { font-size: 22px; font-weight: 700; line-height: 1.4; }\n  .tside { font-size: 14px; font-weight: 500; letter-spacing: .12em; color: var(--muted); margin-top: 12px; }\n  .heads { font-size: 15px; font-weight: 400; line-height: 1.8; color: var(--muted); margin-top: 14px; font-variant-numeric: tabular-nums; }\n\n  .foot { font-size: 16px; font-weight: 400; line-height: 1.8; color: var(--muted); border-top: 1px solid var(--rule); padding-top: 24px; }\n</style>\n\n<div class=\"artboard\" data-artboard>\n  <div class=\"content\" data-content>\n    <div class=\"head\">\n      <h1 class=\"title\" data-type=\"title\">推進体制</h1>\n      <p class=\"lede\" data-type=\"lede\">決める場を 1 つ、合同の窓口を 1 つに絞っています。作業チームからの相談はすべて合同 PMO を通します。</p>\n    </div>\n\n    <div class=\"chart\">\n      <div class=\"node top\" data-row=\"1\">\n        <p class=\"role\" data-type=\"role\">意思決定</p>\n        <p class=\"who\" data-type=\"who\">ステアリングコミッティ</p>\n        <p class=\"cadence\" data-type=\"cadence\">月 1 回 ／ 御社役員・弊社責任者</p>\n      </div>\n      <div class=\"drop\"></div>\n      <div class=\"node joint\" data-row=\"2\" data-emphasis=\"fill rule\">\n        <p class=\"role\">日々の窓口・課題の一次受け</p>\n        <p class=\"who\">合同 PMO</p>\n        <p class=\"cadence\">週 2 回 ／ 御社 2 名・弊社 2 名</p>\n      </div>\n      <div class=\"drop\"></div>\n      <div class=\"bar\"></div>\n      <div class=\"legs\">\n        <div class=\"drop\"></div>\n        <div class=\"drop\"></div>\n        <div class=\"drop\"></div>\n        <div class=\"drop\"></div>\n      </div>\n      <div class=\"teams\">\n        <section class=\"team\" data-row=\"3\">\n          <p class=\"tname\" data-type=\"tname\">業務チーム</p>\n          <p class=\"tside\" data-type=\"tside\">御社 主管</p>\n          <p class=\"heads\" data-type=\"heads\">営業推進部 4 名<br>要件確定・受入判定</p>\n        </section>\n        <section class=\"team\">\n          <p class=\"tname\">開発チーム</p>\n          <p class=\"tside\">弊社 主管</p>\n          <p class=\"heads\">設計 3 名・実装 8 名<br>設計から結合まで</p>\n        </section>\n        <section class=\"team\">\n          <p class=\"tname\">基盤チーム</p>\n          <p class=\"tside\">合同</p>\n          <p class=\"heads\">御社 1 名・弊社 2 名<br>環境・連携・移行</p>\n        </section>\n        <section class=\"team\">\n          <p class=\"tname\">品質チーム</p>\n          <p class=\"tside\">弊社 主管</p>\n          <p class=\"heads\">2 名<br>テスト計画・不具合管理</p>\n        </section>\n      </div>\n    </div>\n\n    <p class=\"foot\" data-type=\"foot\">要員の氏名と稼働率は付録 B に記載しています。この図には会議体と役割だけを載せ、人の入れ替えで図が古くならないようにしています。</p>\n  </div>\n</div>\n",
      "url": "https://design-vault.pages.dev/designs/team-structure-joint-pmo/pattern.html",
      "fonts": [
        "https://design-vault.pages.dev/designs/team-structure-joint-pmo/font.css",
        "https://design-vault.pages.dev/designs/team-structure-joint-pmo/font-0.woff2",
        "https://design-vault.pages.dev/designs/team-structure-joint-pmo/font-1.woff2",
        "https://design-vault.pages.dev/designs/team-structure-joint-pmo/font-2.woff2"
      ]
    }
  },
  "urls": {
    "ja": "https://design-vault.pages.dev/designs/team-structure-joint-pmo",
    "en": "https://design-vault.pages.dev/en/designs/team-structure-joint-pmo"
  },
  "notesMarkdown": "## この構成について / About this pattern\n\n案件の推進体制を 1 枚で示す版。**`pattern.html` が版そのもの**で、`cover.png` と frontmatter の\n寸法はどちらもそこから機械的に出している。編集するのは `pattern.html` だけ。\n\nThe structure slide for a joint project. `pattern.html` is the artboard itself; both `cover.png`\nand the measurements come from it, so the three cannot drift apart.\n\n### Techniques\n\n- 枝は 1px の罫だけで組む。囲みを足すと、渡り線と平行な線が 2 本になって枝と囲みの区別が消える\n- 上位 2 節は幅を変えて階層を出す（520px / 720px）。線の太さで階層を作ると罫が主役になる\n- 人数は `--muted` に落とす。人数が太字だと「多い／少ない」が先に読まれ、役割が後回しになる\n\n### Apply to\n\n- 提案・キックオフでの体制説明、体制変更のお知らせ\n- 運用体制への引き継ぎ（下段を「運用・保守・監視」に読み替える）"
}