Looking to create video news feeds in a way that caters to mobile viewers?
Many customers have asked how they can recreate a Facebook-like video experience with embedded videos. To address this, IBM Cloud Video has developed a player SDK that includes autoplay and pre-buffering functionalities. Due to the pre-buffering logic, video content starts with virtually no delay and will pause automatically when a user scrolls past it. Ultimately this gives viewers a quick, smooth video playback experience comparable with mainstream social networks, but created under your own brand.
To achieve this, developers can use the SDKs to create an app, for Android or iOS, that will present large libraries of content in an easily scrollable, skimmable format for end users.
- Making a news feed app
- Pre-buffered video for automatic play
- Closed caption support
- Adaptive bitrate streaming
- Creating a news feed
- Other player SDK use cases
Making a news feed app
In November 2016, mobile and tablet Internet usage exceeded desktop usage for the first time. As a result of changing habits, content creators are shifting strategies. There is now greater emphasis on being able to reach end users with ideal mobile experiences.
To aid in this, IBM Cloud Video has a introduced inline playback, pre-buffering and autoplay capabilities to its player SDKs to create iOS or Android apps.
The SDKs allow developers to create scrollable collections of content for mobile users to skim through. This can be a mixture of written articles, with associated images, and video content. The latter leans on the robust video distribution capabilities of IBM Cloud Video to integrate video content.
To elaborate, this means video content can tap into IBM Cloud Video’s SD-CDN (Software Defined Content Delivery Network) technology. This approach utilizes multiple CDNs, for improved geographic reach, while layering on QoS (quality of service) components. As a result, video content can seamlessly switch between edges at CDNs based on collected data from users, built around avoiding congestion related downtime and reducing the probability of content buffering. To learn more about SD-CDN, check out this Scaling Video Delivery white paper.
On the user side, this presents them with an app that they can use to skim through curated content. To facilitate this, IBM Cloud Video has provided functionality to its SDKs to support this, including example source code for developers to create their own news feed.
New SDK features, such as the ability for content to both autoplay and for video content to pre-buffer, help to build this news feed experience. They join earlier SDK functionality, such as the ability to display closed captions or manipulate player controls, to aid in the creation of these news feeds.
How these functionalities are used, how they are displayed, how the player looks and behaves are all developer decisions or app level features. So the end user experience will vary.
In an example version of the news feed that IBM Cloud Video created, users scroll through the list of content that includes both written articles and video. Once they reach a video, it will automatically start to play, with no audio but closed captions present. Interacting, which simply requires them to touch the video, will cause the player to go fullscreen. At this point the audio will engage and a time bar will appear at the bottom. The user can close the full screen view and then return back to the news feed view at any time.
Pre-buffered video for automatic play
One of the more compelling aspects of this news feed application is the manner in which video content automatically plays. To ensure a frictionless experience, video content is setup so that it pre-buffers. Depending on the video asset, this means about 10-15 video chunks will be pre-loaded.
As a result, when a user scrolls down and comes across video content it will begin to play automatically. This gives the user a seamless experience, where they won’t have to pause in their scrolling as they wait for content to load. In addition, multiple videos can, depending on the content in your news feed, be pre-buffered as well. So the user can continue to scroll through their news feed for quite awhile, having videos continually play in a seamless experience as they do.
Closed caption support
Video content in news feeds have full closed caption support. In fact, not only do captions work in the news feed, but they will be visible when the content is autoplayed. This is key as it can give valuable context about the video before a viewer engages with it, giving them an idea if they want to watch the content or not. This lines up with changing viewing habits and preferences. In fact, it was discovered that 85% of video on Facebook was played without sound while adding captions to a video increased view times on the network by 12%. So creating an environment where someone can understand context without sound is important. In the event the viewer is interested they can always engage with that content as well, which will give them an experience with captions and audio.
If you are interested in adding captions to your on-demand content for use with this feature, please reference this WebVTT Captioning article. WebVTT is a caption format for displaying text that is tied to an HTML5 element. In this case, it’s a file that can be associated with on-demand video content.
Adaptive bitrate streaming
Video content played through the news feed can take advantage of adaptive bitrate streaming. This is the ability for the video content to, essentially, adapt to the connection speed of the viewer. This is done through the creation of different quality levels, each being a different video resolution with a different associated bitrate. These quality levels are then sent to the viewer based on their available download speed. So a viewer with a faster download speed would get a higher quality version of the video compared to someone with a slower download speed. This is done around the idea of reducing buffering time. This technology, and how IBM Cloud Video utilizes it, is documented in this Adaptive Streaming eBook.
Another aspect to consider is the pre-buffering, which also utilizes this approach. It wouldn’t make sense to have a user pre-buffer high definition video content if their connection was unable to support it, for example. As a result, the video chunks that will be pre-loaded are those that function under HLS (HTTP Live Streaming) guidelines, with deep level optimizations occurring at the control layer to enhance performance. In essence, a mobile user on fast WiFi network will pre-buffer higher bitrate and resolution content versus someone on a slower 4G connection.
Creating a news feed
To get started creating your news feed, first read the IBM Player SDK public documentation. The public documentation describes how to setup the SDK and also how to initialize the player to playback live or on-demand video content on iOS, Android or tvOS.
The SDK was developed with a generic approach, where only the core components are exposed. This gives developers the flexibility to implement app level features on top of it, for a large range of use-cases.
To utilize it, an IBM Cloud Video user needs to have the SDK access enabled on their account. After this, they can login, go to Integrations & App, and then select API/SDK. This will let them create SDK credentials for their app for their preferred platform. After generating the credentials, developers will get the option to download the SDK package. This contains the actual SDK and one or two sample applications with source-code, depending on the selected platforms.
The SDK can then be used with the account’s content after authenticating with the SDK key generated from the dashboard of the account. The sample applications provide examples for different use cases, making it easier to create them. These examples range from listing content based on thumbnails to the news feed module highlight here, with autoplay and pre-buffering enabled for an in-line playback experience.
Other player SDK use cases
SDKs can be used in virtually any scenario where a content owner wants to tap into the feature set of the IBM Cloud Video platform but needs to utilize a more white label approach. This includes being able to build a custom branded, native application with video. A sample use case can be a training focused app for a large enterprise, where security, privacy and analytics are paramount alongside the desire for custom branding. Media companies might also look toward building an OTT (over the top) television solution with monetization options. These options can be subscription based or the content can be open and follow an ad-based model.
To the point, the idea behind the SDK is that it’s really generic, while offering support for platform features and more. This includes age lock, password lock and hashlock support. As a result, in a native mobile environment it can be incorporated in very complicated setups. So it’s a good fit for complex applications with a rich feature set.
Although the provided web player from IBM Cloud Video includes a wealth of customizations, the SDKs give much more control. For instance, a client used the SDKs to create a custom branded UI for their app with video. This implemented an RTC based chat feature on top of the player while adding interactive animations that were trigged by touch.
IBM Cloud Video’s SDKs allow content owners a lot of options in how they present their content to their viewers. This latest update is built around empowering these content owners to develop news feed modules through the addition of autoplay and pre-buffering of content, although these SDK features are far from limited to this use cases.
Want to try out the SDKs and see how you can start sharing your content differently? Contact us to learn more.