{ "id": "design:company-facts-infographic", "schemaVersion": 2, "title": { "ja": "数字で見る会社 — 7 つの数字に、伝えたい順の大小をつける", "en": "Company in Numbers — Seven Figures, Sized by What Matters Most" }, "summary": { "ja": "いちばん伝えたい数字を強調色の大きな枠に、残り 6 つを同じ大きさの枠に並べる。大きな数字には一言の補足を添える", "en": "The figure that matters most fills a large accent panel; six more sit in equal tiles, and the big one gets a line of context" }, "capturedAt": "2026-10-19", "categories": [ "presentation" ], "tags": [ "bold", "data-viz" ], "useCases": [ "kpi" ], "format": "slide-16x9", "density": "medium", "layout": { "kind": "grid", "canvas": { "w": 1920, "h": 1080 }, "margin": { "top": 88, "right": 140, "bottom": 56, "left": 140 } }, "type": { "kicker": { "size": 22, "weight": 700, "tracking": "0.16em", "numeric": "tabular" }, "title": { "size": 54, "weight": 700, "leading": 1.35, "numeric": "tabular" }, "factLabel": { "size": 24, "weight": 700, "numeric": "tabular" }, "factBig": { "size": 180, "weight": 700, "tracking": "-0.01em", "leading": 1, "numeric": "tabular" }, "factNote": { "size": 22, "weight": 400, "leading": 1.6, "numeric": "tabular" }, "factValue": { "size": 80, "weight": 700, "tracking": "-0.01em", "leading": 1, "numeric": "tabular" }, "note": { "size": 20, "weight": 400, "numeric": "tabular" }, "folio": { "size": 16, "weight": 400, "numeric": "tabular" } }, "colors": { "ground": "#FFFFFF", "surface": "#F4F3F0", "ink": "#16181D", "muted": "#686C74", "accent": "#D9411F", "rule": "#E0DED8", "series": [] }, "rules": [ { "ja": "大きくする数字は 1 つだけ。全部を同じ大きさにすると、どれも覚えられない", "en": "Enlarge one figure only — at equal size, none is remembered" }, { "ja": "大きな数字には意味の補足（5 年で 4 倍）を添える", "en": "Give the big figure its meaning (four times in five years)" }, { "ja": "単位は数字の 1/3 の大きさで、下端を揃える", "en": "Units at a third of the figure's size, aligned to its baseline" }, { "ja": "時点を必ず書く", "en": "Always state the as-of date" } ], "cover": "https://design-vault.pages.dev/_astro/cover.BIowSVPb.png", "assets": [], "shortlist": false, "status": "published", "relations": { "similar": [ "kpi-grid-four-deltas", "kpi-hero-single-figure", "kpi-dark-three-figures" ] }, "license": "Original", "publishedAt": null, "reproduction": { "spec": { "format": "slide-16x9", "density": "medium", "layout": { "kind": "grid", "canvas": { "w": 1920, "h": 1080 }, "margin": { "top": 88, "right": 140, "bottom": 56, "left": 140 } }, "type": { "kicker": { "size": 22, "weight": 700, "tracking": "0.16em", "numeric": "tabular" }, "title": { "size": 54, "weight": 700, "leading": 1.35, "numeric": "tabular" }, "factLabel": { "size": 24, "weight": 700, "numeric": "tabular" }, "factBig": { "size": 180, "weight": 700, "tracking": "-0.01em", "leading": 1, "numeric": "tabular" }, "factNote": { "size": 22, "weight": 400, "leading": 1.6, "numeric": "tabular" }, "factValue": { "size": 80, "weight": 700, "tracking": "-0.01em", "leading": 1, "numeric": "tabular" }, "note": { "size": 20, "weight": 400, "numeric": "tabular" }, "folio": { "size": 16, "weight": 400, "numeric": "tabular" } }, "colors": { "ground": "#FFFFFF", "surface": "#F4F3F0", "ink": "#16181D", "muted": "#686C74", "accent": "#D9411F", "rule": "#E0DED8" }, "rules": [ "Enlarge one figure only — at equal size, none is remembered", "Give the big figure its meaning (four times in five years)", "Units at a third of the figure's size, aligned to its baseline", "Always state the as-of date" ] }, "prompt": { "ja": "以下の仕様でスライドを 1 枚作ってください。\n\n- 版面 1920 × 1080\n- 余白 上 88 右 140 下 56 左 140\n\n## 文字（版面 1920px に対する px）\nkicker 22px / 700 / 字間 0.16em / 等幅数字\ntitle 54px / 700 / 行送り 1.35 / 等幅数字\nfactLabel 24px / 700 / 等幅数字\nfactBig 180px / 700 / 字間 -0.01em / 行送り 1 / 等幅数字\nfactNote 22px / 400 / 行送り 1.6 / 等幅数字\nfactValue 80px / 700 / 字間 -0.01em / 行送り 1 / 等幅数字\nnote 20px / 400 / 等幅数字\nfolio 16px / 400 / 等幅数字\n\n## 配色\n地 #FFFFFF / 面 #F4F3F0 / 文字 #16181D / 補助 #686C74 / 強調 #D9411F / 罫 #E0DED8\n\n## 外すと崩れる点\n- 大きくする数字は 1 つだけ。全部を同じ大きさにすると、どれも覚えられない\n- 大きな数字には意味の補足（5 年で 4 倍）を添える\n- 単位は数字の 1/3 の大きさで、下端を揃える\n- 時点を必ず書く\n\n内容は［ここに自分の内容を書く］に置き換えてください。寸法と配色はそのまま守ってください。\n正確に再現する場合は、この HTML をそのまま使ってください: https://design-vault.pages.dev/designs/company-facts-infographic/pattern.html", "en": "Produce one slide to the following specification.\n\n- Canvas 1920 × 1080\n- Margin top 88 right 140 bottom 56 left 140\n\n## Type (px against a 1920px canvas)\nkicker 22px / 700 / tracking 0.16em / tabular numerals\ntitle 54px / 700 / leading 1.35 / tabular numerals\nfactLabel 24px / 700 / tabular numerals\nfactBig 180px / 700 / tracking -0.01em / leading 1 / tabular numerals\nfactNote 22px / 400 / leading 1.6 / tabular numerals\nfactValue 80px / 700 / tracking -0.01em / leading 1 / tabular numerals\nnote 20px / 400 / tabular numerals\nfolio 16px / 400 / tabular numerals\n\n## Colour\nGround #FFFFFF / Surface #F4F3F0 / Ink #16181D / Muted #686C74 / Accent #D9411F / Rule #E0DED8\n\n## Constraints — dropping these breaks it\n- Enlarge one figure only — at equal size, none is remembered\n- Give the big figure its meaning (four times in five years)\n- Units at a third of the figure's size, aligned to its baseline\n- Always state the as-of date\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/company-facts-infographic/pattern.html." }, "code": { "html": "\n\n数字で見る会社 — 7 つの数字に、伝えたい順の大小をつける\n\n\n\n\n
\n
\n
\n

数字で見るミチシルベ

\n

小さな町から、128 の自治体に広がった

\n
\n
\n

導入している自治体

128自治体

5 年で 4 倍。うち 7 割が人口 10 万人以下の町

\n

1 日の経路検索

42万回

\n

社員

86名

\n

創業

2017年

\n

開発職の割合

58%

\n

育休からの復帰

100%

\n

平均年齢

34.2歳

\n
\n

2026 年 9 月時点。数値は説明用の架空のもの

\n
\n

株式会社ミチシルベ　会社紹介 2026

\n

04

\n
\n
\n
\n", "url": "https://design-vault.pages.dev/designs/company-facts-infographic/pattern.html", "fonts": [ "https://design-vault.pages.dev/designs/company-facts-infographic/font.css", "https://design-vault.pages.dev/designs/company-facts-infographic/font-0.woff2", "https://design-vault.pages.dev/designs/company-facts-infographic/font-1.woff2", "https://design-vault.pages.dev/designs/company-facts-infographic/font-2.woff2" ] } }, "urls": { "ja": "https://design-vault.pages.dev/designs/company-facts-infographic", "en": "https://design-vault.pages.dev/en/designs/company-facts-infographic", "json": "https://design-vault.pages.dev/ai/assets/company-facts-infographic.json", "designJson": "https://design-vault.pages.dev/ai/designs/company-facts-infographic.json" }, "notesMarkdown": "## この構成について / About this pattern\n\n出典を持たない自作パターン。**`pattern.html` が版そのもの**で、`cover.png` と frontmatter の\n`layout` / `type` / `colors` はどちらもそこから機械的に測った結果。一式「会社紹介・採用」の\n1 枚で、架空の会社「ミチシルベ」の会社紹介として描いてある。会社・人物・数値はすべて架空。\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 seven company and recruiting slides,\ndrawn as a fictional company's introduction; every company, person and figure on it is invented.\n\n### Techniques\n\n- 1.8fr と 1fr × 3 の格子、大きな枠は 2 行ぶん\n- 大きな数字は 180px の地の色、強調色の面\n- 小さな枠は淡い面に墨の 80px\n\n### Apply to\n\n- 会社紹介・採用説明\n- 事業部の紹介、年次報告の扉", "slug": "company-facts-infographic", "kind": "artboard", "catalogVersion": 1, "designSchemaVersion": 2, "capabilities": [ "view-artboard", "read-spec", "copy-prompt", "get-code" ], "reusePolicy": "construction-reuse" }