멀티에이전트 시스템 설계 Designing Multi-Agent Systems
Chapter 05 · 구현

컴퓨터 사용 에이전트 구축하기

API가 없을 때, 동작이 복잡하고 동적일 때 — 사람이 인터페이스를 조작하듯 화면을 보고, 추론하고, 클릭하는 에이전트가 필요해진다.

관찰-사고-행동 인터페이스 표현 액션 시퀀스 생성 Playwright 그라운딩 프롬프트 인젝션

Section 1코드와 API만으로는 부족할 때

4장의 에이전트는 코드 인터프리터와 함수로 행동했다. 그러나 현실의 많은 시나리오는 또 다른 접근을 요구한다 — 사람이 작업을 완수하기 위해 애플리케이션과 상호작용하듯, 사용자 인터페이스(UI)를 이해하고 조작하는 에이전트.

코드 실행이 한계에 부딪히는 시나리오 — Photoshop에서 지도 위에 폴리곤을 그리는 일, 복잡한 서식의 스프레드시트를 다루는 일, 그리고 무엇보다 대응하는 API가 전혀 없는 독점 소프트웨어. 이런 작업은 인터페이스 레이아웃·시각적 단서·맥락에 대한 깊은 이해를 요구한다.

컴퓨터 사용 에이전트는 더 넓은 자동화 패턴을 가능케 한다 — 여러 웹사이트에서 정보를 수집·비교하는 리서치 에이전트, 단절된 엔터프라이즈 시스템을 정합화하는 백오피스 에이전트, UI 경로를 탐색하는 소프트웨어 테스팅 에이전트. OpenAI의 Operator, Anthropic의 Computer Use, Manus 모두 이 일반 원칙을 따른다.

함정

기본 웹 스크래핑은 정적 HTML만 가져온다. 현대 웹 앱은 동적 JavaScript, AJAX, 봇 방어(CAPTCHA, 헤더 검사)를 쓴다. 컴퓨터 사용 에이전트는 사람의 상호작용을 시뮬레이션하지만, 이러한 자동화는 항상 웹사이트의 이용 약관을 준수해야 한다.

Section 2컴퓨터 사용 에이전트의 해부학

컴퓨터 사용 에이전트는 OBSERVE-THINK-ACT(관찰-사고-행동) 실행 패턴을 따른다. "시애틀발 새너제이행 항공편을 찾아라" 같은 과업은 일련의 인터페이스 액션 — navigate, type, click, print — 으로 분해된다.

Motion · 관찰-사고-행동 루프 STEP 01 / 6
매 액션이 인터페이스 상태를 바꾼다

세 가지 핵심 구성 요소

  • 액션 시퀀스 플래너 — 생성형 AI 모델이 고수준 과업을 구체적 인터페이스 액션으로 번역한다.
  • 인터페이스 표현 컴포넌트 — UI의 현재 상태를 모델이 이해할 형식으로 제시한다.
  • 액션 실행기 — 계획된 액션을 대상 인터페이스 위에서 실제 수행한다.
표 · 명시적 계획 vs 암시적 계획
방식설명적합한 인터페이스
명시적 계획초기 상태로 완전한 계획을 생성 후 실행. 구조화된 추론, 적은 모델 호출로그인·연락처 폼처럼 정적·예측 가능
암시적 계획매 단계 현재 상태를 고려해 반복적으로 계획 생성항공편 예약·검색 결과처럼 동적

Section 3인터페이스 표현 전략

인터페이스 표현이란 UI의 현재 상태를 AI 모델이 이해하고 액션을 생성할 수 있도록 제시하는 방법이다. 세 가지 주요 접근이 있다.

Text텍스트 기반 표현

HTML/XML/JSON 같은 구조화된 텍스트. DOM 파싱(CSS 선택자로 요소 타깃팅)과 접근성 API(Windows UI Automation, macOS Accessibility). 토큰 효율적이고 정확하지만 시각적 컨텍스트를 놓친다. 전체 DOM은 크고 잡음이 많아 DOM 필터링이 필요하다.

Image이미지 기반 표현

스크린샷·시각적 캡처. 시각 정보를 종합적으로 포착하고 텍스트 표현이 없는 앱에도 통한다. 토큰 비용이 크고 멀티모달 모델이 필요하다. 흔히 두 단계 — 마크 주석(라벨이 붙은 바운딩 박스)을 입혀 모델에 전달(Set-of-mark, OmniParser).

Hybrid하이브리드 표현

두 형식을 결합 — CSS 선택자의 정밀한 타깃팅과 시각적 레이아웃 이해를 동시에. ComputerUseAgent의 권장 모드. get_state(format=...)로 text·visual·hybrid를 선택한다.

행동 실행기 · Playwright

행동 실행기는 흔히 인터페이스 표현 컴포넌트에 결합된 자동화 도구다 — 상태를 얻는 도구가 행동도 실행한다. Playwright(Microsoft)는 Chromium·Firefox·WebKit을 단일 API로 자동화한다. 크로스 브라우저, 포괄적 선택자, 자동 대기, 네트워크 가로채기, 모바일 에뮬레이션을 지원한다. 데스크톱은 PyAutoGUI 같은 라이브러리를 쓴다.

Motion · 세 가지 인터페이스 표현의 트레이드오프 STEP 01 / 5
정밀도 · 비용 · 시각 이해의 균형

Section 4ComputerUseAgent 구현

맞춤 솔루션을 빚는 대신, 우리는 4장의 기반 Agent 클래스를 확장한다. 핵심 통찰 — 클릭·타이핑·이동 같은 인터페이스 동작을 에이전트가 쓰는 로 다룬다.

Listing 5.3 · Playwright 툴 모음 — 에이전트의 행동 공간
def create_playwright_tools(interface_client):
    """웹 인터페이스 상호작용 툴을 생성한다."""
    return [
        NavigateTool(interface_client),    # URL로 이동
        ClickTool(interface_client),       # CSS 선택자 클릭
        TypeTool(interface_client),        # 선택자에 텍스트 입력
        SelectTool(interface_client),
        PressTool(interface_client),
        HoverTool(interface_client),
        ScrollTool(interface_client),
        ObservePageTool(interface_client), # 페이지 상태 관찰
    ]
직관 · 결정적인 관찰 루프

여기서 컴퓨터 사용 에이전트는 함수 호출 에이전트와 갈라진다. 날씨 툴이 "맑음, 75°F"를 반환할 때 그것은 완결된 정보다. 그러나 버튼을 클릭했을 때는 무슨 일이 벌어졌는지 관찰해야 한다 — 새 페이지가 로드되었는가? 폼이 나타났는가? 오류 메시지가 떴는가? 별도의 observe_page 툴이 현재 페이지의 텍스트 구조와 시각적 외관을 동시에 포착한다.

구현은 observe_page 결과를 가로채 스크린샷으로 보강한다 — DOM 데이터와 스크린샷이 결합된 멀티모달 정보 위에서 더 풍부한 추론을 펼친다. get_state(mode)는 세 모드를 지원한다 — text(토큰 효율), visual(스크린샷만), hybrid(권장 — 구조화 데이터 + 시각 컨텍스트). 자원 관리는 다층 보호 장치 — 브라우저 프로세스는 명시적으로 종료해야 하며, 스크린샷 실패는 텍스트 전용 모드로 우아하게 격하된다.

Section 5핵심 과제와 프로덕션

표 · 컴퓨터 사용 에이전트의 다섯 가지 핵심 과제
과제핵심 쟁점
인터페이스 표현·그라운딩DOM의 잡음, 시각적 관계 누락, 동적 콘텐츠. 하이브리드·Set-of-mark·UI-TARS로 대응
컨텍스트와 메모리다중 상호작용 횡단 사용자 선호 학습, 일화 기억, 애플리케이션 횡단 지식 그래프
동작 모호성 해소여러 타당한 행동 대상 중 선택, 자율성 vs 사용자 입력 균형, 신뢰도 자기 평가
보안·개인정보민감 데이터 보호, 자격 증명 관리, 프롬프트 인젝션 방어
지연 시간·비용다중 LLM 호출의 지연·비용 누적, 작은 모델·선제 가져오기
함정 · 프롬프트 인젝션

프롬프트 인젝션 공격(Wang et al. 2025)은 웹페이지 HTML이나 렌더링된 콘텐츠에 심어진 악의적 지시문이 에이전트의 행동을 조종할 때 발생한다. 주요 위협 — 자격 증명 노출(인증 토큰·쿠키 악용), 공급망 위험(서드파티 확장), 탐지의 어려움(EDR·DLP가 합법적 인간 행동과 에이전트 행동을 구별하기 어려움).

프로덕션 핵심 관행robots.txt와 이용 약관 존중, 비율 제한, 격리 환경 샌드박싱(파급 범위 제한), 민감 데이터 필터링, 감사 로그, 단기 자격 증명, 헤드리스 모드(리소스 절감), 의사결정에 필요할 때만 스크린샷 캡처.

멀티에이전트 시스템 설계 제5장 · 컴퓨터 사용 에이전트 구축하기