TEXT For developers

Cyber-Pulse: 3D Neon Particle Swarm

Contributed by loshu2000

Improved by Laravel Company · 2026-09-07

You are an expert Three.js and WebGL programmer specializing in high-performance, shader-based particle systems. Your task is to architect and provide the core implementation for a fast-paced arcade game concept.

Game Concept:
Design and implement a dynamic "dodge-em-up" environment set within a digital void. The visual centerpiece is a fluid-like nebula composed of 15,000+ blue and purple particles that react dynamically to the player's position and mouse input. The aesthetic should be highly luminous and energetic.

Technical Requirements & Constraints:

  1. Framework: Use Three.js for the 3D scene setup.
  2. Particle System: Implement a system managing a large number of particles (target: 15,000+).
  3. Shading: Utilize a custom ShaderMaterial for rendering the particles to achieve a strong, glowing effect (bloom/glow).
  4. Interaction (Repulsion Logic): Implement a dynamic repulsion system where all particles actively fly away from the current mouse cursor position.
    • The repulsion calculation must use vector mathematics to ensure particles move away from the mouse. A suitable implementation of the following logic should be used:
      javascript
      // Core repulsion logic adaptation:
      // Calculate the direction vector away from the mouse
      let direction = particlePos.clone().sub(mousePos).normalize();
      // Apply force (adjusting the factor for desired repulsion strength)
      particlePos.addScaledVector(direction, REPULSION_STRENGTH);
  5. Post-Processing: Integrate a BloomPass to enhance the glow effect of the particles.
  6. Performance Constraint: The entire system, including particle updates and rendering, must be optimized to maintain a stable 60 Frames Per Second (FPS). Focus on efficient geometry handling and shader optimization.

Desired Output:
Provide a complete, well-structured, and commented JavaScript (Three.js) implementation demonstrating the setup, particle management, the custom shader logic, and the dynamic repulsion mechanism. Include necessary setup instructions for camera, lights, and post-processing.

Original prompt (before our improvements)

Game Concept: A fast-paced arcade "dodge-em-up" set in a digital void. The player controls a core energy spark, navigating through a fluid-like nebula of 10,000+ blue and purple particles that react to the player's presence. Technical Prompt: Create a Three.js scene featuring a Points system with 15,000 particles. Use a custom ShaderMaterial for a glow effect. Implement a repulsion logic where particles fly away from the mouse cursor. JavaScript // Core repulsion math let dist = particlePos.distanceTo(mousePos); if (dist < 5) { direction.subVectors(particlePos, mousePos).normalize(); particlePos.addScaledVector(direction, 0.2); } Include a BloomPass for post-processing and ensure 60FPS performance via