research-article

Computation of Interface Aesthetics

Authors:

Aliaksei Miniukovich,

Antonella De AngeliAuthors Info & Claims

CHI '15: Proceedings of the 33rd Annual ACM Conference on Human Factors in Computing Systems

Pages 1163 - 1172

https://doi.org/10.1145/2702123.2702575

Published: 18 April 2015 Publication History

Abstract

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.

References

[1]

Armstrong, T. and Detweiler-Bedel, B. Beauty as an emotion: the exhilarating prospect of mastering a challenging world. Review of general psychology, 12, 4 (2008), 305--329.

[2]

Balinsky, H. Evaluating interface aesthetics: measure of symmetry. In Digital Publishing Conference (San Jose 2006), International Society for Optics and Photonics.

[3]

Balinsky, H. Y., Wiley, A. J., & Roberts, M. C. Aesthetic measure of alignment and regularity. In the 9th ACM symposium on Document Engineering (Munich 2009), ACM, 56--65.

Digital Library

[4]

Cao, J., Mao, B., and Luo, J. A segmentation method for web page analysis using shrinking and dividing. International Journal of Parallel, Emergent and Distributed Systems, 25, 2 (2010), 93--104.

Digital Library

[5]

Choi, J. H. and Lee, H. J. Facets of simplicity for the smartphone interface: A structural model. International Journal of Human-Computer Studies, 70, 2 (2012), 129--142.

Digital Library

[6]

De Angeli, A., Sutcliffe, A., and Hartmann, J. Interaction, usability and aesthetics: what influences users' preferences? In the 6th conference on Designing Interactive systems (2006), ACM, 271--280.

Digital Library

[7]

Fei-Fei, L., Iyer, A., Koch, C., and Perona, P. What do we perceive in a glance of a real-world scene? Journal of vision, 7, 1 (2007), 1--29.

[8]

Gartus, A. and Leder, H. The small step toward asymmetry: Aesthetic judgment of broken symmetries. i-Perception, 4, 5 (2013), 352--355.

[9]

Hall, R. H. and Hanna, P. The impact of web page textbackground colour combinations on readability, retention, aesthetics and behavioural intention. Behaviour & information technology, 23, 3 (2004), 183--195.

[10]

Harper, S., Michailidou, E., and Stevens, R. Toward a definition of visual complexity as an implicit measure of cognitive load. ACM Transactions on Applied Perception, 6, 2 (2009).

Digital Library

[11]

Ivory, M. Y., Sinha, R. R., and Hearst, M. A. Empirically validated web page design metrics. In Proceedings of the SIGCHI conference on Human factors in computing systems (2001), ACM, 53--60.

Digital Library

[12]

Kim, H. and Fesenmaier, D. R. Persuasive design of destination web sites: An analysis of first impression. Journal of Travel Research., 47, 1 (2008), 3--13.

[13]

Lee, S. and Koubek, R. J. Understanding user preferences based on usability and aesthetics before and after actual use. Interacting with Computers, 22, 6 (2010), 530--543.

Digital Library

[14]

Lindgaard, G., Fernandes, G., Dudek, C., and Brown, J. Attention web designers: You have 50 milliseconds to make a good first impressoin! Behavior & information technology, 25, 2 (2006), 115--126.

[15]

Michailidou, E., Harper, S., and Bechhofer, S. Visual complexity and aesthetic perception of web pages. In the 26th annual ACM international conference on Design of communication (2008), ACM, 215--224.

Digital Library

[16]

MiniUnited Kingdomovich, A., De Angeli A. Quantification of Interface Visual Complexity. In the 2014 International Working Conference on Advanced Visual Interfaces (2014), ACM, 153--160.

Digital Library

[17]

MiniUnited Kingdomovich, A., De Angeli A. Visual Impression of Mobile App Interfaces. In Proceedings of the 8th Nordic Conference on Human-Computer Interaction: Fun, Fast, Foundational (2014), ACM, 31--40.

Digital Library

[18]

Nadkarni, S. and Gupta, R. A Task-Based Model of Perceived Website Complexity. Mis Quarterly, 31, 3 (2007).

Digital Library

[19]

Ngo, D. C. L., Teo, L. S., and Byrne, J. G. Modelling interface aesthetics. Information Sciences, 152 (2003), 25--46.

Digital Library

[20]

Oliva, A., Mack, M. L., Shrestha, M., and Peeper, A. Identifying the perceptual dimensions of visual complexity of scenes. In the 26th Annual Meeting of the Cognitive Science Society (2004).

[21]

Purchase, H. C., Freeman, E., and Hamer, J. An exploration of visual complexity. Digrammatic representation and inferences (2012), 200--213.

Digital Library

[22]

Purchase, H. C., Hamer, J., Jameson, A., and Ryan, O. Investigating objective measures of web page aesthetics and usability. In 12th Australasian user interface conference (AUIC 2011) (2011), Australian computer society, Inc., 19--28.

Digital Library

[23]

Reber, R., Schwarz, N., and Winkielman, P. Processing fluency and aesthetic pleasure: is beauty in the perceiver's processing experience? Personality and social psychology review, 8, 4 (2004), 364--382.

[24]

Reber, R., Winkielman, P., and Schwarz, N. Effects of perceptual fluency on affective judgments. Psychological science, 9, 5 (1998), 45--48.

[25]

Reinecke, K. and Gajos, K. Z. Quantifying visual preferences around the world. In the 32nd annual ACM conference on Human factors in computing systems ( 2014), ACM.

Digital Library

[26]

Reinecke, K., Yeh, T., Miratrix, L., Mardiko, R., Zhao, Y., and Liu, J., Gajos, K. Z. Predicting users' first impressions of website aesthetics with a quantification of perceived visual complexity and colorfulness. In CHI (2013), ACM, 2049--2058.

Digital Library

[27]

Rosenholtz, R., Li, Y., and Nakano, L. Measuring visual clutter. Journal of vision, 7, 2 (2007), 1--22.

[28]

Sereno, S. C. and Rayner, K. Measuring word recognition in reading: eye movements and eventrelated potentials. Trends in cognitive sciences, 7, 11 (2003), 489--493.

[29]

Sonderegger, A., Zbinden, G., Uebelbacher, A., and Sauer, J. The influence of product aesthetics and usability over the course of time: a longitudinal field experiment. Ergonomics, 55 (2012), 713--730.

[30]

Thielsch, M. T., Blotenberg, I., and Jaron, R. User evaluation of websites: From first impression to recommendation. Interacting with Computers, 26, 1 (2013), 89--102.

[31]

Tinio, P. P. and Leder, H. Just how stable are stable aesthetic features? Symmetry, complexity, and the jaws of massive familiarization. Acta Psychologica, 130, 3 (2009), 241--250.

[32]

Tractinsky, N. Visual Aesthetics. In Soegaard, Mads and Dam, Rikke Friis, eds., The Encyclopedia of Human-Computer Interaction, 2nd Ed. The InteractionDesign.org Foundation, Aarhus, 2013.

[33]

Tractinsky, N., Cokhavi, A., Kirschenbaum, M., and Sharfi, T. Evaluating the consistency of immediate aesthetic perceptions of web pages. International journal of human-computer studies, 64, 11 (2006), 1071--1083.

Digital Library

[34]

Tuch, A. N., Bargas-Avila, J. A., and Opwis, K. Symmetry and aesthetics in website design: It's a man's business. Computers in Human Behavior, 26, 6 (2010), 1831--1837.

Digital Library

[35]

Tuch, A. N., Bargas-Avila, J. A., Opwis, K., and Wilhelm, F. H. Visual complexity of websites: effects on users' experience, physiology, perfomance, and memory. International journal of human-computer studies, 67 (2009), 703--715.

Digital Library

[36]

Tuch, A. N., Presslaber, E. E., Stocklin, M., Opwis, K., and Bargas-Avila, J. A. The role of visual complexity and prototypicality regarding first impression of websites: Working towards understanding aesthetic judgments. International Journal of Human-Computer Studies, 70 (2012), 794--811.

Digital Library

[37]

Van Den Berg, R., Cornelissen, F. W., and Roerdink, J. B. A crowding model of visual clutter. Journal of Vision, 9, 4 (2009), 1--11.

[38]

Van Schaik, P. and Ling, J. The role of context in perceptions of the aesthetics of web pages over time. International Journal of Human-Computer Studies, 67, 1 (2009), 79--89.

Digital Library

[39]

Wu, O., Hu, W., and Shi, L. Measuring the visual complexities of Web pages. ACM Transactions on the Web (TWEB), 7, 1 (2013), 1--34.

Digital Library

[40]

Zheng, X. S., Chakraborty, I., Lin, J. J. W., and Rauschenberger, R. Correlating low-level image statistics with users-rapid aesthetic and affective judgments of web pages. In SIGCHI Conference on Human Factors in Computing Systems ( 2009), ACM, 1--10

Digital Library

Cited By

Wu JPeng YLi XSwearngin ABigham JNichols J(2024)UIClip: A Data-driven Model for Assessing User Interface DesignProceedings of the 37th Annual ACM Symposium on User Interface Software and Technology10.1145/3654777.3676408(1-16)Online publication date: 13-Oct-2024
https://dl.acm.org/doi/10.1145/3654777.3676408
Haddad SLatifzadeh KDuraisamy SVanderdonckt JDaassi OBelghith SLeiva L(2024)Good GUIs, Bad GUIs: Affective Evaluation of Graphical User InterfacesProceedings of the 32nd ACM Conference on User Modeling, Adaptation and Personalization10.1145/3627043.3659549(232-243)Online publication date: 22-Jun-2024
https://dl.acm.org/doi/10.1145/3627043.3659549
S Bhowmick SChen SSrivastava DBarcelo PSanchez-Pi NMeliou ASudarshan S(2024)Cognitive Psychology Meets Data Management: State of the Art and Future DirectionsCompanion of the 2024 International Conference on Management of Data10.1145/3626246.3654682(590-596)Online publication date: 9-Jun-2024
https://dl.acm.org/doi/10.1145/3626246.3654682
Show More Cited By

Index Terms

Computation of Interface Aesthetics
1. Human-centered computing
  1. Human computer interaction (HCI)
    1. HCI design and evaluation methods
    2. Interaction paradigms
      1. Graphical user interfaces

Recommendations

Quantification of interface visual complexity
AVI '14: Proceedings of the 2014 International Working Conference on Advanced Visual Interfaces

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 ...
Haptic interface aesthetics: 'feedback loops, live coding and how to harness the potential of embodied estrangement in artistic practices and aesthetic theories within interface culture'
DUXU'13: Proceedings of the Second international conference on Design, User Experience, and Usability: design philosophy, methods, and tools - Volume Part I

This article describes interface aesthetics from a trans-disciplinary perspective and reports on the findings of research into haptic interfaces through discussion of a series of prototypes and their potential as &'critical' design as opposed to &'...
Evaluating interface esthetics

Gestalt psychologists promulgated the principles of visual organization in the early twentieth century. These principles have been discussed and re-emphasized, and their importance and relevance to user interface design are understood. However, a ...

Comments

Information & Contributors

Information

Published In

cover image ACM Conferences

CHI '15: Proceedings of the 33rd Annual ACM Conference on Human Factors in Computing Systems

April 2015

4290 pages

ISBN:9781450331456

DOI:10.1145/2702123

General Chairs:
Bo Begole
Huawei, USA
,
Jinwoo Kim
Yonsei University, Korea
,
Program Chairs:
Kori Inkpen
Microsoft Research, USA
,
Woontack Woo
KAIST, Korea

Copyright © 2015 ACM.

Permission to make digital or hard copies of all or part 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 components of this work owned by others than the author(s) must be honored. Abstracting with credit is permitted. To copy otherwise, or republish, to post on servers or to redistribute to lists, requires prior specific permission and/or a fee. Request permissions from [email protected].

Sponsors

SIGCHI: ACM Special Interest Group on Computer-Human Interaction

Publisher

Association for Computing Machinery

New York, NY, United States

Publication History

Published: 18 April 2015

Permissions

Request permissions for this article.

Request Permissions

Check for updates

Author Tags

Qualifiers

Research-article

Conference

CHI '15

Sponsor:

SIGCHI

CHI '15: CHI Conference on Human Factors in Computing Systems

April 18 - 23, 2015

Seoul, Republic of Korea

Acceptance Rates

CHI '15 Paper Acceptance Rate 486 of 2,120 submissions, 23%;

Overall Acceptance Rate 6,199 of 26,314 submissions, 24%

Upcoming Conference

CHI '25

Sponsor:
sigchi

CHI Conference on Human Factors in Computing Systems

April 26 - May 1, 2025

Yokohama , Japan

Contributors

Other Metrics

View Article Metrics

Bibliometrics & Citations

Bibliometrics

Article Metrics

59
Total Citations
View Citations
1,431
Total Downloads

Downloads (Last 12 months)162
Downloads (Last 6 weeks)19

Reflects downloads up to 06 Nov 2024

Other Metrics

View Author Metrics

Citations

Cited By

Wu JPeng YLi XSwearngin ABigham JNichols J(2024)UIClip: A Data-driven Model for Assessing User Interface DesignProceedings of the 37th Annual ACM Symposium on User Interface Software and Technology10.1145/3654777.3676408(1-16)Online publication date: 13-Oct-2024
https://dl.acm.org/doi/10.1145/3654777.3676408
Haddad SLatifzadeh KDuraisamy SVanderdonckt JDaassi OBelghith SLeiva L(2024)Good GUIs, Bad GUIs: Affective Evaluation of Graphical User InterfacesProceedings of the 32nd ACM Conference on User Modeling, Adaptation and Personalization10.1145/3627043.3659549(232-243)Online publication date: 22-Jun-2024
https://dl.acm.org/doi/10.1145/3627043.3659549
S Bhowmick SChen SSrivastava DBarcelo PSanchez-Pi NMeliou ASudarshan S(2024)Cognitive Psychology Meets Data Management: State of the Art and Future DirectionsCompanion of the 2024 International Conference on Management of Data10.1145/3626246.3654682(590-596)Online publication date: 9-Jun-2024
https://dl.acm.org/doi/10.1145/3626246.3654682
Jiang YZhou CGarg VOulasvirta A(2024)Graph4GUI: Graph Neural Networks for Representing Graphical User InterfacesProceedings of the 2024 CHI Conference on Human Factors in Computing Systems10.1145/3613904.3642822(1-18)Online publication date: 11-May-2024
https://dl.acm.org/doi/10.1145/3613904.3642822
Xiang WZhu HLou SChen XPan ZJin YChen SSun L(2024)SimUser: Generating Usability Feedback by Simulating Various Users Interacting with Mobile ApplicationsProceedings of the 2024 CHI Conference on Human Factors in Computing Systems10.1145/3613904.3642481(1-17)Online publication date: 11-May-2024
https://dl.acm.org/doi/10.1145/3613904.3642481
Lee LYau YHui P(2024)Perceived User Reachability in Mobile UIs Using Data Analytics and Machine LearningInternational Journal of Human–Computer Interaction10.1080/10447318.2024.2327199(1-24)Online publication date: 25-Mar-2024
https://doi.org/10.1080/10447318.2024.2327199
Wang CMiniukovich ARen X(2024)An interpretable metric of visual aesthetics for GUI designBehaviour & Information Technology10.1080/0144929X.2024.2325030(1-15)Online publication date: 29-Feb-2024
https://doi.org/10.1080/0144929X.2024.2325030
Bakaev MHeil SGaedke M(2023)A Reasonable Effectiveness of Features in Modeling Visual Perception of User InterfacesBig Data and Cognitive Computing10.3390/bdcc70100307:1(30)Online publication date: 8-Feb-2023
https://doi.org/10.3390/bdcc7010030
Ma JS Bhowmick SChoi BTay L(2023)Theories and Principles Matter: Towards Visually Appealing and Effective Abstraction of Property Graph QueriesProceedings of the ACM on Management of Data10.1145/35892771:2(1-26)Online publication date: 20-Jun-2023
https://dl.acm.org/doi/10.1145/3589277
Eisbach SDaugs FThielsch MBöhmer MHertel G(2023)Predicting Rating Distributions of Website Aesthetics with Deep Learning for AI-Based ResearchACM Transactions on Computer-Human Interaction10.1145/356988930:3(1-28)Online publication date: 10-Jun-2023
https://dl.acm.org/doi/10.1145/3569889
Show More Cited By

View Options

Get Access

Login options

Check if you have access through your login credentials or your institution to get full access on this article.

Full Access

Get this Publication

View options

PDF

View or Download as a PDF file.

eReader

View online with eReader.

Media

Figures

Other

Tables

View Table of Contents