Skip to main content
Log in

A Web-based distributed architecture for multi-device adaptation in media applications

  • Original Article
  • Published:
Personal and Ubiquitous Computing Aims and scope Submit manuscript

Abstract

HTML5 is driving a strong trend towards interoperable Web-based applications, enabling a wider range of devices to run this kind of applications. The key challenge of next-generation media applications is to federate cooperative devices to provide multi-device experiences overcoming current second screen solutions within the connected TV industry. There is a gap on the experience of users, since they perceive devices as isolated pieces of applications when they would prefer to have a single experience through multiple devices at the same time. This paper proposes a unified methodology and a common specification over Web Components for the adaptation of a single application, seamlessly running different instances on one or more devices simultaneously, according to the multi-device context of the user and the specific features of the devices. The solution presented in this paper extends current Web standards towards an interoperable architecture and offers broadcasters and media application developers the possibility to easily design applications that will automatically provide a unique consistent experience across the connected devices. The architectural design is targeted to be included in the roadmap of the standards.

This is a preview of subscription content, log in via an institution to check access.

Access this article

Price excludes VAT (USA)
Tax calculation will be finalised during checkout.

Instant access to the full article PDF.

Fig. 1
Fig. 2
Fig. 3
Fig. 4
Fig. 5
Fig. 6
Fig. 7
Fig. 8
Fig. 9
Fig. 10

Similar content being viewed by others

Notes

  1. http://mediascapeproject.eu.

  2. DIAL Discovery And Launch protocol specification. Version 1.7.2 (2015) http://www.dial-multiscreen.org/dial-protocol-specification.

  3. SMIL 3.0. December 2008. http://www.w3.org/TR/SMIL/.

  4. Gridster.js website. http://gridster.net/.

  5. CSS Regions library, April 2014. http://github.com/FremyCompany/css-regions-polyfill.

  6. Mozilla XUL. http://developer.mozilla.org/en-US/docs/Mozilla/Tech/XUL.

  7. Kontx. http://developer.yahoo.com/connectedtv/kontxapiref/.

  8. EnyoJS. http://enyojs.com/.

  9. Bootstrap. http://getbootstrap.com/.

  10. Polymer library’s website: http://www.polymer-project.org/.

  11. A polyfill is a downloadable code which provides facilities that are not built natively in a Web browser.

  12. Lazy loading is a design pattern to defer initialisation of an object until the point at which it is needed, contributing to the efficiency of the application.

  13. Video of one of the performed experiments http://vimeo.com/113514286.

References

  1. Anthes G (2012) HTML5 leads a web revolution. Commun ACM 55(7):16–17

    Article  Google Scholar 

  2. Courtois C, D’heer E (2012) Second screen applications and tablet users: constellation, awareness, experience, and interest. In: Proceedings of the 10th European conference on interactive TV and video. ACM, pp 153–156

  3. Claudy L (2012) The broadcast empire strikes back. IEEE Spectrum 49(12):52–58

    Article  MATH  Google Scholar 

  4. Cesar P, Bulterman DC, Jansen AJ (2008) Usages of the secondary screen in an interactive television environment: control, enrich, share, and transfer television content. In Changing television environments. Springer Berlin, pp 168–177

  5. Millward Brown (2014) Marketing in a multi-screen world. In: AdReaction 2014

  6. Zorrilla M, Tamayo I, Martin A, Olaizola IG (2013) Cloud session mainte-nance to synchronise HbbTV applications and home network devices. In: IEEE international symposium on broadband multimedia systems and broadcasting (BMSB). IEEE, pp 1–6

  7. Ziegler Christoph (2013) Second screen for HbbTV—automatic application launch and app-to-app communication enabling novel TV programme related second-screen scenarios. In: IEEE third international conference on consumer electronics Berlin (ICCE-Berlin), 2013. (ICCE Berlin 2013), IEEE

  8. Merkel K (2011) Hybrid broadcast broadband TV, the new way to a comprehensive TV experience. In: 2011 14th ITG conference on, electronic media technology (CEMT). IEEE, pp 1–4

  9. Weiser M (1991) The computer for the 21st century. Sci Am 265(3):94–104

    Article  Google Scholar 

  10. TVP-CPA: Cross-Platform Authentication (2014) Publication as an EBU recommendation: EBU Tech 3366. https://tech.ebu.ch/docs/tech/tech3366.pdf

  11. Zorrilla M, Martin A, Tamayo I, O’Halpin S, Hazael-Massieux D (2014) Reaching devices around an HbbTV television. In: 2014 IEEE international symposium on broadband multimedia systems and broadcasting (BMSB). IEEE, pp 1–7

  12. Desruelle H, Lyle J, Isenberg S, Gielen F (2012) On the challenges of building a web-based ubiquitous application platform. In: Proceedings of the 2012 ACM conference on ubiquitous computing. ACM, pp 733–736

  13. Desruelle H, Isenberg S, Botsikas A, Vergori P, Gielen F (2014) Accessible user interface support for multi-device ubiquitous applications: architectural modifiability considerations. Univers Access Inf Soc 1–15

  14. Brandenburg R, Veenhuizen A (2013) Immersive second-screen experiences using hybrid media synchronization. In: Media synchronization workshop 2013 (MediaSync)

  15. W3C Community Group (2015) Multi-device timing community group. https://www.w3.org/community/webtiming/

  16. W3C Editor’s Draft (2015) Timing object. http://webtiming.github.io/timingobject/#broadcasting—time-consistent-live-web-productions

  17. Arntzen Ingar M, Njål T Borch, Christopher P Needham (2013) The media state vector: a unifying concept for multi-device media navigation. In: Proceedings of the 5th workshop on mobile video, ACM

  18. MediaScape EU project report (2014) Usage scenarios and requirements. Deliverable D2.1. http://mediascapeproject.eu/files/D2.1.pdf

  19. Nielsen report (2014). Shifts in viewing: The cross platform report. http://www.nielsen.com/us/en/insights/reports/2014/shifts-in-viewing-the-cross-platform-report-q2-2014.html

  20. Nielsen report (2014) State of the media: audio today. http://www.nielsen.com/us/en/insights/reports/2014/state-of-the-media-audio-today-q3-2014.html

  21. Strategy Analytics (2014) 2013 Smart TV shipments grew 55 %. http://www.strategyanalytics.com/default.aspx?mod=pressreleaseviewer&a0=5472

  22. An Ericsson Consumer Insight Summary Report (2013) TV and media. Identifying the needs of tomorrow’s video consumer. Ericsson ConsumerLab. http://www.ericsson.com/res/docs/2013/consumerlab/tv-and-media-consumerlab2013.pdf

  23. Gartner report (2014). Forecast: PCs, Ultramobiles, and mobile phones, Worldwide, 2010–2017. http://www.gartner.com/newsroom/id/2645115

  24. NAPTE survey (2014) https://www.natpe.com/press/release/130

  25. Nielsen survey (2014) Sports fans amplify the action across screens. http://www.nielsensocial.com/sports-fans-amplify-the-action-across-screens/

  26. Nielsen survey (2014) Who’s tweeting about tv? http://www.nielsensocial.com/whos-tweeting-about-tv/

  27. Soares LFG, Costa RM, Moreno MF, Moreno MF (2009) Multiple exhibition devices in DTV systems. In: Proceedings of the 17th ACM international conference on Multimedia. ACM, pp 281–290

  28. Soares LFG, Moreno MF, De Salles Soares Neto C (2010) Ginga-NCL: declarative middleware for multimedia IPTV services. Commun Mag IEEE 48(6):74–81

    Article  Google Scholar 

  29. W3C World-Wide Web Consortium (2008) Synchronized multimedia integration language—SMIL 3.0 Specification, W3C Recommendation. http://www.w3.org/TR/2008/REC-SMIL3-20081201/

  30. Pereira FC (2002) The MPEG-4 book. Prentice Hall Professional. ISBN: 0-13-061621-4

  31. Manjunath BS, Salembier P, Sikora T (eds) (2002) Introduction to MPEG-7: multimedia content description interface (vol 1). Wiley, New York

  32. W3C Editor’s draft (2014) HTML 5.1 nightly. A vocabulary and associated APIs for HTML and XHTML. http://www.w3.org/html/wg/drafts/html/master/embedded-content.html#the-source-element-when-used-with-the-picture-element

  33. W3C Recommendation (2012) Media queries. http://www.w3.org/TR/css3-mediaqueries/

  34. W3C Recommendation (2010) Mobile Web application best practices. http://www.w3.org/TR/mwabp/

  35. W3C Working Draft (2014) CSS flexible box layout module level 1. http://www.w3.org/TR/css3-flexbox/

  36. W3C Working Draft (2014) CSS regions module level 1. http://www.w3.org/TR/css3-regions/

  37. W3C Working Draft (2014) CSS grid layout module level 1. http://www.w3.org/TR/css3-grid-layout/

  38. W3C Working Group Note (2014) Introduction to Web components. http://w3c.github.io/webcomponents/explainer/

  39. Techrunch (2013) Google believes Web components are the future of Web development. http://techcrunch.com/2013/05/19/google-believes-web-components-are-the-future-of-web-development/

  40. Zorrilla M, Martin A, Tamayo I (2015) User interface adaptation for multi-device Web-based media applications. In: 2015 IEEE international symposium on broadband multimedia systems and broadcasting (BMSB). Pending to be published. IEEE

  41. W3C Editor’s Draft (2014) Media queries level 4. http://dev.w3.org/csswg/mediaqueries4/#script-custom-mq

Download references

Acknowledgments

The MediaScape project has received funding from the European Union’s Seventh Framework Programme for research, technological development and demonstration under grant agreement 610404. The contribution from the UPV/EHU has been supported by the Basque Council under Grant Agreement IT395-10. The first author would like to thank Iñigo Tamayo, Angel Martin, Ana Dominguez and Igor G. Olaizola, researchers in Vicomtech-IK4, for supporting the architectural design and implementation presented in the paper.

Author information

Authors and Affiliations

Authors

Corresponding author

Correspondence to Mikel Zorrilla.

Rights and permissions

Reprints and permissions

About this article

Check for updates. Verify currency and authenticity via CrossMark

Cite this article

Zorrilla, M., Borch, N., Daoust, F. et al. A Web-based distributed architecture for multi-device adaptation in media applications. Pers Ubiquit Comput 19, 803–820 (2015). https://doi.org/10.1007/s00779-015-0864-x

Download citation

  • Received:

  • Accepted:

  • Published:

  • Issue Date:

  • DOI: https://doi.org/10.1007/s00779-015-0864-x

Keywords

Navigation