시각적 버그 리포트 도구

손으로 버그 리포트를 쓰는 일은 느리고 정보가 새어 나갑니다. "드롭다운이 정렬이 안 맞아요"는 어느 드롭다운인지, 어느 페이지에서, 어떤 상태였는지를 좀처럼 말해주지 못하죠. 그래서 수정이 오래 걸리고, 때로는 아예 엉뚱한 요소를 건드립니다.

시각적 버그 리포트는 이 문제를 뒤집습니다. 어디에 있는지 설명하는 대신, 라이브 앱 위의 깨진 요소를 바로 클릭하면 됩니다. 캡처는 클릭하는 그 순간 한 번만 일어납니다.

리뷰어는 라이브 앱 위의 깨진 요소를 곧장 클릭합니다. 어디에 있는지 설명할 필요가 없죠. 요소 하나에 코멘트가 앵커되므로, 개발자가 "어느 모달?"이라고 되물을 일이 없습니다.

코멘트는 타이핑해도 되고, 자동으로 텍스트로 변환되는 음성 메모로 남겨도 됩니다. 리뷰어는 계정이 필요 없습니다. 링크를 열고, 클릭하고, 말하면 됩니다.

클릭 한 번에, Patchrooms는 개발자가 재현에 필요한 기술적 디테일을 자동으로 기록합니다. 버그의 어떤 것도 사라지지 않습니다.

• 클릭한 요소의 DOM 셀렉터.
• 스크린샷과 페이지 URL.
• 뷰포트, 브라우저, 그리고 그 순간 존재한 콘솔 에러.
• 리포트별 상태(신규, 분류됨, 진행 중, 마감)로 남은 것을 추적.

리포트는 셀렉터, 스크린샷, URL, 콘솔 컨텍스트를 모두 담아 Markdown으로 내보내집니다. 개발자는 추측이 아니라 정확히 조준된 수정을 하고, 코딩 에이전트는 그대로 읽어서 정확한 요소를 고칩니다. 에이전트가 읽는 텍스트는 영어입니다.

## Bug: Misaligned modal
- **Element:** `div.confirm-modal`
- **Comment:** Modal is offset ~24px to the right on desktop.
- **Screenshot:** blob/scr_41bd.png
- **URL:** https://staging.example.com/billing
- **Console:** no errors

Claude Code, Cursor에 붙여넣거나, MCP 서버로 에이전트가 큐를 직접 읽게 하세요. AI 에이전트를 위한 피드백에서 더 살펴보세요.

임베드는 여러분이 제공하는 어떤 페이지에서도 실행됩니다. 프로덕션, 스테이징, 프리뷰 빌드 모두요. 이슈 트래커를 대체하려는 게 아닙니다. 트래커에 연결할 수도, 단독으로 쓸 수도 있습니다. 리포트를 Markdown으로 내보내 트래커나 코딩 에이전트에 붙여넣거나, Patchrooms 대시보드에서 분류한 채로 두세요.

QA가 스테이징에서 직접 주석을 남기는 흐름은 QA feedback(영어)에서, 전체 흐름은 workflows에서 확인할 수 있습니다.