WebCraftBench 운영 중

WebCraftBench는 텐센트 혼위안이 칭화대학교, 베이징대학교와 공동으로 출시한 AI 웹 생성 평가 벤치마크입니다. WebCraftBench는 먼저 생성된 애플리케이션에 자동 계측을 적용하고, 에이전트가 Playwright를 통해 웹페이지를 실제로 조작하며 기능을 탐색하도록 하여 코드 커버리지로 누락된 부분을 찾도록 유도합니다. 그런 다음 상호작용 기록을 상태 그래프로 추상화하고, 아름다움, 사용성, 요구사항 부합도의 세 가지 차원에서 각각 점수를 매깁니다. 이 벤치마크는 실제 요구사항 369개와 사람이 검증한 인수 기준 5,088개를 포함하며, 최신 모델 17개의 애플리케이션 6,273개를 대상으로 합니다. 인간 선호도와의 일치율은 85.3%에 달합니다.

실제 요구사항 평가 세트: 실제 사용 트래픽에서 수집한 사용자 요구사항 369개와 사람이 검증한 인수 기준 5,088개를 포함하며, 기능, 콘텐츠, 시각적 요소의 세 가지 요구사항을 다룹니다.
상호작용형 자동 탐색: 에이전트가 Playwright MCP를 통해 테스터처럼 클릭하고 입력하며 페이지를 전환하여 기능을 능동적으로 발견하고 경계 상황을 테스트합니다.
코드 커버리지 기반 탐색 유도: Istanbul을 기반으로 자동 계측을 적용하고 커버리지를 실시간 모니터링합니다. 탐색이 충분하지 않다고 판단되면 보조 모델이 아직 도달하지 않은 코드 영역을 제안합니다.
상태 추상화 및 정리: 긴 조작 기록에서 중복을 제거하고 표준화하여 상태 전이 그래프로 통합하고, 평가에 사용할 핵심 실행 증거를 추출합니다.
세 가지 차원의 독립 평가: 아름다움, 사용성, 요구사항 부합도를 각각 평가하고 표준화된 종합 점수로 합산합니다.
인간 선호도 검증: 독립 검증 세트에서 재검토된 인간 투표와 비교한 결과, 쌍대 판단 일치율이 85.3%에 달해 평가의 신뢰성을 검증했습니다.

자동 계측을 통한 실행 증거 수집: 시스템은 애플리케이션 코드에 카운터를 삽입하며, 정적 HTML, Vite, Next, CRA, Astro 등의 프레임워크를 지원합니다. 애플리케이션이 시작된 후 각 상호작용마다 코드 커버리지와 증분 정보를 전송하여 '어떤 코드가 실행되었는지'를 관찰할 수 있게 합니다.
커버리지 기반 에이전트 탐색: 탐색 에이전트는 소스 코드와 인수 기준 목록을 보지 않고 GUI 테스트 절차에 따라 웹페이지를 조작합니다. 세 번 연속 상호작용에서 새로운 커버리지가 발생하지 않으면 시스템은 다른 모델에 아직 실행되지 않은 코드를 분석하도록 요청하고, 그 제안을 자연어로 변환하여 탐색 에이전트가 계속 시도하도록 전달합니다.
상태 추상화를 통한 상호작용 궤적 압축: 페이지 구조를 표준화하여 동일한 페이지를 하나의 상태로 병합하고, 조작을 상태 전이 그래프로 연결합니다. 반복되는 스크린샷이 평가 모델의 컨텍스트를 차지하는 것을 방지하고, 오류 경로를 한눈에 파악할 수 있게 합니다.
탐색과 평가를 분리한 다차원 점수화: 탐색 단계에서 증거를 수집할 때는 인수 기준을 보지 않고, 평가 단계에서만 기준별로 증거를 대조하여 검색합니다. 아름다움과 사용성은 '장점 찾기-결함 지적-판정 및 점수 산정'의 세 차례 심의를 사용합니다(요구사항 부합도는 각 항목의 판단에 실행 증거를 반드시 인용하고 충족 비율에 따라 점수를 계산합니다. 세 차원은 각각 종합 점수의 3분의 1을 차지합니다.

생성 애플리케이션 준비: 평가 대상 모델이 요구사항에 따라 웹 애플리케이션을 생성하고 실행 가능한 상태로 배포하도록 합니다.
자동 계측: WebCraftBench의 계측 도구를 실행하여 애플리케이션 코드에 커버리지 카운터를 삽입하고, 각 상호작용에서 코드 실행 정보를 전송할 수 있게 합니다.
상호작용 탐색: 탐색 에이전트를 시작하고 Playwright MCP로 웹페이지를 조작하여 클릭, 입력, 페이지 전환 등의 동작을 수행하고 기능을 능동적으로 발견하며 경계 상황을 테스트합니다.
커버리지 기반 누락 탐색: 세 번 연속 상호작용에서 새로운 커버리지가 발생하지 않으면 보조 모델이 실행되지 않은 코드를 분석하고 자연어 제안을 생성하여 탐색 에이전트가 계속 탐색하도록 합니다(최대 100단계).
실행 증거 정리: 시스템이 페이지 구조를 자동으로 상태 추상화하고 조작 기록의 중복을 제거하여 상태 전이 그래프로 통합하며, 스크린샷과 상호작용 궤적을 보존합니다.
세 차원 평가: 평가 에이전트가 아름다움과 사용성을 각각 평가하고, 인수 기준을 하나씩 대조하여 요구사항 부합도를 검사합니다. 각 판단에는 실행 증거를 반드시 인용해야 합니다.
결과 출력: 세 차원의 표준화 점수와 종합 총점을 얻을 수 있으며, 모델 풀 순위와 비교할 수 있습니다. 점수 차이가 클수록 결과의 신뢰도가 높습니다.

실측 중심: 에이전트가 웹페이지를 실제로 조작하며 점수를 매기므로 코드나 스크린샷만 보는 방식과 다릅니다. 이를 통해 '진입 버튼이 작동하지 않음', '홈페이지가 열리지 않음'과 같이 정적 평가에서 놓치기 쉬운 문제를 발견할 수 있습니다.
커버리지 기반 탐색 유도: 코드 커버리지를 '누락 탐색 단서'로 활용합니다. 테스트 에이전트가 기능을 찾지 못하면 백그라운드 모델이 방향을 제시하여 탐색 실패를 제품 결함으로 잘못 판단하는 일을 줄입니다.
탐색과 평가의 분리: 인수 기준 목록은 평가 단계에서만 사용합니다. 요구사항 제약은 유지하면서도 목록 외의 상호작용을 관찰하는 것을 제한하지 않아 평가 범위를 넓힙니다.
다차원 독립 평가: 아름다움, 사용성, 요구사항 부합도를 분리하여 평가하므로 '보기에는 좋지만 사용하자마자 작동이 중단되는' 모델의 단점이 하나의 종합 점수에 가려지는 것을 방지합니다.
인간 선호도와 높은 일치율: 재검토된 인간 비교 197개 그룹에서 판단 일치율이 85.3%에 달했으며, 점수 차이가 클 때(≥0.75)는 일치율이 98%로 상승하여 결과의 신뢰도가 높습니다.
높은 평가 안정성: 평가 판정 모델을 변경한 후에도 순위 상관계수가 0.980에 달했고 상위 4개의 순서가 변하지 않아, 결론이 단일 판정 모델에 의존하지 않음을 보여줍니다.

arXiv 기술 논문: https://arxiv.org/pdf/2609.15387

AI 프로그래밍 도구의 모델 선정: 팀이 웹 애플리케이션 생성에 사용할 대규모 모델을 선택할 때 WebCraftBench의 세 차원 점수를 활용해 객관적으로 비교함으로써 데모의 외관만 보고 결정하는 일을 방지합니다.
AI 웹 생성 제품의 인수 테스트: WebCraftBench의 '실측 절차'를 제품 인도 과정에 도입하여 사람이 페이지별로 확인하는 작업을 대체하고, 진입점 오류나 접근할 수 없는 기능 등의 문제를 자동으로 발견합니다.
코드 생성 모델의 반복 회귀 테스트: 모델이 업그레이드될 때마다 벤치마크를 실행하고 아름다움, 사용성, 요구사항 부합도의 변화를 비교하여 새 버전이 개선되었는지 악화되었는지를 정량화합니다.
생성 품질의 계층적 진단: 차원별 분석과 낮은 커버리지 단서를 활용해 문제가 디자인에 있는지, 상호작용 버그인지, 요구사항 이해의 오류인지 파악하고 집중적인 최적화를 지원합니다.