Hello Dev Community!
I'm excited to share my latest project:
Particle Systems with Acceleration and Friction!
A particle system built using HTML5 canvas and vanilla JavaScript, showcasing real-world physics principles.
๐ฎ Live Demo:
Check out the live demo here to see the particles in action!
https://algomystique.github.io/ParticleSystems-Physics
๐ Key Features:
Fully Responsive Canvas: The canvas adjusts dynamically to different screen sizes while maintaining functionality.
Particle Interaction: Particles respond to mouse events, like clicks, with realistic movement and collisions.
Physics-Based Movement: Acceleration and friction create smooth, realistic motion for the particles.
๐ How It Works
Canvas Setup: A responsive HTML5 canvas initializes, generating random particles with positions, velocities, and accelerations.
Particle Motion: Each particleโs velocity is updated by its acceleration, with friction applied to simulate resistance.
Rendering: Every frame, particles are drawn on the canvas, updating positions based on motion laws.
Mouse Interaction: Particles react to mouse movement or clicks, accelerating away or towards the pointer.
๐ Technologies Used
HTML5 Canvas
CSS3
Vanilla JavaScript
Iโd love your feedback, suggestions, or any contributions! Check it out on GitHub: [https://github.com/AlgoMystique/ParticleSystems-Physics].
This project was inspired by concepts learned in the "Creative Coding in JS - Masterclass" by Frank Dvorak on Udemy.
Find his Udemy Course here: https://www.udemy.com/user/frantisek-dvorak
Happy coding! ๐
Top comments (0)