AI 에이전트와 함께 보는
살아있는 코드베이스

ViewWork 는 디렉토리 구조 · AI 에이전트의 작업 흐름 · 사용자 IDE 활동 · dev 서버 트래픽을 한 화면에서 실시간으로 2D / 2.5D / 3D 로 시각화하는 데스크톱 앱입니다. 어떤 파일을 누가 읽고, 어떤 URL 을 탐색 중이며, DB 어느 테이블을 호출하는지 — 노드맵 위 캐릭터로 직접 확인하세요.

📸 hero screenshot — 3D 노드맵 + 캐릭터 활동 /web/assets/screenshots/hero.png

한 화면에 모두 담긴 코드 + 활동

단순한 트리뷰가 아닙니다. ViewWork 는 분석 + 워치 + 추적 + 시각화를 한 데 모아 코드와 실시간 활동을 캐릭터 아바타 + 가상 노드 + 데이터 흐름 입자로 그립니다.

🌐

2D / 2.5D / 3D 동시 지원

같은 데이터를 React Flow 2D, 아이소메트릭 2.5D, Three.js 3D 로 자유롭게 전환. 4가지 레이아웃 (수평 / 수직 / 방사형 / 부피 트리) 즉시 적용.

🤖

AI 에이전트 자동 추적

Claude Code · OpenAI Codex · Cursor · GitHub Copilot · Windsurf 의 세션 로그를 자동 감지. 어떤 도구로 어느 파일을 read / edit / write 중인지 캐릭터가 노드 위로 이동하며 표시.

🧠

외부 활동도 시각화

프로젝트 외부의 활동까지 추적 — WebFetch / WebSearch URL 별 가상 노드, LLM thinking, 텍스트 답변 출력 모두 그래프 위에 등장합니다.

🗄️

MCP + DB 스키마 통합

.mcp.json 의 모든 MCP 서버, Prisma / Drizzle / SQL migration 의 테이블 구조와 외래키 관계까지 자동 추출 + 노드맵에 표시.

👥

방문자 / dev 서버 추적

dev 서버 reverse proxy 로 라이브 visitor 의 페이지뷰 · API 호출 · 폼 제출까지 캡처. LAN 공유로 다른 기기 방문자도 캐릭터로 보입니다.

🎨

커스텀 캐릭터 + 3D 모델

PNG / SVG / GIF / WebP / AVIF 캐릭터를 액션별로 등록. .glb / .fbx 3D 모델 + Mixamo 애니메이션 클립도 자동 매칭.

🔌

다국어 + 라이트 / 다크 테마

한국어 · 영어 + 사용자 설치 언어팩. 다크 / 라이트 / 시스템 모드, 5가지 강조 컬러. 뷰포트 전체가 즉시 따라갑니다.

📦

로컬 우선 + 오픈

모든 분석은 사용자 PC 안에서. 외부 서버 없음. 키 / 코드 / 활동 로그가 ViewWork 외부로 나가지 않습니다.

3단계로 시작

설치 후 폴더만 선택하면 끝. AI 에이전트 hook 도 자동 인식.

설치

아래 다운로드 섹션에서 본인 OS 의 인스톨러를 받아 실행. Windows NSIS / macOS DMG / Linux AppImage·deb 지원.

프로젝트 열기

상단 Ctrl+O 또는 헤더의 폴더 아이콘으로 분석할 디렉토리 선택. 첫 스캔에서 노드맵이 즉시 그려집니다.

AI 작업 시작

Claude Code / Cursor / Codex 로 그 프로젝트에서 코딩만 하면 자동 추적. 외부 hook 설치는 필요 없습니다.

스크린샷

실제 ViewWork 가 동작하는 모습.

3D 노드맵 + AI 에이전트 캐릭터
3D 씬에서 AI 에이전트 캐릭터가 파일 노드 위에서 작업하는 모습
2D React Flow 그래프 + cloud / MCP 노드
2D 그래프에서 MCP / 클라우드 / 외부 활동 가상 노드 통합 표시
사이드바 — AI 작업 추적 + 라이브 트래픽
사이드바 — AI 작업 추적, 라이브 트래픽, 표시 옵션 통합 패널
설정 모달 — 테마 / 언어 / 캐릭터 / 캐시 / 성능
설정 모달 — 6개 탭으로 분리된 시스템 설정

다운로드

GitHub Releases 에서 최신 빌드 (.exe / .dmg / .AppImage / .deb) 를 무료로 다운로드. 업데이트는 앱 실행 시 자동 확인됩니다.

소스 코드: github.com/leehy/viewwork · README · 패치 노트