AI와 협력하는 벡터 디자인 도구 OpenPencil 공개

핵심 요약

• Rust로 완전히 재작성된 OpenPencil은 AI-네이티브 벡터 디자인 도구로, 프롬프트를 입력하면 실시간 스트리밍 애니메이션으로 캔버스에 UI가 생성된다.
• 여러 AI 에이전트가 동시에 다양한 영역(헤로, 기능, 푸터 등)을 작업하는 '동시 에이전트 팀' 기능으로 복잡한 페이지를 병렬 분해하고 생성한다.
• Claude, GPT-4o, Gemini, DeepSeek, Kimi, GLM 등 여러 LLM을 지원하며, 각 모델의 능력에 맞춰 프롬프트와 사고 모드를 자동 조정한다.
• MCP 서버 기능으로 Claude Code, Codex, OpenCode, Copilot CLI 등에 원클릭 설치하여 터미널에서 `.op` 파일을 읽고 수정할 수 있다.
• `.op` 파일은 JSON 포맷의 인간 친화적, Git 친화적 설계 파일이며, 디자인 변수는 CSS 커스텀 속성으로 변환된다.
• React + Tailwind, HTML + CSS, Vue, Svelte, Flutter, SwiftUI, Jetpack Compose, React Native 등 8개 플랫폼으로 코드 내보내기를 지원한다.
• 무한 캔버스, 자동 레이아웃, 다중 페이지, 불린 연산, 아이콘 선택기, 이미지 임포트, 디자인 변수 기능을 갖춘 풀스택 편집 환경을 제공한다.
• 50개 이상의 내장 스타일 가이드(글래스모피즘, 브루탈리즘, 레트로 등)를 태그 기반 퍼지 매칭으로 선택하여 생성된 디자인에 적용할 수 있다.
• Chrome 확장으로 웹페이지를 스냅샷하여 OpenPencil으로 직접 임포트하며, Figma `.fig` 파일도 레이아웃과 효과를 보존하며 변환한다.
• 데스크톱 앱은 Electron 대신 winit와 GPU Skia를 사용한 단일 55.5MB 네이티브 바이너리이며, macOS, Windows, Linux를 지원한다.
• 웹 빌드는 8.2MB(gzip 2.18MB)이고, 10,000개 노드 문서도 레이아웃 스냅샷을 0.68초에 완료하며 캔버스 상호작용 중 CPU 오버헤드가 거의 없다.
• 실시간 협업 기능으로 인증된 피어투피어 세션 또는 공개 릴레이를 통해 10자 리전 태그 코드로 참여하고, 원격 커서와 충돌 해결 패널을 지원한다.
• CLI 도구 `op`로 터미널에서 디자인을 제어하거나 배치 처리할 수 있으며, 데스크톱 앱, 웹 서버, 헤드리스 파일 기반 서버와 함께 작동한다.