WAC 2.0 & Hybrid Web App 권정혁 ( @xguru ) 1
WAC 2.0 &
Hybrid Web App
권정혁����������� ������������������ ����������� ������������������ ( @xguru )
1
HTML5*Web����������� ������������������ Development����������� ������������������ to����������� ������������������ the����������� ������������������ next����������� ������������������ level
*����������� ������������������ 웹기술만으로����������� ������������������ 네이티브����������� ������������������ 애플리케이션����������� ������������������ 수준의����������� ������������������ 웹����������� ������������������ 애플리케이션을����������� ������������������ 개발
*����������� ������������������ 과거����������� ������������������ HTML����������� ������������������ 호환성을����������� ������������������ 유지하면서����������� ������������������ 실제����������� ������������������ 개발����������� ������������������ 시����������� ������������������ 어려웠던����������� ������������������ 문제들을����������� ������������������ 해결
HTML CSS JS APIHTML5 ~= + +
2
Mobile Web App needs Device APIs
• WAC (Wholesale Application Community)
• 70개 이상의 통신사/제조사 협의체 : BONDI + JIL ~= Waikiki Beta
• W3C DAP ( Device API )
Web AppDeveloper
WebBrowser
DeviceAPI
Javascript
Hybrid
Camera
Contacts
Calendar
Gallery
Filesystem
Messaging
Tasks
DeviceStatus
Acclerometer
DeviceOrientation
Geolocation
DeviceInteraction
3
WAC : Wholesale Application Community
• 전세계 70개 이상의 이동통신사+제조사들의 협업
• 모바일 어플리케이션 도매시장
• Web 기술에 기반한 표준개발환경 제공
• 매우 빠른 행보 ( 2010년 2월 MWC 발표 , 2011년 2월 WAC 오픈 )
개발자소비자Application
Store
비용
애플리케이션
4
WAC 출현 배경
Needs
이동����������� ������������������ 통신사,����������� ������������������ 개발자,����������� ������������������ 소비자의����������� ������������������ 필요����������� ������������������ 및����������� ������������������ 웹����������� ������������������ 기술의����������� ������������������ 발전이����������� ������������������ 기반이����������� ������������������ 되어����������� ������������������ WAC����������� ������������������ 출범
Feasibility
•이동����������� ������������������ 통신사의����������� ������������������ 필요✓ ����������� ������������������ 사업자����������� ������������������ 주도의����������� ������������������ 어플리케이션����������� ������������������ ,����������� ������������������ 서비스����������� ������������������ 플랫폼����������� ������������������ 필요
•개발자의����������� ������������������ 필요✓ 어플리케이션����������� ������������������ 개발을����������� ������������������ 통한����������� ������������������ 수익을����������� ������������������ 원함
✓ 다양한����������� ������������������ 플랫폼에����������� ������������������ 대응하기����������� ������������������ 위한����������� ������������������ 방안����������� ������������������ 필요
•소비자의����������� ������������������ 필요✓ 다양한����������� ������������������ 어플리케이션을����������� ������������������ 원함
✓ 구매한����������� ������������������ 어플리케이션을����������� ������������������ 다양한����������� ������������������ 기기에서����������� ������������������ 사용하고����������� ������������������
싶음
•웹����������� ������������������ 표준����������� ������������������ 기술의����������� ������������������ 발전✓ W3C����������� ������������������ HTML5,����������� ������������������ CSS3
✓ Javascript����������� ������������������ ,����������� ������������������ W3C����������� ������������������ DAP����������� ������������������ (����������� ������������������ Device����������� ������������������ API����������� ������������������ )
•브라우저����������� ������������������ 기술의����������� ������������������ 발전✓ Javascript����������� ������������������ Engine����������� ������������������ 의����������� ������������������ 성능����������� ������������������ 향상
✓ Web����������� ������������������ Rendering����������� ������������������ Engine����������� ������������������ 의����������� ������������������ 표현력
•하드웨어의����������� ������������������ 발전✓ 고성능����������� ������������������ CPU����������� ������������������ ,����������� ������������������ GPU
✓ 넉넉한����������� ������������������ 메모리
Source : Current / Future of WAC / KWAC - http://www.slideshare.net/gubed/current-and-future-of-wackwac
5
WAC ScheduleWAC 1.0 WAC 2.0 WAC 3.0
•Basis����������� ������������������ for����������� ������������������ Commecial����������� ������������������ Launch
•HTML4����������� ������������������ Web����������� ������������������ App
•모바일����������� ������������������ 디바이스의����������� ������������������ 기능����������� ������������������ 접근����������� ������������������
•카메라
•주소록
•Accelormeter����������� ������������������ 등
•JIL����������� ������������������ +����������� ������������������ BONDI
•2011년����������� ������������������ 2월����������� ������������������ Release
•HTML5����������� ������������������ +����������� ������������������ 멀티미디어����������� ������������������ 기능
•더욱����������� ������������������ 확장된����������� ������������������ 디바이스����������� ������������������ 기능����������� ������������������ 접근����������� ������������������
•File����������� ������������������ System
•Calendar
•Device����������� ������������������ Orientation����������� ������������������ 등
•보안기능����������� ������������������ 향상
•2011년����������� ������������������ 9월����������� ������������������ 예정
•HTML5����������� ������������������ +����������� ������������������ Network����������� ������������������ APIs
•WAC����������� ������������������ 2.0����������� ������������������ 기반
•주요����������� ������������������ 네트웍����������� ������������������ API����������� ������������������ 제공����������� ������������������
•In-App����������� ������������������ Billing
•Identity
•Authentication
6
WAC 의 문제점•이동통신사����������� ������������������ 주도의����������� ������������������ 모바일����������� ������������������ 앱����������� ������������������ 스토어����������� ������������������ ?
•현재����������� ������������������ 안드로이드/바다����������� ������������������ 플랫폼����������� ������������������ 에만����������� ������������������ 적용.����������� ������������������ 5월부터����������� ������������������ 디바이스들����������� ������������������ 생산예정����������� ������������������ (갤럭시S2����������� ������������������ 등����������� ������������������ )
• iOS����������� ������������������ 에서는����������� ������������������ WAC����������� ������������������ 규격����������� ������������������ 지원을����������� ������������������ 할����������� ������������������ 이유/예정이����������� ������������������ 없음
•개발자들이����������� ������������������ WAC����������� ������������������ 용으로����������� ������������������ 앱����������� ������������������ 을����������� ������������������ 개발해야����������� ������������������ 한다면����������� ������������������ ?����������� ������������������ iOS����������� ������������������ 를����������� ������������������ 포기해야함
➠����������� ������������������ 현재����������� ������������������ 나와있는����������� ������������������ Hybrid����������� ������������������ 앱����������� ������������������ 방식을����������� ������������������ 통해����������� ������������������ 이를����������� ������������������ 보완����������� ������������������ 가능����������� ������������������ (����������� ������������������ iOS����������� ������������������ ,����������� ������������������ Android����������� ������������������ 동시지원����������� ������������������ )
Rank Store2009매출
2009점유율
2010매출
2010점유율 Growth
1 Apple App Store $789M 92.8% $1,782M 82.7% 131.9%
2 BlackBerry App World $36M 4.3% $165M 7.7% 380.3%
3 Nokia Ovi Store $13M 1.5% $105M 4.9% 719.4%
4 Google Android Market $11M 1.3% $102M 4.7% 861.5%
Source : IHS Screen Digest 2011.02
7
Native
Web
Hybrid
Vs.
Vs.
8
Native App
•뛰어난����������� ������������������ 성능����������� ������������������ /����������� ������������������ 게임
•훌륭한����������� ������������������ UX
•디바이스����������� ������������������ 모든����������� ������������������ 기능����������� ������������������ 활용
•수익모델����������� ������������������ (����������� ������������������ 판매����������� ������������������ )
•개발이����������� ������������������ 어렵다����������� ������������������ /����������� ������������������ 비싸다����������� ������������������
•다양한����������� ������������������ 기기����������� ������������������ 대응����������� ������������������ 어렵다
9
Web App
•웹기술����������� ������������������ :����������� ������������������ HTML5����������� ������������������ ,����������� ������������������ CSS����������� ������������������ ,����������� ������������������ JS����������� ������������������ •서버기반����������� ������������������ 빠른����������� ������������������ 업데이트•Multi����������� ������������������ Device����������� ������������������ 지원
•속도가����������� ������������������ 느리다?
•디바이스����������� ������������������ 기능����������� ������������������ 활용?
•판매����������� ������������������ 수익?
10
Hybrid App
Device OSNative App /
Hybrid framework
Web Browser
Web Application css/js/html
Web Server
Web Application
•Native����������� ������������������ +����������� ������������������ Web����������� ������������������ approach•Multi����������� ������������������ Device����������� ������������������ /����������� ������������������ Multi����������� ������������������ Platform•Device����������� ������������������ APIs����������� ������������������ 사용가능•Web����������� ������������������ App����������� ������������������ 으로는����������� ������������������ 불가능한����������� ������������������ 기능����������� ������������������ 지원•App����������� ������������������ Store����������� ������������������ /����������� ������������������ Market����������� ������������������ 에����������� ������������������ 판매가능
•성능����������� ������������������ ?
•어떻게����������� ������������������ 만드는지����������� ������������������ ?
11
1 12
DIY with WebView Using Hybrid Framework1
2Hybrid Types
Native App +
Web View
WebHybridNative
WebView connecting toWeb Server
Hybrid Frameworks
Appspresso / Phonegap / Titanium
12
Hybrid DIY• Native + WebView
✓ 주요����������� ������������������ 기능은����������� ������������������ Native����������� ������������������ API����������� ������������������ 를����������� ������������������ 이용하여����������� ������������������ 구현,����������� ������������������ 서버����������� ������������������ 접속����������� ������������������ 및����������� ������������������ 계속����������� ������������������ 변경되어야����������� ������������������ 하는����������� ������������������ 화면에����������� ������������������ ����������� ������������������ Web����������� ������������������ 기술을����������� ������������������ 사용
✓ 유지보수가����������� ������������������ 쉽고����������� ������������������ ,����������� ������������������ 멀티����������� ������������������ 플랫폼����������� ������������������ 지원����������� ������������������ 가능
✓ 웹앱은����������� ������������������ Native����������� ������������������ 부분과����������� ������������������ Javascript����������� ������������������ 를����������� ������������������ 통해����������� ������������������ 통신����������� ������������������ 가능
Device OSMobile App
WebView
Major/MinorFeature
with
Native API
Web Server
Web App
주 채팅 기능은Native API 로 구현
선물하기 화면에는WebView 를 사용
카카오 톡 ( iPhone & Android )
13
Hybrid Frameworks• Appspresso / Phonegap
★ 웹 어플리케이션을 Native App 으로 Wrapping
★ WebView 와 Native API 간의 통신을 최대한 활용
★ Javascript 확장을 통해 디바이스 접근 기능을 부여 ( Camera, Contact, File System 등 WAC 이나 W3C DAP API )
• Titanium Mobile ★ Use web technologies to build Native app
★ Full Featured Javascript API , Cross Platform
★ Compile web app to real Native app
14
Appspresso• Mobile App Builder by
http://appspresso.com
Hybrid Web App 개발 플랫폼 : iOS , Android 동시 지원
Device API : WAC API ( Waikiki API 2.0 ) 지원
1 클릭으로 아이폰/안드로이드 앱 빌드
확장을 위한 PDK ( Plugin Development Kit ) 제공
• Device API 를 사용한 HTML5 Web App
Touch UI : Sencha , jQueryMobile
Extension APIs : Gallery browsing , Cross Domain Call, Screen capture ..
Powered By
15
Appspresso Write OnceSell Anywhere
Android / iOS App Build with 1-Click
jQueryMobile Jo����������� ������������������ App
Sencha
Sencha
Create����������� ������������������ template����������� ������������������ with����������� ������������������ Sencha����������� ������������������ Touch����������� ������������������ Framework����������� ������������������
http://sencha.com
Win / Mac support Touch UI Frameworks
WAC 2.0 API
16
Source: AT&T Consumer Survey ( conducted by Burke, Dec 2010 )
Voice Music Movie Game
App
Computer TVTabletSmartphone Game Console
N����������� ������������������ -����������� ������������������ Screen
Book News
절반이상의����������� ������������������ 미국인이����������� ������������������ 3개����������� ������������������ 이상의����������� ������������������ Device����������� ������������������ 로����������� ������������������ 같은����������� ������������������ 컨텐츠를����������� ������������������ 보고����������� ������������������ 있다
17
Computer TVTabletSmartphone Game Console
Voice Music Movie Game
App Book News
HTML5 based ( Hybrid ) Web App
3 6 5 3 3
18
Future of Hybrid App•(현재로선)����������� ������������������ Web����������� ������������������ app����������� ������������������ 은����������� ������������������ Native����������� ������������������ App����������� ������������������ 을����������� ������������������ 완전히����������� ������������������ 대체하지는����������� ������������������ 못함
•Hybrid����������� ������������������ app����������� ������������������ 이����������� ������������������ Native����������� ������������������ 와����������� ������������������ Web����������� ������������������ App����������� ������������������ 의����������� ������������������ 중간고리가����������� ������������������ 될����������� ������������������ 수����������� ������������������ 있음
•Hybrid����������� ������������������ app����������� ������������������ 이����������� ������������������ Web����������� ������������������ App����������� ������������������ 의����������� ������������������ 도입을����������� ������������������ 빠르게����������� ������������������ 하는����������� ������������������ 효과
•Device����������� ������������������ API����������� ������������������ 는����������� ������������������ 제조사����������� ������������������ 및����������� ������������������ Hybrid����������� ������������������ App����������� ������������������ Framework����������� ������������������ 에����������� ������������������ 의해����������� ������������������ 계속����������� ������������������ 발전중
•Hybrid����������� ������������������ App����������� ������������������ Framework����������� ������������������ 들이����������� ������������������ 점점����������� ������������������ 사용하기����������� ������������������ 쉬운����������� ������������������ 형태로����������� ������������������ 발전
•이제����������� ������������������ Native����������� ������������������ App����������� ������������������ 개발자들도����������� ������������������ Hybrid����������� ������������������ 방식에����������� ������������������ 대해서����������� ������������������ 알아야����������� ������������������ 함����������� ������������������
•Hybrid����������� ������������������ App은����������� ������������������ Mobile����������� ������������������ 만을����������� ������������������ 위한����������� ������������������ 것이����������� ������������������ 아니라����������� ������������������ N-Screen����������� ������������������ 을����������� ������������������ 위한����������� ������������������ 기초작업
19
Thank you !email : guru @ xguru.net twitter : @xguru
20