10.7: Painting with Pixels - Processing Tutorial

[@tu8833]

I'm Japanese student. This video make me feel infinite possibilities of processing. I'll study the great language!!

[@TheCodingTrain]

Thank you!

[@gaborm5673]

*makes an entire OS with processing

[@KasanovOFFICIAL]

Lol

[@danny_racho]

And we never heard from him again Lol

[@kevnar]

Virtual Van Gogh algorithm: 1. pick a random point on the canvas that has not already been painted. 2. set the circle's color to the color of that point on the frog image, + or - some slight mutation factor 3. set the circle in motion with a vector that has random acceleration added over time, so that it glides and wiggles around in a random walk. 4. As the circle moves, check its color against the color of the frog image at the new location. If it changes too much, stop it. 5. Repeat from step 1 until all areas of the canvas have been filled with color.

[@engineeringwithmehran]

Processing is a great framework for learning and visualization and you are the best teacher, who helped us grasp our mind over programming and understand some of the basics of some complicated algorithms.

[@kg13]

My jaw dropped in awe when I saw 3000 particles, loved it!

[@abhijeetkushwaha424]

We love him 3000 xD

[@joaquimjesus6134]

honestly i love your videos... these playlist videos, about pixels, can used\learned for all languages. the only thing you miss was more about drawing with stretch\alphablend and more about using math with pixels. please add more videos about pixels.. please

[@amirulidzham3686]

Seriously, I need people like you teach people like me as a startup. Sometimes, I having difficulties understanding the code by lab demonstrator.

[@AntandraMusic]

These videos are so awesome. Been improving my programming skills a lot. Thanks!

[@jaugretler9140]

you are a gift to civilization

[@peterhayman1789]

man this idea of pushing pixels into a 3d space! im just so excited to start dooin it!! :-D

[@philmageo]

I love you when you make short videos !!! This one is great.

[@williamwherewhatwho6177]

I've been so busy watching your tutorials I've been forgetting to click like. But be not mistaken, I love your videos! Keep them coming!

[@mdtanveeralamgir8924]

I Just love your work and admire your passion for coding.

[@TheCodingTrain]

Thank you so much!

[@ajnovember]

You have many excellent videos but this may be your best!

[@kocaksaid]

okay wow, i think this lesson was quite impressive for me. really amazing... thanks again !

[@TheCodingTrain]

+said koçak thanks, I'm so glad to hear!

[@JavierOrtiz-gg2em]

Un trabajo increible, Gracias por tu aportacion, personas como tu hacen un mundo mejor. ( It is a incredible work, thank you very much for your contribution, people like you make a better world ). Un cordial saludo (best regards).

[@mgpyae]

2:40 you gotta take some minutes here and enjoy the small wonderful little things in life .. :)

[@arvikirjonen6219]

Code examples link needs updating. And thank you for all the tutorials! Once im done with these i will move start following your coding challenges. Great fun ! :)

[@sweethomes674]

Outstanding information teaching and examples 😊

[@Nammedit]

The last one is so awesome!!

[@wiedwijanarto2859]

you just done what everybody needs in graphics ! great job !

[@TheCodingTrain]

+wied wijanarto thanks for the nice feedback!

[@MrSmalix]

Great videos, enjoyed wactching'em, witch is quite rare for coding tutorials, thanks !

[@TheCodingTrain]

+Alix Turcq thank you!

[@cagr2725]

Thank you for enjoyable tutorial

[@MattRyanBurrows]

this is the first video i found that lead me to successfully uploading a image to processing. thank you.

[@TheCodingTrain]

+Matt B Drawings so glad to hear!

[@flameofphoenix5998]

The joy of rendering

[@coffeecatrailway]

if you do this code "ellipse(x, y, i-(i/2), i-(i/2));" it looks really cool!

[@cjw6659]

Processing is awesome.

[@hascheidl]

Link to code example is broken.

[@ramoun7633]

one of the best out there

[@furrane]

I going through all your tutorial video of processing, and after each videos I'm like " I got god power at my finger tips " xD I got into processing for an arduino project but I got so mindfucked about the possibilities I just can't stop learning this language. Thanks for the vids man, deeply !

[@TheCodingTrain]

+Furrane Thanks for the nice feedback, good luck!

[@miksuko]

Furrane why do people put spaces where they don't belong

[@ohaRega]

Might be the same reason why some people don't put dots where they do belong.

[@Vinni-2K]

same for the first sentence :D

[@celiacasimiro465]

10:19 Very Interesting Perception of 2000

[@systemdeveloper5266]

Thank you for the video! I love watching them and leanring alot :D

[@johndoerqaaa]

You are truly magnificant. love your videos! keep it up

[@Tokyo_Pessi]

373 likes, 0 dislikes!! Great job

[@corrompido7680]

why aren't you a painter, you are really good

[@abhijeetkushwaha424]

@10:22 Dan, I love you 3000

[@prabhanshuwakodikar2082]

Thank you sir, i have drawn the image using phyllotaxis algorithm

[@navidshad]

Hi Daniel, thank for your great tutorial videos. they've helped me a lot . it has been a question for me that how you earn money? where you are working for yourself or not ?

[@Mr_cl0wn]

best video ever!!!!!!!!!!!!!!!!!!!!!!!!

[@lokeshisrani8827]

Further reduce the diameter of circle and you'll see nearly exact replica when exact pixel color is picked and stored.

[@tarteur]

Oh hello, Thank you a lot for all your videos. I have a question for you sempai, how can you draw (with the same pict) in a bigger windows, the same pict but resize ? (it's not very clear, sorry i'm french...) I want to do this with a video ! Thanks and have a good day.

[@ritikkhatri]

Superb!!!!!!!!!!!!

[@laurencegoldman4639]

Studio Artist software is doing this kind of thing. Problem is on the fine art aesthetic spectrum, the image output sucks. It doesn’t hold to great art. The system needs to do what Brian Eno’s loops do: endless generation of non-repetitive variation. The accidents need to be something I can never think of myself. The stuff that’s done particle generation from human movement is more interesting. If you take a video of a crowd walking, say. And make moving mats so you get two tone flat shapes moving. And do the same thing with another video and then layer them, you get an organic never repeating set of shapes where each frame is unique forever (if you loop the two out of sync). How do you code that? For example?

[@clemmmk]

What if you are dealing with arrays? For example an array of string text that you want to pixelate. How will you go about it especially at the for loop?

[@riveraluciano]

Hi! I just got into Processing and I'm so rusty from programming (haven't done so in years, last time I actually did so was back with Assembly and a little with C). Would you mind uploading the code for the particle systems in 10:20? I'm trying to implement something like that for a project.

[@RedsBoneStuff]

Cool stuff!

[@katem2941]

Does anyone know how to alter the code so that the user “paints” the pixels in themselves. Like if the user moves the cursor around on the screen, then the pixels will show up? I’m new to programming and would appreciate any and all guidance. Thank-you!

[@barco10001]

Use the mouseX and mouseY functions for the position of the ellipse, and put the background function in setup.

[@bahadrsivasl114]

you are the best..

[@aurelianobuendia24]

I know you can resize the image using as arguments the image like image(img,0,0,width,height); But how do I apply that scaling of a in image to the color array to accoplish the effect that is in the video?

[@aurelianobuendia24]

Yeah ! im going to publish it there also, but i figure it out : pix = img.get(int(map(pos.x, 0, width, 0, img.width)), int(map(pos.y, 0, height, 0, img.height))); You´ve only have to use map, jeje pretty easy

[@michalbotor]

really cool!

[@albertdjikeng729]

how would you do clustering? separating pixels according to their values and grouping them together

[@Anton-wc7lb]

Thanks for the video! When I change the get() funktion to a nested loop and then put the ellipse() funktion at the bottom of the loop, the program will attempt to draw a helluvalot of circles? My frog is 750*500 pixels, that seems like too many circles to draw, because my screen remains black :( Any ideas?

[@rsvn29]

which software i can use to try out the algorithm you have shown? Can you suggest any link to download?

[@johnniegilkerson4724]

Where is the code for Particle? I looked at all of the links. @ 9:20 in video you skipped past the whole code for Particles?

[@TheCodingTrain]

Is this the right code? github.com/CodingTrain/website/tree/master/Tutorials/Processing/11_video/sketch_16_1_particles_capture

[@AslanTO]

Im late to this video and dont mind me to ask: is "DipFak" running the similar concept with this image painting?

[@ThisToxic]

Where can i look at the Explode source code?

[@sleep3017]

well the main sketch is the same like the bubbles he is just calling functions and you can just go to 9:19 and just pause when he scrolls through the whole class and get the basic idea. P.S: There is some sin cos tan stuff in there.

[@tagaiismailov4235]

Where can I get your chapters with exercises?

[@zeichenkunstlerin2644]

Hi is there a possibility to get the code of the sunflower :D

[@zahidahmed586]

This can be A video intro!

[@syamahmad1229]

can we do real time image processing in this platform...form arduino camera...????

[@joaquimjesus6134]

how do the alphablend and stretch using math?

[@CharIie83]

genius

[@marijnmeijers]

Hello! Please help me! I want to fill a png image. I only want to fill a silhouette. Is this possible ? Please help it's a school project.

[@sarmenalmond3622]

How to resize the image within this array? and What's the last line after particles[i].new ; ah!!

[@olfmombach260]

Where the heck do you get all of your ideas? My process (no pun intended) of learning a programming language always stagnates because I don't have any new ideas what to do...

[@TheCodingTrain]

I would suggest finding a community to learn / collaborate with!

[@olfmombach260]

Do you know any good ones? I am completely new to this field, sorry for my incapability ;)

[@ellenchu1850]

Is there way to code pixels into shapes eg: rect and the ellipse code and apply it onto an image?

[@TheCodingTrain]

+Ellen Chu I would take a look at the texture() function. You can process pixels in a PImage object and then "texture" it onto a shape.

[@CamilaHernandez-um6on]

version 3.2.1 does not receive get ( int ( x ) , int ( y)) :( I don't know what to do.

[@nirajgautam403]

Which programming language

[@Anonimousxz]

Many cool!!! omg o/

[@danny_mg9535]

Hey there, I notice that each ellipse is entirely the same color can each pixel rather, have a different color? regardless of whether or not it's in the same ellipse

[@danny_mg9535]

and minus the shortcut of having really small ellipses

[@danny_mg9535]

Hey, got it. I used PGGraphics coupled with a mask image

[@leandroaraujo4201]

XD, use notes instead of replying yourself, nah, do what you want :D

[@RichardCorral]

ah so fun

[@TheCodingTrain]

+RichardCorral Thank you!

[@fairydragonbreath9192]

The link for the examples on the github says 404. Can you show us how to do this in p5?

[@TheCodingTrain]

Oops! github.com/CodingTrain/Rainbow-Code/tree/master/Tutorials/Processing For p5: kzbin.info/www/bejne/ZoeWpox3Zs2UnM0

[@giovannygalindo4726]

the Link is broken, I want to see it!!! :(

[@laurencegoldman4639]

After seeing those dance images with Kinect, the difference is this. It’s a whole other thing if the streaking is a HUMAN GESTURE, as opposed to what is outputted here. I.e a spontaneous path that’s never the same twice. What’s happening here is computer rendering of something already done , fixed. Art creation is fluid, dynamic, endlessly interactive, subtle. It stops and considers. Makes constant changes. Code needs to codify this.

[@YLprime]

Why do we need to vx and vy instead of speed

[@tvojtatko123]

your github link is broken

[@iampetah5409]

Hey, can anyone here help me with this: github.com/processing/processing/issues/5025 ? For some reason there is a arrayindexoutofboundsexception, but it actually isnt.. What the hell is happening here?

[@pronobroy8389]

Why you do unnecessary smile always?