An Analysis of the Application of Color in Designing User interface in Educational Websites: A Meta-Synthesis Approach

Articles in Press

Document Type : Review Article

Authors

• Hadiseh Heidari ¹
• Raheleh Karimian ²
• Yaghoub Norouzi ³

¹ Ph.D Student in Knowledge and Information Science, Alzahra University, Tehran, Iran.

² Ph.D Student in Knowledge and Information Science, Qom University, Qom, Iran.

³ Professor of Knowledge and information science, Qom University, Iran.

10.22067/infosci.2024.86371.1193

Abstract

Purpose: Color is one of the most important elements of any user interface and plays an important role in user interface design. So, it is used as a means for communicating and engaging with users on the websites. The main aim of this research is to analyze the use of color in the design of the user interface of educational websites with based on meta-synthesis approach.

Methodology: This study was done using a qualitative method and a meta-synthesis approach. The seven-stage model devised by Sandelowski and Barroso (2007) was employed for collecting the needed data. Out of the 184 retrieved articles and theses, 27 works were selected and analyzed. Thematic content analysis was then employed for coding and categorizing the findings. The statistical population includes articles and theses on the user interface of educational websites, extracted from domestic and international scientific databases in Persian language from 1390 to 1402 and in Latin language from 1984 to 2023. Then it was done based on the thematic content analysis of the researches, coding and categorization.

Results: Analysis of researches in the field of color application in the design of the user interface of the educational website, which led to the identification of three general categories and 18 components. The main categories in this field include the fields of using color in designing the user interface of educational websites, using color in designing the user interface of educational websites, and using color in covering the subject area. In designing the user interface of educational websites.

Conclusion: The study showed that Consistent results of checking color in user interface design are not seen on all websites. Therefore, in the context section, researchers pay attention to their commercial, news, entertainment and entertainment websites in the context section, which is less thought about the topic. In the section on the applications of colors, researchers have shown the topic of attractiveness and beauty of the website, helping to increase the needs of users by designers, attractiveness of the website and cognitive processing of users, culture and understanding of users from the website, the effect of color on the characteristics of cultural attention has been shown.

Keywords

• User Interface. Interactive Environment
• Website Design
• Color Analysis
• Educational Websites

---

References

Bianchi, R. G., & Neris, V. P. D. A. (2015). Which color should I pick? a study on colors and emotions in human-computer interaction. doi:https://doi.org/10.1145/3148456.3148464

Bleicher, S. (2023). Contemporary Color: Theory and Use (r. Edition Ed.): Cengage Learning. doi:https://doi.org/10.4324/9781003242741

Bonnardel, N., Piolat, A., & Le Bigot, L. (2011). The impact of colour on Website appeal and users' cognitive processes. Displays, 32(2), 69-80. doi: https://doi.org/10.1016/j.displa.2010.12.002

Cao, Y. Q., Proctor, R. W., Ding, Y., Duffy, V. G., Zhang, Y., & Zhang, X. F. (2021). Influences of Color Salience and Location of Website Links on User Performance and Affective Experience with a Mobile Web Directory. International Journal of Human-Computer Interaction, 37(6), 547-559. doi: https://doi.org/10.1080/10447318.2020.1838188

Casas, M. C., & Chinoperekweyi, J. (2019). Color psychology and its influence on consumer buying behavior: A case of apparel products. Saudi Journal of Business and Management Studies, 4(5), 441-456. doi: https://doi.org/10.21276/sjbms.2019.4.5.8

Çetin, E., & Özdemir, S. (2013). A Study on an Educational Website's Usability. ProcediaSocial and Behavioral Sciences, 83, 683-688. doi:https://doi.org/10.1016/j.sbspro.2013.06.129

Chan, I. C. C., Law, R., Fong, L. H. N., & Zhong, L. (2021). Website design in tourism and hospitality: A multilevel review. International Journal of Tourism Research, 23(5), 805-815. doi:https://doi.org/10.1002/jtr.2443

Cyr, D. (2008). Modeling web site design across cultures: relationships to trust, satisfaction, and e-loyalty. Journal of management information systems, 47-72. doi:https://doi.org/10.2753/MIS0742-1222240402

Cyr, D., Head, M., & Larios, H. (2010). Colour appeal in website design within and across cultures: A multi-method evaluation. International Journal of Human-Computer Studies, 68(1-2), 1-21. doi: https://doi.org/10.1016/j.ijhcs.2009.08.005

Deng, L., Zhang, Z., Zhou, F., & Liu, R. . (2022). Effects of app icon border form and interface background color saturation on user visual experience and search performance. Advances in Multimedia, 1-12. doi:https://doi.org/10.1155/2022/1166656

Fang, X., Chang, D., & Zhang, Z. . (2022). Effects of Different Interface Color Modes and Textbox Design on Users’ Reading Efficiency and Accuracy. Paper presented at the In 2022 IEEE International Conference on Industrial Engineering and Engineering Management (IEEM), doi:https://doi.org/10.1109/IEEM55944.2022.9989887

Fogg, B. J., Soohoo, C., Danielson, D. R., Marable, L., Stanford, J., & Tauber, E. R. (2003). How do users evaluate the credibility of Web sites? A study with over 2,500 participants. Paper presented at the Proceedings of the 2003 conference on Designing for user experiences. doi: https://doi.org/10.1145/997078.997097

Gallud, J. A., Tesoriero, R., & Penichet, V. M. R. (2011). Distributed User Interfaces: Designing Interfaces for the Distributed Ecosystem: Springer London. https://doi.org/10.1007/978-1-4471-2271-5

Golubović, G., Dedijer, S., Juretić, I., & Đurđević, S. (2022). COMPARATIVE ANALYSIS OF THE INFLUENCE OF COLOUR ON CUSTOMERS’ TRUST TOWARDS WEBSITES IN THE FIELDS OF ONLINE BANKING AND CRYPTOCURRENCY TRADING. doi: https://doi.org/ 10.24867/GRID-2022-p28

Goto, K., Pelet, J. E., & Iizuka, K. (2022) The Effect of Colors Used in E-Commerce Websites: An Analysis of Japanese Consumers. In: Vol. 1582 CCIS (pp. 485-491): Springer Science and Business Media Deutschland GmbH. doi: https://doi.org/10.1007/978-3-031-06391-6_60

Haria, A., Subramanian, A., Asokkumar, N., Poddar, S., & Nayak, J. S. (2017). Hand gesture recognition for human computer interaction. Procedia computer science, 115, 367-374. doi:https://doi.org/10.1016/j.procs.2017.09.092

Hawlitschek, F., Jansen, L. E., Lux, E., Teubner, T., & Weinhardt, C. (2016, Jan 05-08). Colors and Trust: The Influence of User Interface Design on Trust and Reciprocity. Paper presented at the 49th Hawaii International Conference on System Sciences (HICSS), Koloa, HI. doi: https://doi.org/10.1109/hicss.2016.80

Jo, M. S., Wang, L., & Chen, Z. (2023). A Comparative Study on the Cultural Difference of Users’ Preference of Library Website Interface Design Between Korea and the United States. Paper presented at the In International Conference on Human-Computer Interaction. doi: https://doi.org/202302281753223638

Kaczmarek-Gajewska, W., & McDonnell, M. (2021). Effect of website colour saturation on trustworthiness and visual appeal impressions. 16th International Conference on Interfaces and Human Computer Interaction - Duration: 20 Jul 2022. Lisbon, Portugal . 69-76. https://www-scopuscom.ezproxy.udes.edu.co/record/display.uri?eid=2s2.085117526531&origin=resultslist&sort=plff&src=s&sid=12668295347423c77f48da444a0c2c1&sot=a&sdt=a&s=

Karami, Z. (2020). Investigating the effect of color on websites selling sports goods for Iranian buyers' sense of satisfaction and trust. (Masters), Tabriz, Islamic Art University of Tabriz. https://ganj.irandoc.ac.ir/#/articles/c8b39a54ee605f5c34e13c7da2a95759. [In Persian]

Karimi, A. (2019). Assessing the aesthetics aspects of web design. (Master's thesis), Art University of Tehran, Tehran. https://ganj.irandoc.ac.ir/#/articles/da2dba40a802be89fbfac677b9c305b1. [In Persian]

Khaleghi, N. (2006). The most important general criteria for a desirable user interface. Library and Information Sciences, 9(3), 85-94. https://sid.ir/paper/431571/fa .[In Persian]

Khuong, T. T., Nhi, P. Y., Nhan, D. T., Thuan, N. H., & Acm. (2018, Feb 02-04). Colour, Trust, Satisfaction, and E-loyalty: The Vietnamese Experience of Website Design. Paper presented at the 2nd International Conference on Machine Learning and Soft Computing (ICMLSC), Vietnam. doi: https://doi.org/10.1145/3184066.3184070

Manzoor, M., Hussain, W., Ahmed, A., & Iqbal, M. J. (2012). The importance of higher education website and its usability. International Journal of Basic and Applied Sciences, 1(2), 150-163. doi: https://doi.org/10.14419/ijbas.v1i2.73

Marcus, A., Cowan, W. B., & Smith, W. (1989). Color in user interface design: Functionality and aesthetics.doi: https://doi.org/10.1145/67449.67455

Medjden, S., Ahmed, N., Lataifeh, M. (2020). Adaptive user interface design and analysis using emotion recognition through facial expressions and body posture from an RGB-D sensor. PLOS ONE, 15(7):e0235908. doi: https://doi.org/10.1371/journal.pone.0235908

Meier, B. J. (1988). ACE: A color expert system for user interface design. doi: https://doi.org/ 10.1145/62402.62424

Miketić, N., Pinćjer, I., Milić Keresteš, N., & Bošnjaković, G. (2023). Search Performance and Aesthetics: Harmonious Colours and Grouping for a Better User Interface. Tehnicki Vjesnik, 30(2), 506-513. doi: https://doi.org/10.17559/TV-20220622140433

Mohammadian, N. (2021). Relationship between Preferred Colors of Online Users on Websites and Their Cultural Features. 7th International Conference on Web Research (ICWR). 19-20 May 2021. Iran, Tehran. doi: https://doi.org/10.1109/ICWR51868.2021.9443142

Mohammadian, N., Noorbehbahani, F., & Ieee. (2017, Apr 19-20). Analyzing Users' Preferred Color On Websites Based On Demographic Features. Paper presented at the 3rd International Conference on Web Research (ICWR), Tehran, IRAN. doi:https://doi.org/10.1109/ICWR.2017.7959320

Pastushenko O, H. J., Hruska T. . (2019). Evaluation of user interface design metrics using generator of ̌ realistic-looking dashboard samples. Expert Systems, 38(5), 1-19. doi:https://doi.org/10.1111/exsy.12434

Pelet, J. E., Conway, C. M., Papadopoulou, P., & Limayem, M. (2013) Chromatic scales on our eyes: How user trust in a website can be altered by color via emotion. In: Vol. 205 AISC (pp. 111-121): Springer Verlag. doi: https://doi.org/ 10.1007/978-3-642-37317-6_10

Puji, A. A., & Engraini, V. (2021). Perancangan User Interface Website E-Commerce Pada Usaha Kuliner Menggunakan User Centered Design. Jurnal CoSciTech (Computer Science and Information Technology), 2(1), 1-8. doi:https://doi.org/10.37859/coscitech.v2i1.2196

Reayatsanathi, F. (2015). Analysis of the perceived characteristics of color in the design of the user interface of corporate websites. (master's thesis), Science and Culture of Tehran University. https://ganj.irandoc.ac.ir/#/articles/17ed9a198f7ba51ebd74eecd9ac94933. [In Persian]

Sadeghi, N. (2021). Color in the user interface design of educational and entertainment websites for children. (Master's Thesis), Art University of Tehran.https://ganj.irandoc.ac.ir/#/articles/f5e383cda22e4369b52f8b52db18f1e4. [In Persian]

Sandelowski, M., & Barroso, J. (2006). Handbook for synthesizing qualitative research: springer publishing company. doi:https://doi.org/10.46743/2160-3715/2009.2820

Schwarz, M. W., Beatty, J. C., Cowan, W. B., & Gentleman, J. F. (1984). TOWARDS AN EFFECTIVE USER INTERFACE FOR INTERACTIVE COLOUR MANIPULATION.doi:https://doi.org/10.20380/GI1984.33

Seckler, M., Opwis, K. & Tuch, A. N. (2015). Linking objective design factors with subjective aesthetics: an experimental study on how structure and color of websites affect the facets of users’ visual aesthetic perception. Computers in Human Behavior, 49, 375-389. doi:https://doi.org/10.1016/j.chb.2015.02.056

Shen, Z., Xue, C., Li, J., & Zhou, X. . (2015). Effect of icon density and color contrast on users’ visual perception in human computer interaction. Paper presented at the In Engineering Psychology and Cognitive Ergonomics: 12th International Conference. doi:https://doi.org/10.1007/978-3-319-20373-7_7

Tham, D. S. Y., Sowden, P. T., Grandison, A., Franklin, A., Lee, A. K. W., Ng, M., ... & Zhao, J. . (2020). A systematic investigation of conceptual color associations. Journal of Experimental Psychology, 149(7), 1311. doi: https://doi.org/10.1037/xge0000703

Thowfeek, M. H., & Salam, M. N. A. (2014). Students’ Assessment on the Usability of E-leaming Websites. Procedia-Social and Behavioral Sciences, 141, 916-922. doi: https://doi.org/10.1016/j.sbspro.2014.05.160

Vitols, G., Arhipova, I., Hirata, Y., & Ikarts, I. (2015). Colour Extraction and Analysis Solution for Design of Cross-cultural Websites. Paper presented at the Conference on ICTE in Regional Development, Valmiera, LATVIA. doi:https://doi.org/10.1016/j.procs.2015.12.374

Vitols, G. Arhipova, I. Hirata, Y. (2012). Cultural preference identification for cross-cultural website design. ICEIS 2012 - Proceedings of the 14th International Conference on Enterprise Information Systems, 3 HCI(EA/-), 99–102. https://www.scopus.com/inward/record.uri?eid=2s2.084865712602&partnerID=40&md5=44e101bc328d4ab98d97ef7768c1d6c7

Vu, K. P. L., Proctor, R. W., & Hung, Y. H. (2021). Website design and evaluation. Handbook of human factors and ergonomics, 1016-1036. doi: https://doi.org/10.1002/9781119636113.ch39

Wright, O. (2006). The origin and nature of perceptual colour categories: University of Surrey (United Kingdom). https://www.proquest.com/openview/75ba5ce2fe3ceb83dae8abfc72951950

Wu, Z., Xue, C., Zhu, Y., Zhai, B., & Zhang, C. . (2020). Shopping Website Accessibility Study Based on Users’ Mental Models. In Intelligent Human Systems Integration 2020: Proceedings of the 3rd International Conference on Intelligent Human Systems Integration. doi: https://doi.org/10.1007/978-3-030-39512-4_118

Xiaoxiao, B., & Wenming, L. (2018). Research on the application of color semantics in the human-computer interaction design of smartphones. doi: https://doi.org/10.1051/matecconf/201817604001

Zerehsaz, M., and Fattahi, R. . (2005). Basic considerations in the design of the user interface of computer systems and databases. libraranship and Information Organization Studies, 17(2), 251-268. https://sid.ir/paper/465274/fa. [In Persian]

Zhou, J., Miao, X., He, F., & Miao, Y. (2022). Effects of Font Style and Font Color in News on User Cognitive Load in Intelligent User Interfaces. IEEE Access, 10, 10719-10730. doi:https://doi.org/10.1109/ACCESS.2022.3151915