게임피케이션으로 재방문율 높이기

사용자 재방문이 얼마나 중요한지는 말할 필요 없다. 한 번 온 사용자가 다시 돌아오지 않으면 아무리 좋은 기능도 소용없다. 이번엔 간단하면서도 효과적인 접근을 택했다: 재방문 배지와 오늘의 상위 성장자 위젯. 시각적 피드백과 사회적 증명(social proof)을 동시에 제공해 재방문을 자연스럽게 유도하는 구조다.

배경: 왜 리텐션 기능인가

사용자 유지(retention)는 보통 세 가지 측면에서 접근한다. 첫째는 기능의 유용성—사용할 이유가 있어야 한다. 둘째는 습관 형성—일상에 자연스럽게 녹아들어야 한다. 셋째는 시각적 보상과 사회적 동기—뭔가 얻는 느낌, 남과 비교하는 즐거움이다.

이 커밋은 세 번째 부분에 집중했다. 재방문 배지는 "아, 내가 어제 왔었지"라는 인식을 주고, 상위 성장자 위젯은 "저 사람은 왜 저렇게 랭킹이 올랐지?"라는 호기심을 불러일으킨다. 둘 다 마찰이 적으면서도 심리적으로 꽤 강한 신호다.

실제로 많은 앱에서 이런 패턴을 쓴다. 뱃지 시스템(Discord의 배지, 깃허브의 풀리퀘스트 스트릭), 리더보드(게임의 일일 랭킹, SNS의 트렌딩), 성장률 표시(재무 앱의 포트폴리오 상승률) 등. 큰 기능이 아니라도 심리적 가치가 높은 이유다.

구현 구조: 두 UI 컴포넌트와 데이터 API

변경된 5개 파일의 역할을 보면 구조가 명확하다:

API 먼저 고민해야 했다. 레이더보드는 매번 새로 계산해야 하고(성장률은 실시간으로 변함), 캐싱 전략도 필요했다. route.ts에서 "오늘 하루 데이터만 쿼리한다"는 약속을 세우고, 응답 구조를 정했을 것 같다.

// 가상의 API 응답 구조
{
  "topGrowers": [
    { "userId": "...", "username": "...", "growthRate": 45, "rank": 1 },
    { "userId": "...", "username": "...", "growthRate": 38, "rank": 2 }
  ],
  "timestamp": "2026-06-19"
}

컴포넌트 구현에서는 몇 가지 결정이 있었을 것 같다:

1. 배지 표시 방식: 연속 방문 수를 어떻게 카운트할 것인가? 자정 기준인가, 24시간 기준인가?
2. 위젯 업데이트 빈도: 매번 페이지 로드할 때마다 새로 fetch할 것인가, 아니면 캐시를 활용할 것인가?
3. 상호작용: 위젯에서 사용자 프로필로 바로 이동할 수 있게 할 것인가?

ButtonClient.tsx 수정이 포함된 이유는, 아마 이런 상호작용(클릭, 팔로우 등)을 클라이언트 사이드에서 처리하고 싶어서일 것이다.

회고: 작은 변화, 큰 영향

이렇게 5개 파일에 걸친 변경은 겉보기에 작아 보이지만, 실제로는 여러 계층을 건드린다:

• 프론트엔드: 새로운 UI 컴포넌트 2개 추가, 기존 페이지 레이아웃 확장
• 백엔드: API 쿼리 최적화 필요 (매일 랭킹을 다시 계산하는 건 비용)
• 비즈니스: 리텐션 지표에 영향을 줄 수 있는 기능

팀 관점에서는 이런 우선순위 결정도 중요하다. "더 큰 기능을 만들자"와 "작지만 효과 있는 UX를 먼저 배포하자" 중에 뭘 고를 것인가? 이 경우 후자를 선택한 이유는 아마:

• 배포 위험이 낮다 (기존 기능을 건드리지 않음)
• 빠르게 데이터를 수집할 수 있다 (리텐션 효과를 측정 가능)
• 반복 개선이 쉽다 (배지 디자인, 위젯 위치, 타이밍 등을 조정하기 쉬움)

결국 이게 좋은 기술 리더십이다. 큰 리팩토링도 필요하고 새 기능도 많지만, "지금 당장 사용자 경험에 영향을 주는 건 뭐지?"를 먼저 고르는 것.

🛒 이 글과 어울리는 추천 상품

• 모니터 쿠팡에서 보기 →
• 기계식키보드 쿠팡에서 보기 →
• 사무의자 쿠팡에서 보기 →

*위 링크는 쿠팡파트너스 활동의 일환이며, 일정액의 수수료를 제공받을 수 있습니다.