Optimization approaches for graphical layout design

Morteza Shiripour

Research output: ThesisDoctoral ThesisCollection of Articles

Abstract

The graphical user interface (GUI) is the most frequently used method of communicating with computers. These interfaces employ graphical components rather than either pure command lines or natural language for the purpose of interaction. A well-designed GUI is critical for improving the interaction's efficacy and utility. Currently, the process of developing GUIs is primarily a manual one that is time-consuming and difficult, and the final product depends greatly on designer competence. Furthermore, the large design space of alternative designs complicates manual design. For example, the number of distinct positions possible for placing five elements on a common canvas of 1024 X 768 pixels (for simplicity, suppose the canvas is divided into 32 X 24 pixels) is approximately 2.6e+14. Whereas analyzing these solutions manually would demand large amounts of time and effort, the thesis examines the alternative of developing computational methods (e.g., mathematical models, deep learning, and heuristic algorithms) and their integration into the design process, for purposes of addressing the inherent complexity of manual design. Several models and algorithms are proposed that automate aspects of the GUI-design process.In one method, a grid operator is presented to a non-dominated-sorting genetic algorithm for graphical layout problems. These grid operators create some vertical and horizontal lines using the fixed elements. The remaining unfixed elements are then inserted between these lines. This procedure ultimately results in the satisfaction of overlap-related constraints and better element alignment, thus fulfilling one of the main objectives of a designer organizing layout elements. The second method developed, which involves a deep neural network estimating Web pages' visual appeal, could serve objective-function approximation that informs evaluating a given design's aesthetics. Results from a deep neural network developed in the doctoral project attest to the ensuing model's ability to predict the ratings that people with diverse demographic backgrounds would give the Web page shown. For the last method, empirical evaluation of a novel integer-programming formulation for menu systems was designed and implemented. The optimized design exhibited increased efficiency: user interactions were around 25% quicker than with non-optimized commercial designs. Along with the project's contribution, the thesis discusses the future work required for solving GUI problems from both a theoretical and a practical standpoint.
Translated title of the contributionOptimization approaches for graphical layout design
Original languageEnglish
QualificationDoctor's degree
Awarding Institution
  • Aalto University
Supervisors/Advisors
  • Oulasvirta, Antti, Supervising Professor
Publisher
Print ISBNs978-952-64-0990-0
Electronic ISBNs978-952-64-0991-7
Publication statusPublished - 2022
MoE publication typeG5 Doctoral dissertation (article)

Keywords

  • optimization
  • graphical design

Fingerprint

Dive into the research topics of 'Optimization approaches for graphical layout design'. Together they form a unique fingerprint.

Cite this