1. M obile U ser I nterface Survey March 11, 2011 Hyojin Song

2. Contents Introduction Mobile Web browser UI Mobile Application UI Mobile Widget UI Conclusion 2 / 30

3. Introduction Mobile user interface is have become popular research issue There are more mobile phones in the world than personal computers Current mobile devices support communication and social services through three major user interface (UI) tools 1. Mobile Web Browser 2. Mobile Application 3. Mobile Widget In several conference and journal, a lot of paper is being published about mobile user interface. Mobile HCI 2010, IUI2011, Interact 2009, … 3 / 30

4. Introduction 4 / 30 Mobile Web Browser The web browser on a mobile device that supports access to all web sites through a conventional browser UI. Mobile Application The basic building block of native mobile functions. Some recent ones are also mashed-up with web content. Mobile Widget It delivers a small piece of web information to mobile devices without user intervention.

5. Introduction The current tools have some major problems Due to the size restrictions of mobile phones, providing a more usable interface is hard to achieve All the content is confined to separate applications Navigating in mobile environment is time-consuming and prone to error Mobile applications organize information through hierarchical structures Users need to navigate from high to low levels when performing a task For example, confused by the different behaviors of Back in web browser 5 / 30

6. Contents Introduction Mobile Web browser UI Mobile Application UI Mobile Widget UI Conclusion 6 / 30

7. Mobile Web Browser UI Exploring Cross-Device Web Use on PCs and Mobile Devices Users share web information between devices Many current mobile devices offer full-featured web browsers that allow access to any web page But generally used cumbersome manual methods to do so Users visited many of the same sites on both their mobile device and PC Automatically sharing web activity information between devices has potential to improve the usability of the mobile web Provide users with the ability to quickly look up facts, exchange messages with friends, read news articles, find maps or directions, etc. Study 1: A Survey of Multi-device Web Use Study 2: Logging Web Activity on Multiple Devices 7 / 30

8. Mobile Web Browser UI Exploring Cross-Device Web Use on PCs and Mobile Devices How mobile web users accessed web sites on their mobile devices Informants reported that they used bookmarks much more frequently than they typed in URLs 8 / 30

9. Mobile Web Browser UI Optimizing User Interaction for Web-based Mobile Tasks The design and prototype implementation of MIntOS (Mobile Interaction Optimization System) A system for improving mobile interaction in web-based activities MintOS monitors users interactions both for gathering interaction history and for the runtime construction of interaction context Interaction history is defined by a set of interaction state Page-load event URL-Input event Text-Highlight event Text-Copy event Text-Paste event Form-Input event 9 / 30

10. Mobile Web Browser UI Optimizing User Interaction for Web-based Mobile Tasks These demonstration employs three real world use scenarios: 10 / 30

11. Mobile Web Browser UI Wish I Hadnt Clicked That: Context Based Icons for Mobile Web Navigation and Directed Search Tasks Examples of hyperlinks on two mobile web pages augmented with mouse-over SemantiLynx icons 11 / 30

12. Mobile Web Browser UI Wish I Hadnt Clicked That: Context Based Icons for Mobile Web Navigation and Directed Search Tasks Overview of SemantiLynx icon generation 12 / 30

13. Mobile Web Browser UI Wish I Hadnt Clicked That: Context Based Icons for Mobile Web Navigation and Directed Search Tasks Process of composition the icon and the algorithm 13 / 30

14. Mobile Web Browser UI Find This For me: Mobile Information Retrieval on the Open Web Search Results in a webpage Highlighted using dotted rectangle Each of them are presented using similar pattern 14 / 9

15. Mobile Web Browser UI Find This For me: Mobile Information Retrieval on the Open Web Result form detection It is represented the DOM tree node 15 / 30

16. Contents Introduction Mobile Web browser UI Mobile Application UI Mobile Widget UI Conclusion 16 / 30

17. Mobile Application UI SocialSearchBrowser: A novel mobile search and information discovery tool The mobile Internet offers anytime, anywhere access to a wealth of information Limitations of mobile environments that go beyond simple screen size and network issues SocialSearchBrowser (SSB in short) is a map-based mobile search prototype designed to enhance the search and information discovery See the queries and interactions of peers Pose queries of their own Interactions are handled on a rich map-based interface. 17 / 30

18. Mobile Application UI SocialSearchBrowser: A novel mobile search and information discovery tool Screenshots of the SocialSearchBrowser Application 18 / 30

19. Mobile Application UI SocialSearchBrowser: A novel mobile search and information discovery tool The software architecture of SSB consists of three components iPhone application allows users to browse, answer and add queries Facebook application Allows a given users social network to browse queries and add new answers to those queries A server Synchronizes and stores all queries in the SSB database Feeds both applications with an up-to-date list of all queries and answers Using the Google Local Search API and the Eventful API SMS notification facility 19 / 30

20. Mobile Application UI Linked Internet UI: A Mobile User Interface Optimized The Linked Internet UI as a new mobile UI to deliver social services It fetches and links content from existing services and uses hypertext navigation for presentation and interaction LinkedUI removes unnecessary boundaries of individual applications and services Contribution of this application Users can concentrate on the content that interests them instead of accessing separate web sites applications, or widgets Enables a consistent interaction style on a mobile device by applying hypertext navigation system-wide Facilitate using multiple services Twitter, Facebook, Flickr, Delicious 20 / 30

21. Mobile Application UI Linked Internet UI: A Mobile User Interface Optimized Hypertext Navigation On mobile devices, many researches address hypertext navigation in web applications Hypertext navigation mechanisms include back-stepping, bookmarking, and a history list Users rely on these mechanisms to navigate in the web. 21 / 30

22. Mobile Application UI Linked Internet UI: A Mobile User Interface Optimized Screenshots of the Linked Internet UI (Hypertext navigation) 22 / 30

23. Contents Introduction Mobile Web browser UI Mobile Application UI Mobile Widget UI Conclusion 23 / 30

24. Mobile Widget UI SmartActions: Context-Aware Mobile Phone Shortcuts Due to the size restrictions of mobile phones, providing a more usable interface is hard to achieve Context awareness can be used to facilitate the interaction of the user by recognizing the user context Making available appropriate shortcuts, thus minimizing the users interaction with the device through the UI The use of unsupervised learning to automate common tasks on a mobile phone By means of context-dependent quick-access shortcuts displayed in the home screen of the device 24 / 30

25. Mobile Widget UI SmartActions: Context-Aware Mobile Phone Shortcuts Screenshots of the application 25 / 30

26. Mobile Widget UI Inducing Shortcuts on a Mobile Phone interface Inducing shortcuts to automate common tasks on a mobile phone Compare several approaches Focused on the issue of stable vs. changing shortcuts How the trade-off between efficiency and predictability should be evaluated? 26 / 30

27. Mobile Widget UI Comparison of Tag Cloud Layouts Visual browsing in the tag collections is realized in different ways; often, websites offer an interface element known as tag cloud The analysis of the eye tracking data was performed in an exploratory manner looking for typical patterns in the visual search 27 / 30

28. Contents Introduction Mobile Web browser UI Mobile Application UI Mobile Widget UI Conclusion 28 / 30

29. Conclusion Mobile user interface is have become popular research issue There are more mobile phones in the world than personal computers Due to the hardware restrictions(screen size, performance, etc.) of mobile phones, we can find several method to improve a user activity for mobile phone unlike personal computer Context awareness technique or improvement of web navigation for mobile UI is one of the useful research topic 29 / 30

30. Thank You! Any question or comment?