Drawing In Code
An exploration of artistic observation and computational thinking.
Can you teach a computer how to draw, design animations, interactive stories, and games?
The Basic Cityscape
Learn to draw a basic cityscape programatically. Design functions
that allow you to design different buildings for your city.
Create a simplified version of the popular "Flappy Bird" mobile game.
A "flappy square" that you "fly" through a series of walls.
Learn about animation and user interactions on your way to building
a simple HTML5 game.
The Animated Cityscape
Learn create an animated cityscape with a gradient sunset and lights
within offices flashing on and off.
Parallax allows you to create a sense of depth in a 2d surface.
Learn how to create layers of an image that move independently,
providing this 3D illusion.
A Brick Building
Create a much more visually rich and detailed building, complete
with detailed bricks, windows, door, and railing.
A gallery of drawings, animations, and games.
Create your own work and let us know about it so we can add
it to the gallery!
View The Gallery
Your Drawings, Animations, and Games
The goal of this website is to help you develop the skills
necessary for you to create your own drawings, animations, and games.
Take the skills you learn in the lessons below and apply them in a novel way
to create something completely new!