인라인 비주얼라이저: 로컬 AI 모델로 대화형 HTML 시각화 렌더링

인라인 비주얼라이저는 로컬 AI 모델이 채팅 내에서 직접 대화형 HTML/SVG 시각화를 렌더링할 수 있게 해주는 Open WebUI 플러그인으로, 시각적 요소와 AI 모델 간의 양방향 통신을 가능하게 합니다.

주요 기능

이 플러그인은 모델에 디자인 시스템과 렌더링 도구를 제공합니다. 모델이 HTML/SVG 조각을 작성하면, 이 도구가 다크 모드를 지원하는 테마가 적용된 셸로 감싸 채팅 내에 인라인으로 렌더링합니다. JavaScript 브리지를 통해 시각화 내부의 요소들이 채팅 인터페이스로 메시지를 다시 보낼 수 있습니다.

주요 특징

툴 호출을 지원하는 모든 모델과 호환: Qwen, Mistral, Gemma, DeepSeek, Gemini, Claude, GPT
BSD-3 라이선스 - 포크, 수정, 자유롭게 사용 가능
iframe 내 iframe 없음, 외부 서비스 불필요, API 키 필요 없음
대화형 요소가 AI 모델로 메시지를 다시 보낼 수 있음

사용 예시

노드를 클릭하면 AI가 해당 구성 요소에 대해 설명하는 아키텍처 다이어그램
적절한 다크/라이트 모드 테마가 적용된 Chart.js 대시보드
AI가 답안을 채점하는 대화형 퀴즈
선택 사항을 수집하여 모델로 전송하는 선호도 양식
확장 가능한 섹션과 호버 효과가 있는 설명 자료
모델이 작성할 수 있는 모든 HTML/SVG/JS 콘텐츠

요구사항

Open WebUI (자체 호스팅)
툴 호출을 지원하는 모든 모델
두 파일을 붙여넣고 설치 설정을 따르는 데 1분 미만 소요

성능 고려사항

제작자는 성능이 모델의 초당 토큰 처리량(TPS)에 따라 달라진다고 언급했습니다. 한 자릿수 TPS의 경우 렌더링된 결과물이 나타나기까지 약 1분 정도 기다려야 할 수 있습니다. 데모에서는 속도를 위해 Claude Haiku를 사용했지만, 이 도구는 Qwen3.5 27b(느리지만 기능적)로도 테스트되었습니다.