Microsoft Clarity를 사용하여 사용자를 더 잘 이해하기
게시 됨: 2022-03-11Microsoft Clarity를 사용하면 사용자가 웹 사이트와 상호 작용하는 방식을 분석할 수 있습니다. Google Analytics를 보완하고 히트맵 및 세션 재생과 같은 도구를 통해 사용자 통찰력을 제공합니다. Clarity의 고유한 기능은 무엇이며 웹사이트의 사용자 경험을 어떻게 개선할 수 있습니까?
요즘에는 분석이 풍부합니다. 웹사이트에 대한 자세한 데이터를 수집하는 프로그램이 필요한 경우 옵션이 부족하지 않습니다. 그러나 많은 분석 프로그램에는 설계 결정으로 변환하기 어려운 가파른 학습 곡선과 산출 메트릭이 있습니다.
Microsoft Clarity는 사용자 상호 작용을 시각적 통찰력으로 바꾸는 행동 분석 도구입니다. Clarity는 다양한 대시보드, 히트맵 및 세션 재생을 제공하여 사이트의 어느 부분이 가장 많이 참여하고 가장 적게 참여하는지 보여줍니다. 또한 분노 클릭 및 데드 클릭과 같은 기능을 통해 혼란과 성능 저하를 유발하는 문제를 쉽게 분석할 수 있습니다.
Clarity의 가장 강력한 기능은 무엇입니까?
Clarity를 구축한 팀의 소프트웨어 개발자로서 저는 디자이너가 사용자를 더 잘 이해하는 데 Clarity가 어떻게 도움이 될 수 있는지 직접 보았습니다. Clarity의 기능은 강력할 뿐만 아니라 복잡하지 않고 깔끔합니다. 모든 것은 Clarity 대시보드에서 시작됩니다.
Clarity 대시보드: 높은 수준의 통찰력 및 미묘한 필터
Clarity의 기본 대시보드에는 사용자 불만을 나타내는 세션 메트릭, 트래픽 소스 및 차트가 표시됩니다. 또한 커서 이동, 운영 체제 및 크기 조정된 페이지와 같은 보다 미묘한 기준에 따라 검색할 수 있는 고급 필터를 제공합니다.
또한 Clarity는 사용자 정의 태그를 무제한으로 생성할 수 있는 옵션을 제공합니다. 이는 검토를 위해 특정 세션을 찾는 능력을 가속화하는 맞춤형 필터입니다. 사용자 정의 태그는 다음과 같은 경우에 특히 유용합니다.
- 양식 제출 및 구매와 같은 전환 식별
- 특정 사용자에 대한 히트맵 및 세션 기록 찾기
- 특정 사용자가 언제 로그인하고 어떤 유형의 페이지를 보고 있는지 추적
불만 지표: 사용성 문제 식별 및 제거
선택하지 않으면 사용성 문제로 인해 웹 사이트가 중단됩니다. 다행히도 Clarity의 좌절 지표는 UX 디자인 결함을 암시하는 상호 작용을 분리합니다.
- 분노 클릭 : 사용자가 같은 영역을 빠르게 여러 번 클릭합니다. 격렬한 클릭은 대상 크기가 충분하지 않거나 잘못된 시각 디자인을 나타낼 수 있습니다.
- 데드 클릭 : 사용자가 요소를 클릭했지만 아무 일도 일어나지 않습니다. 죽은 클릭은 링크가 끊어진 결과일 수 있습니다.
- 과도한 스크롤 : 사용자가 일반 사용자보다 더 자주 페이지를 급하게 위아래로 스크롤합니다. 과도한 스크롤은 검색 가능성이 낮거나 관련 없는 콘텐츠를 나타낼 수 있습니다.
- 빠른 뒤로 : 사용자가 페이지를 방문하고 빠르게 이전 페이지로 돌아갑니다. 퀵백은 오해의 소지가 있는 아이콘이나 콘텐츠 설명으로 인해 발생할 수 있습니다.
세션 다시보기: 사용자가 사이트를 실제로 경험하는 방법 확인
"Recordings" 탭은 세션 리플레이를 볼 수 있는 곳입니다. 커서 이동 및 클릭을 추적하는 것 외에도 재생에는 시작 및 종료 URL, 세션 기간, 날짜 및 장치와 같은 정보가 포함됩니다.
Clarity는 또한 사용자가 아무것도 하지 않을 때 확장된 스트레치를 건너뛸 수 있는 "비활성 건너뛰기" 확인란을 제공하므로 여러 세션을 볼 때 시간을 크게 절약할 수 있습니다.
각 비디오 위의 "세부정보" 옵션은 사용자 행동의 타임라인을 보여줍니다. 각 작업은 클릭할 수 있으며 녹음에서 해당 위치에 연결됩니다.
히트맵: 가장 매력적인 콘텐츠 시각화
히트맵은 집계된 세션을 시각화하고 사용자가 페이지와 상호 작용하는 방식을 이해하는 쉬운 방법입니다. 따뜻한 색상은 더 인기 있는 지역을 나타내고 차가운 색상은 덜 인기 있는 지역을 나타냅니다. Clarity에서는 세 가지 유형의 히트맵을 사용할 수 있습니다.
- 클릭 히트맵 은 사용자가 데스크탑 페이지에서 클릭한 위치를 보여줍니다.
- 탭 히트맵 은 사용자가 모바일 및 태블릿 페이지에서 탭한 위치를 보여줍니다.
- 스크롤 히트맵 은 사용자가 페이지를 얼마나 아래로 스크롤했는지 보여줍니다.
클릭 앤 탭 히트맵은 매력적인 콘텐츠를 식별하고 디자인 반복을 비교하기 위한 기준선 역할을 할 수 있습니다. 또한 "재생" 버튼이 포함된 일러스트레이션과 같이 사용자가 상호작용적이라고 잘못 생각하는 요소를 찾아낼 수도 있습니다.
스크롤 히트맵을 사용하여 페이지 섹션 위로 마우스를 가져가면 해당 지점에 도달한 사용자의 비율을 볼 수 있습니다. 스크롤 히트맵은 또한 사용자가 스크롤하기 전에 페이지 상단에 있는 영역인 평균 접힘을 식별합니다.
참고: 대시보드 필터는 "녹음" 및 "히트맵" 탭에도 적용할 수 있습니다.
Clarity의 설정을 미세 조정하는 방법
Microsoft Clarity를 사용하면 새 프로젝트를 시작하고 데이터를 마스킹하고 특정 IP 주소를 차단할 수 있습니다. 또한 Google Analytics와 통합되어 웹사이트의 강점과 약점에 대한 보다 자세한 정보를 제공합니다.
Clarity 설정: 인기 있는 타사 플랫폼과 호환
Clarity에 로그인하면 "프로젝트" 페이지로 이동합니다. "새 프로젝트 추가"를 클릭하고 사이트에 대한 세부 정보를 입력하여 시작하십시오. Clarity의 기능은 트래픽 양에 관계없이 모든 웹사이트에서 사용할 수 있습니다.
프로젝트를 생성하면 "설정" 페이지로 이동하고 Clarity 추적 코드가 제공됩니다. 코드를 복사하여 페이지의 <head> HTML 섹션에 붙여넣거나 Clarity의 WordPress 플러그인 또는 Google 태그 관리자 템플릿을 통해 설치합니다. Clarity는 여러 타사 플랫폼에 대한 설정 지침도 제공합니다.
마스킹: 웹사이트 데이터 보호
Clarity가 웹사이트의 민감한 텍스트를 캡처하지 못하도록 하는 세 가지 마스킹 모드가 있습니다.
- Strict : 모든 텍스트가 마스킹됩니다.
- 균형 : 민감한 텍스트만 마스킹됩니다. 민감한 텍스트에는 입력 필드, 숫자 및 이메일 주소가 포함됩니다. (Clarity의 기본 설정입니다.)
- 완화됨 : 마스크된 텍스트가 없습니다.
Clarity의 마스킹 모드 외에도 이미지와 같은 특정 콘텐츠를 마스킹할 수도 있습니다.
참고: 의료 기록이나 금융 정보와 같은 민감한 데이터가 포함된 사이트에서는 Clarity를 사용하지 않는 것이 좋습니다.
IP 차단: 추적에서 특정 방문자 제외
IP 차단은 특정 IP 주소가 Clarity에 의해 기록되는 것을 방지합니다. 예를 들어 팀 구성원의 사이트 방문을 차단할 수 있습니다. 차단 목록에 있는 주소에서 오는 트래픽은 프로젝트 대시보드에 표시되지 않습니다.
Google Analytics: Clarity Recordings에 대한 링크
플랫폼 간에 유사점이 있지만 Google Analytics와 Clarity는 경쟁자가 아니라 서로를 보완합니다. Google Analytics는 트래픽과 전자상거래 실적을 측정합니다. Clarity는 유사한 메트릭을 추적하지만 사용자가 실제로 사이트를 탐색하고 참여하는 방법을 볼 수도 있습니다.
예를 들어 Google Analytics에서 성능이 떨어지는 페이지를 발견하면 Clarity를 사용하여 사용자 세션을 관찰하고 페이지의 디자인 결함을 식별할 수 있습니다. 실제로 Clarity는 Google Analytics 대시보드에서 세션 재생에 연결하는 쉬운 방법을 제공합니다.
Microsoft Clarity는 귀중한 사용자 통찰력을 제공합니다.
디자이너는 사용자 연구, 정보 아키텍처, 프로토타이핑 및 테스트에 수많은 시간을 쏟아 붓습니다. 행동 분석은 어떤 디자인 선택이 효과가 있고 그렇지 않은지를 보여주기 때문에 이러한 지속적인 발견 및 개선 프로세스에 매우 중요합니다. 직관적인 기능과 그래픽 단순성을 갖춘 Microsoft Clarity는 디자이너가 복잡한 사용자 행동을 데이터 기반 디자인 결정으로 전환할 수 있도록 지원합니다.
Toptal Design 블로그에 대한 추가 정보:
- Hotjar: UX 및 변환 팁
- 대중을 위한 UX 테스트: 간단하고 비용 효율적으로 유지
- 누가, 무엇을, 왜 - 사용자 테스트 방법 가이드