YoVDO

Introduction to Programming for the Visual Arts with p5.js

Offered By: University of California, Los Angeles via Kadenze

Tags

p5.js Courses Software Development Courses Javascript Courses Drawing Courses Object-oriented programming Courses Data Structures Courses Color Theory Courses

Course Description

Overview

This course is an introduction to writing code within the context of the visual arts. It asks two primary questions:

What is the potential of software within the visual arts?
As a designer or artist, why would I want (or need) to write software?

Software influences all aspects of contemporary visual culture. Many established artists have integrated software into their process. Prominent architects and designers not only use software, they commission custom software to help them realize their unique ideas. The creators of every innovative video game and Hollywood animated film write custom software to enhance their work.

As a comprehensive first introduction to the potential of software development within a broad range of the arts, this course aspires to teach you to engage the computer more directly with code. Programming opens the possibility to create not only tools, but systems, environments, and new modes of expression. It is here that the computer ceases to be a tool and becomes a medium.


Syllabus

  • Media: Load and display images, shapes, and fonts
    • This session will cover external media, file formats, how to load and display images, how to load and display vector shapes, how to load fonts and display text, and how to handle sound files.
  • Hello
    • In this session, we will cover the following topics: 1) What is Code? 2) Form and Computers 3) Drawing: Define and draw simple shapes; and 4) Color: Change the fill and stroke for shapes. You will also be introduced to p5.js so you can start creating your own work!
  • Motion: Move and choreograph shapes
    • In this session you will learn about types of motion in code, how to create motion with code, transformations, and timers.
  • Functions: Build new code modules
    • This session will introduce functions. We will cover the basics of functions, functions with parameters, and returning values from functions.
  • Synthesis A, Nonlinear Narrative
    • In this session we will begin putting the elements together. We will use longer examples including modes, events, and transitions.
  • Objects: Create code modules that combine variables and functions
    • In this session you will learn how to define a class, add fields and methods to a class, create an instance of a class, and create multiple instances of a class.
  • Synthesis B, Game
    • This session will focus on putting the elements together to create work including motion, objects, and arrays. It will also cover collisions.
  • Flow and Response
    • In this session, we will cover the following topics: 1) Setup and Draw: Creating programs that run over time. 2) Input, Responding to the mouse and keyboard. 3) Drawing. 4) Make different tools with code. 5) Conditionals, Making decisions in code. 6) Easing.
  • Variables and Loops
    • This session will cover variables and how to store, modify, and reuse data; loops, and how to use Random to get random values from the computer.
  • Arrays: Working with lists of variables
    • In this session you will learn what arrays are, how to declare and create arrays, how to assign and ready values, and more.
  • Extend: Adding cameras and more
    • This session will cover using video and video playback, adding camera images and analysis, manipulating the DOM, integrating existing JavaScript libraries, and working with p5.js in instance mode.

Taught by

Lauren McCarthy, Casey Reas and Chandler McWilliams

Tags

Related Courses

Learn Javascript - 21 Essential Array Methods
Coursera Project Network via Coursera
3D Graphics for Web Developers
Pompeu Fabra University via FutureLearn
Access WebView in an Android Studio Project
Coursera Project Network via Coursera
Advanced React
Meta via Coursera
Building Modern Nodejs Applications on AWS
Amazon Web Services via edX