기타 Hacker News · 2026-09-26

"A 옆에 B 둬" 좌표 없이 문장으로 배치하는 새 다이어그램 툴 등장

핵심 요약
  • 절대 좌표나 자동 레이아웃 대신 노드 간의 상대적인 위치 관계를 텍스트로 기술해 다이어그램을 생성하는 도구 'reladraw'가 공개되었습니다.
  • 기존 머메이드의 배치 제어 한계와 draw.io의 수동 편집 번거로움을 해결하며, AI 에이전트가 문장 수정만으로 쉽게 다이어그램을 고칠 수 있도록 설계되었습니다.
  • 현재 0.4.0 버전으로 독립 실행형 SVG 렌더러를 지원하며 주요 AI 코딩 에이전트를 위한 스킬 패키지도 함께 제공됩니다.
요약 개발자들이 다이어그램을 그릴 때 쓰는 툴들은 보통 두 가지 극단으로 나뉩니다. 머메이드(Mermaid)나 그래프비즈(Graphviz) 같은 도구는 텍스트로 노드와 연결 관계만 적어두면 알아서 배치해 주지만, 사용자가 원하는 위치에 특정 요소를 배치하기 어렵다는 단점이 있습니다. 반대로 draw.io나 피그마(Figma) 같은 도구는 마우스로 원하는 위치에 정확히 둘 수 있지만, 구조가 복잡해질수록 일일이 손으로 수정해야 해서 번거롭고 AI 에이전트가 좌표값을 계산해 편집하기에도 매우 비효율적입니다. 이번에 공개된 오픈소스 프로젝트 '렐라드로우(reladraw)'는 이 두 방식의 중간 지점을 노리고 등장했습니다. 절대 좌표(x, y 픽셀)를 전혀 쓰지 않으면서도, "A 노드의 오른쪽", "B 노드 위쪽", "C와 D 사이"처럼 요소들 간의 '상대적 위치'를 텍스트 문장 형태로 기술하는 방식입니다. 들여쓰기나 중첩 구조가 없어서 각 라인이 독립적이며, 레이아웃 엔진이 이 상대적인 설명들을 종합해 자동으로 전체 다이어그램을 완성합니다. 특히 이 방식은 최근 늘어난 AI 코딩 에이전트(Claude Code, Cursor 등)와의 협업에 최적화되어 있습니다. AI에게 "인증 서비스를 왼쪽으로 옮겨줘"라고 지시할 때, 절대 좌표 기반 툴에서는 숫자를 역산해야 하고 자동 배치 툴에서는 배치를 직접 제어할 수 없지만, reladraw는 해당 설명 문장만 고치면 바로 배치가 바뀌기 때문입니다. 현재 0.4.0 버전으로 타입스크립트 기반 파서와 SVG 렌더러를 제공하며, AI 에이전트용 스킬 파일도 함께 배포되고 있습니다.
Sponsored · 광고