The Canvas API includes the HTML 5 canvas tag and the JavaScript to draw in the tag such as the rectangle code below:
The above code is "lower level" and can look a little scary. We make it simple in ZIM:
The canvas is great for making games, puzzles, art, e-learning apps and other visually rich apps.
If you are making information sites with scrolling pages of text and pictures, probably just use HTML, CSS and JS.
See When to Use a JavaScript Canvas Library or Framework article by Dr Abstract in Medium.
It is best to use a library or framework when making interactive works with the Canvas, otherwise, there is no way to group shapes or tell which shape is being interacted with.
The ZIM Framework provides easy containers and shapes, drag and drop, hit tests, components like buttons, sliders, dials and more based on the robust CreateJS. See WHY ZIM.
CodePen is an excellent resource for inspiration and learning. There is a series called CREATIVE CODING LESSONS.
The lessons are NOT how to learn basic coding or ZIM (see the video series above or the schools below for those) but rather focus on techniques for making art, games, puzzles, etc. with creative coding.
KIDS
Visit ZIM KIDS for Colorful Coding Workshop Tutorials including
an easy online editor to test right in the Browser. TEACHERS can check how the lessons match curriculum.
Tutorials are divided into PARTS, BUGS and THINGS and each tutorial has three levels.
There are also MAGIC, SPELLS and SLATE pages to learn and practice! Test kids with BADGES.
SKOOL
Visit ZIM SKOOL for Creative Coding Lessons including colorful theory and practice for both left and right brain learners!
There are introduction pages for STUDENTS and TEACHERS. The lessons are found HERE
and are supported by the many TUTORIAL examples in ZIM Learn.
COLLEGE
Dr Abstract (ZIM Founder) is a Professor of INTERACTIVE MEDIA at Sheridan College in Canada.
The Interactive Media program is a one-year post-grad with courses in Interactive Coding (Canvas), Web Design and Development (DOM), Audio Video, UI/UX, Project Management, Creative Technology and Mobile Design.
Get MORE INFORMATION.
[an error occurred while processing this directive]
TUTORIALS
Original BASIC, MID and ADVANCED tutorials are below. We recommend the VIDEO series above for more recent material.
For new coders and philosophers of code, watch the CODE ZERO videos.
Learn to make HTML 5 Games with Dr Abstract!
Get CERTIFCATES making ART and GAME projects.
The TIPS show latest ZIM techniques and ZIM Bubbling the latest features!
See the code of the ZIM INTRO page for a quick demo!
See BITS EXPO for ZIM Bits below in the ZIM Editor
BASIC LEVEL
MID LEVEL
COMING SOON
ADVANCED LEVEL
COMING SOON
COMING SOON
[an error occurred while processing this directive]