Get Your Mobile Videos Up to Speed

Nov 21, 2017

Share:

How to integrate videos in mobile apps with SDKs and PWAs

As a Solution Engineer at JW Player, I get a lot of questions about integrating video into mobile applications.  The questions range from How easy is the integration to How do I get started to What type of experiences can I create?  In this article, I will provide key information about working video into mobile apps, discussing the history behind Software Development Kits (SDKs), and getting started. I’ll also overview the new kid on the block, Progressive Web Apps (PWAs).

Background

When Nokia released the first mass market Smartphone OS, the S series, they had an application store, where users could download and install applications for their devices.  Since then, to make compiling access points, developers have created applications, as the on-device browsers were not the power entities as they are today.  For example, browsers would not allow for a rich experience that could save users’ data in between sessions.  Apps were a way around such limitations.  As mobile OSs improved, with the progression of iOS and Android especially,  the features available to the app also improved.  Now, programmers had the ability to access on-board sensors as well as playback of offline content, which is especially helpful if you have a long commute.

 

In a bid to help programmers create feature-rich applications, vendors have released Software Development Kits (SDK). An SDK is a set of tools that can be used to develop software applications targeting a specific platform.  In other words, SDKs provide a shortcut to access the vendor’s service.  In the case of JW Player, the SDK is built on top of media frameworks inherent in the operating system, and programmers can concentrate on creating the mobile app with all the features they want rather than having to understanding the complexity of showing video within an app.

Getting Started

To get started with integrating JW Player videos into your application, you will need to know Objective-C/Swift or Java for iOS and Android, respectively, and can work in the respective IDE or build system.  The SDK is available for all to download, but you will need a valid Key for its operation.  The Key is available through the Dashboard.

 

Depending on the platform for your mobile app development, you will need to acquire the necessary prerequisites such as Xcode for iOS or Android Studio for Android as well as the Key, from the Dashboard.  Each SDK has its own Getting Started documentation:

IOS: https://developer.jwplayer.com/sdk/ios/docs/developer-guide/intro/getting-started/

Android: https://developer.jwplayer.com/sdk/android/docs/developer-guide/getting-started/library-project-setup/

The documentation is dense and filled with helpful info.  I would suggest that you review the material in full before building your app.  Also, in the list of related material below, you will find best practices apps that you can download from JW’s Github to use as a framework for your app or to see how to implement a particular feature.

Moving to PWAs

There is a movement away from Native Apps to Progressive Web Apps (PWA), albeit slowly.  PWAs are a middle ground between websites and Native Apps.  PWAs start out like any other web site, but when the user returns and demonstrates usage, the user will be invited to ‘install’ the app to their home screens. PWAs also benefit from push notifications and access to on-board sensors, just like Native Apps.  After the app is installed, an icon appears in the home screen and launches without the browser chrome.  No navigation UI or URL bar appears. Just the app in fullscreen.

Why Build PWA Over SDKs

There are some great benefits to shifting to PWAs. They are built with HTML5/JS/CSS. There is no lengthy approval process when launching/updating in the app stores, and there isn’t a lengthy update cycle (as soon as the user launches the app, they get the latest version).  And offline support is available.  PWAs should meet the following requirements:

Be accessible over HTTPS

Have a valid manifest with required properties

Have a service worker

Have its own navigation

Should be responsive to different screen sizes

The service worker is the key for a PWA’s operations.  Push notification and background sync are handled by the service worker.  A service worker, to use Google’s definition, is a JavaScript based script that your browser runs in the background, separate from a web page, opening the door to features that don’t need a web page or user interaction.  With assistance from service workers, PWA seems great to me.  The application can be built with just JS & CSS, and it has almost the same features as a Native App. Sign me up!

 

However, not all is well in PWA land.  While Google, through the Chrome browser, is bullish about PWA, Safari does not fully support PWA; the underlying renderer, WebKit, does not have the key service workers feature (yet – please see this for the latest on this feature).  

 

Like Google, JW Player is similarly bullish about PWA as the JW Showcase product can be made into a PWA with minimal effort. Also the cloud-hosted version will have PWA features too.  Also, the HTML5 JW Player can be integrated into a PWA app just by adding its embed code into the app.  Just doesn’t get easier than that!

 

Ready to leverage the power of SDKs and PWAs? Schedule time to talk with one of our video experts.

 

Contact Us

 

Related Material

For more information on SDKs and PWAs, check out the following resources. Happy reading!  

SDKs

Android SDK: https://developer.jwplayer.com/android-sdk/

Android Best Practices Apps: https://developer.jwplayer.com/android-sdk/demos/

Android SDK Reference: https://developer.jwplayer.com/sdk/android/reference/

iOS SDK: https://developer.jwplayer.com/ios-sdk/

iOS Best Practices Apps: https://developer.jwplayer.com/ios-sdk/demos/

iOS SDK Reference: https://developer.jwplayer.com/sdk/ios/reference/

PWA

Documentation about JW Player: https://developer.jwplayer.com/jw-player/

Overview of PWA: https://developers.google.com/web/updates/2015/12/getting-started-pwa

Google PWA Course: https://developers.google.com/web/ilt/pwa/

 

Contact Us