70
GET rect(): Interactive Graphics with p5.js
Completed by 9 learners
Ages 10-15
Live Group Class
Average rating:
5.0
Number of reviews:(2 reviews)
Live video meetings
1x per week, 3 weeks
3-10 learners per class
60 min
What’s included
3 live meetings
3 in-class hoursClass Experience
Students will be able to draw and color shapes on a canvas using a javascript library called p5.js. Additionally, participants will learn how to make their graphics interactive! They will learn through activities where they get to use their own creativity to design digital sketches. In the first activity, learners will choose a famous work of art or their own inspirational image, and create a digital sketch of it with p5. In the second activity, learners will an create animated gif of their sketch and upload it to the class Tumblr page: https://get-rect-creations.tumblr.com/. In the third activity, learners will use a tensorflow library called poseNet, to create Instagram-like filters on their own webcam video. This activity is not supported on Internet Explorer or Microsoft Edge browsers. As long as learners are able to type in a web browser and see images on the screen, they will be successful with this course. Progress is evaluated by the learners sharing their sketches via hyperlink. The instructor will ask students to share their screen in order to help them debug their code. Students are expected to create a login for the p5.js web editor before the first session. If they are unable to complete an activity during class time, they are expected to complete it for homework. Please install Chrome or Firefox if you usually use Internet Explorer or Edge as your browser.
Learning Goals
Students will learn the foundations of drawing with picture elements (pixels) on a 2D canvas. These include but are not limited to: RGB values, x-y coordinates, points, lines, rectangles, ovals, stroke, fill, interaction and animation.
Students will learn some of the fundamentals of the javascript coding language including variables, functions, scope, loops, data structures, conditional statements and control logic.Other Details
Supply List
Course materials are free and will be shared via google docs and hyperlinks. Please create a login for the p5.js web editor before the first session.
External Resources
In addition to the Outschool classroom, this class uses:
Meet the teacher
Joined December, 2018
5.0
2reviews
Teacher expertise and credentials
I coach math teachers and support them to bring technology tools into their classrooms. I am inspired by the prospect of opening learners' eyes to the possibilities of online learning environments. My goal is to introduce learners to affinity groups where they can continue to pursue their interests freely online. This course in particular is an introduction to Dan Shiffman and his youtube channel, "The Coding Train".
I studied CS at Stanford: https://evanrushton.wixsite.com/learndesigntech/technology
I am an active Data Scientist: https://www.evanrushton.com/Reviews
Parents also liked
Javascript / P5.Js Computer Science Coding Club: Games, Animations, and More
Coco Coders
4.8
(975)
$20 per class
Next session at 12 AM on Monday
Group Class
1/wk, 55 min
9-13
Javascript/P5.Js Creative Coding: Create Games, Animation and More!
Create N Learn: Game-Based Learning & Future Skill
4.9
(101)
$15 per class
Next session at 2 PM tomorrow
Group Class
8 wks, 1/wk, 55 min
12-14
JavaScript 1
James Fitzpatrick
4.4
(24)
$19 per class
Next session at 1 AM on Thu 6/19
Group Class
8 wks, 1/wk, 55 min
7-12
Graphic Design for Beginners
Elizabeth (BFA, MAE)
4.8
(461)
$18 per class
Next session at 8 PM on Monday
Group Class
1/wk, 55 min
9-14
Summer Camp: Project Based Javascript for Kids (Level 2)
AI Code Academy
4.7
(1,805)
$19 per class
Next session at 3 PM on Mon 6/16
Group Class
2 wks, 5/wk, 1 hr
10-15
Graphic Design for Beginners (Teen Edition)
Elizabeth (BFA, MAE)
4.8
(461)
$19 per class
Next session at 8 PM on Monday
Group Class
1/wk, 55 min
12-17
Exploring Graphic Design With Canva
Music with Miss Suzanne
4.9
(36)
$10 per class
Next session at 1 PM on Wed 7/2
Group Class
7 wks, 1/wk, 40 min
11-14
The Basics of Graphic Design & Canva
Mrs. Singleton
$9 per class
Next session at 4 PM on Tue 6/17
Group Class
3 wks, 1/wk, 1.92 hr
11-14
Graphic Design for Beginners: 1-on-1
Elizabeth (BFA, MAE)
4.8
(461)
$30 per session
1-on-1 Lessons
On Demand
8-18
Graphic Design 101 - Camp
Rachael Young
4.9
(204)
$23 per class
Next session at 2:30 PM on Tue 6/17
Group Class
2 wks, 4/wk, 1.25 hr
12-16
Summer Camp: Javascript Coding 4 Kids (Intro)
Dr. Elliott Heflin, Jr.
4.6
(405)
$19 per class
Next session at 10 PM on Monday
Group Class
5 wks, 2/wk, 55 min
8-13
Semester of Javascript: From Basics to Big Ideas!
Coco Coders
4.8
(975)
$18 per class
Next session at 2:30 PM on Wed 6/25
Group Class
10 wks, 1/wk, 55 min
10-15
Project-Based Javascript Coding (Level 2)
AI Code Academy
4.7
(1,805)
$22 per class
Next session at 3 PM on Sat 6/14
Group Class
10 wks, 1/wk, 1 hr
10-13
Introduction to Graphic Design with Canva - Summer Camp
Fleming Tech Camps
4.9
(26)
$60 per class
Next session at 1 PM on Mon 7/14
Group Class
1 wk, 5/wk, 2.92 hr
10-14
Adventures in Ink: Graphic Novel Book Club
Wild and Unstructured Learning
4.8
(1,161)
$21 per class
Next session at 2 PM on Mon 9/1
Group Class
1/wk, 55 min
12-15
Semester Coding Camp: Javascript Adventures for Kids!
Coco Coders
4.8
(975)
$18 per class
Next session at 2:30 PM on Tue 6/24
Group Class
6 wks, 1/wk, 55 min
9-14
More to explore
Iew 2a
Mine Craft
Chinese Reading
Daily Skills Practice With Reading Spelling Vocabulary And Grammar
Collaboration
Reading Rockstar
Warrior Cats Draw
Lets Bake & Dip
Chibi Drawing
Lets Learn And Practice
Little Bear
Dear Santa
Beyblade Physics
Math Fundamentals
Teaching Little Fingers To Play
Marching To War
Sushi Cooking
Wings Of Fire Sculpture
Meds
Puppy
