# The Rhythm Circle: An Interactive Open-Source Web Environment Based on the Circular Representation

Paul Lascabettes, Corentin Guichaoua, Moreno Andreatta

► To cite this version:

Paul Lascabettes, Corentin Guichaoua, Moreno Andreatta. The Rhythm Circle: An Interactive Open-Source Web Environment Based on the Circular Representation. International Computer Music Conference, Jun 2025, Boston (MA), United States. hal-05054439

HAL Id: hal-05054439

https://hal.science/hal-05054439v1

Submitted on 2 May 2025

HAL is a multi-disciplinary open access
archive for the deposit and dissemination of sci-
entific research documents, whether they are pub-
lished or not. The documents may come from
teaching and research institutions in France or
abroad, or from public or private research centers.

L'archive ouverte pluridisciplinaire HAL, est
destinée au dépôt et à la diffusion de documents
scientifiques de niveau recherche, publiés ou non,
émanant des établissements d'enseignement et de
recherche français ou étrangers, des laboratoires
publics ou privés.

<figure><img src="image_1.png" /></figure>

Distributed under a Creative Commons Attribution 4.0 International License
# The Rhythm Circle: An Interactive Open-Source Web Environment
Based on the Circular Representation

Paul Lascabettes, Coretin Guichaoua, Moreno Andreatta

IRMA, ITI CREAA, Université de Strasbourg, France & IRCAM, STMS Lab, France

`{lascabettes,guichaoua,andreatta}@math.unistra.fr`

## ABSTRACT

We present the Rhythm Circle, an interactive open-source web environment that allows users to generate and manipulate rhythms using the circular representation. In this environment, three rhythms can be looped simultaneously, starting and ending at the same time via three concentric circles, each corresponding to a drum element: a snare drum, a kick drum and a hi-hat. The rotation speed, corresponding to the tempo, is adjustable, and there is an option to export the generated rhythms in midi format. The platform includes preset rhythms, offering binary and ternary patterns that correspond, in this case, to circle subdivisions into 16 and 12 equal parts. One of the advantages of this web environment is the possibility of transforming the different rhythms, not only by activating or deactivating the onsets on the three respective circles, but also by applying musical transformations. The first musical transformation is the change of the subdivision of a circle, for example, from 16 to 17. The second musical transformation is the rotation of a circle, which corresponds to a time shifting of the musical rhythm. A usage counter was implemented, and in just a few months, the platform recorded over 30,000 visits from users worldwide. The Rhythm Circle is accessible at: https://rhythm-circle.com.

## 1. INTRODUCTION TO THE “RHYTHM CIRCLE” WEB ENVIRONMENT

In this article, we introduce the Rhythm Circle web environment, available at: https://rhythm-circle.com. This platform was developed to facilitate the creation and manipulation of rhythms using the circular representation. This representation exploits the cyclical aspect of a musical rhythm by representing the temporal axis as a circle, which naturally begins and ends at the same point, forming a loop. This contrasts with most music software, where the temporal axis is represented linearly, progressing from left to right. The circular representation is similar to a clock: the beginning of the rhythm is at the top of the circle, the time axis progresses clockwise, and the notes are located along the circle. In our implementation, the notes are constrained to a grid that subdivides the circle into equal parts, referred to as *circle subdivisions*. For example, a binary 4/4 rhythm is naturally represented

with a 16-part subdivision, while a ternary 12/8 rhythm uses a 12-part subdivision. This representation provides an original visualization of musical rhythms, making it easier to consider the two possible musical transformations included in this web environment: the change in subdivision of the circle and the rotation of a rhythm, which corresponds to a temporal shift. While these transformations are also theoretically possible with the linear representation of time, they are less intuitive and more challenging to achieve. The Rhythm Circle environment was therefore developed to facilitate access to the circular representation and to these two musical transformations. Moreover, we chose to create an interactive web page to avoid downloading and provide immediate access, unlike more complete and advanced software such as *Xronomorph*, which generates perfectly balanced and well-formed rhythms using the circular representation [1].

The Rhythm Circle environment is illustrated in Figure 1. In this environment, three rhythms can be looped simultaneously, starting and ending at the same time. Three circles are thus played simultaneously, each corresponding to a drum element: a snare drum, a kick drum and a hi-hat, allowing each rhythm to be individually differentiated and combined with the others. The rotation speed, which corresponds to the tempo, is adjustable, and rhythms can be played/paused or reset. There is an option to export the generated rhythms in midi format, which allows to use the generated rhythms in most music software. Additionally, we have developed, in collaboration with Victor Paredes, a VST for Ableton similar to this web environment, illustrated in Figure 2, which can be downloaded for free.<fnref n="1" />

To prioritize simplicity and usability without requiring additional explanations, we have limited the available options. For instance, users cannot add more than three circles, rotate counterclockwise, or replace the drum elements with other instruments. The design of the Rhythm Circle was inspired by the web-based Tonnetz environment, which represents musical notes within a two-dimensional graph [2]. It is available at: https://thetonnetz.com. These two environments are complementary in a “mathemusical” approach: one focuses on harmony, while the other on rhythm.

In the following, we introduce the preset rhythms in Section 2. Then, we explain the two musical transformations: circle subdivision change in Section 3 and circle rotation in Section 4. Finally, we discuss in Section 5 how we have popularized this web environment to encourage the general public to use the circular representation.

Copyright: ©2025 Paul Lascabettes et al. This is an open-access article distributed under the terms of the Creative Commons Attribution License 3.0 Unported, which permits unrestricted use, distribution, and reproduction in any medium, provided the original author and source are credited.

<footnote n="1">¹The VST is available at: https://drive.google.com/file/d/1Qj9DB4FYEvonouCwgv96YWG3VHF4ZoV8/view.</footnote>
<figure><img src="image_2.png" /><figcaption>**Figure 1:** The Rhythm Circle web environment available at: https://rhythm-circle.com.</figcaption></figure>

<figure><img src="image_3.png" /><figcaption>**Figure 2:** Ableton MIDI effect equivalent to the Rhythm Circle web environment, available for free download.</figcaption></figure>

## 2. PRESET RHYTHMS

The Rhythm Circle web environment includes several preset rhythms to facilitate its use. These presets are accessible on the right side of the web interface, as shown in Figure 1. Each preset rhythm can be assigned to one of the three circles, and can also be modified, offering a wide range of possibilities. The preset rhythms consist of binary and ternary patterns selected for their musical importance. Moreover, all these rhythms satisfy several relevant geometric and musical properties [3] defined by Godfried Toussaint in his book *The Geometry of Musical Rhythm* [4]. For instance, many of them are *Euclidean rhythms*, defined by the maximally even distribution of notes in a particular subdivision [5]. Traditionally, a Euclidean rhythm with *k* onsets in an *n*-subdivision is denoted as *E(k, n)*. These preset rhythms are illustrated using the circular representation in Figure 3 by adding a polygonal representation, obtained by connecting each successive onset with a segment to associate a rhythm with a polygon.

We now briefly describe each rhythm of the preset list.

* **Tresillo** is the Euclidean rhythm *E*(3, 8) used in Latin and Afro-Cuban music.

* **Son/Shiko/Soukous/Rumba/Bossa-nova/Gahu** are the six distinguished rhythms considered by Godfried Toussaint in his book [4]. These rhythms come from Central and West Africa, and Afro-Cuban music. Among them, the Bossa-nova rhythm is a rotation of the Euclidean rhythm *E*(5,16), and the Son rhythm scores highest by validating the most geometric properties [3], as Toussaint concludes at the end of his book.

* **Samba** is the Euclidean rhythm *E*(7, 16). In particular, this rhythm is the Samba rhythm necklace from Brazil, and the current Samba rhythm is a rotation of this rhythm by 2 pulses.

* **Fume-fume** is a rotation of the Euclidean rhythm *E*(5, 12). It is frequently used in West African music and is the ternary version of the Son rhythm [6]. From a harmonic point of view, it is equivalent to the pentatonic scale.

* **Bembé** is a rotation of the Euclidean rhythm *E*(7,12). This rhythm is particularly interesting because it is harmonically equivalent to the diatonic scale.

* **Steve Reich**'s signature rhythm is an 8-note pattern within a subdivision of 12 equal parts. This is the rhythm used in *Clapping Music* and many of his compositions [7].

* **Basic 1-4** are regular rhythms that are useful for giving a pulse and avoiding overcomplicated results. Basic *k* is a rhythm with *k* notes evenly distributed.
<figure><img src="image_4.png" /><figcaption>**Figure 3:** Preset rhythms available in the Rhythm Circle web environment. Rhythms (a–h) are binary, dividing the circle into 8 or 16 equal parts, while rhythms (i–k) are ternary, dividing it into 12 equal parts. Note that this polygonal representation is not integrated in the environment.</figcaption></figure>

### 3. CHANGING THE SUBDIVISION OF THE CIRCLE AS A RHYTHMIC DEFORMATION

The first musical transformation available in the Rhythm Circle environment is the modification of the subdivision of a circle. Increasing the subdivision adds empty spaces at the end of the rhythm, while decreasing it removes the last ones, regardless of whether they contain onsets. For example, by considering the Tresillo in the binary notation: 1-0-0-1-0-0-1-0 with a subdivision of 8, reducing the subdivision to 7 results in 1-0-0-1-0-0-1, while increasing it to 9 produces 1-0-0-1-0-0-1-0-0. What makes this feature particularly interesting in the Rhythm Circle environment is the ability to combine three different subdivisions. For example, the first circle can have a subdivision of 8, the second of 11, and the third of 15. This offers the possibility of creating polyrhythms and generating rhythms that are extremely challenging for humans to perform.

Additionally, this feature allows for rhythm deformation by adapting a rhythm within a different subdivision. The subdivision changes that are frequently considered are *binarization* (switching from a ternary to a binary grid, i.e. for a 4 beat rhythm from a 12 to a 16 subdivision) and *ternarization* (switching from a binary to a ternary grid, i.e. for a 4 beat rhythm from a 16 to a 12 subdivision). Various methods of binarization and ternarization have been studied [6], with the conclusion that the most natural approach to these transformations is illustrated in Figure 4. In particular, they transform the ternary rhythm Fume-fume into the binary rhythm Son [4]. Although the ternarization and binarization are not integrated into the Rhythm Circle, they can be obtained manually and implemented in future versions of the environment as well as other more advanced additional transformations. Changing the subdivision of a circle enables therefore the exploration of various rhythm deformations, and the preset rhythms in the Rhythm Circle web environment provide a point of departure for the application of these transformations.

### 4. THE ROTATION OF A CIRCLE AS A TEMPORAL TRANSLATION

The second musical transformation available in the Rhythm Circle environment is the rotation of a circle clockwise or counterclockwise, which corresponds to a temporal translation of a musical rhythm. This transformation produces a different musical experience, despite the close link between the new and the original rhythms. We have constrained this translation to remain within the grid: the circle can only rotate by a single increment, not by a fraction of an increment like half an increment. For example, by considering the Tresillo rhythm in binary notation 1-0-0-1-0-0-1-0 and applying a clockwise rotation ("+" in the Rhythm Circle environment) produces 0-1-0-0-1-0-0-1. On the contrary, by applying a counter-clockwise rotation ("-" in the Rhythm Circle environment) we obtain 0-0-1-0-0-1-0-1. This transformation is particularly adapted to the circular representation, as it takes into account its cyclic aspect. In contrast, with a linear representation, temporal shifts are less intuitive: a clockwise shift requires moving the last note to the beginning, while a counterclockwise shift involves relocating the first note to the end.
<figure><img src="image_5.png" /><figcaption>(a) Binarization of musical rhythms: transforming the circle's subdivision from 12 to 16 equal parts.</figcaption></figure>

<figure><img src="image_6.png" /><figcaption>(b) Ternarization of musical rhythms: transforming the circle's subdivision from 16 to 12 equal parts.</figcaption></figure>

**Figure 4:** Visualization of mathematical models for binarization and ternarization of musical rhythms [6].

# 5. CONCLUSION AND PERSPECTIVES FOR OUTREACH AND LARGE-SCALE USAGE

In this article, we have presented the Rhythm Circle web environment for generating rhythms using the circular representation. The idea behind the development of this environment is that the tools used by the artists have an impact on their art. In particular, the software used by the musicians influence their music. In most standard musical software, the linear representation of time is commonly used, making certain transformations, such as subdivision changes or rotations, less intuitive. In this way, the circular representation offers a different perspective, enabling the exploration of new musical ideas.

To promote the Rhythm Circle, we created a YouTube video on the *Mathémusique* channel,<fnref n="2" /> illustrated in Figure 5. Within just a few months, the environment, equipped with a usage counter, has been accessed over 30,000 times.<fnref n="3" /> We believe this success is due in part to the simplicity and accessibility of the platform, which allows even non-musicians to engage with it, but also to the originality and creative potential that it offers.

<figure><img src="image_7.png" /><figcaption>**Figure 5:** Presentation of the Rhythm Circle web environment in a YouTube video on the *Mathémusique* channel, with over 100,000 views.</figcaption></figure>

# Acknowledgments

This project was funded by the French Ministry of Culture, and supported by the SFAM (French Society for Music Analysis) and the AFIM (Francophone Association of Music Informatics). We acknowledge the support by the Interdisciplinary Thematic Institute CREAA, as part of the ITI 2021-2028 program of the University of Strasbourg, the CNRS, and the Inserm (funded by IdEx Unistra ANR-10-IDEX-0002 and by SFRI-STRAT'US ANR-20-SFRI-0012 under the French Investments for the Future Program).

# 6. REFERENCES

[1] A. J. Milne, S. A. Herff, D. W. Bulger, W. A. Sethares, and R. T. Dean, "XronoMorph: Algorithmic Generation of Perfectly Balanced and Well-Formed Rhythms." in *NIME: The International Conference on New Interfaces for Musical Expression*, 2016, pp. 388-393.

[2] C. Guichaoua, J. L. Besada, E. Bisesi, and M. Andreatta, "The Tonnetz Environment: A Web Platform for Computer-Aided "Mathemusical" Learning and Research," in *International Conference on Computer Supported Education. SCITEPRESS-Science and Technology Publications*, 2021, pp. 680-689.

[3] P. Lascabettes and I. Bloch, "What Are "Good" Rhythms? Generating Rhythms Based on the Properties Set Out in The Geometry of Musical Rhythm," in *International Conference on Mathematics and Computation in Music*. Springer, 2024, pp. 45-57.

[4] G. Toussaint, *The Geometry of Musical Rhythm: What Makes a "Good" Rhythm Good?* CRC Press, 2019.

[5] —, "The Euclidean Algorithm Generates Traditional Musical Rhythms," in *BRIDGES*, 2005, pp. 47-56.

[6] F. Gómez, I. Khoury, J. Kienzle, E. McLeish, A. Melvin, R. Pérez-Fernández, D. Rappaport, and G. Toussaint, "Mathematical Models for Binarization and Ternarization of Musical Rhythm," in *BRIDGES*, 2007, pp. 99-108.

[7] J. Yust, "Steve Reich's Signature Rhythm, and an Introduction to Rhythmic Qualities," *Music Theory Spectrum*, vol. 43, no. 1, pp. 74-90, 2021.

<footnote n="2">² Link to the video: https://youtu.be/indkKkGX5wg.</footnote>

<footnote n="3">³ This corresponds to the period September 2024 - January 2025.</footnote>