콘텐츠 상세 페이지 개선
데스크탑
Role
Product Designer
Contribution
100%
Team
1 Product Owner
1 Product Designer
1 iOS Engineer
1 AOS Engineer
Project Duration
2 months
데스크탑 디자인 전략
데스크탑 디자인을 살펴보기 전에 흥미로운 데이터를 발견했고, 해당 데이터를 아래와 같이 정리했습니다
Mobile
사용자들은 CDP 방문은 늘었지만, 재생 전환율은 오히려 낮게 나타났습니다. 모바일 기기의 특성상 사용자가 이동 중이거나 같은 기기에서 다양한 방해 요소가 발생하면서, 콘텐츠 재생에 대한 집중도가 낮아지는 것이 원인으로 분석됩니다.
Desktop
반면에 데스크탑 사용자들은 CDP 방문은 줄었지만, 재생 전환율은 오히려 높게 나타났습니다. 데스크톱,노트북 환경에서는 사용자가 편안히 앉거나 기대어 콘텐츠를 시청할 수 있고, 주변에 방해 요소가 있어도 백그라운드 재생이 가능하기 때문에, 큰 화면에서 콘텐츠를 재생하는 부담이 상대적으로 적습니다.
1. 아마존 프라임, 디즈니 플러스, 웨이브, 티빙 스타일 구조
이 구조는 트레일러를 가능한 가장 큰 사이즈로 노출할 수 있도록 합니다. 저희는 항상 영상이 콘텐츠에 대한 가장 많은 정보를 전달하는 핵심 요소라고 생각해왔습니다. 사용자는 글을 읽지 않아도, 출연진, 장르, 분위기, 간단한 시놉시스를 바로 파악할 수 있습니다.
하지만 그 외에 에피소드 정보나 유사 콘텐츠와 같이 영상만큼 중요한 요소들은 여전히 충분히 노출되지 못하고 있습니다. 또한, 메뉴 탭 위치는 크게 개선되지 않았고, 각 탭 내 콘텐츠도 사용자가 랜딩했을 때 즉시 확인할 수 없는 상태입니다.
경쟁사 조사와 분석을 진행한 결과, 다른 플랫폼들이 사용하는 세 가지 서로 다른 구조를 확인했습니다.
이후 우리 제품을 각 구조에 적용해 보면서, 우리 서비스에 가장 적합한 방향을 탐색했습니다.
3. 유튜브 스타일 구조
사용자는 작은 플레이어로 바로 콘텐츠를 시청할 수 있으며, 집중해서 보고 싶을 때는 전체 플레이어로 전환할 수 있습니다. 다른 디자인과 달리, 이 구조는 사용자가 콘텐츠를 재생하기 위한 단계와 장벽을 최소화합니다. 전체 플레이어로 완전히 진입하지 않아도, 사용자는 이후 콘텐츠도 쉽게 이어서 재생할 수 있습니다.
이 디자인은 앞서 언급한 데이터 분석과도 잘 맞으며, 저희 가설은 사용자가 CDP에 들어서면 자동 재생되는 콘텐츠를 자연스럽게 이어서 시청할 가능성이 높아져, 전체 시청 시간 증가라는 핵심 KPI 개선에 기여할 수 있다는 점입니다.
또한 사이드 탭과 자동 재생 기능은 스포츠 이벤트 페이지에도 잘 맞습니다. 스포츠 경기에는 라이브 스트리밍, 하이라이트, 라이브 채팅, 통계 정보 등이 포함되기 때문입니다. 다만, 사용자가 시청 전에 결제를 완료해야 하는 TVOD나 채널 콘텐츠에는 최적의 구조는 아닐 수 있습니다.
2. 넷플릭스 스타일 구조
이 구조는 모달 페이지 스타일로 콘텐츠 상세 정보를 제공합니다. 영상 크기는 다소 작지만, 좁은 페이지 레이아웃 덕분에 메뉴 탭을 더 상단에 배치할 수 있어, 사용자가 랜딩하자마자 탭 아래 정보를 바로 확인할 수 있습니다.
CDP 진입과 종료를 위한 클릭 수는 구조 #1과 동일하지만, 배경을 어둡게 처리하고 이전 페이지를 보여주는 UI 덕분에 사용자가 브라우저 뒤로가기 버튼을 쓰지 않고도 배경 영역을 클릭해 쉽게 CDP를 종료할 수 있습니다. 이 구조는 CDP 내에서 보다 사용자 친화적인 탐색 경험을 제공합니다.
데스크탑 최종 디자인
결론적으로, 저희는 구조 #3을 채택하기로 결정했습니다. 이 구조는 사용자가 콘텐츠 재생을 시작하는 과정을 단순화하고, 흥미를 잃더라도 원활하게 다른 콘텐츠를 탐색할 수 있도록 돕습니다.
다른 프로젝트에서의 이전 연구에 따르면, 사용자는 전체 시청 여부를 결정하기 전에 몇 분 정도만 콘텐츠를 먼저 시청하는 경우가 많았습니다.
종합적으로, 구조 #3이 콘텐츠 시청에 가장 최적화된 사용자 경험을 제공한다고 결론 내렸습니다.
사용자 시리즈물 시청 전
1. 예고편 자동재생
사용자가 예고편을 시청하고 있다는걸 알려줍니다
2. 다음 에피소드 자동재생 버튼
사용자에게 다음으로 무엇이 재생되는지 명시하고
버튼에 타이머 애니메이션을 통해 언제 재생되는지 보여줍니다
3. 영화나 첫 에피소드를 자동재생 합니다
에피소드가 재생될때 재생되는 해당 에피소드를 하이라이트 해줌으로 어떤 회차가 재생되고 있는지 보여줍니다
사용자가 이전에 시청하던 콘텐츠를 이어보러 왔을 때
사용자가 CDP 페이지에 진입하면, 플레이어는 이전에 시청을 중단한 위치에서 10초 되감기하여 재생을 시작합니다. 이는 사용자의 기억을 상기시켜 콘텐츠 몰입도를 높이기 위한 기능입니다.
사용자가 콘텐츠를 끝까지 시청한 후
플레이어에서는 다음에 재생될 콘텐츠를 보여줍니다.
사용자가 한 가지 콘텐츠만 강제로 재생하도록 하지 않고, 다른 추천 콘텐츠를 함께 제공함으로써 선택권을 줍니다.
또한, CDP 플레이어에서 재생 전환율을 높이기 위해 어떤 디자인이 더 효과적인지 A/B 테스트를 진행하고자 했습니다.
디자인 A
디자인 A의 가설은, 선택지가 너무 많으면 사용자가 결정하기 어렵다는 점입니다. 이를 해결하기 위해 첫 번째 포스터는 10초 후 자동 재생되고, 사용자가 두 번째 포스터를 클릭해야만 재생되도록 설계했습니다. 사용자가 한 가지를 선택하기 쉽게 만들어 재생 결정을 단순화한 구조입니다.
디자인 B
디자인 B의 가설은, 더 많은 선택지를 제공할수록 사용자가 원하는 콘텐츠를 맞출 확률이 높아진다는 점입니다. 다만, 10초 내에 너무 많은 정보를 보고 결정해야 한다는 점이 고민거리였습니다.
자동 재생될 다음 콘텐츠는 플레이어 상단에서 더 크게 강조되며, 다른 추천 콘텐츠들은 작은 썸네일로 아래에 모아 보여집니다. 주요 추천은 눈에 띄게, 나머지는 선택 가능하게 배치하여 사용자에게 다양한 선택권을 제공합니다.
