프로젝트 소개

fireworks-tech-graph는 Codex와 Claude Code에서 변경 없이 실행되는 Agent Skill입니다. 자연어 설명(영어 또는 중국어)을 기하 검증된 SVG 다이어그램, 고해상도 PNG 내보내기, 검증된 SVG-to-GIF 의미 기반 모션, 단일 오프라인 인터랙티브 HTML 파일로 변환합니다. 핵심 기능 - 12가지 시각 스타일: 11개의 생성기 기반 프로필과 1개의 AI 작성 스타일(Dark Luxury). 네 가지 엔지니어링 우선 스타일은 C4 리뷰, 클라우드 배포, 이벤트 스트림, 신뢰성 조사를 위한 실행 가능한 계약을 추가합니다. - 전체 UML을 지원하는 14가지 다이어그램 유형: Class, Component, Deployment, Package, Composite Structure, Object, Use Case, Activity, State Machine, Sequence, Communication, Timing, Interaction Overview, ER Diagram과 함께 RAG, Agentic Search, Mem0, Multi-Agent, Tool Call 같은 AI/Agent 도메인 패턴을 제공합니다. - 의미 기반 어휘: 도형이 역할을 인코딩하고(LLM은 이중 테두리 사각형, Agent는 육각형, Vector Store는 링이 있는 원기둥), 화살표 색상/점선 패턴이 의미를 인코딩합니다(쓰기, 읽기, 비동기, 루프). - 라우팅 및 레이아웃: 정확한 웨이포인트를 가진 결정적 직교 경로, 구분된 포트, 자동 범례 재배치, 캔버스 내부에 유지되는 레이블, 불가피한 교차에 대한 검증된 브리지 점프를 제공합니다. - 검증: 버전이 지정된 diagram IR이 레거시 JSON을 스키마 v1로 정규화하고 중복 ID, 끊어진 참조, 잘못된 웨이포인트 또는 비유한 기하에서 실패합니다. 구조화된 SVG 검사는 XML 및 마커 무결성과 노드, 예약 영역, 레이블, 캔버스, 엣지 겹침, 엣지 교차 조건을 다룹니다. - 출력: 편집용 SVG와 삽입용 1920px PNG. 외부 폰트 페칭이 없는 순수 인라인 SVG로, cairosvg, rsvg-convert, 헤드리스 Chrome에서 렌더링되도록 설계되었습니다. 통합 CLI는 render, validate, check, export-html, animate를 지원하며, HTML 내보내기는 팬/줌, 라이트/다크 테마, 소스 복사, 1x-4x의 SVG/PNG/JPEG/WebP 다운로드를 추가합니다. - 모션: animate 명령은 승인된 12가지 모션 계약 중 하나를 담은 생성된 의미 기반 SVG를 받아 GIF와 motion.json 검증 보고서를 출력합니다. 문서화된 기본값은 960px, 5.75초, 20fps, 115 프레임 샘플이며, 커넥터는 의미 순서대로 그려집니다. 더 짧은 75프레임 및 55프레임 타임라인도 지원됩니다. - 시각적 검토 게이트: 내보낸 PNG는 클리핑, 겹침, 레이블 배치, 라우팅 회귀에 대해 검사되며, 기본적으로 최대 두 번의 집중 교정 패스를 수행합니다. 런타임이 이미지를 읽을 수 없으면 이 스킬은 검증을 주장하는 대신 visual_review를 건너뛴 것으로 보고합니다. - 제품 아이콘: 브랜드 색상을 가진 40개 이상의 제품과 복잡한 아키텍처를 위한 자동 스윔레인 그룹화를 제공합니다. 설치 및 요구 사항 설치는 skills CLI를 통해 중첩 경로 skills/fireworks-tech-graph를 사용하거나, 저장소를 ~/.agents/skills(Codex) 또는 ~/.claude/skills(Claude Code)에 클론하여 수행합니다. 심볼릭 링크를 사용하는 공유 체크아웃도 문서화되어 있습니다. Python 3.9+가 필요합니다. SVG/PNG 스크립트에는 cairosvg(권장) 또는 rsvg-convert가 필요합니다. 선택적 GIF 내보내기에는 FFmpeg/FFprobe, Chrome/Chromium, puppeteer 또는 puppeteer-core가 필요하며, Puppeteer 경로에는 Node.js 22.12+가 필요합니다. README는 이 프로젝트를 Mermaid 및 draw.io와 비교하며, 자연어 입력을 받고, AI/Agent 도메인 패턴을 포함하며, 내장 스타일을 제공하고, 고해상도 PNG를 자동으로 내보내며, 온라인 도구가 필요 없다는 점을 언급합니다. MIT 라이선스로 배포됩니다.