skip to main content
10.1145/3596454.3597189acmconferencesArticle/Chapter ViewAbstractPublication PageseicsConference Proceedingsconference-collections
demonstration

The Guizmo Framework for Generating Final User Interfaces from Wireframes

Published: 27 June 2023 Publication History

Abstract

We demonstrate Guizmo, a model-driven engineering framework aimed at generating final graphical user interfaces from wireframes according to the following process: (1) design a concrete user interface in a wireframe tool, (2) export/import the wireframe definition into Guizmo for generation of a wireframe model, (3) for segmenting the wireframe into regions by region detection, (4) for inferring positions and dimensions of individual interface elements, (5) in order to obtain a complete layout model that is used for generating the code of a final user interface by model-to-code generation.

References

[1]
James F. Allen. 1983. Maintaining Knowledge about Temporal Intervals. Commun. ACM 26, 11 (nov 1983), 832–843. https://doi.org/10.1145/182.358434
[2]
Nathalie Aquino, Jean Vanderdonckt, Nelly Condori-Fernández, Óscar Dieste, and Óscar Pastor. 2010. Usability Evaluation of Multi-Device/Platform User Interfaces Generated by Model-Driven Engineering. In Proceedings of the ACM-IEEE International Symposium on Empirical Software Engineering and Measurement (Bolzano-Bozen, Italy) (ESEM ’10). Association for Computing Machinery, New York, NY, USA, Article 30, 10 pages. https://doi.org/10.1145/1852786.1852826
[3]
Abdo Beirekdar, Jean Vanderdonckt, and Monique Noirhomme-Fraiture. 2002. A Framework and a Language for Usability Automatic Evaluation of Web Sites by Static Analysis of HTML Source Code. In Computer-Aided Design of User Interfaces III, Proceedings of the Fourth International Conference on Computer-Aided Design of User Interfaces, May, 15-17, 2002, Valenciennes, France, Christophe Kolski and Jean Vanderdonckt (Eds.). Kluwer, 337–348.
[4]
L. Bouillon, Q. Limbourg, J. Vanderdonckt, and B. Michotte. 2005. Reverse engineering of Web pages based on derivations and transformations. In Proceedings of the Third Latin American Web Congress (Buenos Aires, Argentina) (LA-WEB 2005). 11 pp.–. https://doi.org/10.1109/LAWEB.2005.29
[5]
Ahmet Selman Bozkir and Ebru Akcapinar Sezer. 2018. Layout-based computation of web page similarity ranks. International Journal of Human-Computer Studies 110 (2018), 95–114. https://doi.org/10.1016/j.ijhcs.2017.10.008
[6]
Javier Luis Cánovas Izquierdo and Jesús García Molina. 2009. A Domain Specific Language for Extracting Models in Software Modernization. In Model Driven Architecture - Foundations and Applications, Richard F. Paige, Alan Hartman, and Arend Rensink (Eds.). Springer Berlin Heidelberg, Berlin, Heidelberg, 82–97.
[7]
Adrien Coyette, Sascha Schimke, Jean Vanderdonckt, and Claus Vielhauer. 2007. Trainable Sketch Recognizer for Graphical User Interface Design. In Human-Computer Interaction - INTERACT 2007, 11th IFIP TC 13 International Conference, Rio de Janeiro, Brazil, September 10-14, 2007, Proceedings, Part I(Lecture Notes in Computer Science, Vol. 4662), Maria Cecília Calani Baranauskas, Philippe A. Palanque, Julio Abascal, and Simone Diniz Junqueira Barbosa (Eds.). Springer, 124–135. https://doi.org/10.1007/978-3-540-74796-3_14
[8]
Harsh Dave, Sarah Sonje, Jaswantsingh Pardeshi, Sheetal Chaudhari, and Pooja Raundale. 2021. A survey on Artificial Intelligence based techniques to convert User Interface design mock-ups to code. In Proceedings of International Conference on Artificial Intelligence and Smart Systems (Coimbatore, India) (ICAIS ’21). 28–33. https://doi.org/10.1109/ICAIS50930.2021.9395994
[9]
Abner Augusto Lima de Oliveira and Cidcley Teixeira de Souza. 2017. Paper Prototyping in a Model-Driven Process for Android Application Simulation Support. In Proceedings of the XXXI Brazilian Symposium on Software Engineering (Fortaleza, CE, Brazil) (SBES ’17). Association for Computing Machinery, New York, NY, USA, 267–272. https://doi.org/10.1145/3131151.3131192
[10]
Thisaranie Kaluarachchi and Manjusri Wickramasinghe. 2023. A systematic literature review on automatic website generation. Journal of Computer Languages 75 (2023), 101202. https://doi.org/10.1016/j.cola.2023.101202
[11]
Vinoth Pandian Sermuga Pandian, Sarah Suleri, Christian Beecks, and Matthias Jarke. 2020. MetaMorph: AI Assistance to Transform Lo-Fi Sketches to Higher Fidelities. In Proceedings of the 32nd Australian Conference on Human-Computer-Interaction (Sydney, NSW, Australia) (OzCHI ’20), Naseem Ahmadpour, Tuck Wah Leong, Bernd Ploderer, Callum Parker, Sarah Webber, Diego Muñoz, Lian Loke, and Martin Tomitsch (Eds.). ACM, 403–412. https://doi.org/10.1145/3441000.3441030
[12]
Irfan Prazina, Šeila Bećirović, Emir Cogo, and Vensada Okanović. 2023. Methods for Automatic Web Page Layout Testing and Analysis: A Review. IEEE Access 11 (2023), 13948–13964. https://doi.org/10.1109/ACCESS.2023.3242549
[13]
Kênia Soares Sousa, Hildeberto Mendonça Filho, Jean Vanderdonckt, Els Rogier, and Joannes Vandermeulen. 2008. User interface derivation from business processes: a model-driven approach for organizational engineering. In Proceedings of the ACM Symposium on Applied Computing (Fortaleza, Ceara, Brazil) (SAC ’08), Roger L. Wainwright and Hisham Haddad (Eds.). ACM, 553–560. https://doi.org/10.1145/1363686.1363821

Recommendations

Comments

Information & Contributors

Information

Published In

cover image ACM Conferences
EICS '23 Companion: Companion Proceedings of the 2023 ACM SIGCHI Symposium on Engineering Interactive Computing Systems
June 2023
104 pages
ISBN:9798400702068
DOI:10.1145/3596454
Permission to make digital or hard copies of part or all of this work for personal or classroom use is granted without fee provided that copies are not made or distributed for profit or commercial advantage and that copies bear this notice and the full citation on the first page. Copyrights for third-party components of this work must be honored. For all other uses, contact the Owner/Author.

Sponsors

Publisher

Association for Computing Machinery

New York, NY, United States

Publication History

Published: 27 June 2023

Check for updates

Author Tags

  1. Model-based user interface design
  2. model-driven engineering
  3. model-to-code generation
  4. model-to-model transformation
  5. wireframes

Qualifiers

  • Demonstration
  • Research
  • Refereed limited

Conference

EICS '23
Sponsor:

Acceptance Rates

Overall Acceptance Rate 73 of 299 submissions, 24%

Upcoming Conference

Contributors

Other Metrics

Bibliometrics & Citations

Bibliometrics

Article Metrics

  • 0
    Total Citations
  • 63
    Total Downloads
  • Downloads (Last 12 months)24
  • Downloads (Last 6 weeks)5
Reflects downloads up to 20 Jan 2025

Other Metrics

Citations

View Options

Login options

View options

PDF

View or Download as a PDF file.

PDF

eReader

View online with eReader.

eReader

HTML Format

View this article in HTML Format.

HTML Format

Media

Figures

Other

Tables

Share

Share

Share this Publication link

Share on social media