Coding Challenge #36: Blobby!

Channel:
United States The Coding Train
Subscribers:
1,740,000
Published on ● Video Link: https://www.youtube.com/watch?v=rX5p-QRP6R4


Duration: 9:09
117,396 views
1,824

In this coding challenge, I simulate a blob-like shape with wobbly edges using beginShape(), endShape(), polar coordinates, and perlin noise. Code: https://thecodingtrain.com/challenges/36-blobby

πŸ•ΉοΈ p5.js Web Editor Sketch: https://editor.p5js.org/codingtrain/sketches/L_ME8qKmQ

πŸŽ₯ Previous video: https://youtu.be/BAejnwN4Ccw?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
πŸŽ₯ Next video: https://youtu.be/u-HUtrpyi1c?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
πŸŽ₯ All videos: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH

References:
πŸŽ›οΈ Perlin noise Wikipedia article: https://en.wikipedia.org/wiki/Perlin_noise
πŸ™ Superellipse Wikipedia article: https://en.wikipedia.org/wiki/Superellipse

Videos:
πŸŽ₯ Supershapes track: https://thecodingtrain.com/tracks/supershapes
πŸ”΄ Live Stream Archive #58: https://youtu.be/_cDPN2Ief6Q?t=7399s

Related Coding Challenges:
πŸš‚ #19 Superellipse: https://youtu.be/z86cx2A4_3E
πŸš‚ #32 Agar.io: https://youtu.be/JXuxYMGe4KI
πŸš‚ #60 Butterfly Generator: https://youtu.be/O_0fRV4MTZo
πŸš‚ #136 Polar Noise Loops: https://youtu.be/ZI1dmHv3MeM

Timestamps:
0:00 Introduction to the Blobby challenge
0:30 Whiteboard explanation of ellipse vs beginShape/endShape
2:10 Into the code...using the Blob class and creating an ellipse using beginShape/endShape
4:09 Random r value to create a noisy random ellipse
5:30 Getting a blobby shape via a sine wave using the 'offset' variable
6:35 Starting to use Perlin noise
7:30 Adding in the y offset

Editing by Mathieu Blanchette
Animations by Jason Heglund
Music from Epidemic Sound

πŸš‚ Website: http://thecodingtrain.com/
πŸ‘Ύ Share Your Creation! https://thecodingtrain.com/guides/passenger-showcase-guide
🚩 Suggest Topics: https://github.com/CodingTrain/Suggestion-Box
πŸ’‘ GitHub: https://github.com/CodingTrain
πŸ’¬ Discord: https://thecodingtrain.com/discord
πŸ’– Membership: http://youtube.com/thecodingtrain/join
πŸ›’ Store: https://standard.tv/codingtrain
πŸ–‹οΈ Twitter: https://twitter.com/thecodingtrain
πŸ“Έ Instagram: https://www.instagram.com/the.coding.train/

πŸŽ₯ Coding Challenges: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
πŸŽ₯ Intro to Programming: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA

πŸ”— p5.js: https://p5js.org
πŸ”— p5.js Web Editor: https://editor.p5js.org/
πŸ”— Processing: https://processing.org

πŸ“„ Code of Conduct: https://github.com/CodingTrain/Code-of-Conduct

This description was auto-generated. If you see a problem, please open an issue: https://github.com/CodingTrain/thecodingtrain.com/issues/new

#superformulas #superellipse #beginshape #endshape #vertex #perlinnoise #p5js #javascript #processing #java



Other Videos By The Coding Train


2016-09-14Live Stream #60: Week 2 of Programming from A to Z (Regular Expressions)
2016-09-121.6: Homework Assignments Week 1 - Programming with Text
2016-09-12Coding Challenge #37: Diastic Machine
2016-09-121.5: JavaScript String Object - Programming with Text
2016-09-111.4: Getting Text from User: Loading a Text File - Programming with Text
2016-09-091.3: Getting Text form User: Text Input - Programming with Text
2016-09-091.2: My Workflow - Programming with Text
2016-09-091.1: Introduction - Programming with Text
2016-09-07Live Stream #59: Week 1 of Programming from A to Z
2016-09-04Coding Challenge #32.2: Agar.io - Part 2 (Networking with Socket.IO and Node.js)
2016-09-02Coding Challenge #36: Blobby!
2016-09-02Q&A #5: The History of p5.js and Processing
2016-09-02Live Stream #58: Networking Agar.io and the History of p5.js/Processing
2016-08-30Coding Challenge #35.3: Traveling Salesperson with Lexicographic Order
2016-08-25Coding Challenge #35.2: Lexicographic Order
2016-08-24Coding Challenge #35.1: Traveling Salesperson
2016-08-22Coding Challenge #33: Poisson-disc Sampling
2016-08-18Coding Challenge #34: Diffusion-Limited Aggregation
2016-08-16Coding Challenge #32.1: Agar.io - Part 1 (Basic Game Mechanics)
2016-08-12Live Stream #57 - Traveling Salesperson
2016-08-119.10: Genetic Algorithm: Continuous Evolutionary System - The Nature of Code


Tags:
challenge
coding
coding challenge
tutorial
creative coding
javascript
programming challenge
p5.js
p5js
p5.js tutorial
javascript (programming language)
superformulas
superformula
superellipse
blob
beginShape
endShape
vertex
blobby
wobbly
perlin noise