IA Summit 12: Rhythm & Flow

The first regular session I enjoyed at the summit this year was Rhythm & Flow by Peter Stahl. It was a very interesting talk that made me think about the rhythm of user interactions from a repetitive nature, and the flow that users get into when they are so entranced with a task that they forget about time.

Stahl proposed that we are at a cross roads in our own profession and that it is no longer good enough to provide functionality, we have to go further, we have to engage our users. He proposed 5 ways in which engagement can be considered:

  • Interactive Rhythm
  • Flow
  • Artifacts & Deliverables
  • Motivic Rhythm
  • Capturing Timing

Interactive Rhythm

Interactive rhythm in a way could be described as the percussion of your interactions. Read, Click, Read, Click, Read… when surfing the web, or Up, Up, Up, pause, Up, Up, Up, pause when surfing the TV lineup. What makes a rhythm is simple, repeatable tasks with a steady tempo and a reason to continue.

Tasks with rhythm are appropriate when you have one overall job, that contains repeatable interactions, has a low likelihood of errors, and when they happen errors are non-destructive and easy to correct. A user’s rhythm should only be interrupted when you need them to consciously stop and think about something. Rhythm isn’t appropriate for all tasks, and isn’t enough own it’s own to engage users.


Flow is a concept that was introduced by a guy named Mihaly Csíkszentmihályi. Flow is about doing it for the sake of doing it, everything else just falls away. There are 7 attributes of flow:

  • Clear goals and progress tracking.
  • Balance of challenge and skills.
  • Sense of control.
  • Focused concentration.
  • Loss of self-consciousness, becoming one with the activity.
  • Time distortion.
  • Self-rewarding (autotelic) experience.

Some examples he provided were Angry Birds, Pac-man and the Beetles. These lessons can also provide clear goals for web design through clears goals, feedback showing clear progress, achievable challenges, and progression through obvious next steps.

Artifacts & Deliverables

The problem with wireframes is that they’re static, but a real webpage is very interactive. A computer does not make flow, people do. We can’t achieve flow with out the people. Storyboarding would be a better solution to static wireframes. Stahl shows a great example here of A Moment in Time icons that could be used to identify interactions or human responses with emotion, visual triggers, calls to action, and feedback loops.

Motivic Rhythm

This type of rhythm has to do in a large part with timing such as responsiveness to mouseovers. Stahl talks about how to capture timing in storyboards and wireframes. He references movies and the gaming industry before showing how dance notations are captured to show movement in time. Then he showed a great flow chart for the lyrics of Hey Jude from the Love All This Tubmlr page.

Capturing Timing

He finished with a quick overview of some existing tools which may help in trying to capture timing in our deliverables such as Keynote, PowerPoint, Axure, Adobe tools, and Microsoft Expression Blend.