{
"id": "zoom-inset-whole-detail",
"schemaVersion": 2,
"title": {
"ja": "全体構成と、いま話している一点 — 2 つの縮尺を線で結ぶ",
"en": "The Whole and the One Part — Two Scales Joined by Two Lines"
},
"summary": {
"ja": "全体図の一点を枠で囲み、2 本の線で拡大図へ結ぶ。全体を再掲する手間を払わずに、いまどこの話かを保ち続ける",
"en": "One spot in the whole is framed and joined to its blow-up by two lines, so the audience keeps its bearings without the whole being shown again"
},
"capturedAt": "2026-09-16",
"categories": [
"presentation"
],
"tags": [
"minimal",
"typography"
],
"useCases": [
"architecture"
],
"format": "slide-16x9",
"density": "medium",
"layout": {
"kind": "annotated",
"canvas": {
"w": 1920,
"h": 1080
},
"margin": {
"top": 96,
"right": 140,
"bottom": 96,
"left": 140
}
},
"type": {
"title": {
"size": 44,
"weight": 700,
"tracking": "0.01em",
"leading": 1.3
},
"window": {
"size": 20,
"weight": 500,
"leading": 1.5
},
"sectionLabel": {
"size": 20,
"weight": 500,
"leading": 1.4
},
"nodeName": {
"size": 22,
"weight": 700,
"leading": 1.3
},
"insetTitle": {
"size": 26,
"weight": 700,
"leading": 1.3
},
"itemNote": {
"size": 20,
"weight": 400,
"leading": 1.5
},
"note": {
"size": 16,
"weight": 400,
"leading": 1.6
}
},
"colors": {
"ground": "#FFFFFF",
"surface": "#F4F6F9",
"ink": "#131820",
"muted": "#667183",
"accent": "#1F5FA8",
"rule": "#DBE1E9",
"series": []
},
"rules": [
{
"ja": "結ぶ線は 2 本。1 本だと引き出し線と区別が付かず、3 本以上だと拡大の範囲がどこまでかを言えなくなる",
"en": "Exactly two lines. One reads as a leader line; three or more stop saying where the magnified region ends"
},
{
"ja": "全体側は塗らない。枠と線だけで「ここを拡大している」と言う。塗ると、拡大の対象なのか重要な要素なのかが区別できない",
"en": "Do not fill the framed box in the whole. Frame and lines alone say 'this is what is enlarged'; a fill makes it ambiguous with 'this is the important one'"
},
{
"ja": "全体図は縮尺を持たないと明記する。箱の大きさに意味があると読まれると、拡大という操作そのものが嘘になる",
"en": "State that the overview has no scale. If box sizes are read as meaningful, the very act of magnifying becomes a lie"
},
{
"ja": "拡大は 1 か所だけ。2 か所を同時に拡大すると、線が交差して対応が読めなくなり、全体図の役目が消える",
"en": "Magnify one place only. Two blow-ups cross their lines, the correspondence stops being readable, and the overview loses its job"
},
{
"ja": "拡大側に全体側より細かい情報を置く。同じ粒度のまま大きくしただけの図は、拡大ではなく余白の無駄づかいになる",
"en": "Put finer information in the blow-up. Enlarged at the same granularity, it is not a magnification but wasted space"
}
],
"cover": "https://design-vault.pages.dev/_astro/cover.B5G4ZzeJ.png",
"assets": [],
"shortlist": false,
"status": "published",
"relations": {
"similar": [
"callout-numbered-screen",
"concentric-scope-rings"
]
},
"license": "Original",
"publishedAt": null,
"reproduction": {
"spec": {
"format": "slide-16x9",
"density": "medium",
"layout": {
"kind": "annotated",
"canvas": {
"w": 1920,
"h": 1080
},
"margin": {
"top": 96,
"right": 140,
"bottom": 96,
"left": 140
}
},
"type": {
"title": {
"size": 44,
"weight": 700,
"tracking": "0.01em",
"leading": 1.3
},
"window": {
"size": 20,
"weight": 500,
"leading": 1.5
},
"sectionLabel": {
"size": 20,
"weight": 500,
"leading": 1.4
},
"nodeName": {
"size": 22,
"weight": 700,
"leading": 1.3
},
"insetTitle": {
"size": 26,
"weight": 700,
"leading": 1.3
},
"itemNote": {
"size": 20,
"weight": 400,
"leading": 1.5
},
"note": {
"size": 16,
"weight": 400,
"leading": 1.6
}
},
"colors": {
"ground": "#FFFFFF",
"surface": "#F4F6F9",
"ink": "#131820",
"muted": "#667183",
"accent": "#1F5FA8",
"rule": "#DBE1E9"
},
"rules": [
"Exactly two lines. One reads as a leader line; three or more stop saying where the magnified region ends",
"Do not fill the framed box in the whole. Frame and lines alone say 'this is what is enlarged'; a fill makes it ambiguous with 'this is the important one'",
"State that the overview has no scale. If box sizes are read as meaningful, the very act of magnifying becomes a lie",
"Magnify one place only. Two blow-ups cross their lines, the correspondence stops being readable, and the overview loses its job",
"Put finer information in the blow-up. Enlarged at the same granularity, it is not a magnification but wasted space"
]
},
"prompt": {
"ja": "以下の仕様でスライドを 1 枚作ってください。\n\n- 版面 1920 × 1080\n- 余白 上 96 右 140 下 96 左 140\n\n## 文字（版面 1920px に対する px）\ntitle 44px / 700 / 字間 0.01em / 行送り 1.3\nwindow 20px / 500 / 行送り 1.5\nsectionLabel 20px / 500 / 行送り 1.4\nnodeName 22px / 700 / 行送り 1.3\ninsetTitle 26px / 700 / 行送り 1.3\nitemNote 20px / 400 / 行送り 1.5\nnote 16px / 400 / 行送り 1.6\n\n## 配色\n地 #FFFFFF / 面 #F4F6F9 / 文字 #131820 / 補助 #667183 / 強調 #1F5FA8 / 罫 #DBE1E9\n\n## 外すと崩れる点\n- 結ぶ線は 2 本。1 本だと引き出し線と区別が付かず、3 本以上だと拡大の範囲がどこまでかを言えなくなる\n- 全体側は塗らない。枠と線だけで「ここを拡大している」と言う。塗ると、拡大の対象なのか重要な要素なのかが区別できない\n- 全体図は縮尺を持たないと明記する。箱の大きさに意味があると読まれると、拡大という操作そのものが嘘になる\n- 拡大は 1 か所だけ。2 か所を同時に拡大すると、線が交差して対応が読めなくなり、全体図の役目が消える\n- 拡大側に全体側より細かい情報を置く。同じ粒度のまま大きくしただけの図は、拡大ではなく余白の無駄づかいになる\n\n内容は［ここに自分の内容を書く］に置き換えてください。寸法と配色はそのまま守ってください。\n正確に再現する場合は、この HTML をそのまま使ってください: https://design-vault.pages.dev/designs/zoom-inset-whole-detail/pattern.html",
"en": "Produce one slide to the following specification.\n\n- Canvas 1920 × 1080\n- Margin top 96 right 140 bottom 96 left 140\n\n## Type (px against a 1920px canvas)\ntitle 44px / 700 / tracking 0.01em / leading 1.3\nwindow 20px / 500 / leading 1.5\nsectionLabel 20px / 500 / leading 1.4\nnodeName 22px / 700 / leading 1.3\ninsetTitle 26px / 700 / leading 1.3\nitemNote 20px / 400 / leading 1.5\nnote 16px / 400 / leading 1.6\n\n## Colour\nGround #FFFFFF / Surface #F4F6F9 / Ink #131820 / Muted #667183 / Accent #1F5FA8 / Rule #DBE1E9\n\n## Constraints — dropping these breaks it\n- Exactly two lines. One reads as a leader line; three or more stop saying where the magnified region ends\n- Do not fill the framed box in the whole. Frame and lines alone say 'this is what is enlarged'; a fill makes it ambiguous with 'this is the important one'\n- State that the overview has no scale. If box sizes are read as meaningful, the very act of magnifying becomes a lie\n- Magnify one place only. Two blow-ups cross their lines, the correspondence stops being readable, and the overview loses its job\n- Put finer information in the blow-up. Enlarged at the same granularity, it is not a magnification but wasted space\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/zoom-inset-whole-detail/pattern.html."
},
"code": {
"html": "\n\n全体構成と、いま話している一点 — 2 つの縮尺を線で結ぶ\n\n\n\n\n