Successfully reported this slideshow.

Elaborating a Web Interface Personalization Process

1

Share

Upcoming SlideShare
Slideshare
Slideshare
Loading in …3
×
1 of 18
1 of 18

Elaborating a Web Interface Personalization Process

1

Share

Download to read offline

This work builds the required conceptual model for implementing adaptation systems intended to provide a personalized navigation experience for any user. To this end, aspects such as the users’ needs, preferences, and navigational behaviour are taken into account in order to select the adaptation techniques to be applied for each particular user. The validity of the proposed conceptual model to provide the necessary components and mechanisms for implementing suitable web personalization systems is shown by means of a case study.

This work builds the required conceptual model for implementing adaptation systems intended to provide a personalized navigation experience for any user. To this end, aspects such as the users’ needs, preferences, and navigational behaviour are taken into account in order to select the adaptation techniques to be applied for each particular user. The validity of the proposed conceptual model to provide the necessary components and mechanisms for implementing suitable web personalization systems is shown by means of a case study.

More Related Content

Related Books

Free with a 14 day trial from Scribd

See all

Related Audiobooks

Free with a 14 day trial from Scribd

See all

Elaborating a Web Interface Personalization Process

  1. 1. Laboratory of Human-Computer Iinteraction for Special Needs J. Eduardo Pérez, Xabier Valencia, Myriam Arrue and Julio Abascal University of the Basque Country (UPV/EHU) Elaborating a Web Interface Personalization Process : www.jeduardoperez.info : @j_eduardoperez : juaneduardo.perez@ehu.eusSeptember 7th 2015, Vilanova I la Geltrú (Spain) Session 9: Interface Design XVI International Conference on HCI (Interacción 2015)
  2. 2. INTERACCIÓN 2015Elaborating a Web Interface Personalization Process Laboratory of Human-Computer Iinteraction for Special Needs Adapting the Web for Accessibility •  Systems for automated adaptation of web interfaces (transcoders) – no intervention of content authors •  Invented to help people with disabilities access inaccessible Web pages •  Provide personalized navigation experiences for any user – adapting website content, layout and structure Valencia, X., Arrue, M., Pérez, J. E. and Abascal, J. (2013) User individuality management in websites based on WAI-ARIA annotations and ontologies. Conf. on Web Accessibility (W4A ’13), article 29. 2  /  18  
  3. 3. INTERACCIÓN 2015Elaborating a Web Interface Personalization Process Motivation Laboratory of Human-Computer Iinteraction for Special Needs •  Adapting the Web is a complex process – not only technologically but also at conceptual level > Conceptual model for abstraction: – better comprehension of the adaptation process – facilitate the design of better modular tools – adapt the Web for each individual and not for stereotypes 3  /  18  
  4. 4. INTERACCIÓN 2015Elaborating a Web Interface Personalization Process Laboratory of Human-Computer Iinteraction for Special Needs Why adapting the Web is complex? A) Process taking into account multiple factors (user characteristics, required adaptations,…) during different phases (annotation, adaptation,…) [1] B) Select appropriate adaptations to be applied – cover full range of diversity among users or basic stereotypes? > Based on user needs: blind [2], motion impaired [4], … > Based on user preferences [5]: text size definition, line-spacing, magnification,… > Based on user behaviour [3]: performance, assistive technology,… [1] Asakawa, C., Takagi, H. (2008) Transcoding. Web Accessibility: A foundation for Research (Springer), 231-261. [2] Bigham, J. P., Kaminsky, R. S., Ladner, R. E., Danielsson, O. M. and Hempton G. L. (2006) WebInSight: making web images accessible. ACM Conf. on Computers and Accessibility (ASSETS '06), 181-188 [3] Gajos, K. Z., Wobbrock, J. O., Weld, D. S. (2008) Improving the performance of motor-impaired users with automatically- generated, ability-based interfaces. SIGCHI Conf. on Human Factors in Computing Systems (CHI '08), 1257-1266. [4] Mankoff, J., Dey, A., Batra, U., Moore, M. (2002) Web accessibility for low bandwidth input. ACM Conf. on Computers and Accessibility (ASSETS '02), 17-24. [5] Richards, J. T., Hanson V. L. (2004) Web accessibility: a broader view. ACM Conf. on World Wide Web (WWW ’04), 72-79. 4  /  18  
  5. 5. INTERACCIÓN 2015Elaborating a Web Interface Personalization Process Laboratory of Human-Computer Iinteraction for Special Needs Conceptual model: COMPONENTS Web_Interface   •  Presenta5on   •  Naviga5on   •  Content   Annotated_WebInterface   •  Annotated_Presenta5on   •  Annotated_Naviga5on   •  Annotated_Content   Adapted_WebInterface   •  Adapted_Presenta5on   •  Adapted_Naviga5on   •  Adapted_Content   Personalized_WebInterface   •  Personalized_Presenta5on   •  Personalized_Naviga5on   •  Personalized_Content   Adapta5on_Technique   •  Presenta5on   •  Naviga5on   •  Content   ...   User_Model   •  User_Needs   •  User_Preferences   •  User_Behaviour   Adapta5on_Repository   •  Core_Adapta5on_Technique   •  Preferences_Adapta5on_Technique   •  Behaviour_Adapta5on_Technique   5  /  18  
  6. 6. INTERACCIÓN 2015Elaborating a Web Interface Personalization Process Laboratory of Human-Computer Iinteraction for Special Needs Conceptual model: TRANSFORMATIONS Web_Interface   •  Presenta/on   •  Naviga/on   •  Content   Annotated_WebInterface   •  Annotated_Presenta/on   •  Annotated_Naviga/on   •  Annotated_Content   1   Adapted_WebInterface   •  Adapted_Presenta5on   •  Adapted_Naviga5on   •  Adapted_Content   annota/on  (annota/on_language,  Web_Interface)   Web interface annotation process Set of elements the user interact within an original web site Original web interface semantically annotated Personalized_WebInterface   •  Personalized_Presenta5on   •  Personalized_Naviga5on   •  Personalized_Content   Adapta5on_Technique   •  Presenta5on   •  Naviga5on   •  Content   ...   User_Model   •  User_Needs   •  User_Preferences   •  User_Behaviour   Adapta5on_Repository   •  Core_Adapta5on_Technique   •  Preferences_Adapta5on_Technique   •  Behaviour_Adapta5on_Technique   6  /  18  
  7. 7. INTERACCIÓN 2015Elaborating a Web Interface Personalization Process Laboratory of Human-Computer Iinteraction for Special Needs Conceptual model: TRANSFORMATIONS Web_Interface   •  Presenta5on   •  Naviga5on   •  Content   Annotated_WebInterface   •  Annotated_Presenta/on   •  Annotated_Naviga/on   •  Annotated_Content   1   Adapted_WebInterface   •  Adapted_Presenta/on   •  Adapted_Naviga/on   •  Adapted_Content   annota5on  (annota5on_language,  Web_Interface)   Adaptation techniques selection and web interface adaptation adapta/on  (User_Model,  Adapta/on_Repository,  Annotated_WebInterface)  2   Original web interface semantically annotated Personalized_WebInterface   •  Personalized_Presenta5on   •  Personalized_Naviga5on   •  Personalized_Content   Adapta/on_Technique   •  Presenta/on   •  Naviga/on   •  Content   ...   User_Model   •  User_Needs   •  User_Preferences   •  User_Behaviour   Adapta/on_Repository   •  Core_Adapta/on_Technique   •  Preferences_Adapta5on_Technique   •  Behaviour_Adapta/on_Technique   Contains all adaptation techniques sorted by needs, preferences and interaction strategies Parameters that characterize a user and determine the adaptations to be applied Adapted version of the web after applying adaptations 7  /  18  
  8. 8. INTERACCIÓN 2015Elaborating a Web Interface Personalization Process Laboratory of Human-Computer Iinteraction for Special Needs Conceptual model: TRANSFORMATIONS Web_Interface   •  Presenta5on   •  Naviga5on   •  Content   Annotated_WebInterface   •  Annotated_Presenta5on   •  Annotated_Naviga5on   •  Annotated_Content   Adapta/on_Technique   •  Presenta/on   •  Naviga/on   •  Content   ...   Adapted_WebInterface   •  Adapted_Presenta/on   •  Adapted_Naviga/on   •  Adapted_Content   Personalized_WebInterface   •  Personalized_Presenta/on   •  Personalized_Naviga/on   •  Personalized_Content   User-tailored web interface generation process preferences_defini/on  (User_Model,  Adapta/on_Repository,  Adapted_WebInterface)  3   User_Model   •  User_Needs   •  User_Preferences   •  User_Behaviour   Adapta/on_Repository   •  Core_Adapta5on_Technique   •  Preferences_Adapta/on_Technique   •  Behaviour_Adapta5on_Technique   adapta5on  (User_Model,  Adapta5on_Repository,  Annotated_WebInterface)  2   Contains all adaptation techniques sorted by needs, preferences and interaction strategies Parameters that characterize a user and determine the adaptations to be applied User-tailored web interface considering user preferences Adapted version of the web after applying adaptations 8  /  18   1  annota5on  (annota5on_language,  Web_Interface)  
  9. 9. INTERACCIÓN 2015Elaborating a Web Interface Personalization Process Laboratory of Human-Computer Iinteraction for Special Needs [1] Valencia, X., Arrue, M., Pérez, J. E. and Abascal, J. (2013) User individuality management in websites based on WAI-ARIA annotations and ontologies. Conf. on Web Accessibility (W4A ’13), article 29. [2] Pérez, J. E., Arrue, M., Valencia, X. and Moreno, L. (2014) Exploratory study of web navigation strategies for users with physical disabilities. Conf. on Web Accessibility (W4A ’14), article 20. Categories   Adapta/on  Techniques  for  physically  impaired  users   Content   (1)  Add  hot  area  around  hyperlinks   (2)  Use  stretchtext  in  main  content   (3)  Incorporate  specific  scrolling  icons  on  each  page     (4)  Incorporate  buUons  for  browser  “Back”  and  “Forward”   func5onali5es   (5)  Remove  walking  menus   (6)  Avoid  “click  and  drag”  elements  (e.g.,  spinners)     (7)  Avoid  double-­‐clicking  elements     Presenta5on   (8)  Define  large  clickable  area  for  links  and  buUons  in  a     visible  way     (9)  Define  links  and  buUons  well  separated   (10)  Hierarchically  structure  content   (11)  Break  pages  into  chunks  of  no  more  than  one  or  two     screens     Naviga5on   (12)  Provide  naviga5on  bars   (13)  Provide  quick  access  to  different  topics  within  a  website   (14)  Provide  an  index  with  informa5on  in  the  page  (15)  Create  a   table     of  contents  for  website   (16)  Provide  internal  links  to  important  content  on  the  page   (e.g.,  return  to  the  top  of  page)   (17)  Provide  skip  links  (e.g.,  to  main  content)   (18)  Disable  non-­‐recommended  links  (e.g.,  banners)     > Proposed model is valid for implementing suitable web personalization systems? •  Based on 2 previous works: 1) set of 99 adaptation techniques from literature for application to cognitive, physical and sensory impairments [1] 2) study of web navigation strategies with 11 physically impaired users [2] >> classify adaptations techniques Case study: Physically impaired users 9  /  18  
  10. 10. INTERACCIÓN 2015Elaborating a Web Interface Personalization Process Laboratory of Human-Computer Iinteraction for Special Needs > Proposed model is valid for implementing suitable web personalization systems? [1] Valencia, X., Arrue, M., Pérez, J. E. and Abascal, J. (2013) User individuality management in websites based on WAI-ARIA annotations and ontologies. Conf. on Web Accessibility (W4A ’13), article 29. [2] Pérez, J. E., Arrue, M., Valencia, X. and Moreno, L. (2014) Exploratory study of web navigation strategies for users with physical disabilities. Conf. on Web Accessibility (W4A ’14), article 20. •  Based on 2 previous works: 1) set of 99 adaptation techniques from literature for application to cognitive, physical and sensory impairments [1] 2) study of web navigation strategies with 11 physically impaired users [2] >> classify adaptations techniques Case study: Physically impaired users 10  /  18  
  11. 11. INTERACCIÓN 2015Elaborating a Web Interface Personalization Process Laboratory of Human-Computer Iinteraction for Special Needs Case study: Adaptation Repository 1) Core_Adaptation_Techniques: “appropriate for all users with physical impairments” >    Content:  (5)  Remove  walking  menus,  (6)  Avoid  click  and  drag  elements   and  (7)  Avoid  double-­‐clicking  elements.       ︎>    Presenta/on:  (10)  Hierarchically  structure  content.       >    ︎Naviga/on:  (12)  Provide  naviga;on  bars,  (13)  Provide  quick  access  to   different  topics  within  a  website,  (17)     Provide  skip  links  (e.g.,  to  main  content).     Adapta5on_Technique   •  Presenta/on   •  Naviga/on   •  Content   Adapta5on_Repository   •  Core_Adapta/on_Technique   •  Preferences_Adapta5on_Technique   •  Behaviour_Adapta5on_Technique   ...   11  /  18  
  12. 12. INTERACCIÓN 2015Elaborating a Web Interface Personalization Process Laboratory of Human-Computer Iinteraction for Special Needs Case study: Adaptation Repository 2) Behaviour_Adaptation_Techniques: “observations revealed that specific pointing devices (joystick, trackball,…) lack of accuracy on pointing” >    Content:  (1)  Add  hot  area  around  hyperlinks  and  (4)  Incorporate   buDons  for  browser  “Back”  and  “Forward”  func;onali;es.       >    Presenta/on:  (8)  Define  large  clickable  area  for  links  and  buDons  in  a   visible  way  and  (9)  Define  links  and  buDons  well  separated.     Adapta5on_Technique   •  Presenta/on   •  Naviga5on   •  Content   Adapta5on_Repository   •  Core_Adapta5on_Technique   •  Preferences_Adapta5on_Technique   •  Behaviour_Adapta/on_Technique   ...   12  /  18  
  13. 13. INTERACCIÓN 2015Elaborating a Web Interface Personalization Process Laboratory of Human-Computer Iinteraction for Special Needs Case study: Adaptation Repository 2”) Behaviour_Adaptation_Techniques: “specific pointing devices (joystick, trackball,…) were not used to keyboard specific keys for scrolling interactions” >    Content:  (2)  Use  stretchtext  in  main  content  and  (3)  Incorporate   specific  scrolling  icons  on  each  page.       >    Naviga/on:  (16)  Provide  internal  links  to  important  content  on  the   page  (e.g.,  return  to  the  top  of  page).     >    Presenta/on:  (11)  Break  pages  into  chunks  of  no  more     than  one  or  two  screens.   Adapta5on_Technique   •  Presenta/on   •  Naviga/on   •  Content   Adapta5on_Repository   •  Core_Adapta5on_Technique   •  Preferences_Adapta5on_Technique   •  Behaviour_Adapta/on_Technique   ...   13  /  18  
  14. 14. INTERACCIÓN 2015Elaborating a Web Interface Personalization Process Laboratory of Human-Computer Iinteraction for Special Needs Case study: Adaptation Repository 3) Behaviour_Adaptation_Techniques: “performance of numeric keypad users depends on distance and number of keystrokes to reach a target” >    Naviga/on:  (14)  Provide  an  index  with  informa;on  in  the  page,  (15)   Create  a  table  of  contents  for  the  website  and  (18)  Disable  non-­‐ recommended  links  (e.g.,  banners).     Adapta5on_Technique   •  Presenta5on   •  Naviga/on   •  Content   Adapta5on_Repository   •  Core_Adapta5on_Technique   •  Preferences_Adapta5on_Technique   •  Behaviour_Adapta/on_Technique   ...   14  /  18  
  15. 15. INTERACCIÓN 2015Elaborating a Web Interface Personalization Process Laboratory of Human-Computer Iinteraction for Special Needs Case study: Adaptation Repository 4) Preferences_Adaptation_Techniques:   >    Hide/show  specific  scrolling  icons     >    Hide/show  buUons  for  browser  “Back”  and  “Forward”  func5onali5es     >    Define  the  preferred  loca5on  for  scrolling  icons     >    Define  the  preferred  loca5on  for  browser  “Back”  and  “Forward”   func5onali5es     >    Hide/show  accesskeys  for  scrolling/browser  “Back”  and  “Forward”   buUons     >    Hide/show  accesskeys  for  main  content  sec5ons  in  the  website   Adapta5on_Technique   •  Presenta/on   •  Naviga/on   •  Content   Adapta5on_Repository   •  Core_Adapta5on_Technique   •  Preferences_Adapta/on_Technique   •  Behaviour_Adapta5on_Technique   ...   15  /  18  
  16. 16. INTERACCIÓN 2015Elaborating a Web Interface Personalization Process Laboratory of Human-Computer Iinteraction for Special Needs Case study: Results > Adaptation system implemented based on the conceptual model including: •  Extended WAI-ARIA language for semantic annotations •  Adaptation repository including adaptation techniques related to core, behaviour and preferences •  Adaptation process considering transformation in the conceptual model •  Preference definition system for personalized web interfaces 16  /  18  
  17. 17. INTERACCIÓN 2015Elaborating a Web Interface Personalization Process Laboratory of Human-Computer Iinteraction for Special Needs Conclusions •  We have proposed a conceptual model to facilitate the complex adaptation process of web sites •  The conceptual model defines main components & phases of the adaptation process •  The model has been theoretically validated in a case study with physically impaired users •  An adaptation systems was implemented and is being evaluated 17  /  18  
  18. 18. Laboratory of Human-Computer Iinteraction for Special Needs Thank you for your attention Questions? Elaborating a Web Interface Personalization Process : www.jeduardoperez.info : @j_eduardoperez : juaneduardo.perez@ehu.eusSeptember 7th 2015, Vilanova I la Geltrú (Spain) Session 9: Interface Design XVI International Conference on HCI (Interacción 2015)

×