Using Noise Loops

1

0

0

CC Attribution NonCommercial ShareAlike

Using Noise Loops

by

A basic tutorial of creating looping animations with Perlin noise

Wednesday, 5/12/2021

Anyone

Anyone

Anyone

CreativeCommons Attribution NonCommercial ShareAlike

No Thumbnail
Click to Create

Title

Description

How to
interact with it

e.g., mouse, keyboard

Tags

e.g., visualization, fractal, mouse

License

Learn more about Creative Commons

Draft

Add to My Templates

Who can see your sketch?

Anyone Only Me

Join Plus+ to change privacy settings

Who can see the code?

Anyone Only Me

Who can comment?

Anyone Only Me

1/5

sketch

xxxxxxxxxx
 
const bg = [0, 0, 20];
const fg = [0, 0, 80];
const sketch = {
  centerX: () => width / 2,
  centerY: () => height / 2,
}
​
function setup() {
  createCanvas(512, 512);
  // defaults
  colorMode(HSB);
  rectMode(CENTER);
  stroke(fg);
  strokeWeight(2);
  noFill();
}
​
function draw() {
  background(bg);
  rect(sketch.centerX(), sketch.centerY(), 256, 256);
}

Sketch
Files
Editor

Mode

P5js HTML/CSS/JS Pjs

Select mode or a template

Tutorial Mode

Write step-by-step tutorials. Learn more

Showcase Sketch

Loop Protection

Prevents infinite loops that may freeze the sketch.

Libraries - Show All

Text Size

Layout

This will be the default layout for your sketches

Dark Mode

Easy on the eyes

Console

It will show up when there is an error or print() in code

Linting

Potential warnings will be displayed as you type

Close Brackets

Closes parenthesis-like characters automatically as you type

Shortcuts

Controls

Play

Ctrl+Enter

Code

Ctrl+Shift+Enter

Save

Ctrl+S

Interface

Fullscreen

Ctrl+Alt+F

Switch Layout

Ctrl+Alt+L

Settings

Ctrl+Alt+.

Editor

Tidy Code

Ctrl+B

Multiple Cursors

Ctrl+Click

Duplicate Line/Selection

Ctrl+Shift+D

Move Line

Alt+↑/↓

Select Multiple

Ctrl+D

Find in Code

Ctrl+F

Find Next

Ctrl+G

Find Previous

Ctrl+Shift+G

See More Shortcuts

Join Plus+ for private sketches, version history, 1GB space, custom embeds, and more!

Displaying comments on line 1 Show All

Please verify your email to comment

Join to Comment

Sign in to download

Embed

<iframe src="https://openprocessing.org/sketch/1193115/embed/" width="400" height="400"></iframe>

Attribute

“Using Noise Loops” by metanivek
https://openprocessing.org/sketch/1193115
License CreativeCommons Attribution NonCommercial ShareAlike
https://creativecommons.org/licenses/by-nc-sa/3.0

Report Sketch

Any questions? Reach out via email.

File URL

{{filePath}}

Dimensions

{{width}} x {{height}}

Report Sketch

Oh, that naughty sketch! Please let us know what the issue is below.

Apply Template

Applying this template will reset your sketch and remove all your changes. Are you sure you would like to continue?

Report Sketch

Please choose the appropriate issue with this sketch. We will review your submission and take any actions necessary per our Community Guidelines. In addition to reporting, you can also block the user to prevent any future interactions.

Spam, Phishing, or Malicious Content

Inappropriate Content (offensive or abusive language, hate, discrimation, etc.)

For copyright infringements, please fill out this form instead.

Report sketches only when necessary. Unnecessary or abusive use of this tool may result in your own account being suspended.

Report Comment

Please confirm that you would like to report the comment below.

We will review your submission and take any actions necessary per our Community Guidelines. In addition to reporting this comment, you can also block the user to prevent any future interactions.

Please report comments only when necessary. Unnecessary or abusive use of this tool may result in your own account being suspended.

Are you sure you want to delete your sketch?

Any files uploaded will be deleted as well.

Delete Comment?

This will also delete all the replies to this comment.

Delete this tab? Any code in it will be deleted as well.

Select a collection to submit your sketch

We Need Your Support

Since 2008, OpenProcessing has provided tools for creative coders to learn, create, and share over a million open source projects in a friendly environment.

Niche websites like ours need your continued support for future development and maintenance, while keeping it an ad-free platform that respects your data and privacy!

Please consider subscribing below to show your support with a "Plus" badge on your profile and get access to many other features!

GET PLUS MEMBERSHIP