MNet 미디어(http://mnet.com)가 더욱 풍부한 사용자 경험을 제공하는 미디어 서비스인 TVDeep(http://tvdeep.mnet.com)을 실버라이트로 전환했어요.
실은 지난 12월 3일부터 XP에서 IE 6.0을 사용하고 있는 일부 유저를 대상으로 시험 서비스를 시작했지만 시험적으로 열었다 닫았다를 반복하고 약간의 기능 구현이 안되어 있어서 자신있게 소개드리진 못했네요. :(


실버라이트가 없을 때 접속하면 아주 강력하게 설치할 것을 어필하죠. 이부분은 좀 더 설명이 필요 할 것 같아요. 오픈 3일동안 추세를 보면 대부분의 유저가 아무런 의문이나 불만 없이 -혹은 아무 생각 없이- 설치하고 넘어가긴 했지만, 그래도 실버라이트를 왜 설치하는가, 무엇이 좋아지는가에 대한 설명 정도는 해줘야 하지 않을까요?

 
설치 버튼을 누르면 곧바로 다운로드 창이 열리면서 설치할 수 있게 하죠. ActiveX의 노란 띠보다는 훨씬 직관적이고 정확한 설치 방식이라고 생각해요. 하지만 일반 사용자에게 이런 방식을 썼을 때 ActiveX는 그냥 설치하면서 애플리케이션은 설치하지 않는 경우가 더러 있다는군요. 누굴 탓하겠습니까. 앞으로 조금씩 바꿔야겠죠.


설치는 상당히 짧은 시간내에 끝나고 설치가 완료되면 브라우저를 재로딩 할 필요 없이 곧바로 로딩 및 재생이 시작되죠.

TVDeep의 메인 화면, 여타 다른 미디어 서비스와 다를게 없어 보이죠? 하지만 미디어 서비스 사용자들의 요구를 만족시키는 몇 가지 기능들이 있어요.

먼저 가장 특징적인 PIP화면. 오른쪽 위를 보면 뭔가 드래그 해보라는 메시지가 있네요? 한번 따라해보죠.
 
선택된 아이템을 드래그&드랍하면...

조그만 창이 열리면서 로딩이 시작되고

메인 동영상과 함께 PIP 동영상이 함께 재생돼요. 마우스 커서가 메인 동영상에 있을 때는 메인 동영상의 소리가 재생되고 PIP에 있을 때에는 PIP 동영상의 소리가 재생되죠. 또한, PIP는 드래그해서 위치를 옮길 수 있고 클릭했을 때는 메인 동영상과 화면이 전환되죠.

이 기능은 미디어 서비스를 많이 이용하는 사용자에게 빠르게 채널을 선택할 수 있도록 해주죠. 보통 이런 미디어를 많이 소비하는 사용자는 지금 보고 있는 동영상도 있지만 또 다른 관련 영상을 계속해서 검색하고 열어보길 원하는데요, 이럴 때 PIP는 화면의 전환 없이 또 부담 없이 다른 영상을 검색할 수 있게 하는 거죠. 특히, 이 기능은 관련 영상 및 검색과 맞물려서 더 쾌적한 환경을 마련합니다.

앞에서 얘기한 관련 영상을 한번 볼까요?

영상 하단에는 지금 재생중인 동영상과 관련된 영상 목록을 보여주는 곳이 있어요. 이 목록에 적용된 애니메이션도 그간 많이 소개되어 왔던 것들이라 식상할지도 모르겠지만 상당히 멋진 움직임을 보여주죠. 그리고 이 관련영상도 검색된 목록과 마찬가지로 드래그를 하여 PIP로 띄울 수 있어요.

 

다음으로, 북마크 기능인데요, 단순히 영상을 북마크하는게 아니라 내가 원하는 장면의 일부만 저장하고 열어보기 위한 기능이에요.


한가지 아쉬운건, 구간 선택시 위치 선택 헤더를 따라서 동영상이 원활하게 움직이면 좋을텐데 대부분의 영상은 MMS로 서비스되기 때문에 스트리밍을 위한 버퍼링이 있고 그래서 헤더가 움직이고 나서 약 3~5초 후에나 해당 위치의 영상이 나온다는 점이 있어요. 이것은 현재 기술상의 한계라고 볼 수 있겠죠.


구간을 선택하고 제목을 입력한 후 이미지를 선택하고 완료.


내 구간 저장 탭에서 저장된 내용을 볼 수 있고 같은 방식으로 사용 가능.

 
실버라이트에서 가장 큰 어려움 중에 하나는 바로 '퍼가기' 기능인데요, TVDeep은 이 문제를 단순 링크 방식과 iframe 방식으로 처리하고 있어요.

 
TVDeep의 배너 광고. 미디어를 재생하고 있는 도중에도 미디어를 가리지 않고 추가적인 광고를 삽입하고 있죠. 이 광고는 노출되는 시점을 DB에서 조절할 수 있게 되어 있어서 특정 영상에 특정 광고를 특정 시점에 노출할 수 있어서 광고의 구성에 따라서는 굉장히 높은 효율을 보일 수 있을거에요.

이 외에 풀스크린에서도 동일한 방식으로 사용할 수 있고 다른 기능들은 일반적인 미디어 플레이어와 동일하니 패스.

한가지 화면에는 설명되지 않는 팁을 알려드릴께요. :) TVDeep 플레이어는 몇 가지 키보드 제어도 가능한데요, 다음과 같은 단축 키를 지원하고 있어요.

→ : 앞으로 10초
← : 뒤로 10초
↑ : 볼륨업
↓ : 볼륨다운
Space : 재생/정지
M : 음소거

하지만 실버라이트에 포커스가 왔을 때에만 동작하니까 포커스를 잘 맞춰야 동작하네요.

MNet 미디어의 TVDeep은 실버라이트가 기존 웹 환경, 웹 페이지에서 다른 요소들과 함께 '지금 당장' 사용이 가능하다는 것을 보여주는 사례라는 점에서 팝업으로 제공되는 SBSi의 NView와 다른 의미를 가지고 있어요. 물론 사실을 얘기하자면 TVDeep은 iframe을 통해서 제공되기 때문에 어떤 의미에서는 팝업과도 같다고 볼 수 있지만 사용자에게 있어서 TVDeep은 전체적으로 하나의 페이지로 받아들여지게 되죠.

기술적으로 TVDeep은 실버라이트 1.0 즉, JavaScript 만으로도 이 정도 수준의 기능 구현이 충분히 가능하다는 것을 증명하고 있어요. 지난 5월 MIX에서 많은 사람들을 낚았던 Top Banana의 웹 동영상 편집기의 사례를 생각해보면 이 애플리케이션은 데모를 위해서 미리 준비된 리소스들(수많은 이미지, 동영상, 화면 등)로 구성된 '눈속임'이 많았죠. 하지만 TVDeep은 실버라이트 1.0과 ASP.NET AJAX와의 완벽한 조화를 통해 미디어 제어, 검색, 데이터 바인딩, 북마크, 실시간 동영상 구간 지정, PIP 등과 같은 기능들을 실제로 작동하게 구현했다는 거죠.

TVDeep은 향후 웹 미디어 플레이어 환경에 상당한 영향을 줄 것이라고 예상할 수 있어요. 기존의 미디어 플레이어가 단순히 재생을 위한 역할이었다면 TVDeep은 사용자의 미디어 소비 패턴 즉, 사용자의 경험을 더 중시한 기능들을 제공하고 있고 특히, PIP기능은 빠르게 미디어를 소비하는 사용자의 요구를 만족시키는 간단하지만 강력한 도구가 될 것이라고 확신해요.

TVDeep은 새로운 기술-실버라이트-이 기존의 기획과 디자인이 가지고 있던 상상력의 제한을 풀어주고 사용자 경험을 끌어올릴수 있다는 것을 보여주고 있어요. TVDeep의 사례가 더 재밌고 풍부한 사용자 경험을 제공하는 애플리케이션을 기획하고 디자인 할 수 있는 계기가 되었으면 해요.

마지막으로 TVDeep은 여기에서 그치지 않고 벌써 다음 세대의 미디어 서비스를 구상하고 있어요. 아직은 물리적인 인프라스트럭처가 구성되지 않았지만 제반 환경만 마련된다면 기술적으로 충분히 구현이 가능한 멋진 서비스들이죠. 기대하셔도 좋아요!

P.S.
그간 1.0으로 작업하면서 엄.청.나.게. 많은 삽질과 고난이 있었어요. 관련된 얘기는 천천히 풀어볼께요. :)

신고
Posted by gongdo


티스토리 툴바