Improving Collaboration Efficiency Between UX/UI Designers and Developers in a Low-Code Platform

Joao Pacheco, Stoyan Garbatov, Miguel Goulao

Research output: Chapter in Book/Report/Conference proceedingConference contributionpeer-review

Abstract

Customer-facing applications are essential for businesses. Therefore, a good user experience is fundamental for their success in the market. Companies employ highly specialized people in front-end development and User Experience (UX) User Interface (UI) design to achieve this goal. Their collaboration is critical and raises some efficiency challenges, particularly in Low-Code platforms, such as OutSystems. UX/UI designers typically use specialized tools with their underlying metamodels. OutSystems developers use an integrated development environment with the underlying OutSystems metamodel. While there are some code-generation plugins for popular design tools, these do not generate code for Low-Code platforms. The current transformation process from design to development is done 100% manually, resulting in a loss of efficiency. Our goal is to accelerate this transformation process from a design model to a development model to mitigate this inefficiency. To do so, we developed an approach using model transformations to automate part of the process. Namely, it automates the generation of application pages/screens by composing the screen mockups in a design technology (such as Figma or Sketch) with a library of reusable UI components to instantiate the design in a front-end technology (such as OutSystems). Our approach was validated by a professional team of frontend developers from an established enterprise-grade Low-Code platform who applied and evaluated this work on some of their past real projects. Preliminary results show an overall acceptance of the developed tool with a possible increase of 150% to 400% in the number of pages/screens that they can deliver with the same effort. This approach allows mitigating a bottleneck faced by the development team. To increase the value they could offer to customers (e.g., by producing more application screens in the same time frame), they would need to recruit new collaborators whose skill set is high on demand. Our work offers a more economical alternative to increase their productivity.

Original languageEnglish
Title of host publicationCompanion Proceedings - 24th International Conference on Model-Driven Engineering Languages and Systems, MODELS-C 2021
PublisherInstitute of Electrical and Electronics Engineers Inc.
Pages138-147
Number of pages10
ISBN (Electronic)9781665424844
DOIs
Publication statusPublished - 2021
Event24th International Conference on Model-Driven Engineering Languages and Systems, MODELS-C 2021 - Virtual, Online, Japan
Duration: 10 Oct 202115 Oct 2021

Conference

Conference24th International Conference on Model-Driven Engineering Languages and Systems, MODELS-C 2021
Country/TerritoryJapan
CityVirtual, Online
Period10/10/2115/10/21

Keywords

  • Automation
  • Design To Code
  • Front-end Development
  • Generation
  • Low-Code Platforms
  • OutSystems

Fingerprint

Dive into the research topics of 'Improving Collaboration Efficiency Between UX/UI Designers and Developers in a Low-Code Platform'. Together they form a unique fingerprint.

Cite this