At first, I choose the ‘school bell’ to explore the notion of different states of order and chaos. The school bell signals when students have a class and when it finishes. When listening to the bell of the class, students should return to their fixed seats in the classroom wherever they are. Considering each student as a point in space, these randomly scattered points can be gathered together to show a certain state in a space when the command is issued (the ringing sounds), which shows an unordered state transforming to an ordered state.

In this project, I explore the possibility of building a system that randomly distributes patterns in space and returns them to order. I use a simple computer language (P5) to disrupt the organization of graphics in an ordered state and redistribute them randomly into space. A programmatic animation can help me shows more possibilities in such random chaos states.

With the guidance of the tutor, I have chosen p5.js web editor for programming as the tool to realize the animation. p5.js is a JavaScript library based on the processing language, often used for Internet data visualization and interactive art creation.

Using this programming language, simple graphics are drawn which composed from different simple shapes, and the graphic organization in an ordered state is designed at first. Through simple mouse interaction between the programming code, these graphic shapes can be randomly distributed in space to form different disordered graphics. After coding the different states, adding two pieces of sound materials in the order and disordered state to make this interactive animation programming more observable and interesting.

p5.js Web Edition https://editor.p5js.org/shirleyoung/sketches/dJhqUfjr