2026.01 — 현재 · 운영 중
어르다
상담사 수련 매칭 플랫폼
개요
전국 상담 수련기관 정보 탐색, 슈퍼비전 매칭, 수련생 모집 공고, 상담사 자격 요건 확인을 제공하는 상담사 수련 매칭 플랫폼입니다. 사용자가 필요한 정보를 빠르게 탐색할 수 있도록 인터랙티브 UI를 구현했고, 운영 효율을 높이기 위한 내부 관리 시스템과 사용자 행동 데이터를 기반으로 서비스를 지속적으로 개선하고 있습니다.
문제와 개선
첫인상과 진입 동선
AS-IS
핵심 가치와 기능이 첫 화면에서 전달되지 않아, 상담 수련이 낯선 사용자가 서비스를 직관적으로 이해하기 어려웠습니다.
TO-BE
스크롤 인터랙션과 3D Orbit 생태계 다이어그램으로 ‘기관 탐색 → 슈퍼비전 매칭 → 모집 공고 → 자격 확인’을 한눈에 보이게 했습니다. CTA를 동선 한가운데 두어 탐색·매칭으로 자연스럽게 보냈습니다.
랜딩 성능과 분석의 충돌 해소
AS-IS
GTM·Clarity를 첫 페인트에 같이 올리면 홈 초기 로드가 무거워지고, 분석을 빼면 퍼널을 볼 수 없습니다.
TO-BE
홈은 GTM을 deferred로 두어 첫 입력 또는 idle 시점에만 로드합니다. 그 외 공개/보호 페이지는 즉시 로드해, 랜딩 성능과 전환 측정을 동시에 지켰습니다.
퍼널을 이벤트 단위로 정의
AS-IS
이탈 화면과 핵심 기능 사용량을 정량적으로 볼 데이터가 없어 개선 우선순위를 감으로 정해야 했습니다.
TO-BE
회원가입, 상담기관 탐색, 슈퍼바이저 등록 등 시나리오별 이벤트를 GTM에 정의하고 퍼널을 그렸습니다. 어느 단계에서 빠지는지 보고 랜딩 CTA와 탐색 UI 개선 순서를 정했습니다.
운영 효율과 장애 내성
AS-IS
인터뷰 일정을 PM이 수동으로 공유했고, 백엔드가 비거나 지연되면 랜딩 일부가 깨졌으며 Infinite Slider는 드래그/클릭이 충돌했습니다.
TO-BE
일정·진척 관리와 Discord Webhook 알림으로 배정·변경을 자동 공유했습니다. Null-safe 렌더와 드래그 임계값으로 장애·모바일 스크롤에서도 화면이 유지되게 했습니다.
설계에서 남긴 판단
UX는 설명보다 구조
수련 과정이 복잡한 도메인이라, 카피만 늘리지 않고 생태계 다이어그램과 CTA 동선으로 ‘지금 무엇을 하면 되는지’를 먼저 보여 주었습니다.
측정은 첫 페인트 뒤에
분석 태그를 홈 초기 경로에서 빼 첫 페인트를 지키고, 상호작용 이후에 이벤트를 모아 퍼널을 봤습니다. 성능과 데이터 기반 개선을 같은 레이어에서 설계했습니다.
화면
회고
직관적인 UI만으로는 경험이 끝나지 않습니다. 홈에서는 분석을 늦춰 첫인상을 지키고, 그다음 GTM 퍼널로 이탈을 본 뒤에야 어떤 CTA를 고칠지 정할 수 있었습니다. 운영 자동화까지 포함해야 사용자와 운영자 경험이 같이 좋아진다는 점도 배웠습니다.