Coding Challenge #61: Fractal Spirograph

hello welcome to a coding challenge fractals fire draft day today here on the coding train choo choo all that sort of stuff so what you're about to watch is really awkward a little bit odd it's going to have some awkward edits in it I had several long stretches where I got sort of stuck on a debugging problem if you're interested in that longer debugging process you can go and click on there will be a link in this video's description to the long a look like two hour at this point live stream where I did the challenge but what you'll see here is that you have an end result that closely matches this particular image on this blog so the blog is beneath - equation blogspot code at UK and the creator of this blog is thank you to see J Chen the creator I believe of this blog proposing and describing some of these images so this kota challenge is going to start twice because I'm doing this intro and then it's going to actually happen we're all going to introduce it again because I think that I still need this intro and then at the end it's actually going to end twice because we have to finish and then realize and come back and add a few bits to make this more closely match the images on this particular blog so I hope you make something creative with this I really hope this has some put something out into the world that's useful because boy did I spend a long time trying to make this video with a lot of problems and a please share it with me at shipment on Twitter hashtags coding trainwreck hello welcome to a coding challenge in this coding challenge I am going to attempt to make something that is called a fractal spirograph perhaps or fractal roulette or sort of like a workable thing or a pattern thing so this wasn't requested it's in my rainbow topics a repository and I'm still trying to figure out why it's sometimes called the Denice equation and also how to pronounce that so perhaps it's called that because somebody who keeps the blog maybe their name is beneath and I really should just research this but I'm going to rely closely each YouTube audience here to correct me and building it in the comments so you can see here that there's this idea of nested circles orbiting each other and then you the smallest one and sort of like the last nesting of the circle tracing out a pattern you get this kind of nice beautiful fractally thing and so you can see here's a bunch of varieties of it I really like this one maybe we can try to do this one so I'm going to try to make one of these and see if we can get it to work and you will hopefully then adjust the code think of your own ways of making the pattern of using color your own design and creativity I'm going to do this in processing now processing if you're not familiar with it and you know I'll try not to say this in every video I make but it is a Java based platform with a robust drawing library and a development environment so I'm going to be able to just write code with Java syntax call well I've dropped drawing functions and see the results of my programs in a quick sketching prototyping way now another thing I want to mention is this is quite similar and let me come over to the whiteboard here this is quite similar to a coding challenge I did a while back called solar system good yes thank you thank you very much thank you did you hear that or am I just doing weird stuff people started cheering in the hallway I'm not sure why okay so in the solar system coding challenge I created a system that had a circle and each circle had some number of other circles orbiting around it and those had other circles or brigs orbiting around it and I use to do this functions like translate and rotate and these function calls were nested so I would from the center of one circle translate out and then rotate by some angle and then I would translate out again and rotate by some angle so that I could have nested circles orbiting each other which is very similar to and so the idea of this is like the Sun this is the planet and this is the moon that sort of thing this is quite similar to what you're seeing in this orbital fractal Figgy but I think what I want to attempt to doing this challenge for no other reason just to see a different way of doing it is to actually use some trigonometry math so if I know the radius of this circle and I want to have another circle right outside of it and I no it's radiance then I can figure out where this circle should be positioned based on based on polar coordinates and this is something that I've used again and again and again in various coding challenges where I say okay I have it I have a two-dimensional space with an XY coordinate and then I can also think of that XY coordinate as a distance from the center R and an angle so x equals radius times cosine of that angle y equals radius times sine of that angle and this is a formula for converting from a polar coordinate to a Cartesian coordinate that I've used again and again and I will once again link in this video's description to a video that covers this formula in more detail so let's start trying to program this let's start in a very basic way what do I need I need a circle in the center so I'm gonna make a global variable which might not be necessary called R but make it global just to just to see later how we're going to use it and let's make that radius 100 let's start with a radius of 100 so I'm going to set a background color of 51 because that's my favorite background color and I am going to then say no stroke no no I'm going to say stroke of 255 no fill so I want to have an outline of a circle with no interior and then I'm going to use the ellipse function which draws a circle at 300 300 with our times 2 as the whisk and our times 2 as the height and if I do this I have my 4 first circle so some things that I might do just to make it easier for you to see on the live stream or whatever you're watching this is just increase the stroke weight a little bit so I have a little bit of a thicker circle now I want to position a circle right outside of it and maybe I want its radius to be half the size so let's work out the mass for this so what I need to do is I also need an x and a y so that's going to be the center of the first circle and I think I'm going to need to do this in the object-oriented way soon enough why I really didn't plan this out at all so this is going to be an x and y so now I want another circle I'm going to say and let me not make these global variables actually I'm just going to sort of figure out a static version of this just to get started then I'm going to say R equals R times 0.5 so R divided by 2 so I mean I was I'm going to say R 2 for the second circle I'm definitely going to need to do some object-oriented way of nesting these but I'm just bring it this way for right now just to get the basic idea so now what I need to do is say X 2 equals x plus R plus R 2 and then I can say ellipse x 2 y r 2 x 2 r 2 x 2 and now we can see I have two circles so I just wanted to see the basic idea there of putting two next to each other why does this work here's a circle at XY and here is a circle at X 2 comma Y this is r1 and this is r2 so you can see X 2 is offset by X by r1 plus r2 now of course things are going to change quite a bit once I start this to rotate let's see if we can just make just this rotate around how do I do that so really the the answer here is what I really need is an x2 and a y2 and really what are what I would I could distance is oh boy these are terrible variable names I'm going to clean this up in such a nice way so soon we've really got to get to it so let's say our our holy God let's make this our 1 x1 y1 just for this let's get the least make this make some amount of sense for a second x2 y2 and what I want to do is I want to say our sum equals r1 plus r2 and then x2 equals all some time cosine of some angle and at Y 2 equals are some times sine of some angle right what I want is to rotate this around so I want to do this formula but this R is actually the sum of R 1 and R 2 so now what I'm going to do is do this and I'm going to say the angle is zero so I'm going to start with an angle of zero and now whoa that is way off way off what mistake did I make okay let's look at this R 2 is half of our one our sum is R 1 plus X two is our up so it's right but it needs to be offset by the where original and so this is just the offset from the center of our one so X 2 really equals x 1 plus this X Y 1 plus this there we go so now the circles in the right place now let's make this angle a global variable and let's say angle plus equals zero point one and we can see there we go so we now have the circle rotating around so this is the core mechanic I used I could have done this in a much simpler if it's simpler the right word but with less code and less math I could have just used translate and rotate and achieve the same effect see my other video about how to do that but one of the reasons why I wanted to do it this way is I have full control like I can now draw a path so I'm going to just add something to this I'm going to say array list P vector path so what am i doing here I'm using a data structure that the Java data structure called an ArrayList it's like a flexibly sized array and I'm going to fill it with P vector objects P vector objects are two dimensional or three dimensional vectors an X to the Y and our x y&z so what I want to do in setup then is I'm going to say path equals new ArrayList filled with P vectors and then what I want to do is every time I rotate this I want to say pass ad and oopy vector at x2 y2 so as this thing is going I'm going to soar all the points to keep track of a path and then at the end here I can say for every single position in the past so this is a nice Java enhanced for each loop for every P vector pause in path I want to say set of vertex at pause X and cos dot Y and I'm going to say begin shape and n shape to make this one continuous path and now we can see that so what we can see that it's tracing its past so we've got the core idea down from the beneath equation that's orbital fractal which is that we need to have some way of positioning a circle outside of another circle rotating and then keep track of the points of its path and draw something okay so we're good now we've got a serious problem here this is not sustainable right I could maybe do some kind of like weird for loop here and kind of just keep building on the previous one that's a problem so what I want to do is it's really going to work well we're going to give it a try what I might have some angle issues but what I'm going to do is I what I need is to make this into an object so let's take a look at what I mean by that so I need an object to keep track of what I need an object to keep track of a circle that has so each circle let's call it in well I get yeah let's call it in orbit I don't know I don't know what it should be called I'll call the circle so I'm confused it needs to have an X the Y and an R and then it would have like a child so we can think of these as parent-child relationships this is the parents of this circle and if this one has one going around it this is the child of this one if this one has a little and so as this one so that's what we can think of now it also probably needs it needs to know it try needs to know a reference to its parent so that it can pull its parents radius and then it also needs to have some type of orbits speed so I think I could call each of these in orbit and orbit has its current XY it has its own radius and it might have a child it might have a parent right the first one has no parent the last one is no child so I think this is a structure of each object that we can build I think this is going to work I'm sure you guys can think of a better way to do this okay so I'm going to make a new tab here in processing and I'm going to name that tab orbit and I'm going to write a class to create orbit and I'm going to say each orbit has one now I could use a P vector to describe its position but I'm going to be a little bit I'm just going to use an X and a wire so it needs an x and a y it needs a radius that's its own radius and it needs what it needs a parent its parent is another instance of an orbit and it maybe has a child you know I could call it like parents its son and it's shot the child its moon but let's just use I think parent and child will be easier for me to remember and then what else did I say orbit speed okay so it needs I'm just going to call it speed oh and guess what it also needs an angle right easy keep track of that angle so angle and angular velocity is really what we've got here okay so all of these things are all the properties this object needs so when I make an orbit I can maybe get now this is like a kind of annoying convention that I follow but the arguments to a constructor in Java are variables that are kind of like 10 I mean these are arguments to the constructor by me using just as temporary variables to fill the to fill the the actual instance variables of the object itself so I kind of just name them with an underscore to mark them as different but I realize this often looks kind of cryptic or confusing but let's do this and then if I'm making one I could assign I would assign myself as a parent so parent equals P so let's think about how something like this might work like I'm going to make an orbit it's going to have an x and a y it's going to have an R radius and it's going to have a parent orbit thing so I'm going to comment all this out because we might need it again later but what's interesting about this is I don't actually need an array of all the orbit objects I could make one but each orbit object is simply going to keep track of the next one so the iterates RISM I can just go to one which points to the next which points the next and this is actually somewhat by accident a data structure called a linked list so we're kind of programming a bit of a linked list here because each orbit is linked in like a list format so I'm going to say orbit I call it root like it's the core but I'm gonna call it Sun I'm gonna call it Sun and I would say Sun is a new orbit and it is it has a x and a y which is the middle it has a radius which is 100 and what else did I say it needs it needs a parent and this one has no parent so I'm going to say no now I could do some really interesting technique in Java I could actually overload the constructor and actually let's do this just so you see this you can actually write for an object multiple constructors in JavaScript you would just have one you would Tet you would query the amount of arguments but I'm going to do it this way I'm going to write another constructor that does not have the fourth option and I'm going to say this which means call be call a different constructor with X Y R and null so meaning if you ever created orbit without the fourth argument it just does the other constructor and sends it null is not really a major point of me doing this but I don't want to have a parent for the original one so now one thing I definitely want is I want some sort of display function which these days I'm calling show and what I want to do in the show function is a stroke 2:55 stroke wait - and then ellipse at the x and y with r times 2r times 2 so now if i here is in Drye just say son show if I run this again we should see there it is now how come I guess I forgot no Phil son - oh there is okay I don't know how long have you been watching this video and all I've got is a circle on the screen and very very sorry but if I'm hoping this will get more interesting soon okay so now what we need to do is we probably want to say how do we add a child maybe what we should do is say son let's just write a function to it son da add child I'm just going to write a function called son add child I mean I'm gonna write a function called add a child so I need to write add child what does add child do okay so first of all it has a child so I'm going to set child explicitly to null here I'm gonna set angle to zero and angle speed to zero point one just to give those some values so adding a child is I don't want it to be not anymore I want a child equals new orbit now I need to give it an x and a y a radius and a parent okay so the X and the y so first of all I should say a new radius equals R times point zero five so this is divided by half either probably some appropriate ratios I'm supposed to use but I'll just try dividing it by hat by two so I want the new orbit now I need to get those X&Y points so a new X should equal X plus R plus nu new radius right because I just want to offset it by its own X plus its own radius plus the new radius and new y will just be the same so I want to create a new orbit at X nu X new Y and I want a new X new Y with new arm I'm just going to call it new are just to for a little bit more shorthand and then its parent is this so I'm having the function itself I'm having the object itself create its own child and it's going to pass a reference to itself to the child so there's a child that keeps track of the parent good okay so now let's see what's happening here so now what if I say what if I say orbits current equals Sun Y maps or text up so what I want to do is I want to write a loop I want to say show all the orbits so start with the Sun draw it look at the suns child draw it well take the son's child child draw it and when eventually one of the children has no child than stop so as long as current is not equal to no say current show and then I'm going to say current equals Sun dot child so this is now an algorithm I have look at this for saying look at the curt start with one this is iterating through all of them it's kind of like I probably should do something like you know write a function that returns it called next or something but just for simplicity I'm just going to say the current equals its child so start with current equal to Sun it's not at all so show it then get the child is it no it's not then show it they get the child and this should say not sundial current da child right because I'm really in a way maybe I'll call this next while next does not know go to the next child something like that doesn't that really cool occurrence or next or whatever the point is it's a variable that's iterating through all the things so let's see what we get now awesome we've got the son and a child now what if I have this actually also return the child so in addition to creating it and assigning it it returns a reference to it because then what I could do is I could say a Orbitz child equals son done add child this now this is terrible but I could then say orbit child 2 equals child 1 dot add child something like that right so this is this idea of like I could have the son create a child and then the child of the Sun create a child etc so I probably want to write a loop there but you can see now I've got a bunch of them this was pretty good this is looking pretty good ok so why don't we do this why don't we write up why don't we do this a certain number of times three times and I think we can employ the same sort of idea where we can say and this needs to be an integer where we can say a orbit next equals son so next equals next dot add child right so this is a little loop to start with one and then add a child get its reference back do it again do it again do it again so this should give me oh wait can I start with the son then they added three children please do sales like why do I have four I have four because I did it three times but I started with one and we could even see here you know this should probably be a parameter but if I made them much smaller like point two well that's a bad idea let's just leave it at point five so this is good so you can obviously places okay now interestingly enough I just want to show you something really quickly what if I just change this to a - look what I got there so that's interesting to see a little quick variation right stead of offsetting it out by the sum of the radii what if I offset it out by one radius minus the other that's going to give you a certain inside so that's something that you might little variation that you might play with okay now what happens if we want these things to rotate it's just just going to work what if I write in the orbit okay so I need to write a update function update function so first what did i do back here I kind of figured out this algorithm here let's grab this algorithm so our sum in this case is now the sum of my own radius plus my parents radius then my the X should update to be the parents X plus the sum times cosine of the angle right and the Y so this is updating should be the parents y plus the sum times the sine of the angle so this is me updating its position every frame right I want to look at the I want to offset my location based on the parents X y plus a whatever my rotation is and the sum of the two radii so that should update everything and then in addition to that I want to say angle plus equals angle speed or what did I call that just speed so I always want to increment the angle I was feeling there's a mistake here so that should update so let me just run this no syntax errors I think I'm missing some pieces but let's throw caution to the wind and as we iterate through them all let's also update them okay what's wrong you're up okay I a nullpointerexception why because I don't want to update it if it has no parents so I'm trying to well yes the parent never moves never spins so it's really only for the son so I'm trying it you know where I put the you know one thing I could do and there's a bunch of ways I could solve this but probably a good way to do this is just to say if parents is not equal no I just do this right now just to make sure it's not a null parent then I'm going to actually do this okay interesting now what why is it doing that I have a feeling it's doing that because they're all spinning at the same exact speed let's see if I let's see if I can create another I'm going to create another argument here float F for speed and I'm going to say speed equals F and actually before I even do that let's just give them a random speed let's just try a random speed between the Z between 0.01 and point 1 and forget about this for a second so let's give them a random speed hmm look this is to the side twice so I need to get rid of this and like leave these random speeds let's run this again and see so you can see now we're seeing some like slightly different offsets from each other now there's probably an exact science to this and they all also there's a bit of an issue where they're all have the same they off the same angle rotation I am looking at the YouTube chat right now speed reset 2.1 so i think i want to look at the original the original version of this again let's pull that up and let's see if we can kind of uncover what the relationship is between so first of all are they this one is moving so they're moving in opposite that one's moving this this one's moving counterclockwise and the other one is moving clockwise so this would be something to do so let's actually think about that so I have a kind of idea let's just actually leave them with the same so first of all let me add another let's minimize this let me add another argument here and what I'm going to do is just give the first one point one so I'm going to oh there's so many different ways I could do this but let's let's try to be a little somewhat consistent about it let's add a fourth argument for speed right here okay so let's make sure that works and then speed equals s now they should all have exactly whoops and here I should pass in Oh speed so now they all have the same exact speed and that's a little bit fast but I think it'll be easier to sort of figure this out if we watch it a little bit more slowly so let's let's start with just kind of like zero point four oaks zero point oh four or something okay that's a little bit easier to look at okay now let's just try a simple idea of when I make the child the child should have the negative speed of the parent same speed but opposite direction now this looks more like something the question is is this exactly the path that is and you can see this is this exactly the path yeah speed is actually angular velocity someone in the YouTube chat rightz which is a good point it's seaman I'm also getting it seems that speed is I minus 2 times the parent speed so maybe it actually is faster but but in the opposite direction so let's try that you have this look so but I've started with it too fast so let's try it as much slower yeah this looks good so I feel like this looks much more like what the original program has so now that the original one also have a total of four circles let's see let's look back at that original example and I can't see zero one it also looks like these they're shrinking more by like a third I can't exact tell you know exactly but it looks like there's four it looks like maybe they're shrinking by a third so let's let's divide it by three and C so this looks much more like what happened there and I think we could also start the original one at 200 I guess that's a little bit off the window so let's try 150 there we go so now I think we've gotten kind of exactly what's in that thing let's try creasing the past okay so all we need to do is we need to we need to to have a reference to the last one so what's the best way for us to reference one when this is done next is no unfortunately so I think I think what I'll do is just for simplicity is I'll just keep track of a global variable called end and at the end end equals next so the very last child is the end and then I can actually just go back and add this back this passed up exactly back in and I can say NX and n dot Y so this should now be that path and let's make the path I don't know pink or something or purple let's make it just so we can see it and let's let's also make the orbits let's make them maybe a little bit lighter because in the little alpha and let's do we get well that's certainly something let me make this stroke weight a little bit more visible here and we can now see how it's tracing that path it's kind of nice does it look like that fractal pattern at all I'm seeing in the chat that I'm being suggested to multiply it by negative three so maybe I just had that off negative three let's try that there we go so this looks more like that pattern and second circle has five speed and last has twenty times four so I think the how those speeds are changing is actually it's you know we can see what kind of patterns that's times four I think they're actually almost exponentially increasing okay there was an awkward edit there but there was a bunch of debugging needs that happen that I was trying to get this right by just eyeballing it and actually a chat nicely pointed out to me that the formula is just in the comment lower down in the page so I'm going to go back down here and look at the formula which is right here and it says okay so speed of speed is equal to K a constant to the N minus 1 power and n being the level so the first circle is zero the next one is 1 so n must be the level and then also something that is important here is I also need to use 10 or 11 circles where I am in my code I actually only have 3/4 because the first one is zero so what I want to do is go and look how am I getting the speed so I'm multiplying the speed by negative 2 I think I've tried a bunch of different things so maybe where I last left off it might have been four we can see multiply increasing the speed gives me kind of more interesting patterns but really what I want is not what I want to do is rather than have the speed be this thing that changes I want each orbit to keep track of its level so ultimately what I want to do is just send in the number 0 the Sun is zero so I'm going to add a variable called n to keep track of its level and instead of s I'm going to pass in N and I'm going to set an equal to that level then speed is going to be something that I calculate based on the formula so if I go back and look at the formula it is K now I don't fully understand this but K I believe is usually a so I think maybe I could just sort of like pick one of these so I am going to arbitrarily pick K of two and then I'm going to say speed equals power K to the N minus one is that is that correct k to the N minus one yes and then when I create the next orbit I just send in n plus one so the next one is the next level the next one is the next level let's just take a look at this really briefly and why is this giving me oh this should be an integer I'm using integers for the level and same thing here this really matters that much so now whoa something is way off okay here's an issue these values are very large and that's light so one thing I could do is just that maybe think of them as angles and convert them to radians and now we've got something that Mormon now there's a couple problems with this first of all I'm getting a pretty interesting shape even just from this one thing that I need to do is I need them to alternate their direction so the nice thing about setting something to the power of an integer is that if it's a negative number to the power of 2 squares it'll be positive 2 power 3 negative 2 power 4 positive so I could actually just say K equals negative 2 and now they're going to go in opposite directions and you see this kind of looks remarkably like what I started with but let's try having this K to be something larger and we can start to see now that this resembles much more closely to the pattern that we saw in this original this original image now I'm not getting so much detail here and I think the way that I'm going to get more detail is by actually having many many more levels there's only three let's add 10 and now we can see now I'm still my incrementation steps are kind of large from that conversion to radians so there's probably a way for me to have the time be smaller so I can get more detail out of here because you know this would be interesting to try adding a hundred of these and it can't even I don't know it maybe it let's just try adding 20 but my incrementation steps are so large that I'm not getting that level of detail so we we've got something that kind of that kind of resembles it I suppose if I wanted to really trace it out I could have the incrementation step be much smaller maybe I could just divide by a thousand but add like a hundred it's going so so slow so I'm have to speed this up in time-lapse it I'm going to leave that to you as a challenge so the challenge that you should do and maybe I'll come back and revisit this in a future challenge let me get this back to a state where we get something is to take this basic idea and more closely match the level of detail in these images and also think about how can you adjust where how the circles are positioned relative to each other to change to get these different kinds of patterns and I would read through this entire page and and see look at some of these kind of amazing crazy pattern and see what you can get see how you can color it see what you can do and these are loving the story I just want to let's try one more thing let's at least try the thing where we nest the circles inside of themselves rather than outside whoops that didn't work some where's my son that's what I'm looking for here yes so let me say - here with the sum and now we can see this particular pattern that's very similar but now sort of more inside of this particular circle okay so thank you for watching this coding challenge I have no idea if this was interesting or useful at all I feel like there were some nuggets at the beginning if you've made it to the end of this hashtag trainwreck coding trainwreck I think is the new appropriate hashtag for this channel you can tweet me at Schiffman hashtag coding trainwreck with your nan train racks beautiful visualizations that you've made from this beneath the night Vineet a I don't know how to pronounce it somebody will tell me I'm sure in the comment equation orbital fractal thank you for watching okay I'm back for likes of ten thousands bags for a quick addendum this train wreck is not finished of some night I got some wonderful nice comments in the chat and I would like to improve I think it's worth taking an extra bit of your time to improve my particular drawings to match more closely what's going on here so first of all the first thing and I'm sure everybody who won't bother and a lot of you I know which is that I didn't actually line everything up with the top and you'll notice that if we look at mine it lines up perfectly to the right that's the zero angle so I just want to go rotate negative pi divided by 2 and negative 90 degrees so first thing I can do is just very quickly fix the angle to be negative pi divided by two and in this case now we at least have the pattern pointing up now one of the reasons why we don't have the same level of detail that's here is that I might incrementation amounts is quite large so as it moves the rotation is happening fast that I want to see this play out in real time but if you'll notice this has a kind of like stutter it means that it's a gift so there's probably some issues with how it's done but this is it guys this is actually probably each time it moves it's kind of drawn a whole lot of point so I can emulate that so I'm going to make a global variable which I'm going to call a I'm going to call resolution and I'm going to set that resolution right now to one hut two one so what I want to do is here what I want to do is look at the speed and I want to divide the speed by resolution meaning I how many how many incremental steps are going to take in between each each angular change of that angular velocity so maybe I just want each time step is like a full unit of one so I want to divide by resolution there and then what I need to here is each crate each cycle through draw I want to do this st. updating the past an amount of time that resolution amount of time so I'm going to write a for loop here to do this an amount of time so there's a little bit of an issue here where I'm drawing this so I'm going to be drawing the circle multiple time but I want to get all those incremental path points and amount of times that resolution amount of time so it shouldn't use ends up being used somewhere else now if I run this this is exactly what I had before now I could if I wanted take this out I kind of did this all at once because I practiced this a minute ago house debugging up so but even if I just change that resolution now to something like 10 what you're going to get is you're going to see this giving us a finer level of detail but it's going to be running more slowly because the whole animation is doing kind of ten steps so one way I can kind of clean that up is I can do ten steps each cycle through draw to keep that same speed the one thing you'll notice if those circles look much brighter because they've been layered on top of each other a bunch of time I mean one thing I could actually do is just not bother to draw the circle and we could just see the path and there it is and I probably should also you know stop it from redrawing when it gets around the full rotation so you can see it's kind of drawing over itself but you can see this has much more like the quality of what's in the original image and you know just to sort of see you know if I make the resolution 100 does this really give us anything better I'm not sure but you can kind of see now I've got even more level of detail so the number of levels of cerca method circles and that resolution you know it would be I think a great thing to try making this very high retinal blowing this up and making this a large pixel area and trying to really see how details can you make that and make it kind of like a high resolution image version of this okay so thank you for watching this coding challenge I think there's a lot of exciting creative possibilities that you could build off of it if you were able to follow this I will post but in the github repository I will put both a processing version of this and a p5.js version of this that you can run in the browser and look forward to seeing what you make thanks for watching [Music]

Channel: The Coding Train

Views: 66,938

Keywords: live, programming, daniel shiffman, creative coding, coding challenge, tutorial, javascript, coding, challenges, coding train, the coding train, fractals, fractals spirograph, fractal art, fractal roulette, benice fractal, benice fractal spirograph, spirograph processing, spirograph java, fractals java, fractals processing, fractal processing, processing, processing java, java creative art, java creative coding, polar coordinates

Id: 0dwJ-bkJwDI

Length: 44min 19sec (2659 seconds)

Published: Tue Feb 28 2017