세션 리플레이 뷰어

사용자가 어떻게 탐색했는지, 어디에서 문제가 발생했는지, 무엇이 오류를 일으켰는지 이해해야 할 때, 세션 리플레이 뷰어는 기록된 이벤트 타임라인 및 개발자 도구와 함께 세션을 보여줍니다. 제품 관리자는 이를 사용하여 UX 마찰을 파악하고, 개발자는 이를 사용하여 사용자 행동을 API 호출 및 JavaScript 오류와 연관시킵니다.

크기 조절 가능한 패널

전체 리플레이에서 확장 아이콘을 선택하면 확장된 뷰어가 열립니다. 확장된 뷰어에는 작업 흐름에 맞게 크기를 조정할 수 있는 세 개의 패널이 포함되어 있습니다.

왼쪽에 있는 재생 목록입니다.
비디오 플레이어가 중앙에 있습니다.
오른쪽에 있는 사이드 패널에는 이벤트 타임라인, 요약, 프로필 및 의견이 표시됩니다.

패널의 크기를 조정하려면 전체 두 패널 대상 구간의 구분선을 드래그하십시오. 패널은 사용자가 설정한 위치에 맞게 조정됩니다.

Amplitude는 패널 크기를 브라우저의 로컬 저장소에 저장합니다. 다음에 뷰어를 열면 패널이 사용자가 설정한 너비로 다시 열립니다. 패널을 기본 크기로 되돌리려면 도구 모음에서 패널 크기 재설정을 선택합니다.

비활성 상태 건너뛰기 토글

플레이어 컨트롤에서 조절 아이콘을 선택하여 시청 설정을 연 다음 비활성 상태 건너뛰기를 토글합니다. 토글은 사용자가 유휴 상태였던 기간을 재생에서 건너뛰는지 여부를 제어합니다. 토글이 켜져 있으면 플레이어는 비활성 상태를 빠르게 넘어가므로 사용자는 활성 동작에 집중할 수 있습니다. 이 기능이 꺼져 있으면 재생은 유휴 시간 동안 정상 속도로 재생됩니다.

Amplitude는 브라우저의 로컬 저장소에 사용자별 선택을 기억합니다. 토글을 켜거나 끄면, 해당 기본 설정은 캐러셀이나 목록 모달과 같은 임베디드 컨텍스트를 포함하여 다음에 리플레이를 열 때 적용됩니다.

신규 사용자에 대한 기본값: 비활성 건너뛰기가 설정되어 있습니다.
범위: 사용자 및 브라우저별로 표시됩니다. Amplitude에 대한 사이트 데이터를 지우면 기본 설정이 재설정됩니다.
내장된 플레이어: 일부 내장된 보기는 저장된 환경설정을 무시할 수 있습니다. 예를 들어 Agent 분석 세션 리플레이는 불러오기 설정에 관계없이 항상 비활성 상태를 건너뛰습니다.

사이드 패널의 세션 코멘트 탭을 사용하여 Amplitude를 떠나지 않고 팀과 녹음에 대해 논의할 수 있습니다. 코멘트는 이벤트, 요약 및 프로필 탭과 함께 각 코멘트의 작성자, 타임스탬프 및 텍스트를 보여주는 오래된 순의 플랫 스레드로 표시됩니다. 제품 관리자, 개발자 및 지원 팀은 코멘트를 사용하여 세션의 특정 순간을 표시하거나, 질문을 하거나, 조사를 인계합니다.

코멘트 추가

세션 리플레이를 열고 사이드 패널에서 세션 코멘트 탭을 선택합니다.
텍스트 필드에 코멘트를 입력하십시오.
특정 순간에 연결하려면 현재 타임스탬프 추가를 선택하거나, [00:10]와 같이 괄호 구문을 사용하여 타임스탬프를 수동으로 입력하십시오. Amplitude는 누군가가 해당 배지를 선택할 때 해당 초로 플레이어를 이동시키는 클릭 가능한 타임스탬프 배지를 삽입합니다.
팀원에게 알리려면 @를 입력한 다음 자동 완성 목록에서 이름을 선택하십시오. 하나의 댓글에서 둘 이상의 사람을 언급할 수 있습니다.
게시를 선택하여 스레드에 코멘트를 추가합니다.

Amplitude는 언급된 팀원들에게 이메일, 앱 내 및 Slack을 통해 알림을 제공합니다. 재생을 볼 수 있는 권한이 있는 외부 사용자를 언급할 수도 있습니다. 그러면 해당 사용자에게 초대가 전송됩니다.

댓글 편집 또는 삭제

게시한 댓글을 편집하려면 편집 작업을 선택하고 텍스트를 변경한 다음 저장하십시오.
자신이 게시한 댓글을 삭제하려면 삭제 작업을 선택한 다음 확인하십시오.

자신이 게시한 댓글만 편집 및 삭제할 수 있습니다.

댓글 활동 추적

모든 활동 탭은 모든 리플레이에서 사용자의 댓글 활동을 한 곳에 모아주며, 읽지 않음 배지가 새 활동을 표시합니다. 항목을 선택하여 해당 리플레이를 열고 관련 댓글로 이동하십시오. 댓글 알림을 선택하면 Amplitude가 리플레이를 열고 댓글을 강조 표시합니다.

주석 동작 및 제한

댓글은 각각 최대 2,000자의 일반 텍스트를 지원합니다.
본인이 게시한 댓글만 편집 및 삭제할 수 있으며, 댓글을 삭제하려면 확인이 필요합니다.
리플레이에 댓글을 달려면 해당 리플레이를 보는 것과 동일한 권한이 필요합니다.
리플레이에 댓글을 달면 해당 리플레이에 자동으로 북마크가 추가됩니다. 책갈피는 나중에 주석을 삭제하더라도 유지됩니다.
주석은 재생의 리텐션 기간이 만료된 후에도 유지됩니다. 주석은 남아 있지만 재생은 더 이상 사용할 수 없는 것으로 표시됩니다.

DevTools 네트워크 탭

세션 리플레이 뷰어의 개발자 도구 섹션에는 네트워크 탭이 포함되어 있습니다. 네트워크 탭은 재생 다음 기간동안 캡처된 네트워크 요청을 표시하며 사용자의 브라우저가 요청한 내용과 해당 요청이 어떻게 해결되었는지 보여줍니다.

각 네트워크 요청 항목은 다음을 보여줍니다.

URL
HTTP 메소드
상태 코드
응답 시간

행을 선택하여 네 개의 탭이 있는 세부 정보 패널을 엽니다.

탭	내용
헤더	요청 URL, HTTP 메소드, 상태 코드 및 전체 캡처된 요청 및 응답 헤더입니다.
페이로드	캡처된 요청 본문입니다. 이 탭은 SDK 설정에서 `requestBody`캡처 규칙을 구성할 때만 나타납니다.
응답	캡처된 응답 본문입니다. 이 탭은 SDK 설정에서 `responseBody`캡처 규칙을 구성할 때만 나타납니다.
타이밍	재생을 기준으로 요청이 시작된 시점과 요청에 걸린 시간(워터폴 시각화)을 표시합니다.

요청 및 응답 본문을 캡처하려면 networkTrackingSDK 구성에서 requestBody 및 responseBody 캡처 규칙을 구성하십시오. 설정 지침은 네트워크 요청 추적을 참조하십시오.

네트워크 탭을 사용하여 사용자 작업과 API 호출을 연관시키거나 사용자 경험 저하를 유발한 실패한 요청을 식별할 수 있습니다. 예를 들어 사용자가 체크아웃 중에 오류를 경험한 경우 네트워크 탭을 확인하여 재생의 해당 순간에 결제 API 호출이 200이 아닌 상태 코드를 반환했는지 확인하십시오.

네트워크 탭 및 콘솔 탭

네트워크 탭은 재생 다음 기간동안 캡처된 JavaScript 콘솔 로그를 표시하는 콘솔 탭과 함께 작동합니다. 이러한 탭을 함께 사용하면 재생 다음 기간동안 클라이언트측 동작에 대한 완전한 그림을 볼 수 있습니다.

콘솔 로그를 캡처하려면 세션 리플레이 설정으로 이동하여 콘솔 추적을 활성화하십시오.

이 내용이 도움이 되었나요?