메뉴
HN
Hacker News 39일 전

AI 에이전트를 위한 다이어그램 인프라

IMP
8/10
핵심 요약

에이전트가 다이어그램을 단순한 일회성 그림이 아닌, 추적 및 수정 가능한 영구적인 상태(durable state)로 다룰 수 있게 해주는 전용 인프라입니다. DSP(Diagram Scene Protocol)라는 기계 인터페이스를 통해 노드와 엣지를 선언하면, 내장된 레이아웃 엔진이 기하학적 배치를 자동으로 계산하여 SVG, PNG 등의 다양한 형태로 렌더링합니다. 체계적인 검증, 증분 편집(수정 시 전체 재생성 불필요), 버전 관리 기능을 제공하여 여러 에이전트가 협업하는 프로덕션 환경에 적합한 것이 특징입니다.

번역된 본문

에이전트를 위한 다이어그램 인프라

에이전트는 다이어그램을 단순한 일회성 출력물이 아닌 영구적인 상태(durable state)로 생성, 편집, 검증 및 렌더링합니다. Diagram Scene Protocol(DSP)을 통해 구조적인 작업, 불변(immutable) 수정 내역, 40개 이상의 검증 규칙 및 다양한 렌더링 대상을 지원합니다.

문서 읽기 | 플레이그라운드 체험하기 | 사용 사례 →

zindex 아키텍처: 에이전트 → DSP → 검증(validate) → 정규화(normalize) → 레이아웃(scene layout) → 렌더링(render) → SVG/PNG

프로토콜 (The Protocol) DSP(Diagram Scene Protocol)는 다이어그램을 위한 기계용 인터페이스입니다. 에이전트는 '어떻게 그릴 것인가'가 아니라 '무엇이 존재하는가'를 설명합니다.

example.scene.json 예시 { "schemaVersion": "0.1", "scene": { "id": "payments-arch", "units": "px" }, "elements": [ { "id": "api", "kind": "node", "nodeType": "service", "shape": "roundedRect", "label": "API Gateway" }, { "id": "queue", "kind": "node", "nodeType": "queue", "label": "Job Queue" }, { "id": "e1", "kind": "edge", "from": { "elementId": "api" }, "to": { "elementId": "queue" }, "router": "orthogonal" } ] }

도형이 아닌 의미론적 접근 (Semantic, not geometric) 에이전트는 노드, 엣지 및 관계를 선언합니다. 레이아웃은 수동 배치가 아닌 자동으로 계산됩니다.

내장된 레이아웃 엔진 (Layout engine built in) Sugiyama 스타일의 계층적 레이아웃 파이프라인이 위치, 엣지 경로 및 라벨 배치를 자동으로 알아냅니다. 에이전트는 그래프를 묘사하고, 엔진이 기하학을 처리합니다.

패치 적용 가능 (Patchable) 안정적인 ID(Stable IDs)를 통해 점진적인 업데이트가 가능합니다. 전체 다이어그램을 다시 생성할 필요 없이 노드를 추가하거나 엣지를 이동할 수 있습니다.

렌더러 독립성 (Renderer-agnostic) 하나의 표준화된 장면(scene)으로 여러 출력물을 생성합니다. 4가지 렌더 테마(clean, dark, blueprint, sketch)를 적용한 SVG 및 PNG 출력을 지원합니다.

결정론적 실행 (Deterministic) 동일한 입력은 동일한 출력을 생성합니다. 검증(Validate) → 정규화(normalize) → 레이아웃(layout) → 렌더(render)의 모든 단계를 검사하고 추적할 수 있습니다.

왜 Zindex인가? 다이어그램에는 단순한 마크업 생성을 넘어 검증, 레이아웃, 버전 관리 및 다중 형식 렌더링이 필요합니다.

  1. 증분 편집 (Incremental editing): 전체 재생성 대신 패치(Patch) 기반 업데이트를 제공합니다. 에이전트는 나머지 다이어그램을 보존하면서 개별 요소를 수정할 수 있습니다.

  2. 결정론적 실행 (Deterministic execution): 실행할 때마다 일관된 결과를 보장하며, 오류 발생 시 원인을 명확히 파악할 수 있습니다. 파이프라인의 모든 단계를 검사할 수 있습니다.

  3. 영구적인 상태 (Durable state): 수정 내역(Revision history), 차이점(diffs), 안정적인 ID를 제공합니다. 다이어그램은 임시 출력물이 아닌 버전 관리되는 결과물입니다.

  4. 다중 에이전트 지원 (Multi-agent ready): 여러 에이전트가 다이어그램을 공동 작업할 수 있는 공유 인프라를 제공합니다. 단순한 1회성 생성기가 아닙니다.

  5. 도메인 인식 (Domain-aware): 일반적인 벡터 도형이 아닌 아키텍처, BPMN 워크플로, ER 다이어그램, 시퀀스 다이어그램, 조직도 및 네트워크 토폴로지에 맞게 특수 제작되었습니다.

  6. 프로덕션 등급 (Production-grade): 17가지 작업 유형, 40개 이상의 의미론적 검증 규칙을 갖추고 있으며 인증(Auth), 속도 제한(rate limiting), PostgreSQL 스토리지를 지원합니다.

적용 위치 (Where it fits) Zindex는 에이전트의 추론(reasoning)과 시각적 출력 사이의 중간 계층 역할을 합니다.

  • 에이전트 / LLM은 무엇을 변경할지 결정합니다.
  • Zindex는 DSP 프로토콜을 통해 변경 사항을 적용합니다.
  • 렌더러가 그 결과를 표시합니다.

Zindex가 애플리케이션 상태에 대한 데이터베이스 역할을 하듯, 이것은 다이어그램을 위한 데이터베이스입니다. 다이어그램을 영구적인 상태로 생성, 업데이트, 검증 및 렌더링하는 에이전트 네이티브 런타임입니다.

원문 보기
원문 보기 (영어)
diagram infrastructure for agents Agents create, edit, validate, and render diagrams as durable state - not throwaway output. Structured operations, immutable revisions, 40+ validation rules, and multiple render targets through the Diagram Scene Protocol (DSP). Read the docs Try the playground Use cases → zindex architecture agent DSP zindex validate normalize scene layout render SVG PNG the protocol DSP (Diagram Scene Protocol) is the machine interface for diagrams. Agents describe what exists, not how to draw it. example.scene.json { " schemaVersion " : " 0.1 " , " scene " : { " id " : " payments-arch " , " units " : " px " }, " elements " : [ { " id " : " api " , " kind " : " node " , " nodeType " : " service " , " shape " : " roundedRect " , " label " : " API Gateway " }, { " id " : " queue " , " kind " : " node " , " nodeType " : " queue " , " label " : " Job Queue " }, { " id " : " e1 " , " kind " : " edge " , " from " : { " elementId " : " api " }, " to " : { " elementId " : " queue " }, " router " : " orthogonal " } ] } Semantic, not geometric Agents declare nodes, edges, and relationships. Layout is computed, not hand-placed. Layout engine built in A Sugiyama-style hierarchical layout pipeline figures out positions, edge routes, and label placement automatically. Agents describe the graph; the engine handles the geometry. Patchable Stable IDs enable incremental updates. Add a node, move an edge - without regenerating the entire diagram. Renderer-agnostic One canonical scene, multiple outputs: SVG and PNG with 4 render themes (clean, dark, blueprint, sketch). Deterministic Same input, same output. Validate → normalize → layout → render. Every step is inspectable. why zindex Diagrams need validation, layout, versioning, and multi-format rendering - not just markup generation. 01 Incremental editing Patch-based updates instead of full regeneration. Agents can modify individual elements while preserving the rest. 02 Deterministic execution Consistent output across runs. Failures are explainable. The pipeline is inspectable at every step. 03 Durable state Revision history, diffs, stable IDs. Diagrams are versioned artifacts, not ephemeral outputs. 04 Multi-agent ready Shared infrastructure for multiple agents collaborating on diagrams. Not just a single-shot generator. 05 Domain-aware Purpose-built for architecture, BPMN workflows, ER diagrams, sequence diagrams, org charts, and network topology - not generic vector shapes. 06 Production-grade 17 operation types. 40+ semantic validation rules. Auth, rate limiting, PostgreSQL storage. where it fits Zindex is the middle layer between agent reasoning and visual output. agents / LLMs decide what should change zindex apply changes through DSP protocol renderers display the result Zindex is to diagrams what a database is to application state. The agent-native runtime for creating, updating, validating, and rendering diagrams as durable state.