{
"id": "problem-figure-and-voice",
"schemaVersion": 2,
"title": {
"ja": "課題 — 大きな数字 1 つと、当事者の声 1 つ",
"en": "Problem — One Big Figure and One Voice From Someone Who Lives It"
},
"summary": {
"ja": "課題の重さを数字 1 つで左に示し、右に当事者の発言を引用する。数字は大きさを、声は実感を受け持つ",
"en": "One figure on the left shows how heavy the problem is; a quote on the right from someone who lives it gives the feel"
},
"capturedAt": "2026-10-19",
"categories": [
"presentation"
],
"tags": [
"bold",
"typography"
],
"useCases": [
"problem-solution"
],
"format": "slide-16x9",
"density": "low",
"layout": {
"kind": "2-column",
"canvas": {
"w": 1920,
"h": 1080
},
"margin": {
"top": 112,
"right": 160,
"bottom": 96,
"left": 160
},
"columns": {
"count": 2,
"gap": 120
}
},
"type": {
"kicker": {
"size": 22,
"weight": 700,
"tracking": "0.2em"
},
"title": {
"size": 56,
"weight": 900,
"leading": 1.3
},
"figure": {
"size": 220,
"weight": 900,
"tracking": "-0.03em",
"leading": 1,
"numeric": "tabular"
},
"figLabel": {
"size": 30,
"weight": 700,
"leading": 1.5
},
"figBasis": {
"size": 22,
"weight": 400,
"leading": 1.7
},
"quote": {
"size": 40,
"weight": 700,
"leading": 1.6
},
"who": {
"size": 24,
"weight": 400
},
"source": {
"size": 16,
"weight": 400
}
},
"colors": {
"ground": "#101318",
"surface": "#1A1F27",
"ink": "#F2F4F7",
"muted": "#8B93A1",
"accent": "#F5B83D",
"rule": "#2A303A",
"series": []
},
"rules": [
{
"ja": "数字は 1 つ。並べると比べ始めて、課題の重さが薄まる",
"en": "One figure — show several and people start comparing instead of feeling the weight"
},
{
"ja": "数字の下に、何あたりの値かを必ず書く。単位の無い大きな数字は信じてもらえない",
"en": "Say per what under the figure — a big number without a unit is not believed"
},
{
"ja": "声は当事者の言葉のまま、話し手の属性と時期を添える。架空なら出典に書く",
"en": "Keep the voice in the speaker's own words with who and when — and say so in the source line when it is invented"
},
{
"ja": "数字と声を縦の強調線で区切り、2 つが別の証拠であることを見せる",
"en": "A vertical accent rule separates the two, showing they are different kinds of evidence"
}
],
"cover": "https://design-vault.pages.dev/_astro/cover.45QRWb0t.png",
"assets": [],
"shortlist": false,
"status": "published",
"relations": {
"similar": [
"kpi-hero-single-figure",
"quote-testimonial-bleed",
"problem-solution-3step"
]
},
"license": "Original",
"publishedAt": null,
"reproduction": {
"spec": {
"format": "slide-16x9",
"density": "low",
"layout": {
"kind": "2-column",
"canvas": {
"w": 1920,
"h": 1080
},
"margin": {
"top": 112,
"right": 160,
"bottom": 96,
"left": 160
},
"columns": {
"count": 2,
"gap": 120
}
},
"type": {
"kicker": {
"size": 22,
"weight": 700,
"tracking": "0.2em"
},
"title": {
"size": 56,
"weight": 900,
"leading": 1.3
},
"figure": {
"size": 220,
"weight": 900,
"tracking": "-0.03em",
"leading": 1,
"numeric": "tabular"
},
"figLabel": {
"size": 30,
"weight": 700,
"leading": 1.5
},
"figBasis": {
"size": 22,
"weight": 400,
"leading": 1.7
},
"quote": {
"size": 40,
"weight": 700,
"leading": 1.6
},
"who": {
"size": 24,
"weight": 400
},
"source": {
"size": 16,
"weight": 400
}
},
"colors": {
"ground": "#101318",
"surface": "#1A1F27",
"ink": "#F2F4F7",
"muted": "#8B93A1",
"accent": "#F5B83D",
"rule": "#2A303A"
},
"rules": [
"One figure — show several and people start comparing instead of feeling the weight",
"Say per what under the figure — a big number without a unit is not believed",
"Keep the voice in the speaker's own words with who and when — and say so in the source line when it is invented",
"A vertical accent rule separates the two, showing they are different kinds of evidence"
]
},
"prompt": {
"ja": "以下の仕様でスライドを 1 枚作ってください。\n\n- 版面 1920 × 1080\n- 余白 上 112 右 160 下 96 左 160\n- 2 カラム（等分）、間隔 120\n\n## 文字（版面 1920px に対する px）\nkicker 22px / 700 / 字間 0.2em\ntitle 56px / 900 / 行送り 1.3\nfigure 220px / 900 / 字間 -0.03em / 行送り 1 / 等幅数字\nfigLabel 30px / 700 / 行送り 1.5\nfigBasis 22px / 400 / 行送り 1.7\nquote 40px / 700 / 行送り 1.6\nwho 24px / 400\nsource 16px / 400\n\n## 配色\n地 #101318 / 面 #1A1F27 / 文字 #F2F4F7 / 補助 #8B93A1 / 強調 #F5B83D / 罫 #2A303A\n\n## 外すと崩れる点\n- 数字は 1 つ。並べると比べ始めて、課題の重さが薄まる\n- 数字の下に、何あたりの値かを必ず書く。単位の無い大きな数字は信じてもらえない\n- 声は当事者の言葉のまま、話し手の属性と時期を添える。架空なら出典に書く\n- 数字と声を縦の強調線で区切り、2 つが別の証拠であることを見せる\n\n内容は［ここに自分の内容を書く］に置き換えてください。寸法と配色はそのまま守ってください。\n正確に再現する場合は、この HTML をそのまま使ってください: https://design-vault.pages.dev/designs/problem-figure-and-voice/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 120\n\n## Type (px against a 1920px canvas)\nkicker 22px / 700 / tracking 0.2em\ntitle 56px / 900 / leading 1.3\nfigure 220px / 900 / tracking -0.03em / leading 1 / tabular numerals\nfigLabel 30px / 700 / leading 1.5\nfigBasis 22px / 400 / leading 1.7\nquote 40px / 700 / leading 1.6\nwho 24px / 400\nsource 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- One figure — show several and people start comparing instead of feeling the weight\n- Say per what under the figure — a big number without a unit is not believed\n- Keep the voice in the speaker's own words with who and when — and say so in the source line when it is invented\n- A vertical accent rule separates the two, showing they are different kinds of evidence\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/problem-figure-and-voice/pattern.html."
},
"code": {
"html": "\n\n課題 — 大きな数字 1 つと、当事者の声 1 つ\n\n\n\n\n
\n
\n
\n
課題
\n
月次締めが、経理担当 1 人の月末を食い潰している
\n
\n\n
\n
\n
42時間
\n
従業員 50 人以下の会社の、月次締め 1 回あたり
\n
うち 7 割が、請求書と通帳の明細を 1 行ずつ突き合わせる作業
\n
\n
\n
「月末の 3 日間は、突き合わせしかしていません。そのあいだ、ほかの仕事は全部止まります」
\n
製造業・従業員 32 名・経理担当（聞き取り 2026 年 8 月）
\n
\n
\n\n
出典：当社による聞き取り 48 社の平均。数値と発言は説明用の架空のもの
\n
\n
\n",
"url": "https://design-vault.pages.dev/designs/problem-figure-and-voice/pattern.html",
"fonts": [
"https://design-vault.pages.dev/designs/problem-figure-and-voice/font.css",
"https://design-vault.pages.dev/designs/problem-figure-and-voice/font-0.woff2",
"https://design-vault.pages.dev/designs/problem-figure-and-voice/font-1.woff2",
"https://design-vault.pages.dev/designs/problem-figure-and-voice/font-2.woff2"
]
}
},
"urls": {
"ja": "https://design-vault.pages.dev/designs/problem-figure-and-voice",
"en": "https://design-vault.pages.dev/en/designs/problem-figure-and-voice"
},
"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- 数字は 200px の強調色、単位は 1/3 の大きさで数字の下端に揃える\n- 引用は 40px の太字。鉤括弧をぶら下げて、1 行目の頭を揃える\n- 出典は下端の罫の下に 16px で\n\n### Apply to\n\n- ピッチの 2 枚目（課題）\n- 業務改善の提案で、現場の負担を示す 1 枚"
}