تحلیلی بر کاربرد رنگ در طراحی رابط کاربری وب‌سایت‌های آموزشی: رویکردی مبتنی بر فراترکیب

پژوهشنامه کتابداری و اطلاع رسانی

مقالات آماده انتشار، پذیرفته شده، انتشار آنلاین از تاریخ 30 خرداد 1403   

نوع مقاله: مقالات مروری

شناسه دیجیتال (DOI): 10.22067/infosci.2024.86371.1193

نویسندگان

حدیثه حیدری¹؛ راحله کریمیان²؛ یعقوب نوروزی^{* 3}

¹دانشجوی دکتری علم اطلاعات و دانش‌شناسی، دانشگاه الزهرا، تهران، ایران.

²دانشجوی دکتری علم اطلاعات و دانش‌شناسی، دانشگاه قم، قم، ایران.

³استاد علم اطلاعات و دانش‌شناسی، دانشگاه قم، قم، ایران.

چکیده

هدف: رنگ یکی از مهم‌ترین عناصر هر رابط کاربری است و نقش مهمی در طراحی رابط کاربری دارد. از اینرو، برای ارتباط و تعامل با کاربران در وبسایتها استفاده می‌شوند. هدف از پژوهش حاضر، تحلیل کاربرد رنگ در طراحی رابط کاربری وب‌سایت‌های آموزشی با رویکرد مبتنی بر فراترکیب است.

روش‌شناسی: مطالعه حاضر، با رویکرد کیفی و با روش فراترکیب انجام شده است. به منظور گردآوری داده‌ها در این پژوهش از الگوی هفت مرحلهای سندلوسکی و باروسو استفاده شد. جامعه آماری پژوهش مقالات و پایان نامههای مرتبط با رابط کاربری وب‌سایت‌های آموزشی است که در فارسی بازه زمانی سالهای 1390-1402 و در لاتین سال‌های 1984 - 2023 از پایگاههای علمی داخلی و بین‌المللی استخراج شده است. در نهایت از بین 148 مقاله و پایان‌نامه بازیابی شده، 27 عنوان انتخاب و تحلیل شد. و سپس براساس تحلیل محتوای موضوعی پژوهشها، کدگذاری و مقولهبندی صورت گرفت.

یافته‌ها: تجزیهوتحلیل پژوهش‌های حوزه رنگ در طراحی رابط کاربری وب‌سایت‌های آموزشی که به شناسایی 3 مقوله کلی، 18 مؤلفه در این حوزه انجامید. مقولات اصلی در این حوزه شامل زمینه‌های کاربرد رنگ در طراحی رابط کاربری وب‌سایت‌های آموزشی، کاربرد رنگ در طراحی رابط کاربری وب‌سایت‌های آموزشی و کاربرد رنگ در پوشش دامنه موضوعی در طراحی رابط کاربری وب‌سایت‌های آموزشی است.

نتیجه‌گیری: نتایج ثابتی از بررسی رنگ در طراحی رابط کاربر در تمامی وب‌سایت‌ها دیده نمی‌شود. بدین جهت، در قسمت بافت، پژوهشگران توجه خود را معطوف به وب‌سایت‌های تجاری، خبری، سرگرمی گذاشته‌اند که این خود یک خلاء پژوهشی است که توجه‌ کمتری به مبحث آموزش شده است. در بخش کاربردهای رنگ پژوهشگران به مبحث جذابیت و زیبایی وب‌سایت، کمک بر برآورده شدن نیازهای کاربران توسط طراحان، جذابیت وب‌سایت و فرایندهای شناختی کاربران، فرهنگ و درک کاربران از وب‌سایت، تأثیرگذاری رنگ بر ویژگی‌های فرهنگی توجه نشان داده‌اند.

کلیدواژه‌ها

رابط کاربری؛ محیط تعامل؛ طراحی وب‌سایت؛ تحلیل رنگ؛ ‌وب‌سایت‌های آموزشی

مراجع

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