[an error occurred while processing this directive]
LEARN
BEGINNER

Learn ZIM - this pic shows Pragma (ZIM Evangelist) floating cross-legged in a meditation form - getting ready to learn

The very visual results with ZIM are great for left and right brained learners!

ZIM Editor lets you try code right in the Browser

Start
Open the ZIM Editor and type new Circle(100, red).center().drag(); Press the TEST button (or ENTER key) to see results! See VID
Zapps
Press the ZAPPS button to see examples. Explore the BASIC examples. Press the EXPO link on the bar to see thumbnails.
Code
Press the CODE button to see the code for any example. Then press the yellow arrow (bottom right of code) to copy the code to your editor screen.
Next
The first two links below, Kids and Skool, offer full curriculum. Code Zero is a video series for those new to coding. Creative Coding helps you learn JavaScript in a visual and fun way! Then try the Certificates. The S is link to the Sheridan Interactive Media college program.
ZIM KIDS | ZIM SKOOL | CODE ZERO | CREATIVE CODING

Sheridan College - Interactive Media One Year Post Grad Program Oakville Ontario Canada
INTERMEDIATE

Lear ZIM - this pic shows Pragma standing by a very cool tangerine colored convertible car with sexy wheel well humps

Canvas
You may know JavaScript - now welcome to the Canvas! ZIM is built on CreateJS (which we manage). This gives us a stage, containers (scene graph or display list), basic shapes and hit test, media loading, and events.
Tips
ZIM has many conveniences like two ways to handle parameters (ZIM DUO), dynamic parameters (ZIM VEE), and style for the canvas (ZIM OCT). See ZIM Tips for these and more!
Docs
The ZIM Docs show our classes, functions, constants, etc. The definitions open up to give descriptions, examples, parameters, methods, properties, and events.
CodePen
ZIM on CodePen has many examples with comments and references. You can join CodePen, follow ZIM and fork the examples. See the ZIM Topic for a currated list including ZIM's Creative Coding tutorials.
Next
The links below start with a ZIM Basics video series assuming you know JavaScript and are new ZIM. Note the two menus in the Cheat Sheet for all components and controls. See vids of demos made in Five Minutes and Bubbling shows new ZIM features.

ZIM BASICS | CHEAT SHEET | FIVE MINUTES | BUBBLING
ADVANCED

Learn ZIM - this pic shows the ZIM logo with arrows pointing out to Svelte, React, Angular, and VUE logos - indicating that ZIM integrates into each of these

CDN & NPM
The ZIM CDN has all the scripts and modules. ZIM is also on NPM with packages for ZIM Helper Modules and templates for common integrations.
Adobe Animate
Adobe Animate (formerly Flash), exports to CreateJS and therefore ZIM. The Animate page has a set of tutorials on how to use the ZIM Shim or Adobe Animate.
Mobile
ZIM is made for mobile! See the Mobile Page which outlines mobile features and inlcludes a link to the PWA Tool to make Progressive Web Apps in five minutes.
3D & VR
ZIM can be placed into three.js and VR with TextureActives allowing for 2D interactivity on any surface in 3D. The TextureActive Studio shows the way!
Patterns
Here is an info page for Model View Controller with ZIM and a Local Loading with ZIM vid. See our Custom Library page to extend ZIM. All have ZIP files.
Next
The links below go to the ZIM Dev site, the advanced video series ZIM Explore and Under the Hood. Finally, a link to the Helper Libraries for extra functionality.
ZIM DEV | ZIM EXPLORE | UNDER HOOD | LIBRARIES
ARTICLES

Dr Abstract on Medium - this is the logo for Medium

GUIDES

Your Guide to: Coding Creativity on the Canvas Your Guide to: When to Use a JavaScript Canvas Framework Your Guide to: Selecting a JavaScript Canvas Framework Your Guide to: Editors and Templates on the Canvas Your Guide to: Coding Concepts with the Colorful Canvas Your Guide to: Components on the JavaScript Canvas Your Guide to: Conveniences when Coding on the Canvas Your Guide to: Interactivity on the Canvas with JavaScript Your Guide to: Animation on the Canvas with JavaScript Your Guide to: Accessibility on the Canvas with JavaScript Your Guide to: Images, Sounds and Sprites on the Canvas Your Guide to: Style on the Canvas Your Guide to: Responsive and Adaptive Canvas Design Your Guide to: Controlling the Canvas with JavaScript

MAKE HTML 5 GAMES

Make Html 5 Games Tile Game Tutorial Make Html 5 Games Falling Game Tutorial Make Html 5 Games Side Scroller Game Tutorial Make Html 5 Games Isometric Board Game Tutorial Make Html 5 Games Physics Game Tutorial

PUBLISHED

Innovations in Code Canvas API frameworks in Plain English How to get a Developer to use the Canvas 2D Interactivity In 3D Building More In Adobe Animate With Zim Creative Coding For The Both Brained What Is Interactive Animation

PROMOTIONAL

An Invite For Generative Art Makers And Interactive Artists Dr Abstract The Creative Mind Bridging Code Art And The Future Of Innovation Ranking Frameworks To Make Kids Apps Ranking JavaScript Canvas Frameworks


There are also a bunch of short articles on Dev.to Please follow us and leave some claps and hearts! On Medium, you can leave many claps per article.
ZIM on DevTO - for short tech articles
ARCHIVE
Dr Abstract behind a dual monitor set-up with lots of wires indicating OLD - for archives!
See the ARC for canvas info, all the video, articles, and tutorial series including the older What IZ, Capture, and ZIM Bits!

Learn Archive
[an error occurred while processing this directive]