As soon as you place more than one element on the page you create a pattern and pattern is the seed of rhythm. Whether or not you plan for it, your design will have rhythm running through it. Rhythm activates space. Rhythm creates mood. Rhythm can lead visitors through your design.
Rhythm is one of the essential principles we have to work with. It’s a word you know, but perhaps one you don’t associate with design. What is rhythm in the context of visual elements and how do we create it?
What is Rhythm?
Rhythm is a regular and repeated pattern, usually of sound or movement. When you think rhythm music is probably the first thing that comes to mind. In music, rhythm is created by alternating sound and non-sound over time. When notes and chords are played in predictable intervals we get rhythm.
How do we define rhythm visually? As a design principle we can say rhythm is the patterned repetition of elements in space. We place elements on the page and experience the intervals between them. Time enters as our eye moves from one element to the next and through this rhythm in space and time we can create a sense of organized movement similar to a musical beat.
There are a variety of places where you can find rhythm.
- music — patterns of sound over timed intervals
- dance — patterns of movement and gesture through physical space
- speech — patterns of cadence in spoken words
- writing — patterns of cadence written words
- painting — patterns of brush stroke, color, shape, on a canvas
Notice the repetition of the word “patterns” in the list above. Pattern is essential to rhythm. So is repetition. The list above creates a rhythm though repetition. Visually each list item begins with a bullet. The bullet is then followed by a single bolded word, an mdash, and the words “patterns of.” Were I to add another item to the list you would expect it to follow the same predictable pattern.
Notice too, the slight variations created with the length of each line and by the links in a couple of the list items. These variations help break the monotony and add surprise and interest to the rhythm.
3 Types of Rhythm
In design we alternate the positive element with negative space to create patterns, which we then repeat and vary to create rhythm. We create rhythm through:
- repetition which creates patterns through predictability
- alternation which creates patterns through contrasting pairs (thick/thin, dark/light)
- gradation which creates patterns through a progression of regular steps
We’re creating rhythm almost immediately after we begin designing. it’s inevitable once multiple elements appear on the screen. We’d like that rhythm to be a little more planned instead of placing elements randomly though. There are 3 primary types of rhythm you can plan for.
- Regular rhythm
- Flowing rhythm
- Progressive rhythm
Regular rhythm — occurs when the intervals between elements, or the elements themselves, are similar in size or length. Regular rhythm repeats the elements over a predictable interval. Typically both interval and elements are consistent, though one or the other can be varied. The sameness of a regular rhythm creates a less interesting (though not necessarily boring) rhythm.
The regular placement of the same element is usually in a linear path. You can repeat color, shape, pattern or another characteristic of the element over a regular interval. To add more interest you can vary the interval (the space), which changes the pace of the rhythm.
You can also vary the characteristics of the element. You can keep size and shape constant while varying color or keep color and shape consistent while varying size. This variation adds some complexity, but also interest to the rhythm.
Flowing rhythm — occurs when the elements or interval are organic. The organic and natural patterns are used to create a feeling of movement. The elements could be organic over each interval or the interval itself could be organic.
Typically the element is unique, though similar, over each interval. A good example are the stripes on a tiger or zebra. No stripe is quite like the next. Seen together they create a rhythm of natural movement.
Progressive rhythm — occurs when a sequence of forms or shapes is shown through a progression of steps. Here the elements repeat over an interval, but with more variation, usually in progressive steps.
Size, shape or color of the element might have stepped changes over each interval or the interval itself might vary. The steps should be progressive. The characteristics of the element should gradually increase or decrease creating a sense of direction over the sequence. The variation leads to more interest and visual tension and tends to direct the eye along the progression.
A color gradient is an example of a progressive rhythm. Gradually decreasing the size of an element as it recedes into the background is another. The latter creates linear perspective directing your eye to a vanishing point.
As a general rule you can add interest to rhythmic patterns by adding emphasis or contrast that interrupt the pattern at times. This could be a contrasting shape or color or drastically changing the size of one element.
Emphasis through contrast sets the element apart from the pattern and momentarily breaks the rhythm. It can be used to control how the eye flows through the rhythm. More emphasis on a single element makes the eye pause on it before continuing. Too much contrast of this kind can lead to discordance and chaos.
Repetition can also be used to create emphasis through sheer numbers. A lot of local repetition calls attention to the group of elements being repeated.
Whether you plan for it or not, as soon as you place multiple elements on the page your design will exhibit patterns and rhythm. Human beings seek patterns and will naturally see them in your work. We find regular and predictable patterns soothing.
We create rhythm in our designs by repeating and varying patterns over space. A good visual rhythm will lead the eye through a design. The predictability of the rhythm leads to anticipation, which directs visitors to follow.
Variation adds interest to rhythm. It avoids monotony and offers the occasional surprise. The most effective rhythms will provide some unexpected variations.
I’ve talked here about rhythm in more theoretical and abstract terms. I want to pick up the topic again next week talking a little more about the practical side of adding rhythm to our designs.
Download a free sample from my book, Design Fundamentals.
I’m so impressed by the amazing content you have on your blog. Thanks for sharing.
this was really helpful, thank you for putting this up
thanks this really help me understand!..
has been helpful as am making a reseach,thank you
The article is very informative and helpful. Thank you
This site was very helpful. Thank you very much.
You’re welcome Michala. I’m glad I could help.
Concise, well explained!
Heplful article. Thank you, greetings from Turkey.
Thanks Tolga. I’m glad I was able to help.
while I was searching for an appropriate translation for the German phrase “2er Rhythmus” I dropped into your blog.
Thank you for broaden my horizon about looking at the topic ‘rhythm’ itself, thank you for the beautiful pictures, thank you for the elegant blog page.
PS. I decided for the time being to translate it with ‘two time rhythm’.
Does anyone know any designers that use rhythm in their works? Plz help I need this for my homework 🙏🏾
thanks so much this has really helped me it
really help me in my homeworkí ½í±í ½í±
One of the best articles I’ve ever read! Understandable, comprehensive and cohesive. Can’t wait to read more from this author.
Your blog was so helpful.Thanks
Thank you for the information it is very useful.