Skip to content

Instantly share code, notes, and snippets.

View imageFilterStartingPoint.js
//Cat photo used in class example by Nick Nunns on Flickr: https://www.flickr.com/photos/neeb/334265966/
var img;
//preload will load before setup runs
function preload() {
//this relative file path starts in the same folder as your sketch.
//In other words, in this example, make a folder called images in the same
//folder as your sketch file (sketch.js) and then put the image file ("kittens.jpg")
//inside of that.
img = loadImage("images/kittens.jpg");
@nataliefreed
nataliefreed / radial-helper.js
Last active Sep 30, 2017
Wrapper function to make a radial version of a shape in P5
View radial-helper.js
/*
Radial Shape Wrapper Function
Natalie Freed September 2016
*/
function setup() {
createCanvas(600, 600);
//draw a shape
arrow(width/2+20, height/2, 20, color(0));
View showMouseCoordinates.js
function setup() {
}
function draw() {
drawMouseCoordinates();
}
function drawMouseCoordinates() {
push();
View loops example.js
function setup() {
createCanvas(800, 800);
for(var i=0;i<10;i++) {
if(i % 3 == 0) {
arrow(50, 50, 10, color(255, 0, 100));
}
else {
arrow(50, 50, 10, color(150, 0, 255));
}
View drag and drop example 2.js
var circles;
var currentDragged;
var clickRadius = 50;
function setup() {
createCanvas(500, 500);
imageMode(CENTER);
circles = [];
View drag and drop example.js
var circles;
var currentDragged;
var clickRadius = 50;
function setup() {
createCanvas(500, 500);
imageMode(CENTER);
circles = [];
View generative_sentences_with_arrays.js
/*
Exercises:
1. Change the nouns, verbs, adverbs to your own choice of words
2. Change the sentence structure (for example, add "and" and then a second clause)
3. Change the words to a different language (could be the one you are studying in
school right now). Change the sentence structure so that the sentences are grammatically
correct.
*/
var nouns, verbs, adverbs;
View paint_combs.jscad
// title : Paste Paper Comb Generator
// author : Natalie Freed
// license : MIT License
function getParameterDefinitions() {
return [{ name: 'w', type: 'float', initial: 10, caption: "Width :" },
{ name: 'h', type: 'float', initial: 10, caption: "Height :" },
{ name: 'rows', type: 'int', initial: 5, caption: "Rows :" },
{ name: 'cols', type: 'int', initial: 5, caption: "Cols :" },
{ name: 'thickness', type: 'float', initial: 3, caption: "Extrusion Thickness (3D mode):"},
@nataliefreed
nataliefreed / gradient.js
Created Feb 10, 2017
Color gradient example using lerpColor
View gradient.js
var color1, color2;
var gradientHeight = 300; //change this to change how far down the screen the gradient goes
function setup() {
createCanvas(800, 800);
color1 = color('#e67e22');
color2 = color('#2ecc71');
View colorDifferenceTester.js
var color1, color2;
var colorToSelect = 0;
function setup() {
createCanvas(800, 800);
color1 = color(0, 0, 0);
color2 = color(0, 0, 0);
//draw some random colors in a grid
push();