This link has been bookmarked by 79 people . It was first bookmarked on 07 Aug 2008, by Piotr Król.
-
19 Feb 12
-
28 Sep 11
Alex KnabGood examples of design flow, as well as emotion. Goes in detail on both and gives examples.
-
14 May 11
-
21 Feb 11
-
01 Nov 10
-
28 Oct 10
-
The psychologist Mihaly Csikszentmihalyi (1990) has described focused attention as “psychic energy”. Like energy in the traditional sense, no work can be done without it, and through work that energy is consumed. Most of us have experienced a mental/emotional state where all of our attention (or energy) is totally focused on an activity. Csikszentmihalyi (1990) named this state “flow,” based on how participants in his studies described the experience.
-
- A clear goal
-
- Immediate feedback on the success of attempts to reach that goal
-
- A challenge you’re confident you have the skills to handle
-
Different motivations for using a website require different designs to facilitate flow (Novak, Hoffman and Yung 1996). Novice users tend to see the Internet in a playful way, while more experienced users tend to view the Internet in a more utilitarian way (King 2003).
-
- Clear navigation: Make it easy for the user to know where they are, where they can go, and where they’ve been, by including signposts such as breadcrumbs, effective page titles, and visited link indicators.
- Immediate Feedback: Make sure all navigation, such as links, buttons, and menus provide quick and effective feedback. Offer feedback for all user actions. When this isn’t possible, provide an indicator to hold the user’s attention while waiting (e.g., progress bar).
- Balance the Perception of Challenge With the User’s Skill: Since user skill levels differ, it’s up to you to balance the complexity of the visual design with the number of tasks and features people can use. Consider whether they are likely surfing experientially for fun or completing an important task. Tailor your sites to your audience’s scenario of use: more visually rich for experiential use and less so for goal-directed use.
Here are some basic website traits that will help to encourage flow.
-
Adaptable interfaces that allow the user to increase or decrease the perceived challenge by choosing how much detail is displayed. Simplicity helps reduce anxiety for both novices and experts, which is especially crucial in highly stressful situations. Options for information-rich displays can introduce challenge for more experienced users.
Whether you’re an information architect, interaction designer or visual designer, your work should compel users to invest their attention, and then provide them with a return on that investment.Remember, designing for flow doesn’t require a new set of tools or skills – only a different way of thinking. Finding the right balance of design and challenge can help focus attention and create flow, which results in immersive and engaging user experiences.
-
-
04 Aug 10
-
16 Jun 10
-
18 Jan 10
-
13 Jan 10
-
12 Jan 10
-
09 Dec 09
-
24 Sep 09
-
14 Jul 09
-
20 May 09
-
- A clear goal
- Immediate feedback on the success of attempts to reach that goal
- A challenge you’re confident you have the skills to handle
- Total concentration and focused attention
- A sense of control over interactions
- Openness to new things
- Increased exploratory behavior
- Increased learning
- Positive feelings
- Loss of consciousness of self
- Distortions in the perception of time
- Activity is perceived as intrinsically rewarding
The elements associated with the flow state can be classified into the three areas; 1. Causes of Flow 2. Characteristics of Flow 3. Consequences of Flow (Novak, Hoffman and Yung, 1999).
1. Causes of Flow
2. Characteristics of Flow
3. Consequences of Flow
-
too much challenge with too little skill causes anxiety; and too little challenge with too much skill causes boredom.
-
Flow occurs at the boundary between boredom and anxiety. Think of it as a channel that runs between anxiety and boredom.(Figure 1)

Figure 1: Anxiety, Boredom and Flow (Csikszentmihalyi, 1990)
(captions added van Gorp, 2006) -
As the challenges we face increase, we become more anxious and lose flow. Re-entering flow involves increasing our skills to match these challenges and reduce anxiety. As we increase our skill level, we become bored unless we increase the challenge to match our greater abilities.
-
- Less challenging
- More exploratory
- Entertainment-oriented
- More challenging
- Less exploratory
- Connected with tasks (e.g. research, work and shopping)
Goal-directed vs. Experiential Use
Different motivations for using a website require different designs to facilitate flow (Novak, Hoffman and Yung 1996). Novice users tend to see the Internet in a playful way, while more experienced users tend to view the Internet in a more utilitarian way (King 2003). This leads to a distinction between experiential and goal-directed use. Flow tends to occur more often during goal-directed use, because of the higher challenge involved.
Novice Users – Experiential use
Experienced Users – tendency towards Goal-directed use
-
The lower level of challenge in an entertainment-oriented, experiential site means there is a lower level of anxiety connected with its use. Someone who is less anxious is more capable of using creative thought to determine how to navigate a website and overlook minor problems. Motivation here is driven by subconscious arousal triggered by interesting visual elements, bright colors or high contrast. Experiential sites can and should be more arousing visually to demand the greater attention that can lead to flow experiences.
-
The greater challenge of completing tasks (possibly under deadlines) on a goal-directed site creates more higher arousal. Anxiety makes users less able to think creatively when problems are encountered. If a product will be used in a stressful environment, like a hospital operating room, usability becomes crucial. All relevant information needs to be close at hand and visible and feedback should be clear and immediate. A goal-directed site can and should be less visually rich so that users, already anxious at the prospect of a challenging task, are not overwhelmed.

-
Finding the right balance of design and challenge can help focus attention and create flow, which results in immersive and engaging user experiences.
-
-
16 Feb 09
-
27 Jan 09
-
27 Dec 08
-
Clif Mims"Article of about Flow Theory and how to integrate flow with graphic design and interface design." (Michael M. Grant)
-
09 Dec 08
Bernard FarrellUsing Flow to influence the design of user interfaces.
-
19 Nov 08
-
25 Oct 08
-
07 Oct 08
-
02 Oct 08
Little Stepsune introduction à la notion de "flow" et comment favoriser au travers du design le fait de conserver l'attention de l'utilisateur, qu'il reste dans le "flow".
-
1. A clear goal…
-
2. With immediate feedback on the success of attempts to reach that goal…
-
3. Presented as a challenge that you have the skills to handle.
-
- Clear navigation: Make it easy for the user to know where they are, where they can go, and where they’ve been, by including signposts such as breadcrumbs, effective page titles, and visited link indicators.
- Immediate Feedback: Make sure all navigation, such as links, buttons, and menus provide quick and effective feedback. Offer feedback for all user actions. When this isn’t possible, provide an indicator to hold the user’s attention while waiting (e.g., progress bar).
- Balance the Perception of Challenge With the User’s Skill: Since user skill levels differ, it’s up to you to balance the complexity of the visual design with the number of tasks and features people can use. Consider whether they are likely surfing experientially for fun or completing an important task. Tailor your sites to your audience’s scenario of use: more visually rich for experiential use and less so for goal-directed use.
Here are some basic website traits that will help to encourage flow.
-
-
11 Sep 08
-
09 Sep 08
-
01 Sep 08
-
The psychologist Mihaly Csikszentmihalyi (1990) has described focused attention as “psychic energy”. Like energy in the traditional sense, no work can be done without it, and through work that energy is consumed. Most of us have experienced a mental/emotional state where all of our attention (or energy) is totally focused on an activity. Csikszentmihalyi (1990) named this state “flow,” based on how participants in his studies described the experience.
-
flow state can be classified into the three areas; 1. Causes of Flow 2. Characteristics of Flow 3. Consequences of Flow (Novak, Hoffman and Yung, 1999)
-
- A clear goal
- Immediate feedback on the success of attempts to reach that goal
- A challenge you’re confident you have the skills to handle
-
- Loss of consciousness of self
- Distortions in the perception of time
- Activity is perceived as intrinsically rewarding
-
- Providing immediate feedback
- Balancing the perception of challenge against users’ skills
The main elements designers can control are:
-
he user navigates to accomplish a task, like seeking information on a particular topic or surfing for fun
-
receives quick, sensory feedback in the form of a visual shift and/or sound from links, buttons, menus, or other navigation items.
-
The opportunities for action are balanced with the user’s ability. At a basic level, this is accomplished by providing an uncluttered interface and eliminating unnecessary information to limit the user’s cognitive load.
-
Flow and Emotion
-
Flow tends to occur in situations with higher levels of challenge and skill. If the challenge is too easy, or user skill levels are very high, anxiety can be so low that there is little motivation to do anything. This level of activation or “arousal” in the body is the physiological (i.e., bodily) dimension of emotion. The level of arousal affects how intensely we experience a given emotion, and intense emotions demand our attention. In evolutionary terms,
-
Both pleasant and unpleasant objects and experiences can increase arousal levels. Frustration and the excitement both increase arousal levels. So do large images, bright colors, and high contrast (van Gorp, 2006).
-
Goal-directed vs. Experiential Use
Different motivations for using a website require different designs to facilitate flow (Novak, Hoffman and Yung 1996). Novice users tend to see the Internet in a playful way, while more experienced users tend to view the Internet in a more utilitarian way (King 2003).
-
- Less challenging
- More exploratory
- Entertainment-oriented
Novice Users – Experiential use
-
- More challenging
- Less exploratory
- Connected with tasks (e.g. research, work and shopping)
Experienced Users – tendency towards Goal-directed use
-
-
25 Aug 08
william doustThese concepts should be easily transferable to the design and development of more engaging training materials and presenations in a learning & interactive environment.
psychology productivity interaction usability user web webdesign user-experience campaignforlearning campaign4learning framework research
-
Ethan GardnerStart by removing distractions or impediments wherever possible. For both physical and interactive products, this means reducing or eliminating both external (i.e., environmental) and internal (i.e., pain, discomfort, anxiety) distractions that cause emot
-
24 Aug 08
-
20 Aug 08
-
19 Aug 08
Kristan Hodgegood advice on how to keep the user's attention and keep them feeling "in control"
-
A clear goal
-
Immediate feedback on the success of attempts to reach that goal
-
A challenge you’re confident you have the skills to handle
-
Flow occurs at the boundary between boredom and anxiety
-
-
18 Aug 08
George KaoFlow: a state of uninterrupted concentration and enjoyment
flow ux ui IA webdesign psychology ursaminor.com Delicious2012
-
14 Aug 08
-
13 Aug 08
Heidi MorrisDesigning to encourage people to "get in the zone."
-
Simone Economo"The psychologist Mihaly Csikszentmihalyi (1990) has described focused attention as “psychic energy”. Like energy in the traditional sense, no work can be done without it, and through work that energy is consumed. Most of us have experienced a mental/emot
emotion flow design webdesign psychology productivity user attention experience interface information architecture interaction ux ui ixd ia user-experience user-interface interaction-design information-architecture 5-stars for:andreagandino for:craiv for:
-
11 Aug 08
Johann RichardWe create software and websites to display and represent information to people. That information could be anything; a company’s product list, pictures of your vacation, or an instant message from a friend. At this moment, there’s more information availabl
webdesign web ux userexperience uxd usability ui toread psychology for:unic.com *****
-
Noah UllmannWe create software and websites to display and represent information to people. That information could be anything; a company’s product list, pictures of your vacation, or an instant message from a friend. At this moment, there’s more information availabl
-
10 Aug 08
craig rolandFlow + Design = Satisfied Users (apply this to lessons/projects in the classroom?)
-
09 Aug 08
Michael M GrantArticle of about Flow Theory and how to integrate flow with graphic design and interface design.
design graphic web development learning theory flow motivation
-
08 Aug 08
Alan McCluskeyAbout the design of web sites ... (link thanks to Javed)
-
When attention becomes a scarce resource, it’s important to invest it wisely. Information architects and designers play a critical role in ensuring the products they design provide users’ with a return on their investment of attention.
-
-
07 Aug 08
-
Piotr KrólWe create software and websites to display and represent information to people. That information could be anything; a company’s product list, pictures of your vacation, or an instant message from a friend. At this moment, there’s more information available to you than at any other time in history.
Would you like to comment?
Join Diigo for a free account, or sign in if you are already a member.