Collaborator: AI 에이전트와 코드를 한 화면에 펼치는 무한 캔버스 개발 환경

9bow · 6월 21, 2026, 4:30오전

Collaborator 소개

AI 에이전트로 개발을 하다 보면 터미널, 컨텍스트로 넘겨줄 파일, 실행 중인 코드가 여러 창과 탭에 흩어집니다. 에이전트가 어느 터미널에서 무엇을 하고 있는지 따라가려면 창을 옮겨 다니며 맥락을 다시 맞춰야 합니다. Collaborator 는 이 흩어짐을 한 화면으로 모으려는 시도로, 에이전트와 작업물을 나란히 놓을 수 있는 무한 캔버스(infinite canvas) 위의 에이전트 개발 환경입니다.

Collaborator는 터미널, 컨텍스트 파일, 실행 중인 코드를 하나의 무한 캔버스에 배치하는 종단 간(end-to-end) 환경을 표방합니다. 캔버스 위에 에이전트가 도는 터미널을 띄우고, 파일을 끌어다 그 옆에 타일로 펼쳐 두는 방식이라 창을 바꿔 가며 탭을 뒤질 필요가 줄어듭니다. macOS, 윈도우, 리눅스용 네이티브 데스크톱 앱으로 제공되며, 윈도우에서는 터미널 세션이 PowerShell과 WSL2 배포판을 모두 대상으로 동작합니다.

다만 이 앱은 아직 초기 단계이고 활발히 개발 중인 상태입니다. 계정 없이 로컬 파일 위에서 동작하며, 모든 애플리케이션 상태는 ~/.collaborator/ 아래에 JSON 파일로 저장됩니다. 비식별 사용 분석(usage analytics)은 PostHog로 익명 수집됩니다. 본 게시물에서는 Collaborator의 캔버스와 타일 구조, 라이브 타일이 파일과 연결되는 방식, 기술 스택, 그리고 설치·실행 방법을 정리합니다.

Collaborator의 캔버스와 타일

Collaborator의 창은 두 영역으로 나뉩니다. 왼쪽의 내비게이터(Navigator)는 활성 워크스페이스 폴더를 루트로 하는 파일 트리와 워크스페이스 전환기를 담은 사이드바이고, 가운데의 메인 영역(Main area)은 타일이 배치되는 무한 캔버스와, 내비게이터에서 선택한 파일 내용을 보여 주는 뷰어(viewer)로 이루어집니다. 여러 워크스페이스를 등록해 두고 전환할 수 있으며, 캔버스와 뷰어는 워크스페이스 간에 공유됩니다.

캔버스는 점 격자(dot grid) 배경을 가진 무한 평면으로, 스크롤이나 스페이스+드래그로 이동하고 33%에서 100% 범위로 확대·축소할 수 있습니다. 모든 타일 위치와 크기는 격자에 스냅(snap)되며, 격자는 일정 간격의 보조 점과 네 번째마다 찍히는 주요 점으로 구성됩니다. 캔버스에 올라가는 타일에는 네 종류가 있습니다. 빈 캔버스를 더블 클릭하면 그 자리에 터미널(Terminal) 타일이 생기는데, 이 터미널이 AI 에이전트를 실행하는 주요 인터페이스이고 작업 디렉토리는 활성 워크스페이스 경로로 설정됩니다. 내비게이터에서 .md 파일을 끌어다 놓으면 라이브 렌더링되는 노트(Note) 타일, 그 외 텍스트 파일을 놓으면 문법 강조가 되는 코드(Code) 타일, 이미지 파일을 놓으면 읽기 전용 이미지(Image) 타일이 만들어집니다.

Collaborator의 라이브 타일 데이터 모델

Collaborator에서 타일은 독립된 보관함이 아니라 원본을 비추는 라이브 뷰(live view) 라는 점이 핵심입니다. 노트·코드·이미지 같은 파일 타일은 절대 경로로 디스크의 파일과 연결됩니다. 파일 이름이 바뀌면 타일이 새 경로를 따라가고, 파일이 삭제되면 타일이 닫히며, 디스크에서 내용이 바뀌면 타일이 다시 읽어 들입니다.

터미널 타일은 영속적인(persistent) 사이드카 기반 PTY 세션과 연결됩니다. 각 터미널 타일은 자신만의 세션을 만들어 관리하며, 이 세션은 캔버스 위 타일의 생명주기와 독립적으로 유지됩니다. 즉 타일을 닫거나 옮겨도 그 뒤의 에이전트 세션은 살아 있을 수 있는 구조입니다. 뷰어 역시 디스크의 외부 변경을 감시하다가 파일이 바뀌면 자동으로 다시 불러오므로, 캔버스의 타일과 뷰어가 항상 디스크의 실제 상태를 반영합니다.

Collaborator의 기술 스택

Collaborator는 네이티브 데스크톱 앱으로, 멀티 웹뷰(multi-webview) 구조의 Electron 40을 데스크톱 셸로 사용합니다. UI는 React 19와 Tailwind CSS 4로 구성하고 빌드는 electron-vite로 핫 리로드를 지원합니다. 터미널 에뮬레이션은 영속 node-pty 사이드카가 뒤를 받치는 xterm.js가 담당하며, 코드 편집에는 Monaco Editor, 마크다운 리치 텍스트 편집에는 BlockNote와 TipTap을 씁니다. 이 밖에 힘 기반 그래프(force-directed graph) 시각화에는 D3, 이미지 처리에는 sharp, 마크다운 내 수식 렌더링에는 KaTeX가 쓰입니다. 모든 데이터는 로컬 디스크에 저장됩니다.

Collaborator 설치 및 사용법

macOS, 윈도우, 리눅스용 빌드는 Collaborator의 GitHub 릴리스 페이지에서 내려받을 수 있습니다. macOS와 리눅스는 명령줄 설치도 지원합니다.

curl -fsSL https://raw.githubusercontent.com/collabs-inc/collab-public/main/install.sh | bash

윈도우는 릴리스 페이지의 .exe 설치 파일을 사용합니다. 앱을 연 뒤에는 내비게이터의 워크스페이스 드롭다운에서 "Add workspace"(또는 Cmd+Shift+O)로 로컬 폴더를 추가하고, 캔버스를 더블 클릭해 터미널을 만들어 에이전트를 시작합니다. 내비게이터의 파일을 캔버스로 끌어다 놓으면 실행 중인 에이전트 옆에 타일로 펼쳐집니다.

소스에서 직접 빌드하려면 Node.js와 Bun이 필요합니다. 저장소를 클론한 뒤 collab-electron 디렉토리에서 의존성을 설치하고 개발 모드로 실행합니다.

git clone https://github.com/collabs-inc/collab-public.git
cd collab-public/collab-electron
bun install
bun run dev

bun test 로 테스트를, bun run build 로 빌드를 실행할 수 있습니다.

Collaborator의 라이선스

Collaborator는 FSL-1.1-ALv2 (Functional Source License)로 공개되어 있으며, 저작권은 Softspace Inc.에 있습니다. 이 라이선스는 소스 공개(source-available) 방식으로, 경쟁 제품을 만드는 용도(Competing Use)를 제외한 모든 목적으로 소프트웨어를 사용·수정·재배포할 수 있도록 허용하고, 최초 공개로부터 2년이 지나면 Apache License 2.0으로 전환됩니다. 일반적인 permissive 오픈소스 라이선스와는 허용 범위가 다르므로, 상업적으로 활용할 때는 LICENSE.md의 Permitted Purpose 조항을 직접 확인하는 것이 좋습니다.

Collaborator 공식 홈페이지

Collaborator 프로젝트 GitHub 저장소

더 읽어보기

이 글은 GPT 모델로 정리한 글을 바탕으로 한 것으로, 원문의 내용 또는 의도와 다르게 정리된 내용이 있을 수 있습니다. 관심있는 내용이시라면 원문도 함께 참고해주세요! 읽으시면서 어색하거나 잘못된 내용을 발견하시면 덧글로 알려주시기를 부탁드립니다.

파이토치 한국 사용자 모임이 정리한 이 글이 유용하셨나요? 회원으로 가입하시면 주요 글들을 이메일로 보내드립니다!
텔레그램(Telegram)이나 Slack/Discord/Teams/Dooray/GoogleChat 등으로도 새 글 알림을 받으실 수 있습니다.

아래쪽에 좋아요를 눌러주시면 새로운 소식들을 정리하고 공유하는데 힘이 됩니다~