Claude Code를 3D 게임처럼 시각화하는 'Termi Protocol'을 만들었습니다
I got tired of watching Claude Code work in a plain terminal so I built it 3D cozy game simulation for my agents
핵심 요약
지루한 터미널 로그 대신 3D 방에서 AI 에이전트가 작업하는 모습을 시각화하고 관리하는 'Termi Protocol'을 개발했습니다.
- 시각적 코딩 환경 — 터미널 로그를 3D 방 속 에이전트의 활동으로 시각화함
- 에이전트 관리 시스템 — 칸반 보드와 프로젝트 메모리 공유로 효율적인 작업 관리 지원
- 게이미피케이션 요소 — 집중 타이머, 반려동물 키우기, 코인 수집 등 재미 요소 추가
- 로컬 보안 중심 — 리더보드 외 모든 데이터는 로컬에서 처리되어 보안성 확보
여러분 안녕하세요,
제 배경은 주로 Unity와 C#이었는데, 실제 제품을 출시하면서 React Native 같은 기술들을 배워야 했습니다. 시간이 지나면서 AI 보조 코딩이 반복적으로 느껴지기 시작했습니다. 끝없는 터미널 로그, 길을 잃은 컨텍스트, 불완전한 코드, 그리고 끊임없이 클릭해야 하는 "계속하기(continue)" 버튼까지 말이죠.
그래서 저는 게임 개발 경험과 AI 보조 코딩을 결합하여 Termi Protocol을 만들었습니다.
Electron으로 데스크톱 앱을 개발했고, 개발 과정 내내 Claude Code를 사용했습니다. Electron의 아키텍처 덕분에 기존 웹 애플리케이션을 데스크톱 제품으로 훨씬 쉽게 전환할 수 있었고, 처음부터 다시 만들 필요 없이 빠르게 데스크톱 빌드를 생성할 수 있었습니다. 프로젝트의 나머지 부분은 이전 프로젝트에서 얻은 개발 및 제품 경험에 크게 의존했습니다.
Termi는 칸반 시스템을 통해 AI 에이전트를 관리하고, 실수로 닫은 세션을 계획 및 진행 상황과 함께 복구하며, 변경된 파일, 명령어, 방문한 링크를 추적하고, 추가 토큰 낭비 없이 프로젝트 메모리를 보존하도록 도와줍니다.
에이전트들은 공통 프로젝트 브레인을 통해 지식을 공유하고 여러 프로젝트에서 재사용 가능한 기술을 사용할 수도 있습니다.
하지만 가장 큰 초점은 게이미피케이션입니다.
터미널 로그만 보는 대신, 3D 방 안에서 에이전트들이 일하는 모습을 볼 수 있습니다. 에이전트가 App.tsx를 읽을 때는 종이 파일을 스캔하고, 코드를 수정할 때는 모니터에 활동이 나타납니다.
집중 타이머를 사용하고, 코인을 모으고, 방을 청소하고, 운동 기구를 추가하고, 프로젝트를 진행하는 날짜가 지날수록 함께 성장하는 고양이나 강아지를 입양할 수도 있습니다. 반려동물을 돌보지 않으면 스트레스를 받아 방을 어지럽히기 시작합니다. :)
우리는 검은 터미널 화면을 보며 너무 많은 시간을 보냅니다. 저는 AI 개발을 더 시각적이고 이해하기 쉬우며 재미있게 만들기 위해 Termi Protocol을 만들었습니다.
이런 식의 게이미피케이션 코딩 워크플로우에 대해 어떻게 생각하시는지 궁금합니다.
앱 링크는 여기입니다: https://termiprotocol.com
앱 데모 링크는 여기입니다: https://termiprotocol.com/demo
읽어주셔서 감사합니다 🙏
