ZIM Explore! 64. A relaxed intro to ZIM and Coding Creativity on the Canvas - ZIMjs
Channel: ZIM LEARN
Date: 19/10/2022

Never has coding been so free and easy - yet so colorful and magical!  Here we show you around ZIM https://zimjs.com - what you can code on the Canvas, a little about what code is or where to find out more, and then we get you started with a text editor https://atom.io to make code you can see in the Browser. The file we were playing around with can be found at https://zimjs.com/explore/intro.html

00:00 start https://zimjs.com/examples
00:44 intro page with 4 examples Zapp at
03:30 history, before ruled by Adobe Flash, now the CANVAS html5 ruled by ZIM
03:40 ZIM ART examples https://zimjs.com/art
04:23 ZIM makes code simple see info about simple code for loop
05:24 ZIM LEARN https://zimjs.com/learn
06:23 ZIM SLATE https://zimjs.com/kids/slate or https://zimjs.com/slate
06:49 ZIM SPRITE how to make https://zimjs.com/slate/help number 7 SPRITE 
06:50 example with the 4 sprites of htttps://zimjs.com/assetshttps://zimjs.com/zapp/E_F3EWK
07:23 making ZAPP with 2 new Circle().pos().drag()
08:44 ZIM KIDS learning CODE with https://zimjs.com/kids/help_editor
09:20 ZIM MAGIC https://zimjs.com/magic or https://zimjs.com/slate/magic
11:13 ZIM KIDS SPELLS https://zimjs.com/spells inside SLATE https://zimjs.com/slate/spells
11:28 ZIM DOCS https://zimjs.com/docs or inside EDITOR https://zimjs.com/editor/docs
15:03 ZIM CODEPEN https://codepen.io/zim
15:23 ZIM SKOOL https://zimjs.com/skool
15:51 ZIM SKOOL Practice 1 https://zimjs.com/skool/lesson01.html#practice1
17:40 ZIM JAVASCRIPT VIDEOS https://zimjs.com/learn/videos
18:20 ZIM BASIC VIDEOS https://zimjs.com/youtube and https://www.youtube.com/@ZIMLEARN/playlists
20:48 ZIM CODE ZERO https://youtu.be/CLCC8PPoz4o?si=mU6WOEkFtc5MSFHN
21:24 ZIM Medium articles https://Zimjs.com/medium or https://zimjs.com/learn/medium
21:50 CODE CREATIVITY article https://drabstract.medium.com/your-guide-to-coding-creativity-on-the-canvas-ada0996298f6
23:09 ZIM animation https://zimjs.com/animate
23:16 ZIM STYLE with HTML and CSS
24:36 ZIM CODE template https://zimjs.com/code
28:22 ATOM.io code-editor packages https://atom.io or start in ZIM SLATE to test https://zimjs.com/slate
31:10 new Rectangle() with W/2 and H/2 centered on stage S
33:48 new Tile() code example
34:06 new Button()
34:17 new RadialMenu()
34:39 new Emitter()
34:54 new MotionController() with Emitter moves with mousemove
35:44 new Emitter(new Label("hello")).center() emits "hello"
37:18 new Squiggle({interactive:false}) is the ZIM DUO technique
40:30 ZIM Libraries explaining different tools
41:08 ZIM PATHs create code for blob and squiggle https://zimjs.com/paths
41:44 new Squiggle({points:[array]}).center()
43:24 animate a new Circle().animate() o
45:55 animate circle along the squiggle path
47:20 drag the circle along the squiggle path startPaused:true
49:15 new Tile(new Circle(50,array)).drag({all:true})
51:50 series of colors make the same colors each time
51:35 min max sizes are ZIM VEE (=5th version of ZIM) values
52:30 new Button().loc(x,y) location form left top corner + new Grid()
52:41 new Button()..pos(x,y, SIDE, SIDE ) position + use new Grid()
54:00 STYLE settings https://zimjs.com/docs.html?item=STYLE
57:35 PARTICLES https://zimjs.com/particles snowflakes
59:35 ZIM PHYSICS https://zimjs.com/physics coding an example
01:00:10 new Dial().addPhysics()
01:00:39 new Button().reg(CENTER).addPhysics(false)
01:03:08 .outline() is to show the registration points of the object
01:04:10 physics.drag()
01:04:39 .addPhysics({bounciness}) setting to bounce the dial when dropping
01:06:55 if you found a bug send it now to https://forum.zimj.com or https://zimjs.com/discord
01:09:00 result with all objects with physics
01:10:00 ZIM KEEP UP at https://zimjs.com/physics/keepup.html
01:10:22 ZIM FIVE code in 5 minutes https://zimjs.com/five