Coding Challenge #135: Making a GIF Loop in Processing

Subscribers:
1,740,000
Published on ● Video Link: https://www.youtube.com/watch?v=nBKwCCtWlUg



Category:
Tutorial
Duration: 20:14
69,304 views
1,486


In this tutorial, I demonstrate how to render a sketch into a perfect, looping GIF with Processing (Java). Code: https://thecodingtrain.com/challenges/135-making-a-gif-loop-in-processing

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

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

References:
πŸ–Œ Daily Art: http://sasj.tumblr.com/
🐝 Bees & Bombs: https://beesandbombs.tumblr.com/
πŸ’Ύ Loop Templates: https://github.com/golanlevin/LoopTemplates
πŸ–Œ Easing Function: https://easings.net/
πŸ–Œ EZGIF: https://ezgif.com/

Videos:
πŸ”΄ Livestream Archive: https://youtu.be/_xa87yl0nd4

Related Coding Challenges:
πŸš‚ #136 Polar Noise Loops: https://youtu.be/ZI1dmHv3MeM
πŸš‚ #137 4D OpenSimplex Noise Loop: https://youtu.be/3_0Ax95jIrk

Timestamps:
0:00 Introducing today's topic: GIF loops
3:04 Core idea of loop
5:29 Sketch on paper first
6:28 Easing functions
9:19 Use saveFrame() to save images to a folder
13:00 Upload images to EZGIF and stitch images together
15:50 Create a record variable

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://discord.gg/hPuGy2g
πŸ’– 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

#gifloop #ezgif #processing







Tags:
daniel shiffman
coding
the coding train
coding challenge
creative coding
code challenge
javascript (programming language)
programming challenge
coding tutorial
gif loop
gif loop processing
gif loop art
creative coding gif
creative coding tutorials
creative coding art
creative coding processing
processing tutorial