네이버의 새로운 라이브스트리밍 플랫폼 '치지직'
UX/UI분석
'치지직'?
트위치는 최근 한국에서의 네트워크 사용료가 해외에 비해 약 10배나 높다는 이유로 한국 시장에서의 활동을 중단한다고 발표했습니다. 이로 인해 많은 트위치 이용자들이 다른 플랫폼으로의 이동을 고민하게 되었고, 네이버는 이들을 유치하기 위해 '치지직'이라는 라이브 스트리밍 서비스의 베타 버전을 신속하게 출시하였습니다.
치지직의 컬러와 타이포
치지직은 네이버의 브랜드 컬러로 알려진 '그린'을 기존에 사용했으며, 이를 조금 더 젊고 활기찬 느낌을 주기 위해 민트 컬러를 채택하여 디자인되었습니다. 또한 후원금액과 관련된 요소들은 노란색으로 표시되었으며, 생방송 표시는 빨간색으로 구현되었습니다. 또한 사용자 프로필은 보라색으로 강조하여 구분되었습니다.
타이포는 브랜드서체로 '산돌네모니2'를 사용해 주었는데, 치지직의 서비스 특성상 정적인 느낌보다는 주로 게임방송이 많다 보니 조금 더 활기차고 아기자기한 느낌을 줄 수 있는 네모니 서체의 선택은 매우 좋은 선택으로 보입니다.
e스포츠 팬들을 위한 맞춤형 서비스
치치직의 e스포츠 일정 뷰는 네이버에서 일일이 검색하는 것보다 훨씬 편리하게 설계되어 있습니다. 예를 들어, T1 팀의 팬이라면 팀 전체 탭을 클릭하면 해당 팀의 일정만을 요약해서 볼 수 있습니다. 또한, 치치직 내에서 e스포츠 중계를 제공하고 있기 때문에 현재 생중계 중인 일정은 별도의 플랫폼을 거치지 않고도 바로 시청할 수 있습니다. 이렇게 되면 e스포츠 팬들은 치치직 하나로 모든 것을 해결할 수 있게 됩니다. 앞으로 티켓 구매도 가능하다면, 많은 e스포츠 팬들이 치치직만으로 모든 e스포츠 관련 서비스를 이용할 것으로 예상됩니다.
선수별 순위도 한눈에 확인 가능?
e스포츠뷰의 순위 탭에서 유형을 선수로 변경하면, 선수별 랭킹을 살펴볼 수 있습니다. 상위 랭킹의 선수들을 조금 더 강조하여 디자인적으로 구분해 주어, 탑티어 선수들을 눈에 잘 띄도록 하였습니다. 그러나 하단의 랭킹 리스트를 스크롤하여 우측으로 이동하면 추가 정보가 표시될 줄 알았으나, 승부예측 탭으로 전환되어 일반적으로 익숙하지 않은 인터랙션을 경험했습니다. 승부예측 탭은 클릭으로 전환할 수 있도록 하고, 랭킹 리스트에서 우측으로 스크롤하면 나머지 지표를 확인할 수 있도록 함으로써 사용자들이 훨씬 더 편리하게 이용할 수 있는 사용성을 제공할 것으로 생각됩니다.
빈 화면에서 사용자의 행동을 유도할 수 없었을까?
서비스마다 빈 화면을 구성하는 UX/UI를 구성 방법이 조금씩 다릅니다. 치지직에서는 재밌고 귀여운 치지직만의 캐릭터를 사용해 자칫하면 딱딱해질 수 있는 빈 화면을, 캐릭터를 활용해 치지직 자체의 브랜딩을 살린 모습이었습니다. 하지만 ‘저장한 글 빈 화면' 자체에서 글을 저장할 수 있는 화면으로 이동시켜 줄 수 있는 CTA버튼을 디자인해 두었다면 “사용자가 서비스를 조금 더 다채롭게 사용할 수 있는 가능성을 열어줄 수 있지 않았을까”라는 의문이 들었습니다.
마찬가지로 가입라운지 화면도 가입한 라운지가 없다면 가입할 수 있는 후보군들을 추천해 줄 수도 있는데 빈 화면의 활용이 조금 아쉬운 부분이었습니다.
알림 수신함 빈 화면에서는 계속해서 보던 캐릭터그래픽이 아닌 아이콘이 들어갔는데, 이는 서비스 UI의 전체적인 통일성 측면에서 조금 아쉬운 모습을 보였습니다.
치지직이 아직인 베타서비스라서 MVP단계로 출시한 것을 감안하면 그래도 그래픽적으로 브랜딩을 살려준 모습이 매우 인상 깊었습니다.
복잡한 팝업은 사용자에게 혼란을 준다
치지직에서는 게임 라운지에서 게임에 대한 정보를 공유하거나 찾아볼 수 있는 기능이 있습니다. 그러나 해당 라운지에 가입하면 더 많은 정보를 얻을 수 있기 때문에, 인기 라운지 뷰에서 가입을 유도하는 UI를 볼 수 있습니다. 사용자가 가입을 누르면, 총 2단계의 팝업이 나타납니다. 그러나 여기서 문제점을 발견했습니다. 사용자에게 너무 많은 정보를 좁은 팝업에 담으려는 모습이 조금 아쉬웠습니다. 가입을 누르고 처음 보이는 팝업은 텍스트가 너무 많아서 그룹을 구분하기가 어려웠고, 가입 완료 팝업에서도 텍스트가 많아 사용자가 그냥 CTA를 클릭하게 되면 원하지 않는 알림을 받을 수 있습니다. UX라이팅을 조금 수정하거나 팝업 컴포넌트 크기 자체를 조금 늘려 계층구조를 명확히 해준다면 더 좋은 사용자 경험이 될 수 있을 것으로 보입니다.
복잡한 팝업은 사용자에게 혼란을 준다
치지직의 라이브방송 UI에서 주목해야 할 포인트는 총 세 가지입니다.
1. 치즈 후원 순위를 상단에 고정하여 표시
2. 치즈 충전 포인트를 강조하는 색상 사용
3. 다양한 이모티콘을 활용한 브랜딩
우선, 라이브방송 UI에서 사용자들에게 치즈를 후원할 수 있다는 인식을 높이기 위해 채팅창 상단에 가장 많이 후원한 시청자를 상위 3위까지 표시하는 것이 사용자에게 ‘치즈 후원'에 대한 인지에 도움이 되었습니다.
그리고 하단 채팅창에서 치즈 아이콘을 클릭하면 후원하기 탭으로 쉽게 이동할 수 있도록 해서 사용자들이 편리하게 후원할 수 있었습니다. 후원 탭으로 넘어가면 ‘치즈’는 치지직의 주요 비즈니스 모델이기 때문에 충전 버튼에 포인트 색상을 사용하여 시선을 집중시키는 것이 효과적이라고 볼 수 있었습니다.
마지막으로, 치지직의 브랜딩은 다양한 캐릭터를 활용하여 고유의 감성과 컨셉을 전달했습니다. 이러한 브랜드 디자인은 빈 화면과 채팅창에도 녹아들어 사용자들에게 치지직의 이미지를 강화하는 데 큰 역할을 할 수 있다고 볼 수 있습니다.
