소니뮤직사이트 제작기
URL| http://www.sonymusic.co.kr/ Client| 소니뮤직㈜ Agency| 디트라이브 제작기간| 2개월 OPEN| 2003. 11. 1 | |
듣고, 보고, 즐기는 크리에이티브 - 소니뮤직사이트 제작기 | |
소니뮤직이 요청한 소니뮤직 웹사이트의 미션은 매월 신규 앨범의 홍보 창구 구축, 웹 인프라 구축 및 소니뮤직 회원 모집, 장기적인 수익모델 구축을 위한 기반 마련이라는 크게 3가지로 요약되었다. 이 세가지 미션 가장 중점을 두어야 할 것은 소니뮤직 앨범의 강력한 홍보 수단으로의 역할이었다. 매월 신규앨범 발매와 동시에 소니 뮤직 회원들에게 앨범을 홍보하고 관련 정보 및 컨텐츠를 제공과 온라인 특성을 활용한 신규 회원 모집 및 웹사이트 활성화를 통한 고객들의 재 방문률 증대가 프로젝트 미션의 핵심이었다. 소니뮤직 사이트의 Road Map은 크게 세가지로 Basics, Reinforcement, Value Creation으로 볼 수 있다. 즉 소니뮤직 사이트의 기본구조를 갖추어 콘텐츠를 통한 경쟁우위를 확보하고, 고객 Lock-In을 통한 사이트 활성화로 볼 수 있다. 소니뮤직은 라이브러리의 기능보다는 신규 앨범의 효과적이고 효율적인 홍보라는 명확한 미션을 가지고 있기에 소니뮤직을 방문할 트렌디한 유저의 감각을 충족시키는 디자인, 편리하면서도 흥미를 가질 수 있는 U.I, 프로모션할 앨범의 다양한 컨텐츠와 서비스를 통한 노출 등에 포커스를 두고 구축 기획이 진행되었다. 위와 같은 미션을 수행하기 위해 디트라이브는 엔터테인먼트의 요소를 모두 담아 신규 앨범을 홍보하는 툴로 활용할 뮤직진, 신규 앨범을 활용한 서비스 메뉴를 감각적이고 편리하게 이용할 수 있는 퀵 링크 네비게이터, 친철함이 느껴지는 쉽고 편한 검색 페이지, 자신의 favorite album을 따로 모아 둘 수 있는 개인 맞춤 메뉴인 마이 앨범을 차별화 메뉴로 구성하고 다양한 컨텐츠 메뉴와 서비스 메뉴를 활용하여 프로모션할 앨범을 반복적으로 노출해 줌으로서 소니뮤직이 가진 컨텐츠를 집중하여 선보임으로써 미니멀리즘이 접목된 사이트를 지향하여 기획하였다. 디자인은 사이트 기획의도와 맞추어 미니멀리즘을 반영한 심플한 구조를 기본으로 변화에 강한 레이아웃으로 제작되었다. 신규앨범의 효과적 노출을 위해 의례적인 이미지 노출 공간을 배제하고 메인 페이지의 이미지 영역, 채널별 타이틀 이미지 공간, 컨텐츠 페이지의 배너 공간을 아티스트를 홍보 공간으로 활용할 수 있도록 하였다. 또 로고/네비게이션/타이틀을 묶는 상단과 컨텐츠영역 하단으로 한 2단 구조로 컨텐츠 영역 최대확보하고 박스형 구조로 다양한 노출 패턴 확보하였다. |
먼저 소니뮤직 웹사이트의 미디어 서버의 효과적 서비스를 위한 미디어 보안 툴인 dTRIBE Media Control 개발 구축의 케이스 스터디를 살펴보자. |
신규앨범 홍보에 포커스된 미션을 수행하기 위해 소니뮤직 웹사이트는 미디어, 즉 비디오 스트리밍 파일, 오디오 스트리밍 파일이 회원들에게 제공된다. 디트라이브는 제한된 네트워크 대역폭과 미디어 서버를 통해 회원들이 효과적으로 스트리밍 서비스를 사용하도록 구축하기 위한 설계에 들어갔다. 소니뮤직의 ‘GLOBAL INTERNET GUIDELINES’에 따라 소니뮤직은 디트라이브에 스트리밍 서비스는 30일이라는 제한된 기간 내에서만 서비스 되도록 요청하였다. 소니뮤직 사이트의 구축 초기의 구성도를 보면 아래 그림과 같이 심플하게 되어 있다. 서비스될 미디어의 양이 적기 때문에 디트라이브는 아래의 간단한 구성으로도 서비스가 가능할 것으로 여겨졌다. [ 각주 ] bandwidth (대역폭) bandwidth는 2가지 의미로 사용되는데, 하나는 전송매체 상에서 전자 신호들이 전달되는 주파수의 범위를 표시하고, 다른 하나는 전송로에서 데이타의 흐름 속도를 나타낸다. (1) 통신로를 통해 전달될 수 있는 최고 주파수와 최저 주파수간의 차이를 말하며, 통신로의 용량(bps 단위)은 선로의 bandwidth에 의존하기 때문에 bandwidth는 데이터 통신에서 중요한 요소이다. (2) 기억장치의 데이터 처리 속도를 말하며, 연속적으로 기억 장치에서 데이터를 읽거나 데이터를 저장할 때 기억장치가 1초 동안에 전달하거나 받이들일 수 있는 비트수. 디지탈 시스템에서, bandwidth는 bps(bits per second)로 표시되는 데이터의 속도이다.아나로그 시스템에서 bandwidth는 최대 주파수 신호 성분과 최저 주파수 신호 성분 간의 차이로 정의된다. |
그러나 구축 이후 가요의 경우 지속적으로 스트리밍 파일 db가 쌓이게 되어 증가되는 미디어 양과 회원 수를 고려하면 서버 및 네트워크 대역폭에 대한 증설 요구가 예측되었다. 따라서 아래 그림과 같이 2차 서버구성도에 따라 서버와 네트워크 대여폭을 증설하였다. 하지만 아래의 [2차 서버 구성도]와 같이 미디어 서버를 증설 했음에도 불구하고 일부 고비용 저효율 상태가 나타날 수 있다. 예를 들자면 일부 회원들이 서비스 속도가 늦다고 불만을 토로하는 것이다. 이유는 소니뮤직 회원 서비스를 위한 자원이 외부의 무단 링크 등을 통해 제3자에게 제공될 수 있기 때문이다. 이 때문에 정작 소니뮤직 웹사이트에서 스트리밍 서비스를 받는 회원은 접속이 되지 않거나 서비스 속도가 느려져 잦은 버퍼링 등으로 서비스에 만족하지 못하고 장기적으로는 소니뮤직 웹사이트의 미디어 서비스에 대한 낮은 기대도로 인해 뮤직 비디오와 뮤직 오디오 등 미디어 서비스를 통한 신보 앨범의 홍보 역할 수행이 어려워질 것이 예상되었다. |
위에서 예상된 문제점을 해결하기 위해 디트라이브는 dTRIBE Media Control(이하 DMC)이라는 컴포넌트를 개발하였다. DMC는 미디어 서버에 탑재되는 컴포넌트로 다음과 같은 기능을 가지고 있으며, 웹 상에서 모든 관리를 하도록 되어 있다. (1) 미디어 파일에 대한 권한 관리 미디어 파일을 모든 요청에 대해 허용할 지, 특정 사이트에서만 허용할 지 또는 모든 요청을 거부할지를 결정한다. (2) 웹 서버 그룹에 대한 권한 관리 특정 사이트에 미디어 파일의 서비스를 제공할 경우 대상 웹 서버를 관리한다. (3) 통계 미디어 파일 사용에 대한 통계로 미디어 파일의 요청 또는 무단 요청에 대한 통계 등을 제공한다. |
기대 효과 DMC를 적용 후 확인해 보니 전체 미디어 파일 요청자 중 15%가 허용되지 않은 요청이었다. 이러한 DMC의 기능을 통해 제한된 자원인 네트워크 대역폭과 미디어 서버를 효율적으로 사용할 수 있었다. 또한 통계는 향후 증설을 위한 기초 자료로 사용될 것이다. DMC를 사용하여 소니뮤직 회원들에게 질 높은 서비스를 제공할 수 있는 기회를 만들었으며, 충성도를 높일 수 있을 것으로 예상된다. |
음악이라는 엔터테인먼트 요소를 웹사이트에 그대로 녹여내고 신규 앨범의 홍보라는 소니뮤직 웹사이트의 미션 두 가지를 효과적으로 노출하기 위해 뮤직진이 기획되었다. 소니뮤직 웹사이트의 가장 큰 특징이자 사이트의 성격을 대변하는 뮤직진은 기존의 웹사이트들의 레이아웃과는 달리 514x430px 공간을 할애하여 파격적인 영역으로 레이아웃하여 강조시키고, 소니뮤직 아티스트들의 비주얼을 보다 효과적으로 노출시키고자 하였다. 유저들이 소니뮤직 사이트를 방문하면 뮤직진의 신보 앨범 음악을 듣고 아티스트들의 비주얼과 신보 소개를 동시에 메인 페이지에서 즐길 수 있도록 기획되어 소니뮤직 웹사이트는 음악을 더한 즐거운 사이트라는 인지를 자연스럽게 이끌어내고자 하였다. 비주얼의 퀄리티, 최대한 음질, 빠른 접속을 위해 최소한의 장식으로 제작되었으며, 로딩 속도의 최소화를 기본으로 감각적으로 표현된 슬라이딩 네비게이션을 통해 분기별로(3개월씩) 최대 15명의 앨범을 메인 페이지의 뮤직진에서 즐길 수 있도록 하였다. 또 뮤직진의 비주얼을 활용하여 컨텐츠 페이지의 배너를 제작하여 앨범 홍보의 역할 통로를 마련하였다. |
소니 펀(sony fun)은 뮤직 레터와 월 페이퍼, 플래쉬 쇼, 뮤직 비디오, 뮤직진, 마이 앨범 등 소니뮤직의 차별화 된 서비스와 컨텐츠를 각 페이지마다 편리하게 이용할 수 있도록 기획한 퀵 링크 서비스이다. 각 페이지를 스크롤 할 마다 슬라이딩 되는 네비게이터로 구축된 퀵 링크 역시 로딩 속도를 최소화 하고 각 메뉴를 마우스 오버할 때마다 아이콘을 변화시켜 직관적으로 메뉴를 인지시킴과 동시에 유저들의 감각을 충족시켜 준다. 또한 퀵링크 숨기기 기능을 두어 유저의 편의성을 최대한 고려하였다. |
미술, 패션 트렌드와 같이 웹사이트의 미니멀리즘을 담은 사이트인 것이다. 소니의 글로벌 기업 이미지와도 부합되는 '미니멀리즘'은 브랜드 사이트를 포탈 사이트와 차별화하고 유저들에게 보여주고자 하는 것을 컴팩트하게 전달할 수 있는 가장 적합한 표현 방법일 것이다. |
신보앨범 장르별 앨범 소개 리스트 제공 장르&포맷 메뉴는 기획 초기에는 없었던 메뉴로 1차 디자인 시안 후 구축 과정 시 기획된 메뉴이다. 일반 유저들이 신보음반을 검색하거나 음악 정보를 찾을 때 가장 일반적인 검색 형태가 장르별 검색이라는 전제에서 시작하여 클라이언트와의 회의를 통해 POP, Classic, K-POP, Compilation, J-POP, O.S.T, JAZZ, C.C.M, DVD&SuperAudioCD로 총 9개의 장르와 포맷 분류에 따라 신보앨범 순으로 리스트를 보여주도록 기획되었다. 또한 상단 타이틀 존을 대표 아티스트 이미지를 노출시키고 각 장르별로 클라이언트가 프로모션 중인 앨범 3개를 배너식으로 상단에 노출시켜주도록 기획하였다. |
클라이언트의 니드는 명쾌하다. 신규앨범의 효과적 노출! 엔터테인먼트 요소를 중요시 여기는 음악 사이트, 소니뮤직의 기업 이미지를 반영, 전체적으로 차가운 느낌을 주는 직선을 배제하고, 부드럽고 감성적인 라운딩 모티브를 그래픽 요소로 활용하고 이미지 노출시 포트폴리오 폴더를 메타포로 활용하였다 디자인은 사이트 기획의도와 맞추어 미니멀리즘을 반영한 심플한 구조를 기본으로 변화에 강한 레이아웃으로 제작되었다. 신규앨범의 효과적 노출을 위해 의례적인 이미지 노출 공간을 배제하고 메인 페이지의 이미지 영역, 채널별 타이틀 이미지 공간, 컨텐츠 페이지의 배너 공간을 아티스트를 홍보 공간으로 활용할 수 있도록 하였다. 또 로고/네비게이션/타이틀을 묶는 상단과 컨텐츠영역 하단으로 한 2단 구조로 컨텐츠 영역 최대확보하고 박스형 구조로 다양한 노출 패턴 확보하였다. |
디자인 스타일 가이드 신규앨범의 효과적 노출을 위해 의례적인 이미지 노출 공간을 배제하고 메인 페이지의 이미지 영역, 채널별 타이틀 이미지 공간, 컨텐츠 페이지의 배너 공간을 아티스트를 홍보 공간으로 활용 ● Base: 해상도 1024*768에 최적화 ● Greed: 로고/네비게이션/타이틀을 묶는 상단과 컨텐츠영역 하단으로 한 2단 구조로 컨텐츠 영역 최대확보하고 박스형 구조로 다양한 노출 패턴 확보 ● Design Focus: 신보를 강하게 노출을 위해 요소는 철저히 제한 소니뮤직 타입에서 연상되는 라운딩 모티브를 그래픽 요소로 활용하고 이미지 노출시 포트폴리오 폴더를 메타포로 활용 |
소니뮤직이 초기에 웹사이트를 의뢰하며 첫 미팅에서부터 계약 미팅, 시안 회의 등 각 미팅마다 반복 반복하며 긴밀한 관계에 대한 희망사항을 언급했다. “우리는 웹사이트를 대행해서 구축하고 기계적으로 업데이트하는 운영을 원하는 것이 아닙니다. 비즈니스 파트너로서 1년이 아닌 10년 아니 더 이상의 기간을 함께할 수 있고 온라인 마케팅 전반을 가이드해 줄 수 있는 파트너를 원합니다.” 라고 말이다. 모든 클라이언트가 원하는 사항일 수 있지만 그들의 절실한 바람만큼 디트라이브 소니뮤직 프로젝트의 팀원들은 각별한 애정과 철저한 기획과 스케줄에 따라 사이트를 구축했다. 소니뮤직 웹사이트에 담긴 음악을 몇 번이고 반복해서 듣고, 우연히 길에서 비욘세의 사진이 붙어있기만 해도 소리를 지를 만큼 열광하고, CF에서 힐러리 더프의 음악이 배경음악으로 흘러나오면 환호한다. 그만큼 애정을 가지고 구축한 소니뮤직 웹사이트, 디트라이브는 앞으로 2004년에도 매달 애정과 정성을 쏟아 운영해나갈 예정이다. |
'DESIGN' 카테고리의 다른 글
알파벳 일러스트 (0) | 2010.10.11 |
---|---|
자신감의 표현! SK텔레콤 캘리그라피 (0) | 2010.10.11 |
사진을 참고하여 그림 연습을 할 때에 (0) | 2010.10.11 |
LG전자 글로벌 쇼케이스 마이크로사이트 구축기 (0) | 2010.10.11 |
모토로라 온라인 아이덴티티 구축기 (0) | 2010.10.11 |
진정한 울트라매니아를 위한 Evolution! (0) | 2010.10.11 |
크리에이티브의 눈부신 상승, Blue League 2005 (0) | 2010.10.11 |
웹어워드 2005 (0) | 2010.10.11 |
Naomi Nishimura (0) | 2010.10.11 |
IT의 옷을 벗고 유비쿼터스의 옷을 입다! (0) | 2010.10.11 |