Flippable User Interfaces for Internationalization

1,046 views

Published on

The language reading direction is probably one of the most determinant factors influencing the successful internationalization of graphical user interfaces, beyond their mere translation. Western languages are read from left to right and top to bottom, while Arabic languages and Hebrew are read from right to left and top to bottom, and Oriental languages are read from top to bottom. In order to address this challenge, we introduce flippable user interfaces that enable the end user to change the reading direction of a graphical user interface by flipping it into the desired reading direction by direct manipulation. This operation automatically and dynamically changes the user interface layout based on a generalized concept of reading direction and translates it according to the end user’s preferences.

Published in: Technology, News & Politics
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,046
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
6
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • Localization is the process of adapting software to culture, continent, country, region or a set of them. The software copy is created for each adaptation. Changes can be just for one copy (colors), or can be unified for the different copies (orange).Globalization is the process of creating UI the accommodates the common ground of largest possible audience from different cultures, continents, countries, regions. This means one single UI.
  • Flippable User Interfaces for Internationalization

    1. 1. Flippable User Interfaces for Internationalization<br />IyadKhaddam and Jean Vanderdonckt<br />LILAB – Louvain Interaction Laboratory<br />Université catholique de Louvain<br />Belgium<br />Pisa, June 13th- 16th, 2011<br />
    2. 2. Content<br />Internationalization<br />Flippable UI: An Interaction technique To language adaptation<br />Flippable UI: Design Principles<br />Tool Architecture<br />Demo<br />
    3. 3. Internationalization<br />Globalization<br />Localization<br />Software<br />Software<br />EU<br />ME<br />ASIA<br />EU<br />ME<br />ASIA<br />FR<br />JP<br />AR<br />FR<br />JP<br />AR<br />
    4. 4. Internationalization<br />Localization factors:<br />Color<br />Format<br />Metaphor<br />Screen<br />Layout<br />Image<br />Structure<br />Language<br />…<br />User Preferences: End user can adapt the UI (Adaptability)<br />Adaptation logic will handle culture awareness (Adaptive)<br />
    5. 5. Internationalization<br />Language:<br />A critical localization factor.<br />Translation of content, layout adaptation to reading direction<br />Other less critical lexical aspects: color, font, size.<br />Other high-level, hard to predict aspects: metaphors, organization.<br />
    6. 6. Content<br />Internationalization<br />Flippable UI: An Interaction technique To language adaptation<br />Flippable UI: Design Principles<br />Tool Architecture<br />Demo<br />
    7. 7. Flippable UI<br />An Interaction technique To language adaptation.<br />3 Fields of research:<br />Adaptation to Cultural background: <br /> technical adaptations (alphabet, character set), national Adaptation (add nation-relevant information), cultural adaptation (habits, attitude, conventions and meanings).<br />
    8. 8.
    9. 9. Flippable UI<br />An Interaction technique To language adaptation.<br />3 Fields of research:<br />Adaptation to Cultural background<br />Interaction Techniques:<br /> Flipping a page of a book. Increase end user’s subjective satisfaction and naturalness of interaction. <br />
    10. 10. Flippable UI<br />An Interaction technique To language adaptation.<br />3 Fields of research:<br />Adaptation to Cultural background<br />Interaction Techniques<br />Animated Transitions:<br /> Convey the change of display<br />
    11. 11. Content<br />Internationalization<br />Flippable UI: An Interaction technique To language adaptation<br />Flippable UI: Design Principles<br />Tool Architecture<br />Demo<br />
    12. 12. Flippable UI: Design Principles<br />Principles:<br />#1: Provide Handles for direct flipping<br />
    13. 13.
    14. 14. Flippable UI: Design Principles<br />Principles:<br />#1: Provide Handles for direct flipping<br />#2: Perform Adaptation according to flipping<br />
    15. 15. Left To Right, Top To Bottom<br />Right To Left, Top To Bottom<br />Left To Right, Bottom To Top<br />Right To left, Bottom To Top<br />
    16. 16. Flippable UI: Design Principles<br />Principles:<br />#1: Provide Handles for direct flipping<br />#2: Perform Adaptation according to flipping<br />#3: Ensure smooth transition for adaptation<br />
    17. 17.
    18. 18. Content<br />Internationalization<br />Flippable UI: An Interaction technique To language adaptation<br />Flippable UI: Design Principles<br />Tool Architecture<br />Demo<br />
    19. 19.
    20. 20. Content<br />Internationalization<br />Flippable UI: An Interaction technique To language adaptation<br />Flippable UI: Design Principles<br />Tool Architecture<br />Demo<br />
    21. 21. Acknowledgments<br />LILAB<br />
    22. 22. Questions?<br />Thank You.<br />IyadKhaddam (iyad.khaddam@student.uclouvain.be) and Jean Vanderdonckt (jean.vanderdonckt@uclouvain.be) <br />

    ×