์ฝ˜ํ…์ธ ๋กœ ์ด๋™

์–ธ์–ด ์„ ํƒ

ํ˜„์žฌ ์–ธ์–ด: ํ•œ๊ตญ์–ด

Diagrams

Mermaid sources (.mmd) and exported SVGs for OmniRoute v3.8.0 architecture flows.

Source Exported Used in
request-pipeline.mmd SVG docs/architecture/ARCHITECTURE.md, docs/architecture/CODEBASE_DOCUMENTATION.md
auto-combo-scoring.mmd SVG docs/routing/AUTO-COMBO.md
resilience-3layers.mmd SVG docs/architecture/RESILIENCE_GUIDE.md, CLAUDE.md
i18n-flow.mmd SVG docs/guides/I18N.md
mcp-tools.mmd SVG docs/frameworks/MCP-SERVER.md
cloud-agent-flow.mmd SVG docs/frameworks/CLOUD_AGENT.md
authz-pipeline.mmd SVG docs/architecture/AUTHZ_GUIDE.md
db-schema-overview.mmd SVG docs/architecture/CODEBASE_DOCUMENTATION.md

Not every diagram comes from a .mmd source. Hand-authored SVGs live at this directoryโ€™s root and animate with SMIL only (no JS, no external fonts), so they play inside GitHubโ€™s <img> sandbox:

File Used in Notes
tier-cascade.svg README.md (root) Animated 4-tier auto-fallback cascade (16s loop, 4 acts). Edit the SVG directly โ€” there is no .mmd source.
pool-fair-share.svg โ€” (unused) Animated key-pool fair-share quota (generous โ†’ strict, 16s loop). Edit the SVG directly โ€” there is no .mmd source.
combo-always-on.svg style reference Animated priority-combo fallback (4 layers, 16s loop). Edit the SVG directly โ€” there is no .mmd source.
cli-terminal.svg README.md (root) Compact half-height animated terminal (1200ร—350): 3 real CLI commands cycling with typewriter + scrolling subcommand ticker; first frame = completed providers screen. Edit the SVG directly โ€” there is no .mmd source.
compression-pipeline.svg README.md (root) Animated 12-engine compression funnel (8s loop). Edit the SVG directly โ€” there is no .mmd source.
free-tier-budget.svg README.md (root) Animated free-tier budget card (~1.62B/mo quantified headline, 17-pool + Groq-caps budget bar, per-pool grid, signup credits, 10s loop). Edit the SVG directly โ€” there is no .mmd source.
readme-hero.svg README.md (root) Animated hero card (tagline, live provider/free-access headline, full-width compression bar demo, 6 stat chips). Edit the SVG directly โ€” there is no .mmd source.
promise-pillars.svg README.md (root) Animated โ€œThe Promiseโ€ 6-pillar card (12s border-highlight sweep). Edit the SVG directly โ€” there is no .mmd source.
why-pain-fix.svg README.md (root) Animated โ€œWhy OmniRouteโ€ 10-row pain-vs-fix ledger (15s green row sweep). Edit the SVG directly โ€” there is no .mmd source.
strategies-grid.svg README.md (root) Animated grid illustrating 18 of the 19 routing strategies; cache-optimized remains documented in the adjacent table. Edit the SVG directly โ€” there is no .mmd source.
privacy-local.svg README.md (root) Animated โ€œPrivate & Local-Firstโ€ 11-row guarantee ledger with receipt chips (16s green row sweep). Edit the SVG directly โ€” there is no .mmd source.
resilience-layers.svg README.md (root) Animated 3-layer resilience card (breaker states CLOSEDโ†’OPENโ†’HALF-OPEN, key cooldown with ร—2 backoff, model lockout โ€” 18s loops). Edit the SVG directly โ€” there is no .mmd source.
  1. Edit *.mmd.
  2. Re-render: npm run docs:render-diagrams (uses @mermaid-js/mermaid-cli).
  3. Commit both .mmd and .svg.

If @mermaid-js/mermaid-cli is not available locally, install it once:

ํ„ฐ๋ฏธ๋„ ์ฐฝ
npm install -g @mermaid-js/mermaid-cli

The script renders every .mmd in docs/diagrams/ into docs/diagrams/exported/*.svg with a white background, suitable for both dark and light themes.

From a doc in docs/<subfolder>/, the relative path becomes ../diagrams/...:

![Request pipeline](../diagrams/exported/request-pipeline.svg)
> Source: [../diagrams/request-pipeline.mmd](../diagrams/request-pipeline.mmd)

From the repo root (e.g. CLAUDE.md):

![Resilience layers](./exported/resilience-3layers.svg)
  • One concept per diagram. Donโ€™t try to fit the whole platform in one chart.
  • Keep node labels short (3-6 words). Use <br/> for line breaks inside nodes.
  • Prefer flowchart LR for pipelines and flowchart TB for layered models.
  • Use sequenceDiagram for interactive (request/response) flows.
  • Use erDiagram for database schema overviews.
  • Update both .mmd and .svg in the same commit. Keep them in lock-step.

undefined (a58000c7685f)

HagiCode

HagiCode๋Š” ์—์ด์ „ํŠธ ์ฝ”๋”ฉ ์ž‘์—… ๊ณต๊ฐ„์ž…๋‹ˆ๋‹ค. ํ’๋ถ€ํ•˜๊ณ  ํŽธ๋ฆฌํ•œ UI ์ƒํ˜ธ์ž‘์šฉ์œผ๋กœ ๊ณ„ํš ์ˆ˜๋ฆฝ, ์—์ด์ „ํŠธ ์‹คํ–‰, ํ”„๋กœ์ ํŠธ ์ž‘์—…์„ ์‰ฝ๊ฒŒ ์‹œ์ž‘ํ•˜๊ณ  ๋”ฐ๋ผ๊ฐ€๋ฉฐ ๊ฐœ๋ฐœ์„ ๋” ํฅ๋ฏธ๋กœ์šด ๊ฒฝํ—˜์œผ๋กœ ๋งŒ๋“ญ๋‹ˆ๋‹ค.

ํ’๋ถ€ํ•˜๊ณ  ํŽธ๋ฆฌํ•œ UI ์ƒํ˜ธ์ž‘์šฉ์œผ๋กœ ๊ณ„ํš๋ถ€ํ„ฐ ํ”„๋กœ์ ํŠธ ์ž‘์—…๊นŒ์ง€ ์‰ฝ๊ฒŒ ๋”ฐ๋ผ๊ฐˆ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

HagiCode ๋ฐฉ๋ฌธ๋ฌธ์„œ ์ฝ๊ธฐ
  • ์Šค๋งˆํŠธOpenSpec ์›Œํฌํ”Œ๋กœ๋Š” ์˜๋„๋ฅผ ์ œ์•ˆ, ์„ค๊ณ„, ์ž‘์—…์„ ๊ฑฐ์ณ ๋ฐฐํฌ๊นŒ์ง€ ์ด์–ด์ง€๋Š” ์‹คํ–‰ ๊ฐ€๋Šฅํ•œ ๊ฒฝ๋กœ๋กœ ๋ฐ”๊ฟ‰๋‹ˆ๋‹ค.
  • ํšจ์œจ์ ๋‹ค์ค‘ ์—์ด์ „ํŠธ ์‹คํ–‰์œผ๋กœ ์กฐ์‚ฌ, ๊ตฌํ˜„, ๊ฒ€ํ† ๋ฅผ ๋ณ‘๋ ฌ๋กœ ์ง„ํ–‰ํ•˜๋ฉฐ ์—ฌ๋Ÿฌ ์ €์žฅ์†Œ์™€ ์ต์ˆ™ํ•œ Agent CLI๋ฅผ ์ง€์›ํ•ฉ๋‹ˆ๋‹ค.
  • ํฅ๋ฏธ๋กœ์šดํ’๋ถ€ํ•˜๊ณ  ํŽธ๋ฆฌํ•œ UI ์ƒํ˜ธ์ž‘์šฉ์œผ๋กœ ๊ณ„ํš ์ˆ˜๋ฆฝ, ์—์ด์ „ํŠธ ์‹คํ–‰, ํ”„๋กœ์ ํŠธ ์ž‘์—…์„ ์‰ฝ๊ฒŒ ์‹œ์ž‘ํ•˜๊ณ  ๋”ฐ๋ผ๊ฐˆ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

Windows์šฉ ๋‹ค์šด๋กœ๋“œ

Microsoft Store์—์„œ ๋ฐ›๊ธฐ๋ชจ๋“  ๋‹ค์šด๋กœ๋“œ

์•„์ด๋””์–ด๋ฅผ ์‹ค์ œ๋กœ ๋ฐฐํฌ๋˜๋Š” ์†Œํ”„ํŠธ์›จ์–ด๋กœ.

HagiCode๋Š” ์—์ด์ „ํŠธ ์ฝ”๋”ฉ ์ž‘์—… ๊ณต๊ฐ„์ž…๋‹ˆ๋‹ค. OpenSpec ์›Œํฌํ”Œ๋กœ๋กœ ๋ณ€๊ฒฝ์„ ๊ณ„ํšํ•˜๊ณ , ๋‹ค์ค‘ ์—์ด์ „ํŠธ ์‹คํ–‰์œผ๋กœ ์ง„ํ–‰ํ•˜๋ฉฐ, Hero Scenario๋กœ ๊ธด ์ž‘์—…์˜ ์ง„ํ–‰ ์ƒํ™ฉ์„ ํ•œ๋ˆˆ์— ๋ณด์—ฌ ์•„์ด๋””์–ด๋ฅผ ์‹ค์ œ๋กœ ๋ฐฐํฌ๋˜๋Š” ์†Œํ”„ํŠธ์›จ์–ด๋กœ ๋งŒ๋“ญ๋‹ˆ๋‹ค.

์Šค๋งˆํŠธ
OpenSpec ์›Œํฌํ”Œ๋กœ๋Š” ์˜๋„๋ฅผ ์ œ์•ˆ๋ถ€ํ„ฐ ๋ฐฐํฌ๊นŒ์ง€ ์ด์–ด์ง€๋Š” ์‹คํ–‰ ๊ฐ€๋Šฅํ•œ ๊ฒฝ๋กœ๋กœ ๋ฐ”๊ฟ‰๋‹ˆ๋‹ค.
ํšจ์œจ์ 
๋‹ค์ค‘ ์—์ด์ „ํŠธ ์‹คํ–‰์œผ๋กœ ์กฐ์‚ฌ, ๊ตฌํ˜„, ๊ฒ€ํ† ๋ฅผ ๋ณ‘๋ ฌ๋กœ ์ง„ํ–‰ํ•ฉ๋‹ˆ๋‹ค.
์ฆ๊ฑฐ์šด
ํŽธ๋ฆฌํ•œ UI ์ƒํ˜ธ์ž‘์šฉ์œผ๋กœ ๊ณ„ํš, ์—์ด์ „ํŠธ ์‹คํ–‰, ํ”„๋กœ์ ํŠธ ์ž‘์—…์„ ์‰ฝ๊ฒŒ ๋”ฐ๋ผ๊ฐˆ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.