ZIM js JavaScript Framework

Canvas Components, Controls and more!

ZIM Badges – ART – in-depth JavaScript Canvas Tutorial for Generative Art is Live!


ZIM Badges – ART – has launched to help you build four examples of Interactive and Generative Art with controls to go from page to page.  http://zimjs.com/badges.html The Badges Tutorial has 44 steps each with multiple references and code answers.  And you can collect SIX badges along the way for using ZIM Six ;-).


If you or your colleagues, students, etc. complete this tutorial, you will be well on your way to entering the wonderful, wild world of making art with the Computer.  You can combine these techniques with the Sound Frequency animations from the First ZIM Badges – to make an Alien Detector App – to make art that animates to sound – like visualizations for light show projections or art installations.


For the Blob example, above, the users can make their own shapes and they are saved for the next time they come to the application.  In the art piece shown at the top of the page, the art is created with the new ZIM Noise class.


The Badges Tutorial starts using loops and random numbers to put many circles on the stage and animate them (using ZIM loop, rand and animate).  The following picture shows making art with Tiling (using the new ZIM Tile class).


Make sure to watch the intro video before starting.  And good luck coding!

If you complete the Badges – ART, then try the Badges – APP – available at http://zimjs.com/badges.html


ZIM at http://zimjs.com is an open source JavaScript Framework for the HTML Canvas. You code in a text editor and view the code in a Browser. You can make visually rich games, apps, art and sites. ZIM is powered by the wonderful CreateJS with many thanks to their team!

The ZIM site features the following sections:

  • LEARN tutorials on how to start and code in ZIM
  • CODE ZIM Frame template and code context
  • DOCS the objects and commands all defined
  • NEWS latest features and articles
  • ABOUT features, applications, archives, reviews, etc.
  • EXAMPLES sample projects created in ZIM


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s


%d bloggers like this: