nicobailon/visual-explainer

해결하는 문제

코딩 에이전트는 복잡한 개념을 설명할 때 종종 ASCII 아트와 텍스트 기반 테이블에 의존하지만, 터미널에서는 빠르게 읽기 어려워집니다. 이 프로젝트는 에이전트가 스타일링된 HTML 페이지를 생성할 수 있는 기능을 제공하여, 시스템 아키텍처, 차이점 리뷰, 요구사항 비교를 훨씬 쉽게 읽을 수 있도록 합니다.

작동 방식

이 도구는 에이전트 출력을 브라우저에서 바로 열 수 있는 자체 포함형 HTML 페이지로 변환합니다. 줌 및 팬 기능을 지원하는 인터랙티브한 Mermaid 다이어그램과 다크 모드 및 라이트 모드 테마를 지원합니다. Claude Code, Cursor, Pi 등의 다양한 AI 에이전트용 플러그인 또는 스킬로 통합할 수 있으며, 로컬 stdio MCP 서버로 실행하여 렌더링 도구와 프롬프트 템플릿을 노출할 수도 있습니다.

대상 사용자

워크플로우를 벗어나지 않고도 복잡한 기술 데이터, 아키텍처 다이어그램, 코드 리뷰를 명확하고 시각적으로 표현이 필요한 개발자.

주요 특징

• 광범위한 에이전트 호환성: Claude Code, Cursor, Pi, Antigravity CLI, Codex CLI, OpenCode와 호환됩니다.
• 인터랙티브 시각화: 줌 및 팬 기능을 지원하는 Mermaid를 사용한 다이어그램.
• MCP 통합: 표준화된 도구 노출을 위한 로컬 MCP 서버 제공.
• 빌드 단계 없음: 일반 사용 시 빌드 단계가 필요 없으며 웹 브라우저만 있으면 됩니다.
• PPTX 내보내기: 간단한 HTML 슬라이드 덱을 PowerPoint 프레젠테이션으로 변환하는 유틸리티 포함.