{ "id": "cycle-four-stage-loop", "schemaVersion": 2, "title": { "ja": "改善の 1 周 — 終わりが次の始まりになる 4 工程", "en": "One Turn of the Loop — Four Stages Where the End Becomes the Start" }, "summary": { "ja": "環に沿って 4 工程を並べ、矢が戻ることで「終わりが次の始まり」を示す。工程の色は変えず、順序だけに意味を持たせる", "en": "Four stages around a ring, with the arrow returning to where it began. The stages are not colour-coded — order is the only thing carrying meaning" }, "capturedAt": "2026-09-16", "categories": [ "presentation" ], "tags": [ "minimal", "typography" ], "useCases": [ "process" ], "format": "slide-16x9", "density": "low", "layout": { "kind": "radial", "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 }, "step": { "size": 44, "weight": 700, "leading": 1 }, "period": { "size": 26, "weight": 500, "leading": 1.4 }, "name": { "size": 30, "weight": 700, "leading": 1.35 }, "detail": { "size": 22, "weight": 400, "leading": 1.7 }, "note": { "size": 16, "weight": 400, "leading": 1.6 } }, "colors": { "ground": "#FFFFFF", "surface": "#F4F6F9", "ink": "#131820", "muted": "#667183", "accent": "#1F5FA8", "rule": "#DBE1E9", "series": [] }, "rules": [ { "ja": "工程ごとに色を変えない。色を変えると読み手は色にも意味を探し始めるが、この図で意味を運ぶのは環に沿った順序だけである", "en": "Do not colour the stages differently. A reader will look for meaning in colour if it varies, and here the only thing carrying meaning is the order around the ring" }, { "ja": "矢を最後の工程から最初へ戻す。戻りの 1 本が無いと、これは 4 段の手順であって周ではなくなる", "en": "Close the ring with an arrow from the last stage back to the first. Without that one arc this is a four-step procedure, not a cycle" }, { "ja": "中心に周の長さを置く。1 周がどれだけで回るのかが分からない循環図は、いつまでも回り続ける絵に見える", "en": "Put the period at the centre. A cycle that never says how long one turn takes reads as a loop that simply runs forever" }, { "ja": "工程の説明は環の外側に、それぞれの節へ寄せて置く。輪の内側に入れると、文の長さが輪の太さを決めるようになる", "en": "Keep the stage text outside the ring and leaning toward its node. Inside, the length of a sentence starts dictating the thickness of the ring" }, { "ja": "工程は 4 つまで。5 つを超えると節の間隔が狭まり、どの矢がどの工程へ向かうのかを目で追えなくなる", "en": "Four stages at most. Beyond five the nodes crowd and the eye can no longer follow which arc leads to which stage" } ], "cover": "https://design-vault.pages.dev/_astro/cover.DY4lLnpv.png", "assets": [], "shortlist": false, "status": "published", "relations": { "similar": [ "donut-share-center-total" ] }, "license": "Original", "publishedAt": null, "reproduction": { "spec": { "format": "slide-16x9", "density": "low", "layout": { "kind": "radial", "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 }, "step": { "size": 44, "weight": 700, "leading": 1 }, "period": { "size": 26, "weight": 500, "leading": 1.4 }, "name": { "size": 30, "weight": 700, "leading": 1.35 }, "detail": { "size": 22, "weight": 400, "leading": 1.7 }, "note": { "size": 16, "weight": 400, "leading": 1.6 } }, "colors": { "ground": "#FFFFFF", "surface": "#F4F6F9", "ink": "#131820", "muted": "#667183", "accent": "#1F5FA8", "rule": "#DBE1E9" }, "rules": [ "Do not colour the stages differently. A reader will look for meaning in colour if it varies, and here the only thing carrying meaning is the order around the ring", "Close the ring with an arrow from the last stage back to the first. Without that one arc this is a four-step procedure, not a cycle", "Put the period at the centre. A cycle that never says how long one turn takes reads as a loop that simply runs forever", "Keep the stage text outside the ring and leaning toward its node. Inside, the length of a sentence starts dictating the thickness of the ring", "Four stages at most. Beyond five the nodes crowd and the eye can no longer follow which arc leads to which stage" ] }, "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\nstep 44px / 700 / 行送り 1\nperiod 26px / 500 / 行送り 1.4\nname 30px / 700 / 行送り 1.35\ndetail 22px / 400 / 行送り 1.7\nnote 16px / 400 / 行送り 1.6\n\n## 配色\n地 #FFFFFF / 面 #F4F6F9 / 文字 #131820 / 補助 #667183 / 強調 #1F5FA8 / 罫 #DBE1E9\n\n## 外すと崩れる点\n- 工程ごとに色を変えない。色を変えると読み手は色にも意味を探し始めるが、この図で意味を運ぶのは環に沿った順序だけである\n- 矢を最後の工程から最初へ戻す。戻りの 1 本が無いと、これは 4 段の手順であって周ではなくなる\n- 中心に周の長さを置く。1 周がどれだけで回るのかが分からない循環図は、いつまでも回り続ける絵に見える\n- 工程の説明は環の外側に、それぞれの節へ寄せて置く。輪の内側に入れると、文の長さが輪の太さを決めるようになる\n- 工程は 4 つまで。5 つを超えると節の間隔が狭まり、どの矢がどの工程へ向かうのかを目で追えなくなる\n\n内容は［ここに自分の内容を書く］に置き換えてください。寸法と配色はそのまま守ってください。\n正確に再現する場合は、この HTML をそのまま使ってください: https://design-vault.pages.dev/designs/cycle-four-stage-loop/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\nstep 44px / 700 / leading 1\nperiod 26px / 500 / leading 1.4\nname 30px / 700 / leading 1.35\ndetail 22px / 400 / leading 1.7\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- Do not colour the stages differently. A reader will look for meaning in colour if it varies, and here the only thing carrying meaning is the order around the ring\n- Close the ring with an arrow from the last stage back to the first. Without that one arc this is a four-step procedure, not a cycle\n- Put the period at the centre. A cycle that never says how long one turn takes reads as a loop that simply runs forever\n- Keep the stage text outside the ring and leaning toward its node. Inside, the length of a sentence starts dictating the thickness of the ring\n- Four stages at most. Beyond five the nodes crowd and the eye can no longer follow which arc leads to which stage\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/cycle-four-stage-loop/pattern.html." }, "code": { "html": "\n\n改善の 1 周 — 終わりが次の始まりになる 4 工程\n\n\n\n\n
\n
\n
\n

改善の 1 周 — 終わりが次の始まりになる 4 工程

\n

開発チーム 6 名 / 2026 年 4 月から運用 / 周の長さは変えない

\n
\n\n \n
\n
\n
決める
\n
やらないことを先に決めて範囲を閉じる
\n
\n\n
\n
作る
\n
1 周に収まる大きさへ削ってから着手する
\n
\n\n
\n
確かめる
\n
使う人に見せ、役に立つかを測る
\n
\n\n
\n
振り返る
\n
次の周で変える点を 1 つだけ決める
\n
\n\n
\n \n \n \n \n \n \n \n\n \n\n \n \n \n \n\n \n \n \n \n\n 1\n 2\n 3\n 4\n\n 2 週間で 1 周\n \n
\n
\n\n
工程の名前は組織によって違う。ここでは受け入れ条件・実装・検証・振り返りの 4 つを 1 周として数える。
\n
\n
\n", "url": "https://design-vault.pages.dev/designs/cycle-four-stage-loop/pattern.html", "fonts": [ "https://design-vault.pages.dev/designs/cycle-four-stage-loop/font.css", "https://design-vault.pages.dev/designs/cycle-four-stage-loop/font-0.woff2", "https://design-vault.pages.dev/designs/cycle-four-stage-loop/font-1.woff2", "https://design-vault.pages.dev/designs/cycle-four-stage-loop/font-2.woff2" ] } }, "urls": { "ja": "https://design-vault.pages.dev/designs/cycle-four-stage-loop", "en": "https://design-vault.pages.dev/en/designs/cycle-four-stage-loop" }, "notesMarkdown": "循環図が手順図と違うのは、戻りの 1 本だけである。その 1 本を描き忘れた循環図は\n驚くほど多く、そうなると「4 つ目が終わったら解散」という別の意味の絵になる。\n\n中心を空けておくのは、ドーナツと同じ理由ではない。ここに置くべきは母数ではなく\n**周の長さ**である。1 周が 2 週間なのか 1 年なのかで、同じ 4 工程がまったく違う\n働き方を指す。" }