Implementation Guide

QA 효율성 극대화를 위한
TestSprite 도입 가이드

AI 코드 생성 시대의 새로운 품질 보증 표준

Prologue

AI 코드 생성 시대의 과제와 기회

SAM 프로젝트의 개발 프로세스에 AI 코드 생성 도구가 깊숙이 자리 잡으면서 생산성은 향상되었으나, AI가 생성한 코드의 약 58%가 제대로 작동하지 않는다는 사실은 새로운 도전 과제를 제시합니다.

수동 검증의 병목 현상은 출시 지연과 직결됩니다. 본 가이드는 'TestSprite' 도입을 통해 이 문제를 해결하는 전략을 제시합니다.

I. Solution Analysis

'AI 감리 전문가' TestSprite

단순한 테스트 도구를 넘어 '버그 없는 배포'를 가능하게 하는 핵심 가치

🛡️

불안정성 극복

생성 코드의 잠재적 버그를 식별하는 첫 번째 방어선 역할을 수행하여 초기 신뢰성을 확보합니다.

📹

자동 검증 및 녹화

프론트엔드 요소를 사용자 관점에서 자동 검증하며, 모든 과정은 스크린 녹화로 기록됩니다.

🛠️

자동 결함 수정

문제를 보고하는 데 그치지 않고, 직접적인 수정을 제안하여 디버깅 시간을 최소화합니다.

📋

사양 일치성 보장

제품 사양 문서(PSD)를 기반으로 기능적 요구사항 충족 여부를 엄격하게 대조합니다.

👷

전문가 비유

"초보 건축가(코드 생성 AI)가 지은 건물을 점검하여 부실 부분을 찾아내고, 직접 망치를 들어 보수하는 꼼꼼한 감리 전문가와 같습니다."

II. Execution Guide

01

API 키 생성

TestSprite 대시보드 > MCP test > Create a Key 단계를 통해 고유 인증 키를 발급받고 복사합니다.

02

Cursor MCP 서버 설치

'Add to Cursor' 버튼을 클릭하여 에디터 실행 후, 복사한 API 키를 입력하여 서버를 설치합니다.

03

테스트 사전 준비

정확한 검증을 위해 프로젝트 설계도 역할을 하는 제품 사양서(PSD)를 Cursor에 업로드합니다.

🔌

"전문 검측 장비(TestSprite)를 스마트 공장(Cursor)에 연결하기 위해 전용 통신 케이블(MCP)을 꽂고 고유 번호를 입력하는 것과 같습니다."

III. Workflow

QA 자동화 워크플로우

반복적인 디버깅에서 전략적 검수자로의 역할 전환

Step 1

테스트 시작

Cursor 채팅창에 "conduct a front-end testing..." 프롬프트를 입력하고 PSD 파일을 제공합니다.

Step 2

결과 분석

대시보드에서 통과/실패 현황을 파악하고, 스크린 녹화 영상을 통해 오류 지점을 직관적으로 확인합니다.

Step 3

자동 수정 지시

Cursor에서 "please fix all of the issues..." 명령을 내려 발견된 모든 버그의 수정을 요청합니다.

Step 4

수정 내역 최종 승인

AI가 정리한 이슈 목록과 자동 생성된 코드 변경 사항을 검토하고 최종 승인합니다.

Conclusion

버그 없는 배포를 향한 결단

TestSprite의 즉각적인 도입은 SAM 프로젝트의 기술적 우위를 확보하고,
우리의 핵심 목표인 "Bug-free code deployment"를 달성하기 위한 필수적 전략입니다.

🚀 Speed QA 시간 획기적 단축
💎 Quality 코드 신뢰성 극대화
🧘 Experience 핵심 로직 집중 지원
Strategic Briefing

AI 협업 기반
코드 교차 검증 전략

Maximize Quality | Optimize Cost | 5-Step Workflow

Executive Summary

개요 및 핵심 가치

본 문서는 AI 모델 간의 협업을 통해 코드 품질을 극대화하고 개발 비용을 최적화하는 '교차 검증 전략'을 종합적으로 분석합니다.

🚀

5단계 사이클

계획 → 검증 → 구현 → 검증 → 테스트로 이어지는 완벽한 품질 관리 루프

🤝

역할 최적화

Antigravity(실행)와 Claude Code(감리)의 조화로운 역할 분담

💰

비용 절감

검증 단계에만 고성능 모델을 투입하여 전체 토큰 사용량 약 66% 절감

I. Strategy Overview

AI 교차 검증의 핵심 개념

고성능 모델의 초기 테스트 통과율(약 42%) 한계를 극복하기 위한 방법론

단계 주요 도구 핵심 역할
1. 계획 (Plan) Antigravity 문제 해결을 위한 초기 계획 수립 및 문서화
2. 검증 (Verify) Claude Code 계획의 논리적 오류 및 프로젝트 원칙 검토
3. 실행 (Execute) Antigravity 검증된 계획에 따른 고속 코드 구현
4. 검증 (Verify) Claude Code 완성된 코드의 최종 검토 및 완성도 극대화
5. 테스트 (Test) TestSprite MCP 자동화 테스트 및 직관적인 스크린샷 피드백
🏠

전략적 비유

"Antigravity라는 숙련된 시공사가 집을 짓기 전과 후에, Claude Code라는 꼼꼼한 설계사가 도면과 완공 상태를 철저히 감리하는 것과 같습니다."

Visual Evidence

검증 및 테스트의 실제

TestSprite MCP를 통한 자동화 테스트 결과 및 분석 화면

TestSprite Core Analysis
II. Workflow Detail

5단계 교차 검증 상세 프로세스

1단계

계획 수립 및 문서화

  • 문제 분석 및 구조 설계 (Antigravity)
  • work-plan 폴더 내 마크다운(.md) 저장
  • 검토를 위한 물리적 근거 마련
2단계

1차 계획 검증

  • 코드 작성 원칙 기반 논리 검토 (Claude Code)
  • 문서 하단에 보완 사항 추가 (덮어쓰기 금지)
  • 변경 이력의 명확한 추적 가능성 확보
3단계

코드 구현

  • 보완된 최종 지시에 따른 구현 (Antigravity)
  • 잠재적 오류 제거로 인한 에러율 급감
  • 정제된 워크플로우를 통한 생산성 향상
4단계

2차 최종 결과 검토

  • 계획 반영 여부 최종 점검 (Claude Code)
  • 전체 코드 완성도 및 코드 품질 확인
  • 최종 릴리스 준위의 결과물 확보
5단계

자동 테스트 및 피드백

  • TestSprite MCP 기반 자동화 테스트
  • 스크린샷 리포트를 통한 직관적 오류 파악
  • 100%에 수렴하는 품질 완성 사이클
III. Tool Roles & Setup

핵심 도구별 역할 및 설정

Antigravity

실무 실행자 (Doer)

토큰 소모가 많은 초기 계획과 코드 구현 전담. VS Code 내 'Claude Code for VS Code'와 병행 설치 권장.

Claude Code

설계 및 감리자 (Reviewer)

고비용 모델의 효율적 사용을 위해 검증에 집중. 메모리/에이전트/훅 설정에 프로젝트 규칙 정의 필수.

TestSprite MCP

최종 품질 검사관 (Inspector)

자동 테스트 및 스크린샷 리포트를 통해 인간이 놓치는 논리적 결함 발견.

설정 절차

  • API 키: testsprite.com 발급 (유일 1회 노출)
  • Windows: 전용 명령어를 통한 MCP 연결
  • 명세서: Claude Code를 통한 Product Spec 생성 및 제공
IV. Expected Effects

기대 효과 및 실질적 이점

✨

코드 품질 향상

상호 보완적 모델 협업과 전문 테스트 도구를 통한 안정적인 결과물 생산

📉

비용 및 토큰 절감

고비용 모델을 검증에만 집중 배치하여 토큰 사용량 약 2/3(약 66%) 절감

"Claude Max 200달러 요금제를 쓰다가 이 전략을 적용하고 나서 100달러 요금제로 낮췄습니다. 이제는 토큰 걱정 없이 편하게 작업하고 있습니다."
— 실제 사례 사용자
Assessment

단답형 퀴즈

전략의 핵심 개념을 점검해 보세요. 카드를 클릭하면 정답이 표시됩니다.

Dictionary

핵심 용어 정리