Model-driven Development of User Interfaces for IoT via Domain-specific Components & Patterns

This is the summary of a joint contribution with Eric Umuhoza to ICEIS 2017 on Model-driven Development of User Interfaces for IoT via Domain-specific Components & Patterns.
Internet of Things technologies and applications are evolving and continuously gaining traction in all fields and environments, including homes, cities, services, industry and commercial enterprises. However, still many problems need to be addressed.
For instance, the IoT vision is mainly focused on the technological and infrastructure aspect, and on the management and analysis of the huge amount of generated data, while so far the development of front-end and user interfaces for IoT has not played a relevant role in research.
On the contrary, we believe that user interfaces in the IoT ecosystem they can play a key role in the acceptance of solutions by final adopters.
In this paper we present a model-driven approach to the design of IoT interfaces, by defining a specific visual design language and design patterns for IoT applications, and we show them at work. The language we propose is defined as an extension of the OMG standard language called IFML.

The slides of this talk are available online on Slideshare as usual:

Mobile app development – Extensions for IFML modelling language, tool and code generator presented at MobiWIS

Front-end design of mobile applications is a complex and multidisciplinary task, where many perspectives intersect and the user experience must be perfectly tailored to the application objectives. However, development of mobile user interactions is still largely a manual task, which yields to high risks of errors, inconsistencies and inefficiencies.

The contribution of the AutoMobile research project (lead by WebRatio) is a model-driven approach to mobile application development based on the IFML standard by the OMG.

We recently wrote a paper on the subject, which got accepted at the MobiWIS 2014 conference, in Barcelona. In this paper we propose a model-driven approach to mobile application development based on the IFML standard. We propose an extension of the Interaction Flow Modeling Language tailored to mobile applications and we describe our implementation experience that comprises the development of automatic code generators for cross-platform mobile applications based on HTML5, CSS and JavaScript optimized for the Apache Cordova framework.

We show the approach at work on a popular mobile application, we report on the application of the approach on an industrial application development project and we provide a productivity comparison with traditional approaches.

Eric Umuhoza, affiliated with Politecnico di Milano and Ecole des Mines de Nantes, presented the paper at MobiWIS 2014 regarding the research conducted in the AutoMobile project, lead by WebRatio.

Here are the slides of the presentation:


and here is the link to the paper published by Springer:

To keep updated on my activities you can subscribe to the RSS feed of my blog or follow my twitter account (@MarcoBrambi).

Effective Cross-platform Mobile Application Development

Apache Cordova - PhoneGap - crossplatform mobile development and code generation from IFML

I constantly meet with mobile app developers struggling with the requirement from customers about
having their mobile apps available on multiple mobile platforms. Mainly for iOS and Android, but now also for Windows Phone (aside, you may want to know that Windows has now surpassed iOS in mobile market in Italy. No surprise here, great phones and bargain prices!).

With the Automobile project we are trying to cross the chasm of cross-platform development through a model-driven, code generation approach. However, even with this kind of vision, various options remain open. Should we design (model) the application once with a conceptual modeling language like IFML, and then build different code generators for each mobile platforms? Or should we build a unified generator that produces code that is cross-platform per se?

We are currently investigating the latter option, and we started our path with a set of seminars on Apache Cordova (the open source project that is behind the more known PhoneGap product by Adobe).

Apache Cordova is a platform for building native mobile applications using HTML, CSS and JavaScript. It comprises a set of device APIs that allow a mobile app developer to access native device function such as the camera or accelerometer from JavaScript. Cordova can be combined with a UI framework such as jQuery Mobile or Dojo Mobile or Sencha Touch for getting the best apps with limited effort (although these frameworks sometime add additional computational overhead to the app).

The advantage of this kind of approaches, from a model-driven development perspective, is that we could develop only one code generation for different mobile platforms.

Ivano Malavolta, from University of L’Aquila, came visiting us and offered his vision for developing effective and efficient mobile applications. He proposed an approach that is highly scalable and maintainable, based on clean and well structured frameworks and patterns.
This perfectly copes with our aim of automatically generating the code (within the WebRatio platform).

You can find the slides of his core presentations here:

and others here:

Bottom line: cross-platform mobile apps are not just for crappy, cheap applications. If you develop cross-platform mobile apps professionally, you can get excellent results (apps like Flipboard, Gmail, or Amazon are developed like this!).

Furthermore: if you work at conceptual level with a modeling language like IFML and then you generate cross-platform apps, you can maximize your productivity and maintainability of the apps.

To keep updated on my activities you can subscribe to the RSS feed of my blog or follow my twitter account (@MarcoBrambi).