OPTIMIZING AND DELIVERING VIDEO ON MOBILE PLATFORM. Israk Technology Sdn. Bhd.

Transcription

1 OPTIMIZING AND DELIVERING VIDEO ON MOBILE PLATFORM Israk Technology Sdn. Bhd.

2 Smartphone 101

3 In a nutshell, a smartphone is a device that lets you make telephone calls, but also adds in features that you might find on a personal digital assistant or a computer--such as the ability to send and receive e- mail and edit Office documents, for example. The term mobile streaming has been increasing popular for the past few years.

4 Smartphone OS

5 iphone 4 (ios 4.x) Video formats supported : H.264 video up to 720p, 30 frames per second, Main Profile level 3.1 with AAC-LC audio up to 160 Kbps, 48kHz, stereo audio in.m4v,.mp4, and.mov file formats; MPEG-4 video, up to 2.5 Mbps, 640 by 480 pixels, 30 frames per second, Simple Profile with AAC-LC audio up to 160 Kbps per channel, 48kHz, stereo audio in.m4v,.mp4, and.mov file formats; Motion JPEG (M-JPEG) up to 35 Mbps, 1280 by 720 pixels, 30 frames per second, audio in ulaw, PCM stereo audio in.avi file format

6 Android 2.x As an application developer, you are free to make use of any media codec that is available on any Android-powered device, including those provided by the Android platform and those that are device-specific. However, it is a best practice to use media encoding profiles that are device-agnostic.

7 Why? Why do we need to know all those phone specifications? Does phone platform really matters?

8 Mobile devices has its own screen resolution, display size, processor capability. Video content encoded for one smartphone might not be playable on other smartphone. CODEC Support?

9 Comparison Feature iphone 4 HTC (android) HTC (Win7P) Nokia E7 (symbian 3) HTML 5 Yes (Safari) Yes (Webkit) No (IE) No (Webkit, 4.1) Native Silverlight Support H.264 No (but support multibitrate) No Yes (IIS Smooth Streaming Client 1.x) Yes Yes Yes Yes Yes (IIS Smooth Streaming Client for Symbian) Flash Support No Yes (10.1) Yes(10.1) Yes (FlashLite 4) Media Player QuickTime VLC Zune Ovi?

10 Let s see how we do it for iphone 4/iPad/iPod, and Android-based.

11 Visitor A Visitor B Visitor C

12 User agent redirection Web browser identify themselves by providing user agent. Iphone: Mozilla/5.0 (iphone; U; CPU iphone OS 4_3_1 like Mac OS X; zhtw) AppleWebKit/ (KHTML, like Gecko) Version/5.0.2 Mobile/8G4 Safari/ Android: Mozilla/5.0 (Linux; U; Android 2.3.3; zh-tw; HTC_Pyramid Build/GRI40) AppleWebKit/533.1 (KHTML, like Gecko) Version/4.0 Mobile Safari/533.1 HTC_Touch_3G Mozilla/4.0 (compatible; MSIE 6.0; Windows CE; IEMobile 7.11)

13 User Agent

14 We don t need to match entirely the string, but we just need the specific string eg., iphone, Android, IE..etc. This is done via but not limited to php; <?php $known = array('msie', 'firefox', 'safari', 'webkit', 'opera', 'netscape', 'konqueror', 'gecko'); preg_match_all( '#(?<browser>'. join(' ', $known). ')[/ ]+(?<version>[0-9]+(?:\.[0-9]+)?)#', strtolower( $_SERVER[ 'HTTP_USER_AGENT ' ]), $browser ); if($browser['browser'][0]=='msie') print('_');?>

15 switch ($agent) { case iphone : print iphone code here"; break; case Android : print android code here ; break; } case IEMobile : print IE code here ; break;

16 HTML 5? If there is HTML 5..there must be HTML 4..? What is the different? Why are we interested?

17 HTML has been in continuous evolution since it was introduced to the Internet in the early 1990s. Some features were introduced in specifications; others were introduced in software releases. In some respects, implementations and author practices have converged with each other and with specifications and standards, but in other ways, they continue to diverge. HTML4 became a W3C Recommendation in While it continues to serve as a rough guide to many of the core features of HTML, it does not provide enough information to build implementations that interoperate with each other and, more importantly, with a critical mass of deployed content. The same goes for XHTML1, which defines an XML serialization for HTML4, and DOM Level 2 HTML, which defines JavaScript APIs for both HTML and XHTML. HTML5 will replace these documents. [DOM2HTML] [HTML4] [XHTML1] The HTML5 draft reflects an effort, started in 2004, to study contemporary HTML implementations and deployed content. The draft: Defines a single language called HTML5 which can be written in HTML syntax and in XML syntax. Defines detailed processing models to foster interoperable implementations. Improves markup for documents. Introduces markup and APIs for emerging idioms, such as Web applications.

18

19 Embed <html> <head> <title>iphone live streaming page</title> </head> <body> <h1>live stream.</h1> <embed src=" to movie.mov" width="960" height="555" autoplay="true controller="true" pluginspage=" </embed> </body> </html>

20 How HTML5 Works (iphone 4) <html> <head> <title>iphone live streaming page</title> </head> <body> <h1>live stream.</h1> <video width="640" height="480" src="smoothapple.isml/manifest(format=m3u8- aapl).m3u8" poster="myposterframe.png" autoplay="true" controls="true" >Live</video> </body> </html>

21 HTML 5 video played on iphone (full screen)

22 How HTML5 Works (Android 2.x) <html> <head> <title>iphone live streaming page</title> </head> <body> <h1>live stream.</h1> <video width="640" height="480" src= video.mp4" poster="myposterframe.png" autoplay="true" controls="true" >Live</video> </body> </html>

23 caveats Although iphone support LC-AAC audio up to 160kbps, it is recommended to encode audio at max 64kbps. iphone and HTC (Android) may support current H.264 HTML5 implementation, but in near future, this codec may be replaced by WebM and OggVideo codec.

24 Thank you. Israk Technology Sdn. Bhd. ( P) B-8-2, Jln PP25, Putra Walk, Tmn Pinggiran Putra, 43300, Sri Kembangan, Selangor, Malaysia Website : Demo at Tel: info@israkmedia.my mkhalemi@israkmedia.my

25 IIS Smooth Streaming video played on HTC (windows 7 Phone)