Skip to main content
Log in

Generating native user interfaces for multiple devices by means of model transformation

  • Published:
Frontiers of Information Technology & Electronic Engineering Aims and scope Submit manuscript

Abstract

In the last years, the types of devices used to access information systems have notably increased using different operating systems, screen sizes, interaction mechanisms, and software features. This device fragmentation is an important issue to tackle when developing native mobile service front-end applications. To address this issue, we propose the generation of native user interfaces (UIs) by means of model transformations, following the modelbased user interface (MBUI) paradigm. The resulting MBUI framework, called LIZARD, generates applications for multiple target platforms. LIZARD allows the definition of applications at a high level of abstraction, and applies model transformations to generate the target native UI considering the specific features of target platforms. The generated applications follow the UI design guidelines and the architectural and design patterns specified by the corresponding operating system manufacturer. The objective is not to generate generic applications following the lowest-common-denominator approach, but to follow the particular guidelines specified for each target device. We present an example application modeled in LIZARD, generating different UIs for Windows Phone and two types of Android devices (smartphones and tablets).

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.

Similar content being viewed by others

References

  • Abrams, M., Phanouriou, C., Batongbacal, A.L., et al., 1999. UIML: an appliance-independent XML user interface language. Comput. Networks, 31(11-16):1695–1708. [doi:10.1016/S1389-1286(99)00044-4]

    Article  Google Scholar 

  • Ali, M.F., 2004. A Transformation-Based Approach to Building Multi-platform User Interfaces Using a Task Model and the User Interface Markup Language. Faculty of the Virginia Polytechnic Institute and State University.

    Google Scholar 

  • Ali, M.F., Perez-Quiñones, M.A., Abrams, M., et al., 2002. Building multi-platform user interfaces with UIML. Computer-Aided Design of User Interfaces III, p.255–266. [doi:10.1007/978-94-010-0421-3_22]

    Chapter  Google Scholar 

  • Android Developers, 2015. Fragments Developers. The Android Fragments API. Available from http://developer. android.com/guide/components/fragments.html

    Google Scholar 

  • Aquino, N., Vanderdonckt, J., Condori-Fernández, N., et al., 2010. Usability evaluation of multi-device/platform user interfaces generated by model-driven engineering. Proc. ACM-IEEE Int. Symp. on Empirical Software Engineering and Measurement, p.30.1–30.10. [doi:10.1145/1852786.1852826]

    Google Scholar 

  • Arendt, T., Biermann, E., Jurack, S., et al., 2010. Henshin: advanced concepts and tools for in-place EMF model transformations. Proc. 13th Int. Conf. on Model Driven Engineering Languages and Systems: Part I, p.121–135. [doi:10.1007/978-3-642-16145-2_9]

    Chapter  Google Scholar 

  • Berti, S., Correani, F., Mori, G., et al., 2004. TERESA: a transformation-based environment for designing and developing multi-device interfaces. Proc. CHI Extended Abstracts on Human Factors in Computing Systems, p.793–794. [doi:10.1145/985921.985939]

    Google Scholar 

  • Cabot, J., 2013. Movisa: a DSL Tool for Human Machine Interfaces (HMI) in Industrial Automation. Available from http://modeling-languages.com/movisa-a-dsltool-for-human-machine-interfaces-hmi-in-industrialautomation

    Google Scholar 

  • Calvary, G., Coutaz, J., Thevenin, D., et al., 2003. A unifying reference framework for multi-target user interfaces. Interact. Comput., 15(3):289–308. [doi:10.1016/S0953-5438(03)00010-9]

    Article  Google Scholar 

  • Caminero, J., Rodríguez, M.C., Vanderdonckt, J., et al., 2012. The SERENOA project: multidimensional context-aware adaptation of service front-ends. Proc. 8th Int. Conf. on Language Resources and Evaluation, p.2977–2984.

    Google Scholar 

  • Campbell, D.T., Fiske, D.W., 1959. Convergent and discriminant validation by the multitrait-multimethod matrix. Psychol. Bull., 56(2):81–105. [doi:10.1037/h0046016]

    Article  Google Scholar 

  • Chin, J.P., Diehl, V.A., Norman, K.L., 1988. Development of an instrument measuring user satisfaction of the human-computer interface. Proc. SIGCHI Conf. on Human Factors in Computing Systems, p.213–218. [doi:10.1145/57167.57203]

    Google Scholar 

  • Clarius, 2015. Funq: a Fast DI Container You Can Understand. Available from http://funq.codeplex.com

    Google Scholar 

  • Cook, W.R., 1991. Object-oriented programming versus abstract data types. Proc. REX School/Workshop on Foundations of Object-Oriented Languages, p.151–178. [doi:10.1007/BFb0019443]

    Chapter  Google Scholar 

  • Degrandsart, S., Demeyer, S., van den Bergh, J., et al., 2014. A transformation-based approach to contextaware modelling. Softw. Syst. Model., 13(1):191–208. [doi:10.1007/s10270-012-0239-y]

    Article  Google Scholar 

  • Forax, R., Duris, E., Roussel, G., 2000. Java multi-method framework. Proc. Int. Conf. on Technology of Object-Oriented Languages and Systems, p.45–56.

    Google Scholar 

  • Fowler, M., 2004. Inversion of Control Containers and the Dependency Injection Pattern. Available from http://martinfowler.com/articles/injection.html

    Google Scholar 

  • Gamma, E., Helm, R., Johnson, R., et al., 1994. Design Patterns: Elements of Reusable Object-Oriented Software. Addison-Wesley Professional, Boston, MA, USA.

    Google Scholar 

  • Georges, A., Buytaert, D., Eeckhout, L., 2007. Statistically rigorous Java performance evaluation. ACM SIGPLAN Not., 42(10):57–76. [doi:10.1145/1297105.1297033]

    Article  Google Scholar 

  • Hennig, S., Braune, A., 2011. Sustainable visualization solutions in industrial automation with Movisa—a case study. IEEE Int. Conf. on Industrial Informatics, p.634–639.

    Google Scholar 

  • HIIS Laboratory, 2015. The CAMELEON Reference Framework. Plasticity of User Interfaces. Available from http://giove.isti.cnr.it/projects/cameleon.html

    Google Scholar 

  • Limbourg, Q., Vanderdonckt, J., 2004. UsiXML: a user interface description language supporting multiple levels of independence. Engineering Advanced Web Applications: Proc. Workshops in Connection with the 4th Int. Conf. on Web Engineering, p.325–338.

    Google Scholar 

  • Limbourg, Q., Vanderdonckt, J., 2009. Multipath transformational development of user interfaces with graph transformations. Human-Centered Software Engineering—Software Engineering Models, Patterns and Architectures for HCI, p.107–138. [doi:10.1007/978-1-84800-907-3_6]

    Chapter  Google Scholar 

  • Marcotte, E., 2011. Responsive Web Design. Jeffrey Zeldman, New York, NY, USA.

    Google Scholar 

  • Mens, T., van Gorp, P., 2006. A taxonomy of model transformation. Electron. Notes Theor. Comput. Sci., 152:125–142. [doi:10.1016/j.entcs.2005.10.021]

    Article  Google Scholar 

  • Meskens, J., Vermeulen, J., Luyten, K., et al., 2008. Gummy for multi-platform user interface designs: shape me, multiply me, fix me, use me. Proc. Working Conf. on Advanced Visual Interfaces, p.233–240. [doi:10.1145/1385569.1385607]

    Chapter  Google Scholar 

  • Miravet, P., Marin, I., Ortin, F., et al., 2014a. Framework for the declarative implementation of native mobile applications. IET Softw., 8(1):19–32. [doi:10.1049/iet-sen.2012.0194]

    Article  Google Scholar 

  • Miravet, P., Ortin, F., Marin, I., et al., 2014b. Using standards to build the DIMAG connected mobile applications framework. Comput. Stand. Interf., 36(2):354–367. [doi:10.1016/j.csi.2013.08.007]

    Article  Google Scholar 

  • Molina, A.I., Giraldo, W.J., Gallardo, J., et al., 2012. CIAT-GUI: a MDE-compliant environment for developing graphical user interfaces of information systems. Adv. Eng. Softw., 52:10–29. [doi:10.1016/j.advengsoft. 2012.06.002]

    Article  Google Scholar 

  • Neil, T., 2012. Mobile Design Pattern Gallery. Addison-Wesley, Sebastopol, CA, USA.

    Google Scholar 

  • Ortin, F., 2011. Type inference to optimize a hybrid statically and dynamically typed language. Comput. J., 54(11):1901–1924. [doi:10.1093/comjnl/bxr067]

    Article  Google Scholar 

  • Ortin, F., Garcia, M., 2011. A type safe design to allow the separation of different responsibilities into parallel hierarchies. Evaluation of Novel Approaches to Software Engineering, p.15–25.

    Google Scholar 

  • Ortin, F., Zapico, D., Cueva, J.M., 2007. Design patterns for teaching type checking in a compiler construction course. IEEE Trans. Educ., 50(3):273–283. [doi:10.1109/TE.2007.901983]

    Article  Google Scholar 

  • Ortin, F., Quiroga, J., Redondo, J.M., et al., 2014. Attaining multiple dispatch in widespread object-oriented languages. DYNA, 81(186):242–250. [doi:10.15446/dyna.v81n186.40428]

    Article  Google Scholar 

  • Paternò, F., Mancini, C., Meniconi, S., 1997. ConcurTask-Trees: a diagrammatic notation for specifying task models. Proc. IFIP TC13 Int. Conf. on Human-Computer Interaction, p.362–369.

    Google Scholar 

  • Paternò, F., Santoro, C., Spano, L.D., 2009. MARIA: a universal, declarative, multiple abstraction-level language for service-oriented applications in ubiquitous environments. ACM Trans. Comput.-Human Interact., 16(4):19.1–19.30. [doi:10.1145/1614390.1614394]

    Article  Google Scholar 

  • Paternò, F., Santoro, C., Spano, L.D., 2011. Engineering the authoring of usable service front ends. J. Syst. Softw., 84(10):1806–1822. [doi:10.1016/j.jss.2011.05.025]

    Article  Google Scholar 

  • Pausch, R., Conway, M., Deline, R., 1992. Lessons learned from SUIT, the simple user interface toolkit. ACM Trans. Inform. Syst., 10(4):320–344. [doi:10.1145/146486.146489]

    Article  Google Scholar 

  • Rajapakse, D.C., 2008. Fragmentation of Mobile Applications. In: Alencar, P., Cowan, D. (Eds.), Handbook of Research on Mobile Software Engineering. Engineering Science Reference, Hershey, PA, USA.

    Google Scholar 

  • Serenoa, 2012. Multi-dimensional Context-Aware Adaptation of Service Front-Ends. Deliverable 2.1.2 CARF and CADS (R2).

    Google Scholar 

  • Smith, J., 2009. WPF Apps with the Model-View-ViewModel Design Pattern. MSDN Mag., 2(1):1–19.

    Google Scholar 

  • The Eclipse Foundation, 2015a. EMF, the Eclipse Modeling Framework. Available from https://www.eclipse.org/modeling/emf

  • The Eclipse Foundation, 2015b. EMP, the Eclipse Modeling Project. Available from http://www.eclipse.org/modeling

  • The Eclipse Foundation, 2015c. Epsilon Generation Language. Available from http://www.eclipse.org/gmt/epsilon/doc/egl

  • The Eclipse Foundation, 2015d. Xtend, Java 10 Today! Available from http://www.eclipse.org/xtend

  • Tichy, M., Krause, C., Liebel, G., 2013. Detecting performance bad smells for Henshin model transformations. Workshop on the Analysis of Model Transformations, p.82–86.

    Google Scholar 

  • Tran, V., Vanderdonckt, J., Kolp, M., et al., 2009. Generating user interface from task, user and domain models. Int. Conf. on Advances in Human-oriented and Personalized Mechanisms, Technologies, and Services, p.19–26. [doi:10.1109/CENTRIC.2009.24]

    Chapter  Google Scholar 

  • van den Bergh, J., Luyten, K., Coninx, K., 2011. CAP3: context-sensitive abstract user interface specification. Proc. 3rd ACM SIGCHI Symp. on Engineering Interactive Computing Systems, p.31–40. [doi:10.1145/1996461.1996491]

    Google Scholar 

  • Vanderdonckt, J., Limbourg, Q., Michotte, B., et al., 2004. UsiXML: a user interface description language for specifying multimodal user interfaces. W3C Workshop on Multimodal Interaction, p.19–20.

    Google Scholar 

  • W3C, 2010a. Model-Based UI XG Final Report. W3C Incubator Group Report. Available from http://www.w3.org/2005/Incubator/modelbased-ui/XGR-mbui-20100504

  • W3C, 2010b. Model-Based User Interface (MBUI. W3C Incubator Group Report. Available from http://www.w3.org/2005/Incubator/model-based-ui

  • W3C, 2012. Media Queries. W3C Recommendation. Available from http://www.w3.org/TR/css3-mediaqueries

  • Zenger, M., Odersky, M., 2005. Independently extensible solutions to the expression problem. Int. Workshop on Foundations of Object-Oriented Languages, p.1–11.

    Google Scholar 

Download references

Author information

Authors and Affiliations

Authors

Corresponding author

Correspondence to Francisco Ortin.

Additional information

Project supported by the European Commission’s FP7 Serenoa Project (No. 258030), the National Program for Research, Development and Innovation, the Department of Science and Technology, Spain (No. TIN2011-25978), European Regional Development Funds (ERDF), European Union, and the Principality of Asturias, Science, Technology and Innovation Plan (No. GRUPIN14-100)

ORCID: Francisco ORTIN, http://orcid.org/0000-0003-1199-8649

Rights and permissions

Reprints and permissions

About this article

Check for updates. Verify currency and authenticity via CrossMark

Cite this article

Marin, I., Ortin, F., Pedrosa, G. et al. Generating native user interfaces for multiple devices by means of model transformation. Frontiers Inf Technol Electronic Eng 16, 995–1017 (2015). https://doi.org/10.1631/FITEE.1500083

Download citation

  • Received:

  • Accepted:

  • Published:

  • Issue Date:

  • DOI: https://doi.org/10.1631/FITEE.1500083

Keywords

CLC number

Navigation