{ "id": "market-size-tam-sam-som", "schemaVersion": 2, "title": { "ja": "市場規模 — 面積で比べる 3 重の円と、数字の出どころ", "en": "Market Size — Three Nested Circles Compared by Area, With Where Each Number Comes From" }, "summary": { "ja": "TAM・SAM・SOM を面積が金額に比例する 3 重の円で描き、右に各段の金額と算出の根拠を 1 行ずつ添える", "en": "TAM, SAM and SOM drawn as nested circles whose areas follow the amounts, with each tier's amount and basis listed on the right" }, "capturedAt": "2026-10-19", "categories": [ "presentation" ], "tags": [ "data-viz", "typography" ], "useCases": [ "market" ], "format": "slide-16x9", "density": "medium", "layout": { "kind": "nested", "canvas": { "w": 1920, "h": 1080 }, "margin": { "top": 112, "right": 160, "bottom": 96, "left": 160 }, "columns": { "count": 2, "gap": 96 } }, "type": { "kicker": { "size": 22, "weight": 700, "tracking": "0.2em" }, "title": { "size": 56, "weight": 900, "leading": 1.3 }, "name": { "size": 28, "weight": 700 }, "basis": { "size": 21, "weight": 400, "leading": 1.6 }, "value": { "size": 56, "weight": 900, "numeric": "tabular" }, "note": { "size": 16, "weight": 400 } }, "colors": { "ground": "#101318", "surface": "#1A1F27", "ink": "#F2F4F7", "muted": "#8B93A1", "accent": "#F5B83D", "rule": "#2A303A", "series": [] }, "rules": [ { "ja": "円の面積を金額に比例させる。半径に比例させると、大きい側が何倍にも誇張される", "en": "Make the areas proportional to the amounts — scale the radius and the big circle is wildly exaggerated" }, { "ja": "各段に算出の根拠を 1 行で添える。根拠の無い市場規模は、最初に質問される", "en": "Give each tier its basis in one line — a market size without one is the first thing questioned" }, { "ja": "見出しには、取りに行く金額（いちばん内側）を書く。外側の大きな数字で始めない", "en": "The headline names the amount you will go after (the innermost); do not lead with the big outer number" }, { "ja": "いちばん内側の円だけを強調色にする", "en": "Only the innermost circle takes the accent" } ], "cover": "https://design-vault.pages.dev/_astro/cover.D9xLsRo0.png", "assets": [], "shortlist": false, "status": "published", "relations": { "similar": [ "concentric-scope-rings", "venn-two-set-sweet-spot", "iceberg-visible-hidden" ] }, "license": "Original", "publishedAt": null, "reproduction": { "spec": { "format": "slide-16x9", "density": "medium", "layout": { "kind": "nested", "canvas": { "w": 1920, "h": 1080 }, "margin": { "top": 112, "right": 160, "bottom": 96, "left": 160 }, "columns": { "count": 2, "gap": 96 } }, "type": { "kicker": { "size": 22, "weight": 700, "tracking": "0.2em" }, "title": { "size": 56, "weight": 900, "leading": 1.3 }, "name": { "size": 28, "weight": 700 }, "basis": { "size": 21, "weight": 400, "leading": 1.6 }, "value": { "size": 56, "weight": 900, "numeric": "tabular" }, "note": { "size": 16, "weight": 400 } }, "colors": { "ground": "#101318", "surface": "#1A1F27", "ink": "#F2F4F7", "muted": "#8B93A1", "accent": "#F5B83D", "rule": "#2A303A" }, "rules": [ "Make the areas proportional to the amounts — scale the radius and the big circle is wildly exaggerated", "Give each tier its basis in one line — a market size without one is the first thing questioned", "The headline names the amount you will go after (the innermost); do not lead with the big outer number", "Only the innermost circle takes the accent" ] }, "prompt": { "ja": "以下の仕様でスライドを 1 枚作ってください。\n\n- 版面 1920 × 1080\n- 余白 上 112 右 160 下 96 左 160\n- 2 カラム（等分）、間隔 96\n\n## 文字（版面 1920px に対する px）\nkicker 22px / 700 / 字間 0.2em\ntitle 56px / 900 / 行送り 1.3\nname 28px / 700\nbasis 21px / 400 / 行送り 1.6\nvalue 56px / 900 / 等幅数字\nnote 16px / 400\n\n## 配色\n地 #101318 / 面 #1A1F27 / 文字 #F2F4F7 / 補助 #8B93A1 / 強調 #F5B83D / 罫 #2A303A\n\n## 外すと崩れる点\n- 円の面積を金額に比例させる。半径に比例させると、大きい側が何倍にも誇張される\n- 各段に算出の根拠を 1 行で添える。根拠の無い市場規模は、最初に質問される\n- 見出しには、取りに行く金額（いちばん内側）を書く。外側の大きな数字で始めない\n- いちばん内側の円だけを強調色にする\n\n内容は［ここに自分の内容を書く］に置き換えてください。寸法と配色はそのまま守ってください。\n正確に再現する場合は、この HTML をそのまま使ってください: https://design-vault.pages.dev/designs/market-size-tam-sam-som/pattern.html", "en": "Produce one slide to the following specification.\n\n- Canvas 1920 × 1080\n- Margin top 112 right 160 bottom 96 left 160\n- 2 equal columns, gap 96\n\n## Type (px against a 1920px canvas)\nkicker 22px / 700 / tracking 0.2em\ntitle 56px / 900 / leading 1.3\nname 28px / 700\nbasis 21px / 400 / leading 1.6\nvalue 56px / 900 / tabular numerals\nnote 16px / 400\n\n## Colour\nGround #101318 / Surface #1A1F27 / Ink #F2F4F7 / Muted #8B93A1 / Accent #F5B83D / Rule #2A303A\n\n## Constraints — dropping these breaks it\n- Make the areas proportional to the amounts — scale the radius and the big circle is wildly exaggerated\n- Give each tier its basis in one line — a market size without one is the first thing questioned\n- The headline names the amount you will go after (the innermost); do not lead with the big outer number\n- Only the innermost circle takes the accent\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/market-size-tam-sam-som/pattern.html." }, "code": { "html": "\n\n市場規模 — 面積で比べる 3 重の円と、数字の出どころ\n\n\n\n\n
\n
\n
\n

市場

\n

最初の 5 年で取りに行くのは 210 億円

\n
\n\n
\n \n \n \n \n \n \n\n
\n
\n \n
\n

中小企業の経理にかかる人件費

\n

従業員 300 人以下の 357 万社 × 1 社あたり年 16.2 万円

\n
\n

5,800億円

\n
\n
\n \n
\n

うち月次締めの作業

\n

経理の作業時間に占める締めの割合 25%

\n
\n

1,450億円

\n
\n
\n \n
\n

電子請求と銀行連携が揃う会社

\n

上のうち、両方が使える 14.5% ／ 5 年で届く範囲

\n
\n

210億円

\n
\n
\n
\n\n

円の面積は金額に比例。数値は説明用の架空のもの

\n
\n
\n", "url": "https://design-vault.pages.dev/designs/market-size-tam-sam-som/pattern.html", "fonts": [ "https://design-vault.pages.dev/designs/market-size-tam-sam-som/font.css", "https://design-vault.pages.dev/designs/market-size-tam-sam-som/font-0.woff2", "https://design-vault.pages.dev/designs/market-size-tam-sam-som/font-1.woff2", "https://design-vault.pages.dev/designs/market-size-tam-sam-som/font-2.woff2" ] } }, "urls": { "ja": "https://design-vault.pages.dev/designs/market-size-tam-sam-som", "en": "https://design-vault.pages.dev/en/designs/market-size-tam-sam-som" }, "notesMarkdown": "## この構成について / About this pattern\n\n出典を持たない自作パターン。**`pattern.html` が版そのもの**で、`cover.png` と frontmatter の\n`layout` / `type` / `colors` はどちらもそこから機械的に測った結果。一式「事業計画・資金調達」の\n1 枚で、架空の会社「ミナト経理」のシリーズ A のピッチとして描いてある。会社・人物・数値はすべて架空。\n\nA self-authored pattern. `pattern.html` is the artboard itself; both `cover.png` and the\nmeasurements in the frontmatter are derived from it. One of the ten pitch slides, drawn as the\nSeries A deck of a fictional company; every company, person and figure on it is invented.\n\n### Techniques\n\n- 円は底辺を揃えて描き、内側ほど小さく下に寄せる\n- 右の表は金額を等幅数字で右揃えにし、根拠を灰色で添える\n- 面積比例であることを出典の行に書く\n\n### Apply to\n\n- ピッチの市場の 1 枚\n- 新規事業の提案で、狙う範囲の大きさを示す" }