Unit 1: Introduction
With these elementary art lessons you’ll learn how to draw circles, quadrilaterals and more. Explore key geometric ideas - vertices and radians, and how computers use color, and how JavaScript represents coordinates.
9 Lessons:
1. Welcome
2. Introduction to JavaScript
3. Colors
4. Lab: Piet Mondrian
5. Ellipses and Circles
6. More Basic Shapes
7. Lab: Emojis
8. Review
9. Quiz
Unit 2: Colors and Shapes
Learn art concepts as code: changing the transparency of colors, layering shapes, and more. You’ll also learn core programming concepts like functions and randomness.
11 Lessons:
10. Color Schemes
11. Irregular Shapes
12. Lab: Create a Logo
13. User-Defined Functions
14. Lab: Silhouette
15. Transparency
16. Lab: Origami Art
17. Randomness
20. Lab: Cubism
21. Review
22. Quiz
Unit 3: Beauty of Code
Learn new tricks for creating art: blending colors, making gradients, and more. Using these visual art lessons you’ll also learn core programming concepts like variables, loops, and how to use them to create a perspective art piece of your own design.
10 Lessons:
23. Variables
24. Logic and Decisions
25. Loops
26. Lab: Refactoring
27. Gradients
28. Lab: Create a Cityscape
29. Shading: Creating Depth
30. Lab: Sol LeWitt
31. Review
32. Quiz
Unit 4: Logic of Art
Examine coding structures that can help you master when, where, and how you paint the screen. This section is heavy on coding techniques that will allow you to control the feel of your digital brushstrokes.
9 Lessons:
33. Advanced Logic
34. Pixel Art Challenge
35. Draw
36. Implicit Shading
37. Lab: Impressionism
38. Transformations
39. Lab: Perspective
40. Review
41. Quiz
Unit 5: Image Processing & Pixel Editing
Learn how to manipulate the existing pixels of images, and invent your own Snapchat-style filters with these fine art lesson plans. Then apply the techniques of silkscreen artists like Andy Warhol, and spend some time with pointillism.
10 Lessons:
42. Images
43. Lab: Pointillism
44. Arrays
45. Pixel Data
46. Lab: Andy Warhol
47. Steganography
48. Pixel Art Effects
49. Lab: Halftones
50. Review
51. Quiz
Unit 6: Interactive Art and Animation
Create interactive artwork and simple web-based games using p5.js. You’ll also explore data structures and object-oriented programming.
7 Lessons:
52. Mouse Interaction
53. Keyboard Interaction
54. Objects
55. Lab: Picture Slideshow
56. Lab: Art Gallery
57. Review
58. Quiz
Unit 7: Capstone Project
Upon completion of these visual arts lesson plans, you’ll spend several weeks programming an open-ended project of your choice. Form a small group or work solo. Templates, meeting agendas, and a sample project walkthrough are provided to help keep things on task.
3 Lessons:
59. Intro to the Final Project
60. Breaking Bricks
61. Your Final Project