Cue 배우기 · 작업 기반 튜토리얼

음성 버그 리포트를 코딩 Agent 브리프로 변환하기

문제가 보이는 곳에서 바로 설명하세요. Cue로 눈에 보이는 증상을 캡처한 다음, 원인을 추측하지 않고도 코딩 Agent가 문제를 재현하고 수정 사항을 확인할 수 있도록 충분한 컨텍스트를 제공하세요.

작성자: Cue 제품 팀 (English) · 업데이트: . 제품 소스 검토를 바탕으로 작성되었습니다. 실습과 결과물은 예시일 뿐이며 실제 기록된 Cue 실행 결과가 아닙니다. 설치된 버전에 표시되는 컨트롤을 따르세요.

코딩 Agent에게 유용한 음성 버그 리포트를 어떻게 전달할 수 있나요?

해당 앱이 화면에 떠 있는 동안 Cue로 문제를 설명하세요. 설명을 재현 단계, 예상 및 관찰된 동작, 알려진 조건, 완료 검증 항목으로 변환하세요. 브리프를 검토한 후, 올바른 리포지토리에서 설정된 Claude Code 또는 Codex 작업으로 명시적으로 전달하세요.

필요 사항: 구체적인 증상 및 시작 상태. 설정된 코딩 도구는 나중에 인계할 때만 필요합니다. 결과물: 추정된 근본 원인이나 이미 검증된 수정 사항이 아닌, 재현 가능한 리포트 및 범위가 지정된 작업.

실제로 관찰할 수 있는 내용 캡처하기

“레이아웃이 깨졌어요”라는 말은 다음 사람이 당시 상황을 직접 재구성해야 하게 만듭니다. 유용한 음성 리포트는 페이지, 수행한 동작, 눈에 보이는 결과 및 조건을 보존합니다. Cue를 사용하면 관련 앱을 눈앞에 둔 상태에서 설명을 시작할 수 있습니다. 유용한 결과물은 코드에 대한 자신 있는 추측이 아니라 재현 가능한 브리프입니다.

  1. 문제가 발생한 페이지나 앱 상태를 화면에 유지하세요. 확인 가능한 경우 URL이나 화면 이름, 앱 버전, 운영 체제, 브라우저를 기록하세요. 알 수 없는 세부 정보는 이전 리포트에서 임의로 가져오지 말고 알 수 없음으로 표시하세요.
  2. 음성으로 말한 내용을 이슈 초안에 바로 입력하려면 해당 텍스트 필드에 포커스를 두고 Cue Dictation을 사용하세요. 구조화된 리포트가 필요하다면 Cue Agent를 사용하고 관련 화면을 명시적으로 식별하거나 간단한 설명을 제공하세요.
  3. 시작 상태를 포함하여 단계를 순서대로 기록하세요. “한 번 보았습니다”와 “세 번 재현했습니다”를 명확히 구분하세요. 실제로 확인해 본 정상 동작 비교 사례가 있다면 함께 기록하세요.
  4. 초안 리포트를 요청하세요. 대상 프로젝트, 근거 및 범위가 명확해질 때까지는 리포지토리 수정을 승인하지 마세요.

화면에 보이는 컨텍스트에는 숨겨진 브라우저 로그, 소스 코드 또는 모든 탭이 포함되지 않습니다. 스크린샷이 유용하다면 실제 상태를 캡처하고 개인정보를 삭제한 뒤 의도적으로 첨부하세요. 작업에서 첨부 파일을 직접 확인할 수 있기 전까지는 첨부 파일이 존재한다고 명시하지 마세요. 이 튜토리얼에는 제품 스크린샷이나 기록된 테스트 실행이 포함되어 있지 않습니다.

실습: 원인을 추측하지 않고 왜곡된 미리보기 설명하기

이 가상의 리포트는 일회성 예시 웹사이트에 관한 것이며 현재 Cue 웹사이트에 대한 설명이 아닙니다. 여기에 사용된 크기와 재현 횟수는 실습용 데이터이며 이 예시를 위해 브라우저에서 실제로 측정한 값이 아닙니다.

소스 B-01: 예시 사이트의 비디오 미리보기 페이지에서 제공된 이미지는 1600 × 900픽셀입니다. 뷰포트 너비 390픽셀에서 미리보기를 열면 이미지가 세로로 길고 늘어나 보입니다. 너비 1280픽셀에서는 동일한 이미지가 정상적인 비율로 보입니다. 실습 리포트에 따르면 좁은 화면에서 세 번 시도했고 매번 같은 현상이 발생했습니다. 브라우저 버전, 운영 체제 및 영향을 받는 코드 경로는 알 수 없습니다. 요청된 수정 사항은 시각적인 부분에 국한되며 텍스트와 다운로드 동작은 변경되지 않아야 합니다.

B-01을 제공하고 Cue에 다음과 같이 요청하세요:

B-01을 요약, 환경, 재현 단계, 예상 결과, 관찰된 결과, 알 수 없는 항목, 완료 검증 항목이 포함된 버그 리포트 초안으로 변환해 주세요. 관찰 내용과 가능한 원인은 분리하여 유지하세요. CSS 선택자, 파일 경로, 스크린샷, 근본 원인 또는 테스트 결과를 지어내지 마세요. 390픽셀 및 1280픽셀 사례를 포함하세요. 작업 범위는 미리보기의 가로세로 비율과 오버플로로 한정하세요. 초안만 작성하고 이슈를 제출하거나 코드를 수정하지 마세요.

예시 브리프(실제 기록된 Cue 결과가 아님):

요약: 390픽셀 뷰포트에서 비디오 미리보기가 세로로 늘어나 보임.
환경: 예시 사이트; 브라우저 버전 및 운영 체제 알 수 없음.
단계: 미리보기 페이지를 열고 뷰포트 너비를 390픽셀로 설정한 뒤 제공된 1600 × 900 이미지를 표시하고 비율을 검사합니다. 1280픽셀에서 반복합니다.
예상 결과: 두 너비 모두에서 페이지 수준의 가로 오버플로 없이 미리보기가 이미지의 16:9 비율을 유지함.
B-01에서 관찰된 결과: 보고된 세 번의 시도에서 390픽셀일 때 늘어남; 1280픽셀에서는 정상 비율 유지.
알 수 없는 항목: 관련 컴포넌트, CSS 규칙 및 근본 원인.
범위: 시각적 미리보기에만 국한; 텍스트, 가격 표시 및 다운로드 동작은 변경하지 않고 유지.
인수 점검 사항: 390픽셀에서 렌더링된 미리보기가 원본 16:9 비율을 1% 오차 내에서 유지하고 페이지에 가로 오버플로가 보고되지 않음; 1280픽셀에서도 두 조건이 유지됨; 다운로드 링크, 가격 텍스트 및 미리보기 캡션이 변경 전과 바이트 단위로 동일함; 두 너비를 모두 다루는 브라우저 점검이 수정 전에는 실패하고 수정 후에는 통과함.

1600 × 900 소스는 가로세로 비율이 16:9입니다. 이러한 계산은 유용한 확인 수단일 뿐 실제 렌더링된 크기에 대한 증거는 아닙니다. 코딩 Agent에게 수정 방식을 선택하기 전에 실제 이미지와 레이아웃을 검사하도록 요청하세요. “아마도 flexbox 문제일 것”이라는 내용은 근거가 있을 때만 가설 아래에 들어가야 하며 확인된 원인에 들어가서는 안 됩니다.

인계하기 전에 재현 절차와 인수 점검 사항을 교정하세요

음성 보고서는 내용이 틀려도 매끄럽게 읽힙니다. 전달 과정에서 가장 훼손되기 쉬운 부분은 코딩 Agent가 의존하는 핵심 정보입니다. 즉, 절차의 순서, 수치, 직접 관찰한 사실과 추측한 결론 사이의 차이입니다. 다른 사람의 작업으로 넘어가기 전에 초안을 원본과 대조하여 소리 내어 확인하세요. 1분이면 충분하며 모호한 보고서 때문에 발생하는 불필요한 질의응답을 대부분 방지할 수 있습니다.

재현 절차

  • 수행한 순서대로 한 단계당 하나의 작업만 작성하세요. “390픽셀에서 미리보기 페이지를 열고 이미지를 확인한다”는 두 개의 작업이 합쳐져 있어 둘 중 어느 쪽이 실패했는지 알기 어렵습니다. 둘로 나누세요.
  • 시작 상태를 명시하세요. 로그인 또는 로그아웃 여부, 계정 유형, 대상 페이지, 이미 열려 있던 항목을 적습니다. 본인의 특정한 환경에서만 재현된다면 재현 가능한 버그가 아닙니다.
  • 형용사가 아닌 정확한 값을 사용하세요. “좁은 창”이 아니라 390픽셀, “큰 이미지”가 아니라 1600 × 900, “대체로”가 아니라 3회 시도와 같이 표기합니다. 음성 입력된 숫자는 가장 누락되기 쉬우므로 모든 수치를 원본과 대조하세요.
  • 모르는 것은 모른 채로 남겨두세요. 브라우저 버전이 기록되지 않았다면 지난번 보고서의 버전을 가져오지 말고 초안에 알 수 없음으로 표시해야 합니다. 출처 없이 추가된 사실이 있는지 초안을 면밀히 검토하세요.
  • 다른 사람도 따라 할 수 있어야 합니다. 해당 버그를 전혀 본 적이 없는 사람의 입장에서 절차를 읽어보세요. 질문해야만 알 수 있는 부분이 있다면 누락된 단계입니다.

인수 점검 사항

  • 현장에 없던 사람도 직접 관찰할 수 있어야 합니다. “미리보기가 올바르게 표시됨”은 점검 항목이 아닙니다. “렌더링된 미리보기가 원본의 16:9 비율을 유지하고 390 및 1280픽셀에서 가로 오버플로가 발생하지 않음”이 점검 항목입니다.
  • 보고된 증상과 직접 연계되어야 합니다. 각 점검 사항은 보고한 원인으로 인해 현재 실패해야 합니다. 이미 통과하는 점검 항목은 결함에 대해 아무것도 입증하지 못합니다.
  • 최소 한 가지 이상의 부정 점검(변경 방지)을 포함하세요. 다운로드 링크, 가격 텍스트, 캡션 등 변경되어서는 안 되는 대상을 명시합니다. 의도치 않은 범위 변경은 소규모 수정에서 흔히 발생하는 실패 유형이며, 확인을 요청하지 않으면 알아채기 어렵습니다.
  • 증거로 인정할 기준을 명시하세요. 실행된 점검의 실제 출력값, 변경된 파일, 비교 스크린샷 등이 해당합니다. 수정이 잘 작동한다는 설명문이나 관련 없는 컴포넌트의 테스트 통과는 증거가 아닙니다.
  • 정상 결과를 얻기 위해 점검 기준을 완화하지 마세요. 점검을 통과하지 못한다면 이는 수정 사항에 대한 상태 정보일 뿐 요구사항을 수정해야 하는 이유가 아닙니다.

동일한 B-01 단계의 두 가지 버전을 비교하면 차이가 명확해집니다. 미흡한 예: “창을 작게 줄였더니 미리보기가 늘어나 보였음. 아마 flexbox 문제인 듯함.” 이 문장은 뷰포트, 작업, 원인 추측이 섞여 있어 Agent에게 재현할 결함이 아닌 확인해야 할 가설을 넘겨줍니다. 교정된 예: “뷰포트를 390픽셀로 설정. 미리보기 페이지 열기. 제공된 1600 × 900 이미지 표시. 관찰 결과: 이미지가 원본 16:9 비율보다 세로로 길어짐. 3회 반복 확인. 원인 알 수 없음.” 두 번째 버전은 재현하고 반증할 수 있지만, 첫 번째 버전은 불가능합니다.

보고서를 음성으로 입력했다면 무엇을 말했는지 기억에만 의존하지 말고 입력된 텍스트 자체를 읽어보세요. 자릿수가 바뀌거나 “not”이 누락되어도 문장은 매끄럽게 읽힐 수 있습니다. 식별자와 버전 번호는 말하려던 내용이 아니라 원본 자료와 한 글자씩 대조하세요.

브리프를 Claude Code 또는 Codex에 명시적으로 전달하기

가장 간단한 경로는 검토를 거친 텍스트 인계입니다. 대상 리포지토리에서 이미 설정된 Claude Code 또는 Codex 작업을 열고 리포트를 붙여넣거나 프롬프트 필드에 짧은 후속 지시를 구술하세요. 이는 다른 도구로의 음성 입력일 뿐 내장 연동이나 대화 공유를 의미하지 않습니다.

경로 실제 수행 작업 입증되는 내용 입증되지 않는 내용
다른 도구의 입력창에 직접 음성 입력하기 Claude Code 또는 Codex 프롬프트 필드에 커서를 두고 Cue Dictation 컨트롤을 사용한 뒤, 제출하기 전에 입력된 텍스트를 검토합니다. 발화한 내용이 해당 도구의 입력 필드에 도달했음. 짧은 후속 작업에 가장 빠른 경로입니다. 텍스트가 검토되었음. 음성은 교정되지 않은 상태로 입력되며, 이는 식별자와 수치에 가장 취약한 상태입니다.
이미 검토를 마친 브리프 붙여넣기 Cue에서 초안을 작성하고 위 기준에 따라 교정한 뒤, 복사하여 대상 Claude Code 또는 Codex 작업에 붙여넣습니다. 수신 측 작업에 승인된 텍스트가 정확히 전달되었음. 이 실습에서 사용하는 경로입니다. Cue와 해당 도구 간의 연동 상태. 사용자가 직접 수행한 수동 전송입니다.
Cue에 구성된 외부 Agent Cue에서 구성된 외부 Agent를 선택하고 먼저 설정, 로그인 및 권한을 확인합니다. 사용자의 자체 구성과 해당 제공업체 계정이 실제로 허용하는 범위에 한함. Claude, Codex, Gemini가 목록에 표시되어 있어도 연결, 권한 부여, 사용 가능한 모델 또는 실행 완료를 증명하지는 않습니다. 요금 청구 및 가용성은 목록 표시가 아닌 구성된 경로를 따릅니다.

이 실습에서는 위의 수동 텍스트 인계를 사용하며, 설정된 외부 Agent 커넥터를 요구하거나 시연하지 않습니다. Cue의 Agent 선택기에서 외부 Agent를 대신 사용하는 경우 먼저 해당 커넥터의 설정, 로그인 및 권한을 확인하세요. Cue 자체 Agent의 모델을 선택하는 것은 Claude Code 또는 Codex 런타임을 선택하는 것과 다릅니다. 사용 가능 여부와 요금은 구성된 경로에 따라 달라집니다. 이러한 경로들이 서로 호환된다고 가정하기 전에 Agent, 모델 및 컨텍스트 가이드 를 참조하세요.

작업: 선택된 웹사이트 리포지토리에서 첨부된 B-01 리포트를 조사하세요.
먼저: 현재 변경 사항을 검사하고 관련 없는 작업을 보존하세요. 실제 미리보기 구현 위치를 찾으세요. 증상을 재현하고 여전히 알 수 없는 사항을 명시하세요.
그 다음, 승인된 경우: 390픽셀 및 1280픽셀에서 이미지 비율과 오버플로에 대한 브라우저 회귀 테스트를 추가하고, 관찰된 결함으로 인해 실패하는지 확인한 후 가장 적절하고 작은 단위의 수정을 진행하세요.
경계 조건: 텍스트, 가격 정책, 다운로드, 프로덕션 설정 또는 관련 없는 컴포넌트를 변경하지 마세요. 별도로 승인되지 않은 한 커밋, 이슈 제출 또는 배포를 수행하지 마세요.
반환 결과: 범위가 한정된 diff, 실제로 실행된 명령어, 해당 결과 및 남아 있는 불확실한 사항.

다른 Agent는 이전 작업의 기록, 파일 또는 권한을 자동으로 이어받지 않습니다. 공유할 권한이 있는 브리프와 특정 소스 또는 스크린샷을 포함하세요. 리포지토리 파일은 음성 프롬프트에서 추측한 경로가 아니라 선택된 프로젝트에서 가져와야 합니다. 자격 증명, 세션 토큰 및 관련 없는 고객 기록은 재현 과정에 포함되어서는 안 됩니다.

Anthropic의 Claude Code 모범 사례 에서는 Agent에게 자체 작업을 검증할 방법을 제공할 것을 권장합니다. 여기서는 “페이지를 개선해 달라”고 요청하는 것보다 구체적인 완료 검증 항목을 제공하는 것이 훨씬 유용합니다. 해당 안내가 Cue 커넥터가 설치되어 있다거나 이 실습이 실제로 실행되었음을 증명하는 것은 아닙니다.

설명뿐만 아니라 수정 사항도 검토하기

  • 사전 확인: Agent가 올바른 프로젝트에서 보고된 동작을 재현했나요? 그렇지 않다면 시도한 내용을 반환하고 누락된 환경 정보를 요청해야 합니다.
  • Diff 및 테스트: 변경된 파일과 실제 테스트 출력을 검사하세요. 제안된 명령어가 실제로 실행된 명령어는 아니며, 관련 없는 컴포넌트의 성공 테스트 결과가 회귀 테스트를 대신할 수 없습니다.
  • 시각적 결과: 두 너비 모두에서 실제 미리보기를 비교하세요. 소스의 가로세로 비율이 유지되고 페이지 수준의 가로 스크롤이 발생하지 않는지 확인하세요. 바깥쪽 카드뿐만 아니라 이미지 자체도 확인해야 합니다.
  • 범위: 관련 없는 문구, 가격 또는 다운로드 동작이 변경되지 않았는지 확인하세요. 패치가 공유 레이아웃 규칙을 건드리는 경우 이를 사용하는 다른 부분도 함께 확인하세요.
  • 배포: 로컬 수정, 커밋된 코드, 병합된 변경 사항, 배포된 페이지를 구분하세요. 승인된 배포 후에는 공개 페이지에서 동일한 시나리오를 검증하세요.

작성 실습의 성공 기준은 리포트가 재현 가능하고 알 수 없는 사항을 솔직하게 명시하는 것입니다. 실제 수정을 완료하려면 위의 리포지토리 및 브라우저 확인 과정을 별도로 거쳐야 합니다. 예시 리포트를 실제 고객 장애 사례로 게시하지 마세요.

Agent가 안전하게 작업을 마치지 못할 때

Agent가 버그를 재현하지 못하는 경우

정확한 페이지, 뷰포트, 브라우저 버전, 시작 상태 또는 민감 정보가 가려진 실제 스크린샷 등 누락된 사실을 한 번에 하나씩 추가하세요. 무엇을 테스트했는지 질문하세요. 단순히 통과 결과를 얻기 위해 완료 기준을 완화하지 마세요.

제안된 수정 사항이 관련 없는 동작을 변경하는 경우

작업을 일시 중지하고 작업 범위 경계를 지적하세요. 더 작은 패치를 요청하거나 종속성에 대한 설명을 요구하세요. 추가 조치를 취하기 전에 현재 diff를 검토하세요. 작업을 중지하는 것이 실행 취소 작업을 의미하지는 않습니다.

재시도로 인해 일부 작업이 중복 실행될 수 있는 경우

먼저 리포지토리, 이슈 초안 또는 배포 상태를 검사하세요. 완료되지 않은 부분만 이어서 진행하세요. 새 작업에는 모든 것을 무작정 반복하라는 지시 대신 검증된 짧은 상태 요약을 제공해야 합니다.

더 풍부한 배경 맥락을 제공하려면 먼저 회의 노트를 출처가 연결된 조치 항목으로 변환한 다음, 이 버그와 관련된 결정 사항 및 제약 조건만 첨부하세요.보고서가 이미 화면에 있는 텍스트를 바탕으로 시작된다면, 초안을 신뢰하기 전에 Agent가 실제로 전달받은 내용을 확인하세요.

Cue로 시작해 보기

설정된 단축키를 사용하고 Cue Settings에서 활성 모드를 확인하세요. 사용 가능한 앱 컨텍스트와 작업은 권한, 버전 및 계정에 따라 달라집니다. 기밀 자료를 제공하기 전에 개인정보 처리방침 (English) 을 읽어보세요. 이 가이드는 모든 처리가 사용자의 기기 내에서만 유지된다고 보장하지 않습니다.

컴퓨터용 Cue 다운로드 · 현재 요금제 (English)

도움이 필요하거나 오류를 발견하셨나요? Cue 지원팀에 문의 (English) 하거나 이메일을 보내주세요 eli@sophoninc.com. Cue 버전, 플랫폼, 모드 및 민감 정보가 삭제된 예시를 포함해 주세요. 비밀번호, 토큰 또는 비공개 회의 자료는 전송하지 마세요.