Concepts of user experience design and their role in achieving ease of use and effectiveness of responsive educational websites | ||||
| International Design Journal | ||||
| Article 18, Volume 12, Issue 3 - Serial Number 44, May and June 2022, Page 223-235 PDF (1.41 MB) | ||||
| Document Type: Original Article | ||||
| DOI: 10.21608/idj.2021.92913.1025 | ||||
 View on SCiNiTO | ||||
| Author | ||||
Yasser H. El Shamy  
| ||||
| Media Department, College of Language and Communication - Smart Village, Arab Academy for Science, Technology & Maritime Transport, Egypt | ||||
| Abstract | ||||
| Mastery and ease of access to modern knowledge are the goals of communication-based learning, and this is consistent with the communicative revolution in the field of mobile learning, which provides access to education anytime and anywhere. The user experience UX is one of the most important strategies on which the interactive design of educational websites is based now, which increases learnability, develops and directs the visual performance of learners, ease of access to information, and use of the site by eliminating redundant elements that affect the visual design of educational interfaces. Designing an educational site requires a careful study of the characteristics of these devices, user experience, design standards, and visual treatments to determine the expected action possibilities to ensure the best interaction between the learner and smart devices, which provides knowledge at any time and place, therefore the main aspect of the research deals with the concept, processes, and approach to user experience, levels of user experience design for educational websites, theoretical foundations, and principles on which they are based, the relationship between responsive design and user experience and usability components and characteristics. Visual treatments are among the most important mental treatments, with the visual system being the most effective in the brain, also vision processes such as focusing and tracking eye movements are among the basic conditions for the visual system to receive information and process it through the brain, this supports the strategy of responsive design based on user experience because it focuses primarily on visual treatments that affect cognitive and mental abilities, one of the success factors of a responsive educational website is the provision of clear hints that do not require interpretation, illustrations or user instructions, based on user experience and needs, and the longer a potential action requires time or user interpretation, the more unsuccessful the design will be, and lead to dispersal of the learner and a sense of confusion while navigating the site, that is the responsive design of educational web sites and visual treatments that suit the characteristics of mobile devices and user characteristics are what determine the possibilities of the action expected to occur from the learner, and facilitates its use and navigation on the web site. The responsive design strategy for educational websites based on user experience achieves a visual system that adapts to different devices and directs the student to information in a flexible way, so that it fits with the learner's eye movement in the electronic graphic interfaces, and meets his needs and expectations towards the site, addressing the cognitive load is one of the most important modern criteria for ease of use, which is more related to the use of mobile devices, as there are many factors that affect the perception of the user such as the size of the devices, the variety of visual elements, the use of the site or the application while moving, and other factors that must be taken into account to ensure that the distraction that may occur to the user is reduced, we find that the process of understanding is achieved as a result of the organization of the elements within a total unit, where the responsive design strategy is built to take into account the unity visual design of educational web sites and their response to various devices, in proportion to the experience and characteristics of the learner, so that the learner perceives the site as a whole without the distraction caused by unguided navigation operations, which in turn leads to confusing and separating the learner from focusing on the scientific content thus causing distraction and lack of learning. The success or failure of attention depends on the level of perceptual load and cognitive load, which determine the efficiency of rejecting or being affected by the distractor, attention depends on available cognitive resources, and attention does not occur if the cognitive load is large, therefore, the dispersion that occurs to the individual as a result of the multiplicity of stimuli according to the theory of burden depends on two important factors, namely the internal characteristics such as the characteristics and previous experiences of the learner and the user experience, which represents the cognitive burden, and the extraneous external characteristics of visual elements and responsive design, which represents the perceptual burden, the information and elements in the visual fields compete with each other for cognitive processing, this means that the systematic study of choosing the visual elements, the appropriate responsive design strategy, the information structure and the content organization strategy is one of the most important foundations against which the success of the design is measured. The research is developmental research based on descriptive-analytical methodology, we find that the research problem lies in the lack of theoretical and technical bases on which to base the foundations of modern design and development related to the field of user experience design and to achieve ease of use of responsive educational websites, as it is an area that needs more research and study to increase and improve the ability of distant learning, also the research aims to contribute to improving the usability and visual treatments by designing responsive educational websites to better suit the nature of smart devices and achieve ease of use in the educational process to reach the desired educational goals. The significance of the research stems from its being a study of UX user experience strategies in educational websites, which is one of the most important strategies on which interactive design is based now, which is basically concerned with designing and developing communication products and services that focus on the real needs of the user, as well as being one of the interdisciplinary researches that links several important fields and theoretical foundations in the educational process, as it combines modern web design strategies, and the foundations of user experience, cognitive theories of cognitive and perceptual burden, theories of information processing, learning theories, and how to employ them in educational web sites, which are among the most important educational resources at present. The research has shown the importance of a good organizational framework for the cognitive structure that is stable, clear, and easy to process, and it is clear that the instability of information and the inability to recall, process or retain information leads to impediment and disruption of learning, the research also emphasized the importance of dividing the information provided to the learner into units or parts of content organization within the adaptive learning system via the web, and organizing the knowledge structure of the scientific material in a way that enables the student to absorb and learn it, and its sequence from the easiest to the most difficult in a manner commensurate with the student's abilities and characteristics. The research has shown as well that working memory has limited capabilities in the amount of information and the number of items it receives at one time, which is related to the complexity of each element and the burden it represents on the mind, so the mind tends to a simple design that allows short-term visual memory to process the displayed information and transferring it to long-term memory, thus the cognitive load on working memory should be reduced to facilitate changes in the information structure within long-term memory, and then the occurrence of learning. The research has confirmed that one of the most important principles of user experience design is learnability, as the knowledge background of users varies according to their characteristics, abilities, and needs, therefore taking into account these characteristics and needs helps users to interact flexibly and facilitates the use of the digital product and thus helps them perceive the content, also the importance of taking into account the cognitive ability of the individual has been highlighted so that a task with a high level of processing is only given with the required attributes and resources. The research has shown that the lower the perceptual load, the greater the visual system's ability to select important elements, and the fewer distractions that impede perception, since there is an inverse relationship between the target and the interference of distractions, the more distracting unimportant visual elements are, the more difficult it is to pay attention to the target, where it is difficult for the visual system to take notice of all the visual information that is displayed in an element-rich environment. The research has confirmed that the user initially receives stimuli in a total form, and then pays attention to partial features, this depends on the human vision system, and this is consistent with the principle of division and fragmentation in responsive design, but this requires studying, analyzing and planning the content of the site so that the parts appear to stand alone and at the same time work together as part of the whole. The research has confirmed that studying the needs and self-motivations of learners is one of the most important matters that help in designing electronic applications, where it represents a great challenge for designers and developers, whereas, identifying users and studying their different needs and requirements, defining the tasks required in the context of learning and how they are represented in e-learning applications, is one of the most important difficulties that require in-depth and careful study because the main goal of these applications is learning. The research has also confirmed that the graphic interfaces are a visual space for information on which visual entities are displayed with systematic relationships according to the user experience, the more the arrangement and methodology of displaying these visual elements are based on scientific and design principles, the less the user feels distracted when using it. Also, the responsive design of websites is not limited to simply adapting the content of the website to suit all systems and devices, but also adapting the site to the needs of users, which helps in planning and arranging the content, information, elements, and ease of use in a way that suits the nature of each user and each device in a way that ensures the achievement of the desired goal. It is clear from what has been presented in the aspect of user experience, ease of use, and their relationship with responsive design of educational sites, the importance of the instructional designer to studying the principles of user experience and ease of use, to be able to design a responsive learning environment that suits the nature of each user and every individual device in a way that ensures the achievement of the required educational goal, and aims to reduce the burden and visual distraction in order allow to use and navigation of the website easily and effectively. | ||||
| Keywords | ||||
| User experience; usability; user interfaces; cognitive load; perceptual load | ||||
|
Supplementary Files
|
||||
| References | ||||
|
Abdul Majid E. S., Kamaruddin N. & Mansor Z., (2015) "Adaptation of usability principles in responsive web design technique for e-commerce development," 2015 International Conference on Electrical Engineering and Informatics (ICEEI), 2015, pp. 726-729, doi.org/10.1109/ICEEI.2015.7352593.
2. Adams R., (2006) Applying advanced concepts of cognitive overload and augmentation in practice; the future of overload. In Foundations of augmented cognition. 2nd edition. Edited by: Schmorrow D, Stanney KM, Reeves LM. Arlington, VA: Springer Berlin Heidelberg; 2006:223–229.
3. Adams R., (2007) Decision and stress: cognition and e-accessibility in the information workplace. Univ Access Inf Soc 5, 363–379 (2007), doi.org/10.1007/s10209-006-0061-9.
4. Aranyi G. & Schaik P., (2015) Testing a model of user-experience with news websites. Journal of the Association for Information Science and Technology. 67, doi.org/10.1002/asi.23462.
5. Azzawi A., (2014) User Experience in Arabia: The Business Case for User-Centred Design and Usability Engineering, doi.org/10.14236/ewic/BCSIIT2014.13.
6. Battarbee K. & Koskinen I., (2005) Co-experience: user experience as interaction, CoDesign,1:1, 5-18, doi.org/10.1080/15710880412331289917.
7. Barakovic, S. & Kapov L., (2017) “Survey of research on Quality of Experience modelling for web browsing” Quality and User Experience 2 (2017): 1-31.
8. Bernacki J., Błażejczyk I., Indyka-Piasecka A., Kopel M., Kukla E., Trawiński B., (2016) Responsive Web Design: Testing Usability of Mobile Web Applications. In: Nguyen N.T., Trawiński B., Fujita H., Hong TP. (eds) Intelligent Information and Database Systems. ACIIDS 2016. Lecture Notes in Computer Science, vol 9621. Springer, Berlin, Heidelberg, doi.org/10.1007/978-3-662-49381-6_25.
9. Bollini L., (2017) Beautiful interfaces. From user experience to user interface design. The Design Journal An International Journal for All Aspects of Design. 20. 89-101, doi.org/10.1080/14606925.2017.1352649.
10. Brooke J., (1996) SUS: A quick and dirty usability scale. In P.W. Jordan, B. Thomas, B. A. Weerdmeester & I. L. McClelland (Eds.), Usability Evaluation in Industry (pp. 189-194), London: Taylor & Francis.
11. Cooper A., Reimann R., & Cronin D., (2007) About face 3. Indianapolis, Ind.: Wiley Pub.
12. Fadel L., (2014) Design, User Experience, and Usability. Third International Conference, DUXU 2014. Experience-Centered Web Design Model. (pp. 92-103). Switzerland: Springer International Publishing.
13. Flood D., Harrison R., Iacob C., & Duce D., (2013) Evaluating Mobile Applications: A Spreadsheet Case Study. International Journal of Mobile Human Computer Interaction (IJMHCI), 4(4), 37-65, doi.org/10.4018/jmhci.2012100103
14. Forlizzi J. & Ford S., (2000) The Building Blocks of Experience: An Early Framework for Interaction Designers.. Proceedings of the Conference on Designing Interactive Systems: Processes, Practices, Methods, and Techniques, DIS. 419-423, doi.org/10.1145/347642.347800.
15. Garrett J., (2011) The Elements of User Experience: User-Centered Design for the Web and Beyond (2nd ed). United States of America: New Rid- ersl.
16. Gibson J.J., (1977) The Theory of Affordances. In R.Shaw and J. Bransford (Eds.) Perceiving, Acting, and Knowing. Toward an Ecological Psychology. Hillsdale: NJ, Lawrence Erlbaum Associates, 67-82.
17. Gibson J.J., (1979) The Ecological Approach to Visual Perception. Boston: Houghton Mifflin.
18. Guo F., Ding Y., Liu W., Liu C., Zhang X., (2016) Can eye- tracking data be measured to assess product design: Visual attention mechanism should be considered. International Journal of Industrial Ergonomics. 53, (pp. 229-235), doi.org/10.1016/j. ergon.2015.12.001
19. Jason Haag J. & Berking P., (2015) “A Reference Model for Designing Mobile Learning and Performance Support”
20. Harrison R., Flood D. & Duce D., (2013) Usability of mobile applications: literature review and rationale for a new usability model. J Interact Sci 1, 1 (2013), doi.org/10.1186/2194-0827-1-1
21. Hassenzahl M., (2008) User experience (UX): towards an experiential perspective on product quality, In: Proceedings of the IHM'08, pp. 11–15.
22. Hassenzahl M., (2010) Experience Design: Technology for All the Right Reasons. San Rafael, USA: Morgan and Clay.
23. Hassenzahl M. & Tractinsky N., (2006) User Experience—A Research Agenda. Behaviour and Information Technology, 25, 91-97, doi.org/10.1080/01449290500330331
24. Holm A., & Sundberg Kullstrom C., (2015) User Responsive User Experience Design: Building a Conceptual Framework (Dissertation). Retrieved from http://urn.kb.se/resolve?urn=urn:nbn:se:hb:diva-1036
25. ICEL, (2013) 8th International Conference on e-Learning (ICEL 2013)
26. ISO 9241-11:1998. Ergonomic requirements for office work with visual display terminals. (VDTs) - Part 11: Guidance on usability. http:// www.userfocus.co.uk/resources/guidelines.html.
27. ISO FDIS 9241-210 (2009). Ergonomics of human system interaction – Part 210: Human centered design for interactive systems (formerly known as 13407). International Organization for Standardization (ISO), Switzerland.
28. Kaapu T., Tiainen T., (2010) SCIS 2010. User Experience: Consumer Understandings of Virtual Product Prototypes, (pp. 18-33), Heidelberg: Springer-Verlag Berlin.
29. Karr A., (2013) UX RESEARCH VS. UX DESIGN, https://interactions.acm.org/blog/view/ux-research-vs.-ux-design [2013-05-21]
30. Koskinen, Ilpo & Mattelmäki, Tuuli & Battarbee, Katja., (2003) Empathic Design “user experience in product design”, IT Press.
31. Kouprie, Merlijn & Sleeswijk Visser, Froukje, (2009). A framework for empathy in design: Stepping into and out of the user's life. Journal of Engineering Design - J ENGINEERING DESIGN. 20. 437-448, doi.org/10.1080/09544820902875033.
32. Law E. L., Schaik P. V., Roto V., (2014) Attitudes towards user experience (UX) measurement, International Journal of Human-Computer Studies, Volume 72, Issue 6, 2014, Pages 526-541, ISSN 1071-5819, doi.org/10.1016/j.ijhcs.2013.09.006.
33. Levin M., (2014) Designing Multi-Device Experiences, O’Reilly Media, Inc.
34. Iivari, J. & Iivari, N., (2010) Varieties of User-Centeredness: An Analysis of Four Systems Development Methods. Information Systems Journal, 21(2), pp. 125-153.
35. Majid E. S. A., Kamaruddin N. & Mansor Z., (2015) "Adaptation of usability principles in responsive web design technique for e-commerce development," 2015 International Conference on Electrical Engineering and Informatics (ICEEI), 2015, pp. 726-729, doi.org/10.1109/ICEEI.2015.7352593.
36. Matthews T., Judge K. T. & Whittaker S., (2012) How Do Designers and User Experience Professionals Actually Perceive and Use Personas? CHI 12 proceedings.
37. Marville P., (2014) UX is not UI what is the difference between UX and UI design, Semantic studies, Retrieved from: www. semanticstudies.com/user_experience_design [2014-06-21]
38. McNamara N., & Kirakowski J., (2006) Functionality, usability, and user experience: three areas of concern. interactions, 13(6), 26-28.
39. Nakamura W., Teixeira E., & Conte T., (2017) Usability and User Experi- ence Evaluation of Learning Management Systems: A Systematic Map- ping Study. Conference: 19th International Conference on Enterprise Information Systems.
40. Nielsen J., (2012) How many test users in a usability study?, http://www.nngroup.com/articles/how-many-test-users [2015-03-04]
41. Nielsen J., (2002) Homepage Usability, New Riders Publishing, Indianapolis, ISBN 0-73571-102-X.
42. Nielsen J., Molich R., Snyder C., and Farrell S., (2001) E-Commerce User Experience. Nielsen Norman Group, Fremont, CA, ISBN 0-9706072-0-2.
43. Norman D., (2012) Yet Another Technology Cusp: Confusion, Vendor Wars, and Opportunities. Commun. ACM. 55. 30-32, doi.org/10.1145/2076450.2076460.
44. Norman Donald., (2013) The paradox of wearable technologies. 116. 101-103.
45. O'Brien, Heather & Lebow, Mahria., (2013) Mixed-methods approach to measuring user experience in online news interactions. Journal of the American Society for Information Science and Technology. 64. 1543-1556, doi.org/10.1002/asi.22871.
46. Petrovic K., (2012) Best Practices for Successful Deployment of User Experience Design, doi.org/10.1007/978-3-642-31371-4_8.
47. Plascencia D., (2016) Accessibility. In S. Danver (Ed.), The SAGE encyclopedia of online education (pp. 41-43). SAGE Publications, Inc., doi.org/10.4135/9781483318332.n17.
48. Pucillo F., Cascini G., (2014) A framework for user experience, needs and affordances, Design Studies,Volume 35, Issue 2, 2014, Pages 160-179, ISSN 0142-694X, doi.org/10.1016/j.destud.2013.10.001.
49. Saffer D., (2012) Dan Saffer: O Danny Boy, Retrieved from: http://www. odannyboy.com
50. Salvucci D., (2001) An integrated model of eye movements and visual encoding, Cognitive Systems Research, Volume 1, Issue 4, 2001, Pages 201-220, ISSN 1389-0417, doi.org/10.1016/S1389-0417(00)00015-2.
51. Saucken, Constantin & Reinhardt, Jakob & Michailidou, Ioanna & Lindemann, Udo., (2013) Principles for User Experience Design: Adapting the TIPS Approach for the Synthesis of Experiences.
52. Schall A., (2014) Eye Tracking Insights into Effective Navigation Design. In: Marcus A. (eds) Design, User Experience, and Usability. Theories, Methods, and Tools for Designing the User Experience. DUXU 2014. Lecture Notes in Computer Science, vol 8517. Springer, Cham, doi.org/10.1007/978-3-319-07668-3_35.
53. Schildbach B., & Rukzio E., (2010) Investigating Selection and Reading Performance on a Mobile Phone while Walking, In MobileHCI '10 Proceedings of the 12th international conference on Human computer interaction with mobile devices and services (pp. 93-102) ACM, doi.org/10.1145/1851600.1851619.
54. Speicher M., (2015) What Is Usability? A Characterization Based On ISO 9241-11 And ISO/IEC 25010. Technical Report, Retrieved from http://arxiv.org/pdf/1502.06792v1.pdf
55. Von Saucken C., Reinhardt J., Michailidou I., and Lindemann U., (2013) ‘Principles for User Experience Design – Adapting the TIPS Approach for the Synthesis of Experiences’, in Sugiyama, K. (ed.), Proceedings of the 5th International Congress of International Asso- ciation of Societies of Design Research IASDR, 26-30 August, Tokyo, Japan, pp.713-722.
56. Wright P., McCarthy J., & Meekison L., (2005) Making sense of experience, In Funology (pp. 43-53), Springer Netherlands, doi.org/10.1007/1-4020-2967-5_5.
57. Yu N., and Kong J., (2016) “User experience with web browsing on small screens: Experimental investigations of mobile-page interface design and homepage design for news websites”, Information Sciences, Vol. 330, pp. 427–443. ISSN 0020-0255, doi.org/10.1016/j.ins.2015.06.004.
58. Zaharias P., (2013) Towards a framework for applying Gamification in Education. In proceedings of the 7th International Conference in Open and Distance Learning (ICODL 2013). (in press).
59. Zbick, Janosch & Nake, Isabella & Milrad, Marcelo & Jansen, Marc, (2015). A Web-Based Framework to Design and Deploy Mobile Learning Activities: Evaluating Its usability, Learnability and Acceptance, doi.org/10.1109/ICALT.2015.97.
60. Zhang D. & Adipat B., (2005) Challenges, Methodologies, and Issues in the Usability Testing of Mobile Applications, International Journal of Human–Computer Interaction, 18:3, 293-308, doi.org/10.1207/s15327590ijhc1803_3. | ||||
|
Statistics Article View: 354 PDF Download: 224 |
||||
