Computation-based aesthetics metrics have been developed to help designers predict visual aesthetics scores for GUI design. However, designers find these evaluative scores difficult to understand. This paper proposed an interpretable aesthetics metric for GUI design that integrates visual aesthetics (visual similarity and spatial proximity) and GUI structure (semantic similarity and white space) to model visual grouping distribution. Two experiments were conducted to validate the metric’s ability to predict aesthetics and interpret outputs. Experiment 1 showed that our metric had a stronger correlation with users’ impressions of GUI visual aesthetics than past metrics. Experiment 2 suggested that our metric was easier to interpret and appeared more useful to Visual/Graphic/GUI designers than a conventional score-based alternative, by visualising the metric outputs as an experimental tool. Furthermore, this paper provided five potential insights to further advance computational aesthetics research.

The user expects webpages of specific categories to have a look-and-feel specific to that category. For example, unlike university homepages, online-shop webpages typically feature relatively little text, a long grid-like structure listing products, and numerous functional elements for product search, filtering, and recommendation. Ensuring that a webpage meets user expectations enhances its prototypicality and has a positive impact on the user’s impression of the webpage. Despite the potential impact on users, the concept of webpage prototypicality has not been fully explored or extensively employed in Human-Computer Interaction (HCI). This paper addresses this gap by conducting a user study with 1530 participants to investigate webpage prototypicality. The study revealed a strong correlation between prototypicality and webpage visual aesthetics, perceived pre-use usability, and trustworthiness. Notably, the direct effect of prototypicality on trustworthiness outweighed the indirect effects through aesthetics and usability. Overall, prototypicality, aesthetics, and usability collectively accounted for 29% to 68% of the variance in trustworthiness, depending on the webpage category. These findings underscore the importance of embracing prototypicality within the field of HCI, encouraging its wider adoption.

Substantial HCI research investigated the relationship between webpage complexity and aesthetics, but without a definitive conclusion. Some research showed an inverse linear correlation, some other showed an inverted u-shaped curve, while the rest showed no relationship at all. Such a lack of clarity complicates hypothesis formulation and result interpretation for future research, and lowers the reliability and generalizability of potential advice for Web design practice. We re-collected complexity and aesthetics ratings for five datasets previously used in webpage aesthetics and complexity research. The results were mixed, but suggested an inverse linear relationship with a weaker u-shaped sub-component. A subsequent visual inspection of revealed several confounding factors that may have led to the mixed results, including some webpages looking broken or archaic. The second data collection showed that accounting for these factors generally eliminates the u-shaped tendency of the complexity-aesthetics relationship, at least, for a relatively homogeneous sample of English-speaking participants.

Effortless reading remains an issue for many Web users, despite a large number of readability guidelines available to designers. This paper presents a study of manual and automatic use of 39 readability guidelines in webpage evaluation. The study collected the ground-truth readability for a set of 50 webpages using eye-tracking with average and dyslexic readers (n = 79). It then matched the ground truth against human-based (n = 35) and automatic evaluations. The results validated 22 guidelines as being connected to readability. The comparison between human-based and automatic results also revealed a complex framework: algorithms were better or as good as human experts at evaluating webpages on specific guidelines - particularly those about low-level features of webpage legibility and text formatting. However, multiple guidelines still required a human judgment related to understanding and interpreting webpage content. These results contribute a guideline categorization laying the ground for future design evaluation methods.

Graphical User Interfaces (GUIs) of low visual complexity tend to have higher aesthetics, usability and accessibility, and result in higher user satisfaction. Despite a few authors recently used or studied visual complexity, the concept of visual complexity still needs to be better defined for the use in HCI research and GUI design, with its underlying aspects systematized and operationalized, and different measures validated. This paper reviews the aspects of GUI visual complexity and operationalizes four aspects with nine computation-based measures in total. Two user studies validated the measures on two types of stimuli - webpages (study 1, n = 55) and book pages (study 2, n = 150) - with two user groups, dyslexics (people with reading difficulties) and typical readers. The same complexity aspects could be expected to determine complexity perception for both GUI types, whereas different complexity aspects could be expected to determine complexity perception for dyslexics, relative to typical readers. However, the studies showed little to no difference between dyslexics and average readers, whereas web pages did differ from book pages in what aspects made them seem complex. It was not the intergroup differences, but the stimulus type that defined criteria to judge visual complexity. Future research and visual design could rely on the visual complexity aspects outlined in this paper.

Although the HCI community inevitably contributes to engagement via beauty according to the attention paid to known and yet to be discovered principles of aesthetics for digital interface design, it is lacking an epistemological corpus which should include the notion, human factors and the quantification of aesthetic aspects. The aim of the proposed workshop is to discuss these issues in order to strengthen aesthetic studies specifically for HCI and related fields. We want to create a forum for discussing, drafting and promoting the foundations for disciplined aesthetics design within the HCI community. We thus welcome contributions such as theories, methodologies, evaluation methods, and potential applications regarding effective aesthetics for HCI and related fields. Concretely, we aim to (i) map the present state-of-art of aesthetic research in HCI, (ii) build a multidisciplinary community of experts, and (iii) raise the profile of this aesthetics research area within HCI community.

Reading is fundamental to interactive-system use, but around 800 million of people might struggle with it due to literacy difficulties. Few websites are designed for high readability, as readability remains an underinvestigated facet of User Experience. Existing readability guidelines have multiple issues: they are too many or too generic, poorly worded, and often lack cognitive grounding. This paper developed a set of 61 readability guidelines in a series of workshops with design and dyslexia experts. A user study with dyslexic and average readers further narrowed the 61-guideline set down to a core set of 12 guidelines -- an acceptably small set to keep in mind while designing. The core-set guidelines address reformatting -- such as using larger fonts and narrower content columns, or avoiding underlining and italics -- and may well aply to the interactive system other than websites.

Almost any search on Google Play returns numerous app suggestions. The user quickly skims through the list and picks a few apps for a closer look. The vast majority of the apps regardless of how well-made they are go unnoticed. App icons uniquely represent each app in Google Play and help apps to get noticed, as we demonstrate in the paper. We reviewed the visual qualities of icons that could make them noticeable and likable. We then computationally measured two of the qualities visual saliency and complexity for 930 icons and linked the computed scores to app popularity (the number of app ratings and installs). The measures explained 38% of variance in the number of ratings, if app genre was accounted for. Not only does such result assert the link between icon properties and app popularity, it also highlights the automatic prediction of app popularity as a promising research direction. HCI researchers, app creators and Google Play (or another mobile marketplace) will benefit from the paper insights on what antecedes app success and how to measure the antecedents.

People prefer attractive interfaces. Designers strive to outmatch competitors, and create apps and websites that stand out. However, significant expenses on design are unaffordable to small companies; instead, they could adopt automatic tools of interface aesthetics evaluation, a cheaper strategy to good design. This paper describes an important step towards such a tool; it presents eight automatic metrics of graphical user interface (GUI) aesthetics. We tested the metrics in two exploratory studies -- on desktop webpages (N = 62) and on iPhone apps (N = 53) -- and found them to function on both GUI types and for both immediate (150ms exposure) and deliberate (4s exposure) aesthetics impressions. Our best-fit regression models explained up to 49% of variance in webpage aesthetics and up to 32% (if app genre is considered) of variance in iPhone app aesthetics. These results confirm past results and suggest the metrics are valid and reliable enough to be widely discussed, and possibly, to be embedded in our prospective GUI evaluation tool, tLight.

Designers strive for enjoyable user experience (UX) and put a significant effort into making graphical user interfaces (GUI) both usable and beautiful. Our goal is to minimize their effort: with this purpose in mind, we have been studying automatic metrics of GUI qualities. These metrics could enable designers to iterate their designs more quickly. We started from the psychological findings that people tend to prefer simpler things. We then assumed visual complexity determinants also determine visual aesthetics and outlined eight of them as belonging to three dimensions: information amount (visual clutter and color variability), information organization (symmetry, grid, ease-of-grouping and prototypicality), and information discriminability (contour density and figure-ground contrast). We investigated five determinants (visual clutter, symmetry, contour density, figure-ground contrast and color variability) and proposed six associated automatic metrics. These metrics take screenshots of GUI as input and can thus be applied to any type of GUI. We validated the metrics through a user study: we gathered the ratings of immediate impressions of GUI visual complexity and aesthetics, and correlated them with the output of the metrics. The output explained up to 51% of aesthetics ratings and 50% of complexity ratings. This promising result could be further extended towards the creation of tLight, our automatic GUI evaluation tool.