Force Field

An interactive art tool that creates mesmerizing force field patterns through dynamic circle interactions. Watch as a grid of circles responds to your cursor movements, creating unique and captivating visual effects.

Features

• Interactive cursor-based force field generation
• Customizable parameters:
  • Attraction/Repulsion strength
  • Circle density
  • Force field strength
  • Visual effects
• Real-time parameter adjustments
• Smooth animations
• Responsive design

Installation

1. Clone the repository:

git clone [email protected]:rkdotdesign/Force-Field.git
cd Force-Field

2. Install dependencies:

npm install

3. Start the development server:

npm run dev

4. Build for production:

npm run build

Usage

1. Move your cursor over the canvas to interact with the force field
2. Use the control panel to adjust various parameters:
   • Toggle between attraction and repulsion
   • Adjust the strength of the force field
   • Modify the density of circles
   • Fine-tune other visual parameters

Technologies Used

• React 19
• TypeScript
• Vite
• Canvas API

Development

This project is built with:

• React for the UI components
• TypeScript for type safety
• Vite for fast development and building
• Canvas API for smooth animations

License

MIT License - feel free to use this project for your own purposes.

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.