Abstraction 5

Online showcase

Code 1

Introduction, expectations

Housekeeping, code-refresh

Code 2

Code Waves

sin, cos, tan

Code 3

Beauty of Noise

Random, Perlin, Simplex, Heightmap

Code 4

Linking Code and Context

Project ideation starts

Algorithm

Change over time

Texture

Movement

Digital images

Physical objects

Virtual worlds

Aesthetics

Readings

Code

Code 5

Generative Visuals

Project proposal briefing

Code 6

Code, image, export.

Proposal review

Abstraction 1

Proposal presentations

Project implementation begins

Independent study

File formats 

Quality and compression

NFTs

Generative Art

Ideas

Feedback

No class (Project week)

Abstraction 2

In-class development

Abstraction 3

In-class development

Progress check and feedback

Single-page-template briefing  

Abstraction 4

Sharing

In class development

One Night Only

Showcase and submission 

Sharing of work and progress

Progress

Finalising project

Submission checklist

Web 101

Generative art refers to any art practice where the artist uses a system, such as a set of natural language rules, a computer program, a machine, or other procedural invention, which is set into motion with some degree of autonomy contributing to or resulting in a completed work of art.

Generative Art is a process of algorithmically generating new ideas, forms, shapes, colors or patterns. First, you create rules that provide boundaries for the creation process. Then a computer follows those rules to produce new works on your behalf.

There's a new art form on the rise. Generative art has existed since the 1960s, but the new on-chain generative art platforms are pushing the medium in an exciting new direction. While many of the generative techniques are the same, the goals for the program output are wildly different from before. The direct path from the script to the viewer, as well as the large number of iterations, encourages artists to create a special class of artistic algorithm, what I'll refer to here as long-form generativism.

Due week 2

Task

Sketch requirements

p5js sketch(es) saved to your p5js account

Dimension 960x540px

frameCount

sin, cos, tan

sin, cos, tan

Some examples to spark some interest

If in doubt, please visit the Getting Started with p5js slides 

Due week 3

Task

Sketch requirements

p5js sketch(es) saved to your p5js account

Dimension 960x540px

frameCount

Manipulating Variables

Random

x++

sin, cos, tan

for(let i=0;i<10;i++) {

}

if(a>1) {} else {}

class MyObject {

  constructor() {}

}

Due week 5

Loops

when there is a very repetitive task to perform e.g. drawing 100 lines at once with a given spacing between them, make use of a for-loop; if you need to read all elements from an array, use a for-loop

frameCount

frameCount by itself is a variable that has one task, to count the frames that have passed. With that information or that single number that constantly increases in value by 1, we can introduce visible change over time for example by using the value of frameCount to move a shape along the x or y axis, or, we can use frameCount in combination with the sin() function to create a smooth motion going back and forth e.g. x = sin(frameCount * 0.01) * 100;

Conditionals

if, else if, else: non-linearity, how to make decisions inside a program

Objects

An object is an entity within the main program that is derived from a copy of a class template; we looked at this in week 3. The beauty of objects is that once I create the template, I can create as many copies as I want, and each copy can exist with slightly different parameters than the others; this allows us to easily create complexity through simple single entities. Remember? class MyObject {}

Functions

setup and draw, how functions are called, what goes in between the parentheses () and curly brackets {}. We can of course create our own functions or make use of those that e.g. come with p5js and the core of JavaScript.

Variables

Variables contain values that are stored in memory, these can be read and changed; a variable needs to be initialise with (preferably) let, it requires a name and a value

Arrays

Arrays are special variables and can contain multiple values

Shapes

very important, that's one kind of material we use to put images onto the screen; there are primitive shapes like rect, ellipse, circle, or line; with beginShape, vertex and endShape you can create your own shapes based on the vertex-coordinates of that shape; there are 3D shapes as well

Colors

Another important material to work with, on a screen we work with RGB color; you apply color to shapes using the fill() or stroke() commands; in 3D there are is the lighting technique to color, illuminate or shine onto a 3D shape

Due week 6

Task

Sketch requirements

p5js sketch(es) saved to your p5js account

Dimension adaptable, use createCanvas(windowWidth, windowHeight)

Animated

Generative art refers to any art practice where the artist uses a system, such as a set of natural language rules, a computer program, a machine, or other procedural invention, which is set into motion with some degree of autonomy contributing to or resulting in a completed work of art.

Generative Art is a process of algorithmically generating new ideas, forms, shapes, colors or patterns. First, you create rules that provide boundaries for the creation process. Then a computer follows those rules to produce new works on your behalf.

There's a new art form on the rise. Generative art has existed since the 1960s, but the new on-chain generative art platforms are pushing the medium in an exciting new direction. While many of the generative techniques are the same, the goals for the program output are wildly different from before. The direct path from the script to the viewer, as well as the large number of iterations, encourages artists to create a special class of artistic algorithm, what I'll refer to here as long-form generativism.

Task

The website template should include the following details about and derived from your work: