30
Mobile User Interface Survey March 11, 2011 Hyojin Song

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

Embed Size (px)

Citation preview

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

Mobile User Interface Survey

March 11, 2011Hyojin Song

Page 2: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

Contents

Introduction

Mobile Web browser UI

Mobile Application UI

Mobile Widget UI

Conclusion

2 / 30

Page 3: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

Introduction

Mobile user interface is have become popular re-search 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 Browser2. Mobile Application3. Mobile Widget

In several conference and journal, a lot of paper is be-ing published about mobile user interface.› Mobile HCI 2010, IUI2011, Interact 2009, …

3 / 30

Page 4: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

Introduction

4 / 30

Mobile Web Browser

The web browser on a mobile device that supports access to all web sitesthrough 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 deviceswithout user intervention.

Page 5: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

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

Page 6: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

Contents

Introduction

Mobile Web browser UI

Mobile Application UI

Mobile Widget UI

Conclusion

6 / 30

Page 7: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

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 de-

vice and PC

Automatically sharing web activity information be-tween devices has potential to improve the usability of the mobile web› Provide users with the ability to quickly look up facts, ex-

change 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

Page 8: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

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

Page 9: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

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 activ-

ities› MintOS monitors users’ interactions both for gathering inter-

action 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

Page 10: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

Mobile Web Browser UI

Optimizing User Interaction for Web-based Mobile Tasks

These demonstration employs three real world use scenarios:

10 / 30

Page 11: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

Mobile Web Browser UI

Wish I Hadn’t 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

Page 12: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

Mobile Web Browser UI

Wish I Hadn’t Clicked That: Context Based Icons for Mobile Web Navigation and Directed Search Tasks

Overview of SemantiLynx icon generation

12 / 30

Page 13: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

Mobile Web Browser UI

Wish I Hadn’t Clicked That: Context Based Icons for Mobile Web Navigation and Directed Search Tasks

Process of composition the icon and the algorithm

13 / 30

Page 14: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

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

Page 15: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

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

Page 16: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

Contents

Introduction

Mobile Web browser UI

Mobile Application UI

Mobile Widget UI

Conclusion

16 / 30

Page 17: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

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 inter-face.

17 / 30

Page 18: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

Mobile Application UI

SocialSearchBrowser: A novel mobile search and information discovery tool

Screenshots of the SocialSearchBrowser Application

18 / 30

Page 19: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

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 user’s 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

Page 20: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

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 ap-

plications and services

Contribution of this application› Users can concentrate on the content that interests them in-

stead of accessing separate web sites applications, or wid-gets

› 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

Page 21: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

Mobile Application UI

Linked Internet UI: A Mobile User Interface Optimized

Hypertext Navigation› On mobile devices, many researches address hypertext navi-

gation 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

Page 22: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

Mobile Application UI

Linked Internet UI: A Mobile User Interface Optimized

Screenshots of the Linked Internet UI (Hypertext navi-gation)

22 / 30

Page 23: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

Contents

Introduction

Mobile Web browser UI

Mobile Application UI

Mobile Widget UI

Conclusion

23 / 30

Page 24: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

Mobile Widget UI

SmartActions: Context-Aware Mobile Phone Shortcuts

Due to the size restrictions of mobile phones, provid-ing a more usable interface is hard to achieve

Context awareness can be used to facilitate the inter-action of the user by recognizing the user context

Making available appropriate shortcuts, thus minimiz-ing the user’s interaction with the device through the UI

The use of unsupervised learning to automate com-mon tasks on a mobile phone› By means of context-dependent quick-access shortcuts dis-

played in the home screen of the device

24 / 30

Page 25: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

Mobile Widget UI

SmartActions: Context-Aware Mobile Phone Shortcuts

Screenshots of the application

25 / 30

Page 26: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

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

Page 27: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

Mobile Widget UI

Comparison of Tag Cloud Layouts

Visual browsing in the tag collections is realized in dif-ferent ways; often, websites offer an interface ele-ment 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

Page 28: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

Contents

Introduction

Mobile Web browser UI

Mobile Application UI

Mobile Widget UI

Conclusion

28 / 30

Page 29: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

Conclusion

Mobile user interface is have become popular re-search issue› There are more mobile phones in the world than personal

computers

Due to the hardware restrictions(screen size, perfor-mance, 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

Page 30: M obile U ser I nterface Survey March 11, 2011 Hyojin Song

Thank You!

Any question or comment?