Coding Challenge #36: Blobby!

In this short Coding Challenge, I demonstrate how to turn an circle (or any shape you want) into a blob and give the edges have a liquidy / blobby / wobbly look. A technique using beginShape() and endShape() along with perlin noise is used.

This Coding Challenge is loosely linked to the multi-part challenge:

Support this channel on Patreon:

Send me your questions and coding challenges!:


Source Code for the Video Lessons:


For More Supershapes videos:

For More Coding Challenges:

Help us caption & translate this video!






32 responses to “Coding Challenge #36: Blobby!”

  1. Andreas Tagger Avatar

    This series is super good, very creative and artistically driven, broken down in cool ways. Thank you. I did this experiment in 2000 with flash but wasn't as successful.

  2. Nobody Zapped Avatar

    think it could be intresting to have the edge of the circle be perlin noise, but make it 3 dimensional with time being the 3rd dimension like you did in the perlinn noise video with the vetor field. This way the wobble would be continous and somewhat random, could be cool to look at too and if you add for example a sound curve of music to it it might look intrsting too 😀

  3. Iamnottellingyoumyname! Iamnottellingyoumyname! Avatar

    There is a sharp change in between the beginning and end of the shape partly because that angle would be only 0.0831… ect. The rest of your angles where 0.1 radians. This means that is has less space to strech the change over making it a bit more sharp. Two pi is not a decimal terminating in the 10ths place, so you would have to make your increment in your loop that draws the circle in terms of pi. Try pi/31.5 to be your increment. You would have just as many slices in the blob, but they would be more evenly spaced out. I do not know if this would solve the problem, but it is most likely one of the factors causing the problem.

  4. The Faceless Crafter Avatar

    Will there every be another print run of the coding rainbow shirts?

  5. Wolvemania Avatar

    I know your running put of ideas, and I know this was hard to do, but your videos are getting boring, the and snake thing was fun. Not anything else though…

  6. Tomás Mejia Avatar

    Did anyone else notice the green in his Coding Rainbow shirt interferes with the green screen? It looks like he has a see-through slice in his chest

  7. simplecast simplecastic Avatar

    clouds please do animated clouds

  8. MasterFlamaster Avatar

    once again, green color in the rainbow on your shirt

  9. CoxTH Avatar

    I am too distracted by how the green part of the rainbow on his shirt was greenscreened out

  10. Nathan Woods Avatar

    This looks super cool! I took a stab at getting the edges to be continuous using 3D noise. It samples 2d points from a noise plane in the shape of a circle, then uses the z dimension to get the flowing animation effect.

  11. Victor Lu Avatar

    WHY DIDN"T I FIND YOU DURING MY HIGH SCHOOL DAYS OF JAVA LEARNING? These coding challenges are so helpful.

  12. Clokworx Avatar

    Did anyone else notice the green on his shirt conflicting with the green screen?

  13. Cody Thompson Avatar

    fantastic series, super interesting. really well presented too. clever that they are punctuated and content dense as opposed to slow and condescendingly redundant explanation. i watch these for entertainment.

  14. Michael Avnyin Avatar

    Daniel amazing – i love your passion for design and coding. I hope you always continue these wonderful videos

  15. Bian Yx Avatar

    Hey,buddies, I am really a programming beginner, and I followed alone with this video on my own processing,something I did here seems wrong. Please can anyone help me to figure it out? I would be super grateful.

  16. Nathan King Avatar

    idea for looping noise: take 1d noise values based on information from a circle of points in a 2d noise function,
    could be expanded to looping 2d noise with a torus
    so like… non euclidean noise?

  17. orazdow Avatar

    How do you get rid of the discontinuity at the bottom?

  18. Noel Earl Watson Avatar

    How do you do this for spheres?

  19. get fun Avatar

    i dont know how to add javascript on processing
    i need some help

  20. digitalArtform Avatar

    If you made the noise a function of vertex x and y then the first and last points, being similar, would get a similar offset and close better. — How would you make it more of a smooth spline through the vertices with no sharp bends? No piece-wise linear fit?

  21. Imru I Avatar

    hi, you are brilliant.

  22. aronkoffler Avatar

    best videos, best reactions when the code doesn't work the way u wanted!!!

    so much fun to watch, and LEARN, thanks a lot 🙂

  23. riso1990 Avatar

    Any chances of A* path finding algoritham…

  24. Trolled Woods Avatar

    Where is the page of requests for coding challenges? I really want to see Atari Breakout

  25. Malcolm Arcand Avatar

    Where can I go to watch these live?

  26. Pedro Alejandro Mir Avatar

    dude…. you are the best… THX…

Leave a Reply

Your email address will not be published. Required fields are marked *