skip to main content
10.1145/1166253.1166280acmconferencesArticle/Chapter ViewAbstractPublication PagesuistConference Proceedingsconference-collections
Article

Phosphor: explaining transitions in the user interface using afterglow effects

Published:15 October 2006Publication History

ABSTRACT

Sometimes users fail to notice a change that just took place on their display. For example, the user may have accidentally deleted an icon or a remote collaborator may have changed settings in a control panel. Animated transitions can help, but they force users to wait for the animation to complete. This can be cumbersome, especially in situations where users did not need an explanation. We propose a different approach. Phosphor objects show the outcome of their transition instantly; at the same time they explain their change in retrospect. Manipulating a phosphor slider, for example, leaves an afterglow that illustrates how the knob moved. The parallelism of instant outcome and explanation supports both types of users. Users who already understood the transition can continue interacting without delay, while those who are inexperienced or may have been distracted can take time to view the effects at their own pace. We present a framework of transition designs for widgets, icons, and objects in drawing programs. We evaluate phosphor objects in two user studies and report significant performance benefits for phosphor objects.

Skip Supplemental Material Section

Supplemental Material

1166280.mp4

mp4

141.9 MB

References

  1. Assa, J., Caspi, Y., and Cohen-Or, D. Action synopsis: pose selection and illustration. In Proc. Siggraph'05, pp. 667--676. Google ScholarGoogle ScholarDigital LibraryDigital Library
  2. Baecker, R., Small, I., and Mander, R. Bringing Icons to Life. In Proc. CHI '91, pp 1--6. 1991. Google ScholarGoogle ScholarDigital LibraryDigital Library
  3. Bartram, L. Can motion increase user interface bandwidth? In Proc. IEEE Conference on Systems, Man, and Cybernetics'97. pp. 1686--1692.Google ScholarGoogle Scholar
  4. Bartram, L., Ware, C. and Calvert, T. Moving Icons: Detection and Distraction, Interact 2001.Google ScholarGoogle Scholar
  5. Baudisch, P., Cutrell, E., and Robertson, G. High-Density Cursor: A Visualization Technique that Helps Users Keep Track of Fast-Moving Mouse Cursors. In Proc. Interact'03, pp. 236--243.Google ScholarGoogle Scholar
  6. Baudisch, P., Cutrell, E., Robbins, D., Czerwinski, M., Tandler, P. Bederson, B., and Zierlinger, A. Drag-and-Pop and Drag-and-Pick: Techniques for Accessing Remote Screen Content on Touch- and Pen-operated Systems. In Proc. Interact'03, pp. 57--64.Google ScholarGoogle Scholar
  7. Bétrancourt, M. and Tversky, B. (in press). Simple animations for organizing diagrams. International Journal of Human Computer Studies.Google ScholarGoogle Scholar
  8. Cavanagh, P. and Alvarez, G. Tracking multiple targets with multifocal attention. TRENDS in Cognitive Science, Vol. 9. No. 7, pp. 249--354, July 2005Google ScholarGoogle Scholar
  9. Chang, B.-W. and Unger, D. Animation: From Cartoons to the User Interface. In Proc. UIST'93, pp. 45--55. Google ScholarGoogle ScholarDigital LibraryDigital Library
  10. Chittaro L., and Ieronutti, L. A visual tool for tracing users' behavior in virtual environments. In Proc. AVI'04, pp. 40--47. Google ScholarGoogle ScholarDigital LibraryDigital Library
  11. Feiner, S. APEX: An Experiment in the Automatic Creation of Pictorial Explanations. IEEE Computer Graphics and Applications, 5(11), pp. 29--37, 1985.Google ScholarGoogle ScholarDigital LibraryDigital Library
  12. Flash components: download.macromedia.com/pub/documentation/en/flash/fl8/fl8_using_components.pdfGoogle ScholarGoogle Scholar
  13. Gutwin, C., and Penner, R. Improving Interpretation of Remote Gestures with Telepointer Traces. In CSCW'05, pp.49--57. Google ScholarGoogle ScholarDigital LibraryDigital Library
  14. Haller, M., Hanl, C., and Diephuis, J. Non-Photorealistic Rendering Techniques for Motion in Computer Games. In ACM Computers in Entertainment 2(4) October 2004. Google ScholarGoogle ScholarDigital LibraryDigital Library
  15. Heer, J., Card, S., and Landay, J. Prefuse: a Toolkit for Interactive Information Visualization. Proc. CHI'05, pp. 421--430. Google ScholarGoogle ScholarDigital LibraryDigital Library
  16. Hill, W., Hollan, J., Wroblewski, D., and McCandless, T. Edit wear and read wear. In Proc. CHI'92, pp.3--9. Google ScholarGoogle ScholarDigital LibraryDigital Library
  17. Hoobler, N., Humphreys, G., and Agrawala, M. Visualizing Competitive Behaviors in Multi-User Virtual Environments. In Proc. Viz'04, pp. 163--170. Google ScholarGoogle ScholarDigital LibraryDigital Library
  18. Kaptelinin, V., Mäntylä, T., Åström, J. Transient Visual Cues for Scrolling: An Empirical Study. In CHI'02 Extended Abstracts, pp. 620--621. Google ScholarGoogle ScholarDigital LibraryDigital Library
  19. Klein, C. and Bederson, B. Benefits of Animated Scrolling. In CHI'05 Extended Abstracts, pp. 1965--1968. Google ScholarGoogle ScholarDigital LibraryDigital Library
  20. Kurlander, D. J., Skelly, T, and Salesin, D. Comic Chat. In Proc. SIGGRAPH'06, pp. 225--236. Google ScholarGoogle ScholarDigital LibraryDigital Library
  21. Lowe, R. Interactive animated diagrams: what information is extracted? In Proc. First International Conference on Using Complex Information Systems, Sept. 4-6 '96, Poitiers, France.Google ScholarGoogle Scholar
  22. Masuch, M., Schlechtweg, S., and Schulz, R. Speedlines Depicting Motion in Motionless Pictures. In SIGGRAPH'99 Conference Abstracts and Applications, p. 277. Google ScholarGoogle ScholarDigital LibraryDigital Library
  23. McCloud, S. Understanding Comics. Perennial Currents, 1994.Google ScholarGoogle Scholar
  24. McCrickard, S., Catrambone, R., and Stasko, J. Evaluating Animation in the Periphery as a Mechanism for Maintaining Awareness. In Proc. INTERACT'01, pp. 148--156.Google ScholarGoogle Scholar
  25. Oksama, L. and Hyöna, J. Is multiple object tracking carried out automatically by an early vision mechanism independent of higher-order cognition? An individual difference approach. Visual Cognition, Vol. 11, pp. 631--671, 2004.Google ScholarGoogle ScholarCross RefCross Ref
  26. Reynolds, C. Stylized Depiction in Computer Graphics: Non-Photorealistic, Painterly and 'Toon Rendering. An annotated survey of online resources www.red3d.com/cwr/nprGoogle ScholarGoogle Scholar
  27. Robertson, G., Cameron, K., Czerwinski, M., Robbins, D. Poly visualization: visualizing multiple intersecting hierarchies. In CHI'02 Extended Abstracts, pp. 423--430. Google ScholarGoogle ScholarDigital LibraryDigital Library
  28. Robertson, G., Card, S., and Mackinlay, J. The cognitive coprocessor architecture for interactive user interfaces. In Proc. UIST'89, pp. 10--18. Google ScholarGoogle ScholarDigital LibraryDigital Library
  29. Stasko, J. Animation in User Interfaces: Principles and Techniques. In User Interface Software '93, pp. 81--101. Google ScholarGoogle ScholarDigital LibraryDigital Library
  30. Terveen, L. and Hill, W. Finding and visualizing inter-site clan graphs. In Proc. CHI'98, pp. 448--455. Google ScholarGoogle ScholarDigital LibraryDigital Library
  31. Thomas, B., and Calder, P. Applying Cartoon Animation Techniques to Graphical User Interfaces. In TOCHI 8(3):198--222 (2001). Google ScholarGoogle ScholarDigital LibraryDigital Library
  32. Tversky, B., Bauer Morrison, J. Bétrancourt, M. Animation: can it facilitate? Int. Journal Human-Computer Studies 57(4): 247--262 (2002). Google ScholarGoogle ScholarDigital LibraryDigital Library
  33. Ware, C., Neufeld, E. and Bartram, L. Visualizing Causal Relations. In Proc. INFOVIZ '99, pp. 39--42.Google ScholarGoogle Scholar
  34. Wickens, C. And Carswell, C. The proximity compatibility principle: its psychological foundation and relevance to display design. Human Factors 37, 473--494, 1995.Google ScholarGoogle ScholarCross RefCross Ref
  35. Woodring, J., and Shen, H.-W. Chronovolumes: A Direct Rendering Technique for Visualizing Time-Varying Data. In Proceedings IEEE TVCG Workshop on Volume Graphics 2003, pp. 27--34. Google ScholarGoogle ScholarDigital LibraryDigital Library
  36. Yantis, S. Multi-element visual tracking: Attention and perceptual organization. Cognitive Psych. 24, pp. 295--340, 1992.Google ScholarGoogle ScholarCross RefCross Ref

Index Terms

  1. Phosphor: explaining transitions in the user interface using afterglow effects

    Recommendations

    Comments

    Login options

    Check if you have access through your login credentials or your institution to get full access on this article.

    Sign in
    • Published in

      cover image ACM Conferences
      UIST '06: Proceedings of the 19th annual ACM symposium on User interface software and technology
      October 2006
      354 pages
      ISBN:1595933131
      DOI:10.1145/1166253

      Copyright © 2006 ACM

      Permission to make digital or hard copies of all or part of this work for personal or classroom use is granted without fee provided that copies are not made or distributed for profit or commercial advantage and that copies bear this notice and the full citation on the first page. Copyrights for components of this work owned by others than ACM must be honored. Abstracting with credit is permitted. To copy otherwise, or republish, to post on servers or to redistribute to lists, requires prior specific permission and/or a fee. Request permissions from [email protected]

      Publisher

      Association for Computing Machinery

      New York, NY, United States

      Publication History

      • Published: 15 October 2006

      Permissions

      Request permissions about this article.

      Request Permissions

      Check for updates

      Qualifiers

      • Article

      Acceptance Rates

      Overall Acceptance Rate842of3,967submissions,21%

      Upcoming Conference

      UIST '24

    PDF Format

    View or Download as a PDF file.

    PDF

    eReader

    View online with eReader.

    eReader