DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’» is a community of 963,864 amazing developers

We're a place where coders share, stay up-to-date and grow their careers.

Create account Log in
Cover image for Eye of the Dragon!
Dr Abstract
Dr Abstract

Posted on

Eye of the Dragon!

Story of experiments with Noise - in ZIM - code creativity!

"I was wanting to adjust Bloob to make rings of noise that animate out at the viewer. Here is Bloob for reference: https://codepen.io/zimjs/pen/XWjrmoQ

Alt Text


I added a circle at the end of each ray and took away the rays:

Alt Text


Making these bigger and dropping the alpha I ended up with a nice effect.

Alt Text


And adding three of them with different colors I got this:

Alt Text


Finally, I tightened the radius that the noise values are giving and then thought it looked like the Eye of the Dragon! Then I animated the Noise in time and made the app interactive by adding a New Years Advice when rolling over or clicking the center - try it out here: https://codepen.io/danzen/pen/ExgQRjW

Alt Text

Dr Abstract


It is a little tricky working with ZIM Generator and I have only made a few examples like here: https://zimjs.com/cat/generator.html but these are all one pattern as opposed to a complete pattern moving in time.

Alt Text


If you have not checked out the Canvas recently - you simply must! Here is the ZIMΒ DevΒ Site and some In-depthΒ Guides by DrΒ Abstract including Your Guide to Coding Creativity on the Canvas.

Latest comments (0)

🌚 Browsing with dark mode makes you a better developer.

It's a scientific fact.