1. collapse-to-zoom patrick baudisch microsoft research, visualization & interaction research xing xie, chong wang, and wei-ying ma collapse expand

2. short demo (there will be a second, slightly longer demo at the end of this talk)

3. contents short demo the problem: viewing large documents on small screens related work: overviews, fisheyes,… collapse-to-zoom: removing irrelevant content… …in a single pen stroke ( marquee menu) slightly longer demo conclusions

4. scenario: web pages don’t fit on PDA screen

6. related work approaches device-specific authoring multiple-device authoring automatic re-authoring and client-side navigation thumbnail views collapse-to-zoom

7. related work: zooming [Xie etc. al, www’04]: tap to zoom into a tile

8. related work: overview+detail [O’Hara et. at CHI 99]: readable text on hover

9. related work: multiple foci [Wobbrock++ UIST’02]: Web thumb

10. ? limitation of zooming page content is unreadable… …so how can users know where to zoom in?

11. collapse-to-zoom

12. allow users to use their knowledge about relevant areas  zoom in (arbitrary rectangular regions).

13. collapse-to-zoom allow users to use their knowledge about relevant areas  zoom in …but also allow leveraging their knowledge about what is not relevant  collapse

14. collapse-to-zoom always show full page width use freed space to grow remaining (relevant) content

15. collapse-to-zoom provide visual context at all times: placeholders

16. collapse-to-zoom allow bookmarking collapsed state

17. marquee menu

18. marquee menu: there are 4 ways to select today: no distinction between the four ways of opening rectangular selection

19. the name of the game photoshop: “ marquee selection” “marking menu ”: selecting commands with a pen stroke combine both  marquee menu

20. marquee menu: direction selects 1 of 4 commands collapse-cell expand-cell collapse-column expand&zoom expand collapse an main com ds m

21. slightly longer demo

22. implementation runs on desktop / tabletPC page-splitting based on DOM limitation: can’t start drag over link  user study

23. next steps: transfer to smartphone generic label cells with numeric codes and let users enter cell label [Paek et al. CSCW 2004] simple: reduce to 1D collapse column and expand column  webTV

24. next steps: integrating it all collapse-to-zoom for interaction semantic thumbnails fits page to screen width fishnet fits page to screen height ++

25. thanks! try it out: demo reception tonight http://patrickbaudisch.com thanks to xing xie chong wang, and wei-ying ma MSR VIBE

26. related work: halo peripheral awareness indicator keep it off-screen, but show the user [baudisch CHI 2003]

27. next visit of that page: page is already pre-collapsed which leads to fully readable detail view User uses expand-and-zoom gesture… User can follow links directly from within overview Content area expands more and is now readable …make page content grown. Now collapses “menu” column user collapses “archive” column to… collapse- to-zoom: walk through thumbnail view: unreadably small zoom into relevant areas and remove irrelevant areas (such as “menu” and “ad” columns)

28. collapse-to-zoom in order to make something bigger we need to make something else smaller

29. related work: search terms [baudisch++AVI’04] fishnet require search terms [woodruff++CHI’02] popout prism/ enhanced thumbs