OpenClaw에서 Excalidraw 다이어그램을 손쉽게 생성하는 Excaliclaw 스킬 출시!
OpenClaw 환경에서 Excalidraw 다이어그램을 생성하는 Excaliclaw 스킬 개발
초기에는 MCP(Model Context Protocol) 렌더링 문제로 빈 다이어그램 생성, 수정 및 반복 작업을 통해 해결
Excalifont 폰트 및 레이블 처리 개선, 화살표 라우팅 기능 추가로 다이어그램 품질 향상
Excaliclaw 스킬의 핵심 원리
Excaliclaw는 OpenClaw에서 Excalidraw 다이어그램을 생성하기 위해 Excalidraw MCP(Model Context Protocol)를 활용한다.
초기 버전에서는 MCP 렌더링 문제로 빈 다이어그램이 생성되었으나, 전체 Excalidraw 씬(Scene) 페이로드(Payload)를 내보내는 방식으로 수정
Excalifont 폰트 및 레이블 처리를 위해 명시적인 텍스트 요소(Text Element) 사용
화살표 라우팅(Arrow Routing), 챗(Chat) 미리보기(Preview)를 위한 요소 크기 조정 등, 다이어그램 품질 향상을 위한 다양한 개선 사항 적용
OpenClaw 환경에서의 MCP(Model Context Protocol) 활용
본문에서는 OpenClaw에서 Excalidraw MCP를 사용하기 위한 설정 과정을 설명한다.
MCP 서버(Server) 저장소(Repository) 지정 및 스트림 가능한 HTTP(Streamable HTTP) 전송 방식 설정
OpenClaw는 기본적으로 SSE(Server Sent Events)를 사용하지만, MCP 명세(Specification)에 따라 스트림 가능한 HTTP를 사용하도록 변경
Excaliclaw 스킬 설치를 통해 OpenClaw 환경에서 다이어그램 생성 기능 사용 가능
결과적으로 OpenClaw 사용자는 Excaliclaw를 통해 Excalidraw 다이어그램을 손쉽게 생성하고 공유할 수 있다.
Excaliclaw 스킬의 개발 과정 및 개선 사항
Excaliclaw 개발 과정에서 발생한 문제점과 해결 방안을 제시한다.
초기 Kubernetes 다이어그램 생성 시 레이블(Label) 누락 및 Excalifont 폰트 문제 발생
명시적인 텍스트 요소 사용, 폰트 설정, 화살표 라우팅 등을 통해 다이어그램 품질 개선
반복적인 디버깅(Debugging) 과정을 통해 안정적인 다이어그램 생성 패턴 확립
결과적으로 Excaliclaw는 OpenClaw 환경에서 Excalidraw 다이어그램을 안정적으로 생성할 수 있도록 돕는 유용한 스킬로 자리 잡았다.
