Flow in Web Design

Flow is an "optimal experience" that is "intrinsically enjoyable." Time seems to stand still, and we lose our sense of self. We feel playful and are willing to try (and presumably buy) new things. Although flow can occur anywhere, certain activities like rock climbing, performing surgery, chess, and sailing lend themselves to this optimal state of focused attention. Responsive, well-designed web sites can also induce a flow state in their users.

This chapter features an interview with Dr. Mihaly Csikszentmihalyi, the author of Flow and the man who coined the phrase.

Here's a complete PDF (100K, optimized) of Chapter 2 for your reading pleasure. (unoptimized PDF [123K])

Summary

  • Speed - Interactive speed is a significant factor in all models of user satisfaction. Make your pages load quickly and minimize the variability of delay. Be especially careful to avoid sluggish response while users view your pages.
  • Feedback - Provide fast, unambiguous feedback for user input and the following elements:
    • Links (include hover, visited, and active styles)
    • Navigation widgets (menus, etc.)
    • Display performance variables - (server load, cache state, page/file sizes, download progress bars)
  • Clear navigation - Include signposts - such as site maps, breadcrumb trails, and "you are here" landmarks - to help visitors find their way so they can easily form a mental model of your site.
  • Match challenges to skills - Offer an adaptable/adjustable interface that gives users control over their environment's complexity that is appropriate to their skill level. Stage their experience. Make it easy at first, but offer more complex challenges as users gain experience.
  • Simplicity - Uncluttered layout and minimal features reduce the attention load.
  • Importance - Make your offerings appear important and credible with professional design, impressive clients, and outside recognition.
  • Design for fun and utility - Offer a rich yet responsive experience plus tools to help users accomplished their goals quickly and easily.
  • Avoid cutting-edge technology - Cutting-edge technology gets in the way of user goals. Research shows that users don't want it; they just want to get their information.
  • Minimize animation - It distracts users, who often have limited attention.

Further Reading

Books

Beyond Boredom and Anxiety: Experiencing Flow in Work and Play
Mihaly Csikszentmihalyi, (1975; reprint, with a Preface by Mihaly Csikszentmihalyi, San Francisco: Jossey-Bass, 2000). This landmark book introduced the concept of flow to the public.
Finding Flow: The Psychology of Engagement with Everyday Life
Mihaly Csikszentmihalyi, (New York: Basic Books, 1997). A brief layman's introduction to flow.
From Subjective Experience to Cultural Change
Paolo Inghilleri, (New York: Cambridge University Press, 1999). Flow is like a Darwinian force of nature, subtly changing society.
Optimal Experience: Psychological Studies of Flow in Consciousness
Mihaly Csikszentmihalyi and Isabella Selega Csikzentmihalyi eds. (New York: Cambridge University Press, 1988). Modeling, defining, and measuring flow in everyday life. "Flow is a sense that humans have developed in order to recognize patterns of action that are worth preserving and transmitting over time."

Article Highlights

The Dimensionality and Correlates of Flow in Human Computer Interactions
Jane Webster, Linda Trevino, and Lisa Ryan, Computers in Human Behavior 9, no. 4 (1993): 411-426. Flow means fun and playfulness, which increases use.
Flowing with Yann Arthus-Bertrand
A review of Yann Arthus-Bertrand's site Earth from Above. Caution: this site may be flow-inducing. Optimization Week Magazine, Mar. 12, 2004
Go With The Flow
John Geirland, Wired 4, no. 9 (1996): 160-161. An interview with Mihaly Csikszentmihalyi.
How Do People Evaluate a Web Site's Credibility? Results from a Large Study
B.J. Fogg et al. found that users form a quick impression of a web site's credibility from noticing a number of factors including design look (46.1%), information design/structure (28.5%), information focus (25.1%), and information usefulness (14.8%).
Marketing in Hypermedia Computer-Mediated Environments: Conceptual Foundations
Donna L. Hoffman and Thomas P. Novak, Journal of Marketing 60 (July 1996): 50-68. The first study of flow on the web.
Measuring the Customer Experience in Online Environments: A Structural Modeling Approach
Thomas P. Novak, Donna L. Hoffman, and Yiu-Fai Yung, Marketing Science 19, no. 1 (2000): 22-42. 47% of the users surveyed had experienced flow on a particular web site.
The Influence of Goal-Directed and Experiential Activities on Online Flow Experiences
Donna L. Hoffman, Thomas P. Novak, and Adam Duhachek, Journal of Consumer Psychology 13 (2002). Contrary to previous studies found that flow is more likely to occur in task-oriented activities than during recreational activities.
The Influence of the Flow on Hedonic and Utilitarian Shopping Values
Jacques Nantel, Sylvain Senecal, and Jamel Gharbi, Advances in Consumer Research 29 (2002). Found that flow contributes to more hedonic online shopping experiences but not to utilitarian shopping.
Task Characteristics and the Experience of Optimal Flow in Human-Computer Interaction
Jawaid A. Ghani and Satish P. Deshpande, The Journal of Psychology 128, no. 4 (1994): 381-391. People in flow are more exploratory.

General Flow and HCI Resources

eLab
Vanderbilt's eLab research center is devoted to studying the Internet, including flow. Home of flow on the web pioneers, Donna Hoffman and Tom Novak.
HCI Bibliography
Features a searchable database of human-computer interaction resources. By Gary Perlman.
Human Factors International
Has an excellent free monthly newsletter on user interface design issues.