Integrating Web-Based Collaborative Live Editing and Wireframing into a Model-Driven Web Engineering Process

Today’s Model-Driven Web Engineering (MDWE) approaches automatically generate Web applications from conceptual, domain-specific models. This enhances productivity by simplifying the design process through a higher degree of abstraction. Due to this raised level of abstraction, the collaboration on conceptual models also opens up new use cases, such as the tighter involvement of non-technical stakeholders into Web development. However, especially in the early design stages of Web applications, common practices for requirement elicitation mostly rely on wireframes instead of MDWE, created usually in analog settings. Additionally, state-of-the-art MDWE should integrate established and emerging Web development features, such as Near Real-Time (NRT) collaborative modeling and shared editing on the generated code. The combination of collaborative modeling, coding and wireframing, all in NRT, bears a lot of potential for improving MDWE practices. The challenge when covering these requirements lies with synchronizing source code, wireframes and models, an essential need to cope with regular changes in the software architecture to provide the flexibility needed for agile MDWE. In this contribution, we present a MDWE approach with live code editing and wireframing capabilities. We present the conceptual considerations of our approach, the realization of it and the integration into an overarching development methodology. Following a design science approach, we present the cyclic iterations of developing and evaluating our artifacts, which show promising results for collaborative Web development tasks that could open the gate towards novel, collaborative and agile MDWE techniques.