Skip to main content
Log in

Providing adjustable and dynamic spatial layouts for multimedia applications with STyLe

  • Published:
Multimedia Tools and Applications Aims and scope Submit manuscript

Abstract

Interactive multimedia applications may be presented on multiple devices with different screen sizes. Therefore, application layouts should be adapted during runtime. Besides adapting layouts to different devices, the number of visual multimedia objects may vary, thus it is desirable to provide an automatic application layout adjustment to ease the authoring effort and provide good user quality of experience. In this article, the term adjustable layout is used to refer to an application spatial layout that adjusts itself to the number of media objects to be presented. The term dynamic layout is used to refer to an application spatial layout that can change at runtime in reaction to presentation events. Multimedia declarative authoring languages, such as NCL and SMIL, provide simple layout construction using nested rectangular regions to design the application layout. However, these languages do not provide native facilities for authors to develop adjustable and dynamic layouts. This article proposes STyLe, a constraint-based template language for providing adjustable and dynamic spatial layouts for multimedia documents. It also presents an architecture that is capable of interpreting STyLe when used together with NCL to provide dynamic layouts for interactive digital TV applications. The results show that STyLe has more expressiveness and abstraction when compared to NCL and that the language is simple and effective for building adjustable and dynamic layouts.

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.

Listing 1
Listing 2
Listing 3
Fig. 1
Fig. 2
Fig. 3
Fig. 4
Fig. 5
Listing 4
Listing 5
Listing 6
Fig. 6
Fig. 7
Fig. 8
Fig. 9
Fig. 10
Listing 7
Fig. 11
Fig. 12
Fig. 13
Fig. 14

Similar content being viewed by others

Notes

  1. http://clube.ncl.org.br

References

  1. 2IMMERSE (2015) The 2-immerse layout engine packing algorithm. 2immerse.eu/the-2-immerse-layout-engine-packing-algorithm, Accessed 10 February 2020

  2. ABNT (2007) Digital terrestrial television - data coding and transmission specification for digital broadcasting - part 2: Ginga-ncl for fixed and mobile receivers - xml application language for application coding. ABNT NBR 15606-2:2007 standard

  3. Albert I, Charaf H, Lengyel L (2013) Layout definition considerations for a content-driven template-based layout system. In: EUROCON, 2013 IEEE, EUROCON ’13, pp 543–549

  4. Amorim GF (2017) Leiautes dinâmicos baseados em Templates para documentos multimídia PhD thesis Fluminense Federal University in portuguese

  5. Amorim GF, dos Santos JAF, Muchaluat-Saade DC (2016) Xtemplate 4.0: Providing adaptive layouts and nested templates for hypermedia documents. In: MultiMedia Modeling: 22nd International Conference, Miami, FL, USA, January 4-6, Proceedings, Part I, Springer International Publishing, MMM’16

  6. Angulo J, Calzada J, Estruch A (2011) Selection of standards for digital television: The battle for latin america. Telecommun Policy 35(8):773–787

    Article  Google Scholar 

  7. Badros GJ, Borning A, Marriott K, Stuckey P (1999) Constraint cascading style sheets for the web. In: Proceedings of the 12th Annual ACM Symposium on User Interface Software and Technology, UIST ’99, pp 73–82, https://doi.org/10.1145/320719.322588

  8. Barrett CW, Sebastiani R, Seshia SA, Tinelli C (2009) Satisfiability modulo theories. Handbook of satisfiability 185:825–885

    Google Scholar 

  9. Van den Bergh J, Bruynooghe B, Moons J, Huypens S, Hemmeryckx-Deleersnijder B, Coninx K (2008) Using high-level models for the creation of staged participatory multimedia events on tv. Multimedia Systems 14(2):89–103. https://doi.org/10.1007/s00530-008-0116-2

    Article  Google Scholar 

  10. Bhaumik S (2015) Bootstrap essentials. Packt Publ., Birmingham, prefix http://cds.cern.ch/record/2050514,

  11. Borning A, Lin RKH, Marriott K (2000) Constraint-based document layout for the web. Multimedia Systems 8(3):177–189

    Article  Google Scholar 

  12. Bryant J, Jones M (2012) Responsive web design. In: Pro HTML5 Performance, Springer, pp 37–49

  13. Deltour R, Roisin C (2006) The limsee3 multimedia authoring model. In: Proceedings of the 2006 ACM Symposium on Document Engineering, DocEng ’06, pp 173–175, https://doi.org/10.1145/1166160.1166203

  14. Dutertre B (2015) Yices Manual Version 2.4. SRI International

  15. Geurts JPTM, Van Ossenbruggen JR, Hardman HL (2001) Application-specific constraints for multimedia presentation generation. Centrum voor Wiskunde en Informatica

  16. Green TRG, Petre M (1996) Usability analysis of visual programming environments: a ‘cognitive dimensions’ framework. Journal of Visual Languages & Computing 7(2):131–174

    Article  Google Scholar 

  17. HbbTV Association (2018) HbbTV 2.0.2 Specification https://www.hbbtv.org/resourcelibrary/#specifications, accessed 20 July 2018

  18. Hickson I, Berjon R, Faulkner S, Leithead T, Navara ED, O’Connor E, Pfeiffer S (2014) HTML5: A vocabulary and associated APIs for HTML and XHTML http://www.w3.org/TR/html5/ Accessed 10 october 2016

  19. Ierusalimschy R (2016) Programming in Lua. Lua.org

  20. ITU (2009) Nested Context Language NCL and Ginga-NCL for IPTV services http://www.itu.int/rec/T-REC-H.761-200904-P ITU-T Recommendation H.761. Accessed 27 november 2016

  21. ITU (2018) Integrated broadcast-broadband systems https://www.itu.int/pub/R-REP-BT.2267-8-2018 Report ITU-R BT.2267-8 Accessed 15 December 2018

  22. Jacobs C, Li W, Schrier E, Bargeron D, Salesin D (2003) Adaptive grid-based document layout. In: ACM SIGGRAPH 2003 Papers, SIGGRAPH ’03, pp 838–847, https://doi.org/10.1145/1201775.882353

  23. Li J, Röggla T, Glancy M, Jansen J, Cesar P (2018a) A new production platform for authoring object-based multiscreen tv viewing experiences. In: Proceedings of the 2018 ACM International Conference on Interactive Experiences for TV and Online Video, pp 115–126

  24. Li J, Zheng Z, Meixner B, Röggla T, Glancy M, Cesar P (2018b) Designing an object-based preproduction tool for multiscreen tv viewing. In: Extended Abstracts of the 2018 CHI Conference on Human Factors in Computing Systems, pp 1–6

  25. McCormack C, Marriott K, Meyer B (2004) Adaptive layout using one-way constraints in svg In SVG Open

  26. de Moura MSA (2001) Relações espaciais em documentos hipermídia Master’s thesis PUC-Rio in portuguese

  27. Muchaluat-Saade DC, Soares LFG (2002) Xconnector & xtemplate: Improving the expressiveness and reuse in web authoring languages. The New Review of Hypermedia and Multimedia Journal 8(1):139–169

    Article  Google Scholar 

  28. Neto CS, Pinto HF, Soares LFG (2012) TAL Processor of Hypermedia Applications. In: Proceedings of the 2012 ACM Symposium on Document Engineering, DocEng ’12, pp 69–78, https://doi.org/10.1145/2361354.2361369

  29. dos Santos JAF, Muchaluat-Saade DC (2012) Xtemplate 3.0: Spatio-temporal semantics and structure reuse for hypermedia compositions. Multimedia Tools Appl 61(3):645–673

    Article  Google Scholar 

  30. Schrier E, Dontcheva M, Jacobs C, Wade G, Salesin D (2008) Adaptive layout for dynamically aggregated documents. In: Proceedings of the 13th International Conference on Intelligent User Interfaces, IUI ’08, pp 99–108, https://doi.org/10.1145/1378773.1378787

  31. Soares LFG, Neto CSS, Junior JGS (2012) Architecture for hypermedia dynamic applications with content and behavior constraints. In: Proceedings of the 2012 ACM Symposium on Document Engineering, DocEng ’12, pp 217–226, https://doi.org/10.1145/2361354.2361403

  32. Soares LFG, Neto CSS, Junior JGS (2014) Framework for automatic generation of hypermedia applications in runtime. In: Proceedings of the 20th Brazilian Symposium on Multimedia and the Web, WebMedia ’14, pp 207–214, https://doi.org/10.1145/2664551.2664559

  33. Tocchini D, Brados G, Russel A, Bergious H, Aylott T, Fedin Y, Paul Y, Chouinard C (2016) Grid Style Sheets 2.0 https://www.sitepoint.com/introducing-gss-grid-style-sheets/ Accessed 18 april 2017

  34. W3C (2008) Synchronized Multimedia Integration Language - SMIL 3.0 Specification http://www.w3c.org/TR/SMIL3, W3C Recommendation. Accessed 03 december 2015

  35. W3C (2017a) CSS Flexible Box Layout Module Level 1 https://www.w3.org/TR/css-flexbox-1/, W3C Candidate Recommendation. Accessed 15 march 2018

  36. W3C (2017b) CSS Grid Layout Module Level 1 https://www.w3.org/TR/css-grid/, W3C Candidate Recommendation. Accessed 15 march 2018

  37. Zhang K, Kong J, Qiu M, Song GL (2005) Multimedia layout adaptation through grammatical specifications. Multimedia Systems 10(3):245–260. https://doi.org/10.1007/s00530-004-0155-2

    Article  Google Scholar 

Download references

Author information

Authors and Affiliations

Authors

Corresponding author

Correspondence to Glauco F. Amorim.

Additional information

Publisher’s note

Springer Nature remains neutral with regard to jurisdictional claims in published maps and institutional affiliations.

Rights and permissions

Reprints and permissions

About this article

Check for updates. Verify currency and authenticity via CrossMark

Cite this article

Amorim, G.F., dos Santos, J.A.F. & Muchaluat-Saade, D.C. Providing adjustable and dynamic spatial layouts for multimedia applications with STyLe. Multimed Tools Appl 79, 25989–26021 (2020). https://doi.org/10.1007/s11042-020-09204-x

Download citation

  • Received:

  • Revised:

  • Accepted:

  • Published:

  • Issue Date:

  • DOI: https://doi.org/10.1007/s11042-020-09204-x

Keywords

Navigation