Html5를 이용한 음원 공유서비스

HTML5 와 뮤직 모바일 웹음악서비스 개발팀 양의권 & 박우영

This report contains information that is confidential and proprietary to SK Communications and is solely for the use of SK Communications personnel. No part of it may be used, circulated, quoted, or reproduced for distribution outside SK Communications. If you are not the intended recipient of this report, you are hereby notified that the use, circulation, quoting, or reproducing of this report is strictly prohibited and may be unlawful.

2010.10

113년 8월 28일 수요일

쉽게 음악을 듣자!!


쉽게 음악을 서비스하자!!


문제점 Ⅰ

• 권리(저작권)의 문제


문제점 Ⅱ

• 추가 프로그램의 설치


문제점 Ⅱ

• 사용자의 설치액션을 요구


문제점 Ⅱ


• 높은 유지 보수 비용


문제점 Ⅱ



• 단말별로 추가적인 개발이 필요


문제점 Ⅱ



• 단말별로 추가적인 개발이 필요

• 플랫폼 사업자에게 종속적



브라우저를 이용한모바일 웹서비스


브라우저를 이용한모바일 웹서비스모바일


현재 모바일 웹의 문제점

• 내장플레이어를 통한 단곡재생

• 재생 목록을 관리를 못함

• 재생과 브라우징을 동시에 하지 못함

• 제한적인 음원 재생 서비스제공




















모바일웹 구현의 문제점

• 브라우저만으로 음악재생의 어려움

• 페이지 이동으로 인한 연속적인 재생 불가

• 어플리케이션 대비 열악한 UI 및 UX






(HTML5 를 통해 해결)







(페이지 이동을 제거)







(페이지 이동을 제거)

(CSS3를 이용 앱과 같은 사용성)


해결책 Ⅰ - HTML 5

• AUDIO 태그 지원 (추가적인 프로그램 설치없이 음원 재생)

• 음악재생과 관련된 모든 동작을 자바스크립트로 제어

• 아직 정식 표준이 아님 But, 대부분의 브라우저가 지원예정 (모바일단말에 들어가는 브라우저는 지원)


해결책 Ⅱ - 페이지 이동 제거

• HTTP 기반의 서비스의 한계점

• Ajax 와 CSS3 로 페이지 이동없이 페이지 내용 변환



1013년 8월 28일 수요일


1013년 8월 28일 수요일


Player 모듈

1013년 8월 28일 수요일


Player 모듈

1013년 8월 28일 수요일


Player 모듈

1013년 8월 28일 수요일


Player 모듈

1013년 8월 28일 수요일

해결책 Ⅱ - CSS3 를 이용

• CSS3 에서 지원하는 애니메이션 효과

• 화려한 화면이동 효과 지원

• RGBA 등을 통한 다양한 이미지 효과

• 가로보기 모드 지원

1113년 8월 28일 수요일

시 연 Ⅰ

1213년 8월 28일 수요일

효 과• 웹기반의 서비스이므로 곡에 대한 링크 생성이 가능

• 이 URL을 공유해서 음악 듣기가 가능

1313년 8월 28일 수요일



Click!!

1313년 8월 28일 수요일



1313년 8월 28일 수요일



1313년 8월 28일 수요일



1313년 8월 28일 수요일

효 과 Ⅱ

• 단순히 들려주기만 하면 되는 것인가?

• 음악링크 + 권한 = 합법적인 음원재생(선결제 상품)

1413년 8월 28일 수요일

선결제 프로세스

링크생성

권한생성(암호화된 문자열)

링크

링크 + 권한문자열

전곡재생+유효한권한

미리듣기재생

권한구매 미리듣기재생+권한만료

1513년 8월 28일 수요일

시연 Ⅱ

1613년 8월 28일 수요일

결 론• 모바일웹을 통해서 앱과 같은 사용성을 구현

• 추가적인 프로그램없이 브라우저만으로 음악재생

• 서비스의 URL정보 <=> 특정 음악을 재생

• 선결재 기능을 통해서 합법적인 음원공유

• 구매가 아닌 청취를 위한 BM제공을 통한 매출증대

• 편리한 음악서비스 제공으로 인한 모바일 음악 시장을 선점 (De Facto Standard)

1713년 8월 28일 수요일

Q & A

1813년 8월 28일 수요일

Documents

Html5를 이용한 음원 공유서비스