Interactive Layout Transfer

Niraj Dayama*, Simo Santala, Lukas Brückner, Kashyap Todi, Jingzhou Du, Antti Oulasvirta

*Corresponding author for this work

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

Abstract

During the design of graphical user interfaces (GUIs), one typical objective is to ensure compliance with pertinent style guides, ongoing design practices, and design systems. However, designing compliant layouts is challenging, time-consuming, and can distract creative thinking in design. This paper presents a method for interactive layout transfer, where the layout of a source design – typically an initial rough working draft – is transferred automatically using a selected reference/template layout while complying with relevant guidelines. Our integer programming (IP) method extends previous work in two ways: first, by showing how to transform a rough draft into the final target layout using a reference template and, second, by extending IP-based approaches to adhere to guidelines. We demonstrate how to integrate the method into a real-time interactive GUI sketching tool. Evaluation results are presented from a case study and from an online experiment where the perceived quality of layouts was assessed.
Original languageEnglish
Title of host publicationACM IUI Conference on Intelligent User Interfaces
PublisherACM
Number of pages11
DOIs
Publication statusAccepted/In press - 2021
MoE publication typeA4 Article in a conference publication
EventInternational Conference on Intelligent User Interfaces - Virtual, Online, College Station, United States
Duration: 13 Apr 202117 Apr 2021
Conference number: 26

Conference

ConferenceInternational Conference on Intelligent User Interfaces
Abbreviated titleIUI
CountryUnited States
CityCollege Station
Period13/04/202117/04/2021

Keywords

  • User Interface Design
  • Computational Methods
  • MILP
  • Optimisation
  • Style Transfer

Fingerprint Dive into the research topics of 'Interactive Layout Transfer'. Together they form a unique fingerprint.

Cite this