HTML5 Game Development
   
  • HOME
  • News
  • Tutorials
  • Engines
  • Demos
  • Tools
  • Partners
  • Mobile HTML Game
  • Guess The Celebrity
  • About us

Interactive Noise Particle System

This is a cool and creative interactive noise-generated particle system created using three.js and WebGL. The first particle mode reacts to the movements of the user’s input direction and will move with the motion.  The second mode expands the particles away from the user’s input, creating a colorful magenta bubble.

WebGL Interactive Particles Demo

The particles appear to float in mid-space and change color depending on the speed of your motion. It starts off as blue, then yellow and moves on to a vibrant magenta at the fastest movement speed. This creates a very vibrant and beautiful gradient that’s very satisfying to look at.

If you want to check out this cool project, feel free to try it out here.

Share List

You might also find this interesting:


  1. How to Create a Particle System in Three.js Some of the most fascinating Chrome Experiments to watch and experience are 3D Particles. The sdg Blog has a series of tutorials about programming 3D graphics in the browser using Three.js. Their...

  2. WebGL Water Noise demo Using simplex noise and a normal map, an WebGL experiment in creating a water surface. Share List...

  3. WebGL Particle Morph A neat interactive WebGL demo of flying particles morphing into a few various shapes Share List...

  4. GPU Particle Attractors A Three.js Chrome Experiment using texture and FBO to store and compute particle data. View Demo Share List...

  5. WebGL FBO Particle System See your 3D objects as a cloud of particles in this new WebGL experience called Point Cloud Sandbox. Just specify the number of particles (between 10,000 to 2 million), upload...

design, Interactive, noise-generated, Particle System
HTML5 Demos, Three.js-1, WebGL-1

License HTML5 Games

Are you a company looking to license HTML5 games? We recommend MarketJS.com, a B2B platform for licensing games.

MarketJS has over 300 HTML5 games for licensing. They also provide additional services such as game reskin, custom development, and white label portals.

Html5 Game Development


Follow @GameDevHTML5



WHAT’S NEW

  • What’s New in Phaser 3.50

  • Particle and Sprite Editors in Babylon.js 4.2

  • Healthcare Industry HTML5 Games

  • Games for Events Example

  • HTML5 Games for Luxury Brands



NEW DEMOS

  • Vertical Endless Runner Prototype

  • Particle and Sprite Editors in Babylon.js 4.2

  • Song Maker in Google Experiment

  • Phaser 3 Experiment for Drawing Cards

  • HTML5 Game for a Recycling Campaign


ENGINES

  • Building Simulated 3D HTML5 Games With Phaser

    Phaser is commonly used as a 2D game engine for creating HTML5 desktop and mobile games. However, with the help of three.js and Phaser 3D library, you could render your …Read more

  • Egretia Blockchain HTML5 Game Engine

    Egretia is an up and coming HTML5 game development platform that is powered by blockchain. The blockchain technology is like a digital ledger wherein finances or transactions involving value are …Read more

  • Phaser 3.4 Release

    Phaser 3.4 has just been launched, bringing new and better features for HTML5 game development. This updated version now has support for Game Object Containers. Although it’s still in beta …Read more

SEARCH OUR ARCHIVES

CONNECT

rss twitter

HTML5 Game Development is proudly run by 3P Solutions Inc

GOT NEWS?

Send new engines, demos, information and tips to hello@html5gamedevelopment.com

MONTHLY MEETUP

In boston? Join us for the Monthly HTML5 Game Development meetup.

BOOKS

We're in the process of writing a few books about game development. Coming soon!

Copyright HTML5gamedevelopment.com