AI 에이전트에 시각 능력 주기: 오픈 소스 MCP 서버 구조와 로컬 Ollama 설정

코딩 에이전트의 맹점: “이미지를 볼 수 없습니다”

지난 1년 동안 Cursor, Claude Code, Codex 같은 AI 코딩 환경은 개발자의 작업 방식을 바꿔 놓았습니다.

하지만 엔지니어는 이런 답답한 장애물을 자주 마주칩니다.

미묘한 CSS 렌더링 버그나 시각 디자인 시안을 캡처해서 코딩 세션에 끌어다 놓으면, 이런 김빠지는 답이 돌아옵니다.

“이 터미널 환경에서는 이미지를 볼 수 없습니다. 텍스트로 직접 제공해 주세요.”

언어 모델은 강력한 추론 능력을 보여 주지만, 분리된 개발자 CLI 환경 안에서는 여전히 시각적으로 눈이 멀어 있습니다.

해결책: 모델 컨텍스트 프로토콜(MCP)로 시각 능력 표준화하기

통합의 경계를 넘기 위해, Anthropic은 모델 컨텍스트 프로토콜(MCP)을 내놓았습니다. AI 기능을 위한 USB-C와 비슷한 보편 프로토콜입니다.

우리는 개발자 에이전트를 위해 설계된 오픈 소스 MCP 비전 서비스 Shadow Vision을 만들었습니다.

서버 정의 하나만 추가하면 코딩 에이전트는 6가지 구조화된 시각 도구를 쓸 수 있게 됩니다.

1. vision_ocr: 터미널과 UI 캡처에서 고정밀 텍스트 및 표 데이터를 추출합니다.
2. vision_inspect: CSS 오류를 찾아내고 차트를 해석하는 시각 진단을 수행합니다.
3. vision_annotate: 빨간 경계 상자, 화살표, 강조 표시 같은 개발자의 마크업을 인식합니다.
4. vision_layout: 시각 디자인을 계층형 레이아웃 트리와 간격 토큰으로 분해합니다.
5. vision_reconstruct: 핵심 기능입니다. 시각 UI 캡처를 깔끔한 React, HTML, Tailwind 코드 초안으로 재구성합니다.
6. vision_compare: 반복 작업 사이의 픽셀 단위 시각 회귀를 검사합니다.

로컬 우선 프라이버시: 교체 가능한 백엔드와 오프라인 Ollama

기업 팀은 독점적인 스크린샷이 제3자 API로 새어 나가는 위험을 감수할 수 없습니다.

Shadow Vision은 모듈식 교체 가능 백엔드를 구현합니다.

• 로컬 우선 프라이버시: 로컬 Ollama 인스턴스(예: Qwen2-VL, LLaVA)를 기본으로 구동합니다. 이미지 추론은 외부 요청 없이 100% 온프레미스에 남습니다.
• 클라우드 정확도: 복잡한 추론은 Anthropic Claude 3.5 Sonnet 또는 Google Gemini 멀티모달 API로 손쉽게 보낼 수 있습니다.
• OpenAI 호환성: LM Studio, vLLM 또는 자체 기업 게이트웨이와 연동됩니다.

설정 (Claude Desktop / Cursor):

{
  "mcpServers": {
    "shadow-vision": {
      "command": "uv",
      "args": ["run", "shadow-vision"],
      "env": {
        "VISION_BACKEND": "ollama",
        "OLLAMA_MODEL": "qwen2-vl:7b"
      }
    }
  }
}

AI 에이전트가 화면을 인식할 수 있게 되면, 터미널 상호작용은 진정한 멀티모달 협업으로 이어집니다.