Abstract
The metric-based evaluation of user interfaces is a promising way to quickly evaluate their usability and other various design aspects. However, development of such metrics usually requires a sufficiently large training set of realistic-looking user interface samples, which might not be always easy to find. This paper describes a workflow of the preparation of such samples. It presents a configurable generator based on the composition of simple widgets into a screen according to a predefined model. It also describes a reusable library for simple creation of widgets using capabilities of the JavaScript framework Vue.js. The application of the implemented generator is then demonstrated on the generation of dashboard samples which are used to show the significance of color in the measuring of the layout balance.
This is a preview of subscription content, log in via an institution to check access.
Access this chapter
Tax calculation will be finalised at checkout
Purchases are for personal use only
Notes
- 1.
- 2.
The full form with the samples: http://www.fit.vutbr.cz/~ipastushenko/research/balance.php.
References
Altaboli, A., Lin, Y.: Investigating effects of screen layout elements on interface and screen design aesthetics. In: Advances in Human-Computer Interaction 2011, 5 (2011)
Bauerly, M., Liu, Y.: Effects of symmetry and number of compositional elements on interface and design aesthetics. Int. J. HCI 24(3), 275–287 (2008)
Charfi, S., Trabelsi, A., Ezzedine, H., Kolski, C.: Widgets dedicated to user interface evaluation. Int. J. HCI 30(5), 408–421 (2014)
Few, S.: Information Dashboard Design. O’Reilly Media, Sebastopol (2006)
Hollingsed, T., Novick, D., G.: Usability inspection methods after 15 years of research and practice. In: Proceedings of the 25th annual ACM international conference on Design of communication, pp. 249–255. ACM, October 2007
Holmes, S.: Getting MEAN With Mongo, Express, Angular, and Node. Manning Publications Co, New York (2015)
Hynek, J., Hruška, T.: Pixel-based analysis of information dashboard attributes. In: East European Conference on Advances in Databases and Information Systems, pp. 29–36. Springer International Publishing, August 2016
Jäkel, F., Singh, M., Wichmann, F.A., Herzog, M.H.: An overview of quantitative approaches in Gestalt perception. Vis. Res. 126, 3–8 (2016)
Johnson, J.: Designing With the Mind in Mind: Simple Guide to Understanding User Interface Design Guidelines. Elsevier, Amsterdam (2013)
Lindgaard, G., Fernandes, G., Dudek, C., Brown, J.: Attention web designers: You have 50 milliseconds to make a good first impression! Behav. Information. Technol. 25(2), 115–126 (2006)
Ngo, D.C.L., Teo, L.S., Byrne, J.G.: Modelling interface aesthetics. Inf. Sci. 152, 25–46 (2003)
Nielsen, J.: Usability Engineering. Elsevier, Amsterdam (1994)
Nielsen, J.: Usability inspection methods. In: Conference companion on Human factors in computing systems, pp. 413–414. ACM, April 1994
Reinecke, K., Yeh, T., Miratrix, L., Mardiko, R., Zhao, Y., Liu, J., Gajos, K.Z.: Predicting users’ first impressions of website aesthetics with a quantification of perceived visual complexity and colorfulness. In: Proceedings of the SIGCHI Conference on Human Factors in Computing Systems, pp. 2049–2058. ACM, April 2013
Rogers, Y., Sharp, H., Preece, J.: Interaction Design: Beyond Human-Computer Interaction. Wiley, New York (2011)
Salimun, C., Purchase, H.C., Simmons, D.R., Brewster, S.: Preference ranking of screen layout principles. In: Proceedings of the 24th BCS Interaction Specialist Group Conference, pp. 81–87. British Computer Society, September 2010
Tractinsky, N., Katz, A.S., Ikar, D.: What is beautiful is usable. Interact. Comput. 13(2), 127–145 (2000)
Tufte, E.R.: The Visual Display of Quantitative Information. Graphic Press, Cheshire (2001)
Ware, C.: Information Visualization: Perception for Design. Elsevier, Amsterdam (2012)
Zen, M., Vanderdonckt, J.: Towards an evaluation of graphical user interfaces aesthetics based on metrics. In: 2014 IEEE Eighth International Conference on Research Challenges in Information Science (RCIS), pp. 1–12. IEEE, May 2014
Acknowledgments
This work was supported by The Ministry of Education, Youth and Sports from the National Programme of Sustainability (NPU II) project “IT4Innovations excellence in science - LQ1602”.
Author information
Authors and Affiliations
Corresponding author
Editor information
Editors and Affiliations
Rights and permissions
Copyright information
© 2018 Springer International Publishing AG, part of Springer Nature
About this paper
Cite this paper
Pastushenko, O., Hynek, J., Hruška, T. (2018). Generation of Test Samples for Construction of Dashboard Design Guidelines: Impact of Color on Layout Balance. In: Rocha, Á., Adeli, H., Reis, L., Costanzo, S. (eds) Trends and Advances in Information Systems and Technologies. WorldCIST'18 2018. Advances in Intelligent Systems and Computing, vol 746. Springer, Cham. https://doi.org/10.1007/978-3-319-77712-2_93
Download citation
DOI: https://doi.org/10.1007/978-3-319-77712-2_93
Published:
Publisher Name: Springer, Cham
Print ISBN: 978-3-319-77711-5
Online ISBN: 978-3-319-77712-2
eBook Packages: EngineeringEngineering (R0)