Drawing with Code

Learning how to “talk” to a computer is like obtaining a super power. Today, we will get started in learning the basics of computer programming by drawing pictures using code. As the semester progresses, we will learn how to animate those drawings, make them interactive and eventually make them smart. Put on your propeller hat and let’s get coding.

Topics

  • A snapshot of the future
  • Course introductions
  • Review course syllabus
  • Learn how to draw again

Resources

Reading

  • Getting Started with p5.js (Chapters 1 – 3)

Assignment

Animation

We’ll check out your animal sketches at the start of class. Then, we are going to learn how to make your animal move through the use of variables, conditionals and events. Hopefully, we will actually experience what programming feels like. There will be time near the end of the class to get a head start on your animated sketch.

Topics

  • Review animal sketch
  • Demonstrate variables, conditionals and events
  • Work on animated sketch

Resources

Reading

  • Getting Started with P5.js (Chapter 3 & 4)

Extend the game

Today we will be spending most of the class extending the game that we started last class. For example, you could:

  • Add a high score
  • Add a health meter
  • Add different kinds of enemies
  • Increase the difficulty as your score increases
  • Add graphics
  • Add sound
  • Add different kinds of enemies (or bosses)
  • Add different kinds of weapons
  • Make multiplayer with Firebase or Node.js
  • etc, etc, etc

Resources