ATOM Imagination
1.Intro
After learning attraction, I was obsessed with the magic of various kinds of forces in the coding world. But in the course coverage, we only learn the macro physics force. So I decided to explore and test whether the microphysics law fits in the coding world or not. The topic that I chose is Coulomb forces. Also, inspired by the icon of Atom(text editor), I want to build an atom structure with the P5.js.
2.Inspiration
I have mentioned my inspiration and visual reference in my last post.
Link: NOC Midterm Project Concept
Pastel Themed Natural Plants Mood Board
This is the mood board of my project. The images on it are my most straightforward visual director.
3.Project Plan
General Plan Guidelines:
- Experiment of Forces
- Coulomb Forces in P5.js
- Electron Movements around the core of an atom
- Visualization
- Proton & Neutron
- Electron
- Particles Sphere
Experiment of Forces
I started my project by testing the Coulomb Forces in the P5 sketch.
The formula is: F = kq1q2/r2
Look closely, it is similar to what we learn for gravitational attraction
After finding out this, my project shift to another direction: trying to build an atom structure with gravitational attraction.
However, after testing different value setting, I realize that it is impossible to achieve my expected visual effects with only one gravitational setting. The reason is:
- In order to make electrons do orbital movement around the core and do not touch the core, we need to apply a force from sides to push electrons away from the core. I used repulsion at first, but I found out that electrons will be bounced back strongly when they get closer to the core if the adjusting value is too high; electrons’s moving track will be shifted a little bit if the adjusting value is smaller. So the conclusion is repulsion does not work in this case, and I cannot come up with a method to provide a force from sides.
- The speed of electrons is hard to control. By using gravitational attraction, electrons will gradually speed up and move towards the core. That is not what I want for the visual effect. Besides, electrons will slow down when they pass by the core, then speed up again, The process of speed up, slow down, and speed up again, looks weird.
- The orbital and movement of electrons are not regulated. I cannot form a system.
Above all, I think for my current ability, I cannot build an atom system with gravitational attraction. In order to finish the project, I decided to achieve the visual effect with simple attraction.
Visualization
This is the basic structure by applying a simple attraction function to particles.
For proton and neutron, I design them to be sparkle particles. To achieve this, I use for loop to draw many circles, which no fill in body but fill in stroke. When looping through, the radius of a circle increases, but the opacity of filled color in stroke decrease. As a result, proton and neutron look shining. Besides, by applying frameCount and sin/cos value, I make P&N animated.
For electron, I try to keep it simple because it will be hard for watching if the visual effect is too fancy.
For the particles sphere, it is the most tricky one. At first, I want to only make many particles distributed randomly within a circle. I did not know how to do it. So I turned to Moon. Moon provided me a solution, which keeps all the particles outside an invisible circle. When the particles reach to a specific position, we change the direction to opposites. Then we adjust the value of forces so that particles won’t go away but keep bouncing since they are always attracted by the core. Hence visually, it looks randomly distributed on the sketch.
Further development
Interaction Design
I did not put a lot of efforts in the interaction design. So I would say interaction design is one of the potential improvements in my project. I want to keep exploring the how can I combine add electron interaction with music playing. It can be a music interaction project actually.
Visual Design
To be honest, my visual design ability is limited and my imagination is restricted by what I have learned so far. I am not surprised that I cannot do a good visual design. So if I have more time, I will definitely dig deeper to visual experiments.
Finally, big thanks to Moon!
Leave a Reply