macOS용 데스크톱 AI 컴패니언 구축: Tauri v2 + WebGL + MediaPipe를 조합해 5MB 바이너리 크기로 텍스트 기반 AI 에이전트를 시각적 아바타로 구현

Context

AI 에이전트는 터미널 기반 텍스트 인터페이스로만 존재하여 사용자 경험이 거래적(transactional)이고 일시적입니다. 기존 프로젝트들(kkclaw, BongoCat, Mate-Engine, Agentic-Desktop-Pet)은 애니메이션 캐릭터나 음성 처리나 감정 인식 중 일부만 구현했으며, 경량 macOS ARM64 런타임 위에서 이들을 모두 통합한 사례가 없었습니다.

Technical Solution

• 프레임워크 선정: Native Swift, Electron(~150MB), Godot, Unity 대신 Tauri v2를 도입해 바이너리 크기를 5MB로 축소하고 시스템 WKWebView 활용으로 번들 Chromium 제거
• 아키텍처 구성: TypeScript 프론트엔드(Canvas2D/WebGL) + Rust 백엔드(Tauri) 조합으로 투명 창, 카메라 접근, 오디오 I/O를 네이티브 ARM64로 처리
• 투명 항상상단 창 구현: Tauri 설정에서 transparent: true, alwaysOnTop: true, decorations: false 옵션으로 데스크톱 오버레이 실현 및 마우스 이벤트 통과 제어(setIgnoreCursorEvents 동적 전환)
• 캐릭터 애니메이션 아키텍처: MVP 단계에서 Lottie(8/10 품질) 도입, 폴리시 버전으로 Live2D Cubism(10/10 품질, 메시 변형 + 물리 시뮬레이션 + 표현식 블렌딩) 계획
• 감정 감지 파이프라인: MediaPipe Face Mesh(WebGL/WASM)로 468개 얼굴 랜드마크를 실시간 추출(Apple Silicon에서 30fps+ 640×480 해상도)하고, 입 너비/높이, 눈썹 높이 같은 거리 계산으로 감정 분류
• 음성 통합: Whisper STT → OpenClaw Gateway(WebSocket) → Kokoro TTS 파이프라인으로 음성 인식, LLM 처리, 음성 생성을 순차 처리하며 각 단계에서 아바타 상태(listening → thinking → speaking) 변경
• 상태 머신 설계: 7가지 상태(IDLE, ROAMING, LISTENING, THINKING, SPEAKING, REACTING, SLEEPING)를 우선순위로 정렬(SPEAKING > LISTENING > ... > SLEEPING)해 시각적 충돌 방지

Impact

• CPU 사용률: 활성 상태 <3%, 수면 상태 <1%
• GPU 사용률: 활성 상태 <5%, 수면 상태 <1%
• 메모리 사용량: 활성 상태 ~120MB(캐릭터 렌더링 50MB + MediaPipe 40MB + 나머지 30MB), 수면 상태 ~30MB
• MediaPipe 프레임률: 표현식 변화 없을 때 5fps로 드롭, 얼굴 미감지 시 1fps로 드롭

Key Takeaway

MacOS ARM64 데스크톱 애플리케이션 개발 시 Tauri v2는 바이너리 크기와 성능 사이의 최적 트레이드오프를 제공합니다. 또한 AI 에이전트의 인간적 상호작용을 높이려면 음성, 애니메이션, 감정 감지를 통합하는 다층 상태 머신이 필수이며, 이는 3주~4주 분할 로드맵(Living Icon → Companion → Avatar)으로 점진적 구현이 가능합니다.