Claude Code의 상태에 반응하는 데스크톱 스틱 피규어 'Code Pet'

실용적 조언

Claude Code의 이벤트 시스템을 활용하여 모델의 내부 상태를 실시간으로 감지한다. 모델이 사고(Thinking) 중인지, 코드를 작성 중인지, 혹은 터미널 명령을 실행 중인지에 따라 각기 다른 이벤트를 수신하여 캐릭터의 동작을 제어한다.

캐릭터 애니메이션은 별도의 이미지 파일 없이 순수 SVG 코드로 구현되었다. 이는 실행 파일의 크기를 줄이고 해상도에 관계없이 선명한 그래픽을 유지하며, 코드만으로 복잡한 움직임을 제어할 수 있게 한다.

데스크톱 애플리케이션 프레임워크로 Tauri v2를 사용했다. 이를 통해 항상 위에 떠 있는 투명 창(Always-on-top transparent window)을 구현하여 사용자의 작업 흐름을 방해하지 않으면서도 캐릭터의 반응을 상시 확인할 수 있도록 설계했다.

현재는 윈도우(Windows) 환경만 지원하며, 작업 완료 시의 승리 점프나 에러 발생 시의 패닉 모드 등 사용자 경험을 즐겁게 만드는 시각적 피드백 요소를 포함하고 있다.

타우리(Tauri): — Rust 언어를 기반으로 하는 경량 데스크톱 애플리케이션 프레임워크이다. 웹 기술(HTML/CSS/JS)을 사용하여 UI를 구성하면서도 시스템 리소스 점유율이 낮고 보안성이 뛰어난 앱을 제작할 수 있게 해준다.
확장 가능한 벡터 그래픽(SVG): — 2차원 벡터 그래픽을 표현하기 위한 XML 기반의 파일 형식이다. 픽셀이 아닌 수학적 좌표로 이미지를 정의하기 때문에 확대해도 화질 저하가 없으며, 코드를 통해 실시간으로 애니메이션을 제어하기 용이하다.
이벤트 시스템(Event System): — 프로그램 내에서 발생하는 특정 사건이나 상태 변화를 감지하고 이를 다른 구성 요소에 전달하는 메커니즘이다. 여기서는 Claude Code의 작업 단계별 신호를 수신하여 캐릭터의 동작을 결정하는 핵심 역할을 한다.

Claude Code추천

AI 코딩 에이전트 및 CLI 도구

Tauri v2추천

데스크톱 애플리케이션 프레임워크

Code Pet추천

Claude Code 연동 데스크톱 캐릭터