Bouncing Ball - P5js Typing CST Test
Loading…
Bouncing Ball — P5js Code
A ball bouncing off the edges of the canvas.
let x = 200, y = 100;
let xspeed = 3, yspeed = 2;
function setup() {
createCanvas(400, 200);
}
function draw() {
background(255);
x += xspeed;
y += yspeed;
if(x > width || x < 0) xspeed *= -1;
if(y > height || y < 0) yspeed *= -1;
ellipse(x, y, 50, 50);
}P5js Language Guide
p5.js is a JavaScript library designed to make coding accessible for artists, designers, and beginners. It provides an intuitive way to create graphics, animations, and interactive content on the web using a friendly API inspired by Processing.
Primary Use Cases
- ▸Educational projects for teaching programming
- ▸Interactive art installations
- ▸Web-based animations and visualizations
- ▸Prototyping games and interactive experiences
- ▸Creative coding experiments
Notable Features
- ▸Simplifies HTML5 Canvas and WebGL interactions
- ▸High-level functions for drawing and animation
- ▸Event handling for mouse, keyboard, and touch
- ▸Supports multimedia like sound and video
- ▸Open-source and community-driven
Origin & Creator
p5.js was created by Lauren McCarthy in 2014 as a JavaScript adaptation of Processing to make creative coding more web-friendly and accessible.
Industrial Note
Primarily used in education, art, and creative coding communities rather than enterprise software. Its focus is on learning, prototyping, and interactive visualization.