VID 19 - BUILDING - Learn JavaScript with Creative Coding - fun, colorful and free!
VID 19 [Lesson 07 - Templates and Building] - Dr Abstract teaches JavaScript with the following topics:
0:00 - intro to creative coding video 19
0:17 - lessons review - now on Lesson 07
1:03 - showing the intro app that we will build
1:30 - intro demo
3:28 - templates - minimal, fit, outside, full, tag, assets
6:36 - template for Adobe Animate (Flash) called ZIM Shim
7:07 - setting up the fit template for Lesson07
7:38 - quick template review
9:26 - Coding! Making background from Rectangles
10:30 - ZIM colors
12:40 - using pos(x,y,horizontal,vertical,container)
13:52 - reminder of registration point and outline()
14:40 - making a Tile instead!
16:10 - randomizing colors with array and ZIM VEE (Pick)
16:55 - ZIM VEE (Pick) series() to get colors in order
19:29 - Using Container objects - theory
20:45 - making a Container for the first section
21:28 - two types of containers - dimensioned and flexible
21:55 - setting dimensions on containers
22:38 - outlining container (shows our container dimensions are wrong!)
24:08 - centering the Circle in the container!
25:27 - dragging the circle in a Boundary
28:18 - checking the boundary... the registration point stays inside
28:56 - adjusting the boundary to accommodate the radius
30:58 - adding the Label text
32:23 - using STYLE to set the color of all the Label objects
33:26 - no semi-colon at end (not CSS) we use commas
33:58 - setting the alpha with STYLE
34:48 - setting a general style for everything
35:45 - setting styles for a Circle
36:15 - overriding styles
36:44 - purple in the circle!
36:50 - conclusion and "hanging" around with new Vid! (loud)
The Learn JavaScript with Creative Coding is a video series to help left brain and right brain learners explore the wonders of programming using the fun, colorful and friendly HTML Canvas and ZIM. Dr Abstract is a Canadian New Media Awards winner for Programmer and Educator of the Year. He will teach the basics of programming in JavaScript from the ground up so welcome designers, artists, engineers, developers, and all.
The video lessons are supported by ZIM Skool at https://zimjs.com/skool and make an excellent introduction to code at a high school and college levels or for the #100DaysofCode movement and workshop organizations like #CanadaLearningCode. Younger students can go to https://zimjs.com/kids.
We hope you share these lessons with friends, family, work colleagues and any aspiring creators! Cheers, please subscribe, share on social media and give the videos a like if you have likes to give. You are welcome to join us at https://zimjs.com/slack/ to ask questions, discuss code and share examples.
Thanks to BigTRBL - DJ at Shaolin in Hamilton for the intro tune!
Cheers from #LearnJavaScript with #CreativeCoding and #DrAbstract founder of #ZIMjs