블로그

개발자가 바로 대응할 수 있는 버그 리포트 작성법

게시 · 버그 리포트, QA, 스크린샷

개발자가 바로 대응할 수 있는 버그 리포트 작성법

개발자가 재현할 수 있는 버그 리포트에는 정확한 재현 단계, 전체 창 스크린샷, 오류 텍스트, 짧은 녹화가 필요합니다. QA, 지원팀, PM을 위한 실용 가이드입니다.

스크린샷만으로 버그가 고쳐지는 일은 드뭅니다. 버그를 고치게 하는 것은 개발자가 그대로 따라 해 볼 수 있는 리포트입니다. 정확한 단계, 무엇을 보았는지, 대신 무엇을 기대했는지가 있어야 합니다. 스크린샷은 그것을 눈에 보이게 해 주지만, 오류 텍스트만 타이트하게 자른 것이 아니라 충분한 맥락을 보여 줄 때만 그렇습니다.

이 가이드는 QA 테스터, 지원팀, 제품 관리자를 위한 것입니다. 무엇을 캡처해야 하는지, 재현 가능한 단계를 쓰는 법, 개인 데이터를 가리는 법, 그리고 짧은 녹화가 더 빠른 답이 되는 경우를 다룹니다.

쓸모 있는 스크린샷이 보여 주는 것

창 전체를 캡처하세요. 제목 표시줄, 도구 모음, 열려 있는 대화상자까지 포함합니다. 오류 메시지 주변만 자르면 앱 버전, 열려 있던 메뉴, 있던 페이지가 사라지는데, 개발자가 문제를 재현하는 데 필요한 세부 정보가 바로 그것입니다.

웹 앱이라면 브라우저 콘솔을 포함하세요. 브라우저 개발자 도구를 열고 Console 탭으로 전환합니다. 백그라운드에서 요청이 실패했다면 그 이유가 보통 여기에 출력되고 페이지에는 절대 표시되지 않습니다.

정확한 상태를 보여 주세요. 오류 텍스트 자체, 입력을 거부한 필드, 열어 두었던 메뉴를 담습니다. 메시지를 기억에서 다시 타이핑하지 말고 화면에서 복사하세요.

설명하는 대신 지점을 표시하세요. 원, 화살표, 번호 하나면 개발자가 문제로 곧장 갑니다.

INSNAP의 번호 매긴 단계 · 1280 × 800

InSnap에서는 간단합니다. Mac은 ⌘1, Windows는 Ctrl+1을 누르고 원하는 창 위에 마우스를 올린 뒤 클릭하세요. 선택 영역이 창에 맞춰지고, 많은 앱에서는 커서 아래의 버튼까지 맞춰집니다. 도형, 선, 텍스트, 번호로 주석을 단 다음 결과를 복사하세요. 작성하는 동안 복사한 이미지를 ⌘2 또는 Ctrl+2로 편집기 위에 고정해 둘 수 있습니다.

개발자가 재현할 수 있는 단계 쓰기

  1. 알려진 상태에서 시작하세요. "로그아웃 상태, 새 브라우저 탭, 확장 프로그램 없음"은 개발자에게 무엇을 초기화해야 하는지 알려 줍니다.
  2. 단계마다 동작 하나, 화면에 보이는 라벨을 그대로 씁니다. "저장 클릭", "내보내기 › PDF 선택"처럼 쓰고 의역하지 마세요.
  3. 무슨 일이 일어났는지와 무엇을 기대했는지를 적으세요. "대화상자가 저장 없이 닫혔다"는 실행 가능한 정보지만 "안 됐다"는 아닙니다.
  4. 환경을 나열하세요. OS 버전, 앱 버전, 그리고 버그가 항상 발생하는지 가끔 발생하는지 적습니다.
  5. 스크린샷을 해당 단계 옆에 두세요. 여러 장을 찍었다면 화면에 표시한 것과 같은 방식으로 번호를 매기세요.

리포트 제목은 원인에 대한 추측이 아니라 증상을 말해야 합니다. "PDF 내보내기가 끝나지 않음"이지 "내보내기 기능이 고장 남"이 아닙니다.

보내기 전에 개인 데이터 가리기

고객 이름, 이메일 주소, 계정 번호, URL에 들어 있는 토큰, 얼굴, 비공개 메시지는 버그 트래커에 있어서는 안 됩니다. 파일을 첨부하기 전에 흐리게 처리하거나 모자이크하세요. 화면 가장자리도 확인하세요. 브라우저 탭, 알림 팝업, 파일 경로는 메인 창보다 더 많은 것을 흘리는 경우가 많습니다.

InSnap의 모자이크 도구에는 흐림 효과가 포함되어 있습니다. 무언가를 완전히 없애려면 스마트 지우개가 주변 배경으로 그 영역을 채웁니다. 매끄러운 배경, 그라디언트, 인터페이스 배경에서는 잘 작동하지만 복잡한 사진이나 대상의 색이 배경과 비슷할 때는 불안정합니다. 스마트 지우개는 Pro에 포함되며, 모자이크와 흐림 효과는 무료입니다.

이 모든 처리는 사용자의 컴퓨터에서 이루어집니다. InSnap은 선택 사항인 Cloud 구독을 통해 공유하기로 선택하지 않는 한 스크린샷을 업로드하지 않습니다.

말로 다 설명하기 어려울 때는 짧은 녹화를 첨부하세요

어떤 버그는 순서가 중요합니다. 깜빡이는 드롭다운, 엉뚱한 곳에 떨어지는 드래그, 로드된 뒤 튀어 오르는 페이지 같은 것입니다. 몇 초의 영상이 한 문단보다 낫습니다.

화면 영역 녹화 · 1280 × 800

InSnap은 시스템 오디오, 마이크, 카메라, 클릭 효과, 키 입력 표시 옵션과 함께 화면의 한 영역을 녹화합니다. 클릭과 키 입력 표시는 특히 여기서 유용합니다. 보는 사람이 무엇을 눌렀는지 정확히 알 수 있습니다. 빠른 녹화는 MP4로 저장되고 기본 화면 녹화는 무료입니다. GIF 출력과 자동 확대, 카메라 화면 속 화면, 원본 화질 내보내기 같은 편집은 Pro입니다.

클립은 짧게 유지하고 버그가 발생하기 한두 단계 전부터 시작하세요. 녹화가 있어도 서면 단계와 정지 스크린샷을 함께 넣으세요. 어떤 검토자는 휴대폰으로 읽거나 영상을 재생할 수 없습니다.

자주 묻는 질문

버그 리포트에는 무엇이 들어가야 하나요?

문제를 재현하는 정확한 단계, 발생한 일, 기대한 일, 앱과 OS 버전, 그리고 창 전체가 나온 스크린샷 최소 한 장입니다. 움직이는 것은 짧은 녹화를 추가하세요.

오류 메시지만 남기고 스크린샷을 잘라도 되나요?

아니요. 창 전체를 유지하세요. 제목 표시줄, 열린 메뉴, 주변 페이지에 개발자가 필요한 버전과 상태가 들어 있는 경우가 많습니다. 오류는 잘라내지 말고 원이나 화살표로 표시하세요.

스크린샷에서 개인 데이터를 어떻게 가리나요?

파일을 첨부하기 전에 이름, 이메일, 토큰, 얼굴을 흐리게 처리하거나 모자이크하세요. 브라우저 탭과 알림이 있는지 창 가장자리도 확인하세요. InSnap은 사용자의 컴퓨터에서 편집하며, 직접 공유하기로 선택하지 않는 한 아무것도 업로드하지 않습니다.

영상이 스크린샷보다 나은가요?

둘은 서로 다른 질문에 답합니다. 스크린샷은 상태를 보여 주고, 영상은 흐름을 보여 줍니다. 정적인 문제에는 번호를 매긴 스크린샷을 쓰고, 버그가 타이밍·애니메이션·드래그·깜빡임과 관련되면 짧은 녹화를 쓰세요.

다음 스크린샷은 단축키 하나면 됩니다.

macOS 14.4+(Apple 실리콘 및 Intel) · Windows 10+(64비트)