https://github.com/singhofen/small-p5-js-web-apps

Examples of some small p5.js web apps for practice and experimenting with the js library.
https://github.com/singhofen/small-p5-js-web-apps

javascript js p5js p5js-animation p5js-experiment p5js-game webapp

Last synced: 8 months ago
JSON representation

Examples of some small p5.js web apps for practice and experimenting with the js library.

• Host: GitHub
• URL: https://github.com/singhofen/small-p5-js-web-apps
• Owner: singhofen
• License: mit
• Created: 2018-03-23T23:37:37.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2018-10-15T14:37:47.000Z (over 7 years ago)
• Last Synced: 2024-12-27T23:10:36.971Z (over 1 year ago)
• Topics: javascript, js, p5js, p5js-animation, p5js-experiment, p5js-game, webapp
• Language: JavaScript
• Homepage: https://codepen.io/csinghofen/full/deYZoj
• Size: 5.02 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# small-p5-js-web-app

small p5.js web apps. 

https://codepen.io/csinghofen/pen/mLWJEa 10print project

https://codepen.io/csinghofen/pen/XqMaJL pixel canvas

https://codepen.io/csinghofen/pen/deYZoj clock

p5.js library displays graphics, geometric shapes on a created canvas. Which allows User interaction and UX. get started here: https://p5js.org/get-started/

Newly Added 4/30/2018:   p5 JS program version of the  one line command with the  Commodore 64 BASIC program language.   

 10 PRINT CHR$(205.5+RND(1)); : GOTO 10 

 Read More: https://10print.org/

 

 Sample image of project

 

 ![image](https://user-images.githubusercontent.com/23155302/39594008-7870c22e-4ed9-11e8-8bae-cebebceacdbd.png)

 

Mouse over open html file to interact with content. Displays animation and UI with the p5.js library.

![image](https://user-images.githubusercontent.com/23155302/39594117-c1db8890-4ed9-11e8-9a82-76d782e31b63.png)

p5.js  clock that shows real time wherever you open up the file. File is active as soon as its opened. 

![image](https://user-images.githubusercontent.com/23155302/39594154-db2c5e6e-4ed9-11e8-9386-0fd7415ea91c.png)

This p5.js app experiments with pixels and animations. When you open up the app the pixels on the screen animate/flicker. Code can be modified to change colors and size of pixels. 

![image](https://user-images.githubusercontent.com/23155302/39594215-0219f824-4eda-11e8-97ab-cb43fdbb1da9.png)

This p5.js app demonstrates animations and upon opening the app it shows 3 ellipse(s) together inside one another then them slowly seperating and leaving the canvas to the right. 

![image](https://user-images.githubusercontent.com/23155302/39594256-257b0ab0-4eda-11e8-94f5-86be3092255e.png)