Art & Code: Create and Code an Interactive Parallax Illustration

Jarom Vogel, Digital Illustrator

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
10 Lessons (2h 26m)
    • 1. Intro

      2:11
    • 2. Drawing 1 Concept and Thumbnails

      21:16
    • 3. Drawing 2 Refining Your Sketch

      3:06
    • 4. Drawing 3 Blocking in Colors

      20:46
    • 5. Coding 1 Preparing Your Layers

      9:38
    • 6. Coding 2 HTML, CSS, and JavaScript

      12:14
    • 7. Coding 3 Drawing to the Canvas

      30:46
    • 8. Coding 4 Touch and Mouse Controls

      19:35
    • 9. Coding 5 Motion Controls

      14:03
    • 10. Coding 6 Finishing Touches

      12:32
86 students are watching this class

Project Description

Create a parallax illustration and post a video of it! (And be sure to include a link to the project if you publish it somewhere, too!)

I've included all the code and images for my finished project, as well as stopping points along the way for you to compare to if you get stuck.

Good luck!

Student Projects

Hana Robinson
4 comments
Jon Deviny
Alberto De Marco
6 comments
Fanny Rengot
2 comments
Natalia R
1 comment
2 comments
Andy Rash
Ashley S.
1 comment
Tiff Duncan
Anna Avetisyan
1 comment
Frank Chen
Gunes Ozcan
Victoria Blair
1 comment