Coding Train Live: Back to School!

[Music] [Music] so [Music] [Music] [Applause] [Music] so [Music] maybe you can hear me again [Music] set [Music] menu sensitivity [Music] i should be louder louder even still and then here we go this should be better now low battery are you kidding me i just charged these batteries [Music] oh my god [Music] oh my exit oh my goodness i don't know how to use these mics okay hold on i'm muting myself [Music] [Music] oh boy this song is ending which means i've got to come on soon [Music] oh boy this might be something of a disaster today i should warn everybody in advance i got a lot of new tech going here and i'm gonna play the next song i'm gonna switch the camera to me in about one minute um oh i need my headphone i'm walking around here looking for [Music] okay ah here i found a headphone ah i stepped on something oh that hurts [Music] very this is very professional professional setup okay okay now oh my goodness i think i think i might be ready to go here i'm switching to me hi well i might be brighter good morning oh is it the morning it's 10 37 a.m welcome this is the coding train with me your host daniel schiffman with the train whistle it doesn't work very well let's check to see if my whiteboard camera is working almost no chance of this yeah that's not that's not a positive sign i guess i will not be demonstrating that today uh welcome um i'm i'm having a bit of a slow start um as some of you might be aware um i am in a new studio i'm in a garage it's quite a large space i wonder how the echo is right now i've got some i've i've been buying a lot of new stuff i've got a new light which i would love to show you but look the camera that i'm gonna do some behind the scenes stuff at some point i've got a new light i've got another new light that i didn't set up yet i've got some sound blankets to help with the echo i've got sound foam that i need to put maybe on the ceiling that will also help um and uh hello to italy uh says alex uh in the chat uh bon giorno did i get that anywhere close the correct ciao okay maybe that's a little bit ah i think there's a dead cicada on the ground over here i'm kind of in a semi-outdoor space which is sort of fun gloria pickle my lovely pup is over there sitting in the grass i can see her out of the corner of my eye i think this might be a total disaster of a stream but uh it is still sponsored so oh let me go over here and say uh thank you before i forget to the sponsor of today's coding train stream uh brilliant brilliant is like the place on the internet where i love to just soak up and learn lots of new stuff uh in many interactive lessons computer science physics there's this course called beautiful geometry which is amazing it's going to be lots of ideas of things to code in p5 you can sign up for free at brilliant.org codingtrain um and if you want to unlock all of their uh courses and features um if you go through that link you will get 20 off the first 200 people to do so we'll get 20 off from the coding train i've been buying a lot of new equipment it's expensive and so by signing up by going to that link you're kind of helping me out and kind of keeping the train running here uh all right let me go back to this view um so um one thing that's a little bit tricky right now is that i am on a new home internet connection uh back when i was in uh streaming from brooklyn new york i had a fiber connection which was fairly reliable and high speed i have paid for the most expensive internet that i could get but out here um there is no fiber uh there's a lot of there's not that's just like not as much uh internet so it's a little touch and go um but let's see how it goes today if i have to come up with a different solution i shall um you know i had really hoped to be up and running more quickly i don't know if this is really going to come into fruition but i'm putting this into the universe january 2022 this is really where the coding train we're going to add some cars we're gonna add new the schedule is gonna be more frequent um so i'm uh with moving setting up a new studio i am teaching at nyu my my day job three courses this semester i will talk about those because coding train runs parallel with my um university teaching i've got a lot of commitments going on in the next few months my children though they're at school right now at this present time they're at school and they don't come home from school till later in the afternoon so that's certainly opened up quite a bit of time for me but i will be on sabbatical this spring and we'll see maybe i've got some maybe i'll i should be doing something else on sabbatical it's kind of unclear but part of setting up this new studio and and moving to this new place with this garage hoping to really make this my everyday workspace um to do a lot more coding train stuff and maybe other creative coding and other projects i don't know maybe i could start streaming other kinds of tutorials i uh beard trimming tutorials coffee pour over tutorials i'm trying to think i actually don't know about those things it's really nothing that i'm an expert in so sorry uh but that's coming so it's a slow start awkward start but i am here um part of today oh chris sears how is this even possible right's over here in my chat it's not my chat but in the discord member chat i'm teaching seven courses this semester that that blows my mind i don't even understand how that is humanly possible you my friend or a hero um school not cool you don't have a watch yeah i don't i don't really need the watch uh see soarin moderator soarin thank you for being a coding trained moderator in the chat um so let's see let me just try this one more time what's the chance that this has uh um come alive no okay so i don't have a plan for today i was kind of thinking well let me look at what courses i'm teaching make a plan let me look at some of my older plans simon reminded me i'm going to come over to this here for a second and i probably shouldn't do this but i'm going to go here to github.com codingtrain is it raining i hope it doesn't start raining because then poor gloria is going to get quite wet uh coding train uh rainbow topics i think is the name of the repository um where i kind of so this is the thing it's so true oh so true sound is much better than the last time so that's probably just the lav mic uh this space prefers the lav mic over uh have this i have this mic which i really do like i would i would certainly recommend it i don't want to unplug it it shouldn't be plugged in can you see it no where's the camera um it's like a elgato wave not not yet a sponsor but someday maybe um so a simon really rightfully pointed this out to me that i have this habit of at the beginning of every semester making a new markdown file with kind and i duplicate the previous ones and go through a list of stuff that i want to work on and uh apparently i never actually do anything but make the list so let's just look at the summer 2020 i won't make a new list today that's i guess i you know what is it the definition of insanity is doing the same thing yeah you can see like i don't think i've done any of these things that are on the list i didn't move this summer and i've been really working hard to try to keep the nature of code video tutorials coming out so i hope you don't all feel like i'm not doing anything i am doing stuff i'm trying um but um yeah i can see i think like all of these still apply so absolutely no point in remaking this list the cabana is no longer a thing it might return but i i do have dreams of making videos in a sort of different style like those cabana videos um uh yeah so these are i haven't done any of these yeah so great so all this stuff um has not nothing has been oh discord bot stuff that yeah i haven't done any of this so i have an idea this is gonna be fun ready all right everybody you're gonna be amazed watch what i'm about to do for you i'm gonna click this edit button i'm gonna type i don't have access to this project hold on what's going on here ah so i forgot that i made this very silly i attempted to make a youtube short um i don't know if anyone actually watched my youtube short i got some complaints about like why are you making youtube short not not not for you my friend um some people liked it uh but i i made a separate um github account um so maybe what i need to do is go back to um my myself sign in i don't know this might be a total fail whoa okay oh all right i'll take it oh no authentication code and guess where my uh oh i could you know what maybe i could get a code sent to my backup phone number would that help no okay so one issue is everything is a fail today oh my goodness this doesn't work all right this is good i'm gonna get my authentication code and i'll be right back i mean i'm not going to be very far and you're going to hear me the entire time but i'm just going to put on this sound i'll leave this here i'm walking to the side i'm still in a physical space where i'm going over to my phone which is tethered to the computer using something called elgatocam which totally does not work apparently authenticator looking for github okay i gotta memorize this in my head but not tell you the numbers and the dial is going down oh my god it's almost gonna run out of time okay am i gonna get it in time verifying yes i did it now um [Music] coming back here now let me see let me see if i oh yeah that the auto focus causes the desk to dance yeah by the way most of this i just want to say that most of this live stream is me just trying to like figure out this new studio but hopefully as i do this today and get further along more interesting stuff will happen there is a very dead cicada on the ground here i am entirely barefoot i hope you can see that uh i've got some nice rugs here and i'm really afraid of stepping on it i feel like i should do like having like a small little burial for it and say uh cicada say i i mean okay let's see there's got to be something here that's appropriate uh let me see no i want to say something i want to talk about the cicada over here that is lying on the floor cicada i don't know that i ever met you when you were alive but i hear your sounds every night as i walk gloria in the darkness and looking up at the stars and i i hope that you [Music] this is really happening right now okay i'll be right back what was i doing i was gonna see if i get that camera to work ah yes the ipad stand hmm i do have a guy i have four cats two are up for adoption someone in the chat mark booth said get a cat you're gonna be sorry you made that comment in a second all right i'm coming right back all right here i am come on epoch cam there's no reason why it worked all morning and then i wonder if i have to like be in the thing so it's like activated maybe i should be a little more patient here i'm gonna do this like maybe i actually have to leave this here like open for a short bit okay hold on all right everybody i guess it's really not gonna work [Music] up and down and up and down they never load they never load loading the musical broadway's back open when will my time be i will somehow make it on the stage [Music] of coding all right um now i um i want to talk about cats the brooklyn cat cafe is a non-profit cat cafe in new york city cat adoption center and social space all volunteer 501 c 3 organization i am currently my family is currently fostering uh where are they i'm looking for ruby and loki because anyone see ruby ruby ruby and loki here we go i'm gonna you you know especially you know you want to adopt these cute lovely kitties there's loki and there's ruby ruby is amazing oh my god the littlest tiniest creature um and so um they're sweet and relaxed pair of kittens who can't wait to look his most handsome and floofy brown taffy over mead will melt as soon as you pick him up for pets and scratches he purrs like so loud ruby is a sweet curious tiny jewel of a kitty look i love them very much but we already have two cats and four cats is a lot so i'm hoping that somebody will be very excited to adopt them um you can uh i have nothing to do with the adoption process i am my family is just fostering them uh contact the brooklyn cat cafe i don't know maybe you uh um and if you're interested that's not what you're here for so but you know someone did mention uh cats in the chat all right so we've established we've established that i am a very disorganized person who live streams for enormous amounts of time doing absolutely nothing and that some amount of people continue to watch i'm viewership might be going down but you know c'est la vie um bookmark your cats yeah so um i'm trying to set up a new studio my goal a couple things i've i've let's talk about news coding train news breaking news okay so it's not really breaking news because it's all stuff that's repeat but i'm it's telling you this will give you a sense of what's to come and it will help me sort of like think about what it is that's happening that i'm doing so big project probably won't launch until the end of this year early 2022 brand new coding train website um one thing actually i wonder if i can like quickly put up a poll uh and bet what language are you going to get today the language of babel rambling babble that's the language i'm coding in today maybe the poll is kind of unnecessary here uh what i wanted what i wanted to say and we can i'm not actually so first of all you should join the discord um where's that button which pastes a link because i will be having official polls and okay why is itunes is trying to install itself finish okay um great so you should join the discord because that right now i'm going to do an uh sort of like anecdotal poll i'm just going to take your temperature and talk through something that i'm really struggling with um and uh i will soon release this as a google form in the discord itself for everybody to vote on to get your feedback on so one of the things i'm trying to think about with the new website is language and oh you don't see the website this is the old website the current website it's not old it is actively present and new and wonderful but we're making some upgrades you can see here there are various headings like challenges and beginners and learning and more and et cetera et cetera et cetera so for example um what what is the what is the best kind of language to use for organizing all the content on the website is it very sort of literal dry this is what it is beginner how to code in peop you know beginner tutorials uh coding challenges uh machine learning lessons i don't know or would the website be more fun and approachable and would you be able to navigate and understand what's going on you know i want to have a very welcoming and inclusive and kind of playful quality to it if there were more train themed things like these are the tracks and these are the train cars and over here in the cafe car you can join the discord to chat so this is one of the things i'm struggling with i'm so i'm going to be putting out a survey for all sorts of kinds of naming ideas [Music] if you are a writer also you know you know i think i don't really have anyone at present i mean maybe that's not true but i'm also maybe looking for someone to help collaborate on this to sort of think about a style guide for all the language and the descriptions and that kind of thing so um i mean that maybe that's on me to really work on more but that's so that's news item number one new website it's active an active project i will be maybe sharing uh rough versions of it doing we you know already put out i had volunteers to do some preliminary user testing of some of the designs so your path to getting those sneak peeks and previews is the discord of course if you join as a member you also you might get some other sneak peeks and previews that i will be sharing as well so uh karaoke is in the uh chat hello nice to see you um oh yes and the discord link actually can be updated to discord dot gg coding train because we now have a vanity url because as we all know i am a very vain person i mean it's true i mean i could be making all these video tutorials without me in them and yet i choose to put me in them every single day of the week so what are you going to do it's who i am it's what i am um i heard a noise it's it's it's my dog it's okay i heard an animal and i got a little bit afraid i think there are some bears around here not probably wandering into the garage in the middle of the day but um yeah thank you soren for posting that now um um all right so that was that's my website item number one i had some other things in my head when i started this news oh yeah so i'm also trying to figure out the right balance between live streaming and um what you're watching right now and uh more polished sort of recorded video tutorials and um that follows certain sequences as well as new coding challenges because you know as many of you probably my like ability to produce content has severely slowed down i think in some some aspects the quality has greatly improved i'm always and i've been getting very positive feedback about extra diagram and animation elements and you know quicker editing that lets you watch the videos more quickly frankly and have different visuals that help you step through and understand the concepts um but i don't know to what extent um but i'm trying to figure out it it's a tricky balance now how uh you know i could have instead of live streaming today i could have just started recording some more coding challenges but i used to do the coding challenges in live streams and people really like that i don't know i don't know how to do any of this i'm lost and so uh i think if i make it to january that sounds very um ominous but as i plan to make it to january i will have multiple days in the week so maybe i can start to do all of these things um but um i think this would be a good time um since i have no plan um and i just thought of it too [Music] wrong track to talk about and show some uh community contributions so one of my favorite things and one of the things that i'm really hoping will make its way into the new website it's very loud for me um is hopefully it's not too loud for you um our ways of featuring what viewers of the coding train are making so that you can share with each other so you can share with me and that everybody can be inspired and and and welcomed into participating so let's take a look i honestly have not looked at this at all let's go to um this page and i want to look at some bezier curve community contributions i think some new ones have come in i certainly look i feel like i looked at some of these maybe i haven't looked it does anyone remember if i looked at any of these in a previous live stream uh speaking of which though what is a bezier curve so my new trick that i am about to try and see how this goes i do have i really prefer to use a physical whiteboard i like the ability to gesture to draw to move around to erase but it's um i don't have a second camera where i am right now i tried setting up my phones and connecting it and so it's not really working i need some more lights to try to light the whiteboard area but also there might be some value in me doing diagrams that can be captured and replayed and stored so what i have for you today uh is um i mean it's it's an ipad i have one of these uh oh it's like invisible pencils um and i think and i this is procreate which someone recommended to me i've no idea how to use it i don't know if anybody knows or you have your favorite drawing app but what i want to do is kind of look at and diagram what is a bezier curve this is like a very weird um this is a very weird um like pen thing that i'm on sketching inking drawing airbrushing textures abstract charcoals elements spray paints touch-ups luminance what do i want i just want drawing um but i just kind of want like a whiteboard marker is that like this ooh no no no oh that's nice though okay and now hold on how do i can i go to here and just make like a new thing do this all right and then procreate is the best okay so that's good uh i use this app procreate okay great so maybe um can somebody tell me what for just like a very basic pen i should use not a painting painting brush could work no like drawing is what i'm doing but what is just or am i inking maybe i'm inking oh yeah there we go gel pen studio pen marker marker is what but i guess i want something maybe a little smaller so let's try this gel pen oh yeah this is right i just wrote my name that was very exciting two fingers touch is for undo look at that that is cool uh and then this is like probably thickness it doesn't get very uh and so i kind of want it maybe something a little bit thicker gel pen studio pen marker let's try marker again and then i assume i can pick a color somewhere is that like this no whoa what does this do i have no idea okay bezier curve so let me just practice what this would be like if i'm doing um a little uh lesson okay uh bezier whoops i think i made it some weird color where's the color is it this oh yeah there we go uh like what if i just want that there we go okay uh bezier so i also need a much more stable stand i need a much more stable stand because um is moving around a lot as i draw so what i don't like about this is i'm looking down over here which probably doesn't bother you but as i'm drawing then i have to turn i'd much rather be doing this right but um anyway uh so a bezier curve is a particular kind of curve that involves interpolation and as i discussed in my video about bezier curves uh you know technically a um we have a quadratic a cubic and uh what was the what's the first one called i'm completely blanking on this um uh but you know this this is the bezier curve if it just has two two anchor points um it's just a line between those two points but a quadratic bezier curve involves a control point and that control point as you move it causes the curve to bend linear that's what i'm of course i was like it couldn't possibly be linear right that's so obvious um so now oh it's a lot of undo there if i were to add a second control point then that causes the curve to bend down here and up here et cetera so but so by the way this is me just practicing trying to explain stuff with diagrams so and this is uh cubic smiley face oh i could draw this could be like a cat with like some whiskers how's this going everybody so uh my uh video uh it where i uh use an actual whiteboard and show some code examples and talk through everything there is to be on betsy carson this is one of the more popular videos that i've recently released um at least initially videos have these very strange lives to them so um they get a sort of burst of viewership when i first released them and sometimes that burst of viewership kind of takes off in a pretty strong way bezier curve video being quite a good example of that but still um usually if even if it's doing really well in its sort of initial burst somewhere between like 50 and 100 000 views which is tremendous i'm very thrilled with that um other videos like the wander video i recently released which is i'll get to next which is like in the middle of a sequence of many videos they don't tend to take off with that kind of burst whatever youtube magic is happening um it's just not picked up as much but then strangely videos that i have will just a year later or two years later sometimes like take on this life of their own and so the example of what's happening right now is a star let me search for like this a star coding train video um this one is just like consistent this is from 2017 is consistently the most pop viewed video right now every week every day on my channel it might have come down i haven't actually looked in like maybe like three or four days but um this is also pretty interesting that the search for this video is actually this i don't think these are tied to well maybe i don't i don't believe these older videos are time coded um code the title coding challenge has something to do with that that's interesting yeah and i i often think that what i probably should do is have and i don't want to do this but like if i were trying to optimize towards the strongest viewership i would actually just have a channel that's only the coding challenges so that people could subscribe only to that and that youtube's understanding of my content would be like oh people like every video because what happens is i release a coding challenge it's like recommended more and more and then i do one that's like i think really important and part of a sequence but it doesn't get as much viewership so then the next coding challenge is like well people aren't as interested anymore so maybe it'll be a little bit less it's like this never-ending cycle um i i'm trying not to be obsessed with this stuff you know it's it's really not the primary my primary sort of incentive or motivation but it's so hard not to get caught up in it and i understand that for other people um you know who are doing this youtube stuff much more full-time it can be much more of a primary driver an incentive okay snake game yes coding challenge number three the snake game most viewed video of mine at least of all time um all right so uh bezier curve i wanted to look at community contributions so let's see i honestly don't remember if i looked at any of these but um so i want to just look at all of these that are here and encourage you to submit your own um let's look at synth wave animation by chris sears who i know is at least was previously in the chat so let's take a look at this and see what happens loading loading loading loading whoa whoa i have i think i saw this but i definitely didn't look at this on stream because wow this is wild so um now i'm trying to even like understand how this is based off of my sketch i mean i guess i see it here this is my visualization of the quadratic bezier and with the sort of random motion but it's now mapped into a 3d space i feel like i'm like looking at a scene from tron or something this is amazing uh really cool stuff oh and there's music i don't hear it so um you know i'm i would love to it's probably like the way i have all my audio routing going on it's probably why the music is not being heard so apologies for that but it's probably better for me not to play the music on stream anyway uh but this is quite amazing this to me is the in uh it's just like the epitome of why i love doing this because i don't think when i was making my bezier curve example i ever would have thought of this visual application but i think there's so much um you know a bezier wander this on its own is wonderful but now this is leading me to think of so many different ideas yeah it's a great like uh yeah why t brent can ask is that the information super highway no but i could imagine this being like a nice visual for um you know some opening credits of of um some type of game or or other type of content yeah okay um thank you um turn click the canvas during the tangent lines ah oh fascinating so i i can't resist how much i love looking at this with the tangent lines and the colors but this also has a really nice uh quality to it now the move one thing that could be really interesting to experiment with it just occurred to me um it looks like this is probably based off of the random motion that's in my example where i'm just showing like okay see you can move the control points around the curve changes i don't know this to be true we could look at the code obviously but um i wonder if there were some type of um [Music] you know set of rules for the motion so that you know what if it were sine waves or purl and noise those are the obvious ones to start with but so that there's a connection as i'm moving through this space i'm seeing these rippling motions as each curve passes over me sort of passing its motion on to the next um so great great job um uh a bell and a train whistle for um this wonderful community contribution uh closing this one out and going on to bezier curve road editor i remember david telling me about this one so let's take a look [Music] what do i do here shift click to add points to the path so this is using the fact that you can uh chain the bezier curves together so if i go back to um i want a really quick way just to make a new page i guess right now the only way i know how to do this like there must be like in this can i have like multiple pages i can do cut and paste ah like can i make a like how do i make a new okay i'm gonna have to learn how to use this app later right now i'm just gonna do this um so one of the things that's really awesome about bezier curves i mentioned right we have two anchor points and two control points but um a bezier vertex just involves these three points here right that makes the entire bezier vertex like this is the next point we're going to but these control points and i'm sorry i really miss drew this because the curve doesn't pass through the control points that's a kind of common misconception or at least it's a misconception that i make so um oh wait what did i just do did i just change the color to white again what just happened right i don't know what's going on i obviously do not know how to use this piece of software i can have layers in procreate okay so um what's the bezier cat i don't was that the thing that i drew i have no idea what's going on anyway so these are doing a terrible job here these are the elements of the next vertex which means if i wanted to add another vertex i only need three more elements which would cause it to curve like this and then i could put three more elements and when i say element i mean three more points so the vertex the bezier vertex is a collection of three vertices the and i guess this little um it's it's where i am going to like if it were just oh wait what just happened um that was just an extra right it's where i'm going to like if i didn't have a bezier vertex i would just be going to the next vertex but because i do i'm kind of like curving around i have no idea what this would actually do with those two control points so super exciting so this looks like uh what david has done here and i believe the idea if i'm correct is ah yes look at this using bezier curves to create a drop like a road essentially and this would be a perfect complement to what i eventually someday will hopefully actually make i built a version of this during a live stream a while ago with an idea to make it as a multi-part set of video tutorials but i want to use ml5 the javascript machine learning library that i uh helped to maintain to train and ai in big quotes to drive along this path so dreams uh that's like a great project for the spring if i can get back to that wonderful work thank you for this david all right moving along uh everyone gets a bell and a train whistle now we're going to look at bezier curve lerp animations 2 to 10 points by narayana okay gotta love this so one of the aspects of something that i emphasized in my video tutorial is how the bezier curve is the math behind the bezier curve is all about linear interpolation so linear interpolation between just two points is that line um and um but once i add that control point i'm then interpolating the interpolation between the anchor to control and the control to anchor so you can sort of see this playing out here in this animation so for example i think it'll be more obvious if i go to two points right there's i love how this demonstrates the idea so well this is linear interpolation from one point to another let's add one control point so now this is linear interpolation see how that's what that one point is interpolating between these two and the other one is interpolating between the other two and then between those two we've got this nice curve and is this the thing that i can move these points around no but it doesn't matter this is so wonderful i'm so excited about this now if i go to four this is what we're typically seeing as the cubic bezier but okay this is very exciting this really this merits a nice drum roll here let's go to five oh my god oh my goodness oh i'm getting getting a little warm over here oh that's wild oh that is so amazing um i i uh six this is so cool all right i i think i might be getting a delivery do you hear that beeping of the truck backing up uh okay and and and simon in the chat is telling like quartic um there's quintic there's all these different terms let's go let's just jump all the way to 10 because i don't know how else to experience this amazing uh that is wild let's let's do 10 with random points um yeah i see a a delivery truck hopefully they're just gonna drop it off and don't need me um wow this is wild so i'm distracted by the delivery truck but not to mention this incredible uh variation off of the bezier video okay thank you for this it's incredible a huge round of applause can we do that also all right now moving along um i'm almost to 11 30 which is my halfway point so recently the rhythm of these live streams have been um me babbling for a bit showing some community contributions taking a break and coming back and coding something i have a couple ideas maybe i'll when i after i take a break i'll put a poll up um and yes i know there's a whole live poll system that was engineered by many wonderful generous contributors of coding training i can never seem to figure out how to use um which is totally my fault um and but now there's just this pull button in the youtube chat i can walk over here and set a poll all right i am going to go to curve art by larry campfire let's take a look at this one whoa okay i did not know that this was going to be me so wait i don't understand this is wild okay wait i have to understand how this is done so first of all what picture is that gloria [Music] i wish i need a dog cam so what picture is this i have no idea i mean obviously it's a picture of me but i don't remember it's like this is a picture that's released on the internet somewhere probably um so this looks like it is a uh what's happening here if i can understand this correctly and um i'm going to attempt to diagram my understanding of this so there is an image and it has an image as a grid of pixels so each pixel has some brightness value so imagine the image is gray scale and the brightness values are like five okay this is too thick i guess 110 i can do this right make it thinner you know 255 100 0 10 right you could imagine this grid of pixels um each with a grayscale value so i think maybe what's going on is then this is visualized right so normally you would take the grace if we're visualizing the data of an image i would take the grayscale value and i would render it as a block of pixels with that value at that spot that's what an image is it's really just a visualization of the data the color being tied to well typically like an rgb value perhaps with an alpha but in here just the grayscale example a single number a gray value but many other things can be mapped to color to represent the image and you know i think a very a well-known um example of this is even in the sort of like physical world is danny rosen's work you can see here these like amazing physical uh sculptures that take uh you know like little blocks of wood and rotate them to reflect light in different ways to create that pixel view um you know i'm trying to i love this one the like um it's these uh little penguins fuzzy penguins that like spin around so if they're facing you from their back they're dark uh facing you uh from the front they're bright so i really encourage you to check out danny rosen's work um if you're not familiar um look at all these videos that have obviously and links that have a tremendous amount more information so what's happening here i think is something similar of course it's still software and screen based so you can imagine doing this with like string or something but i think what's happening here is like if it is um a bright pixel maybe just a line is drawn and then if it's a darker pixel that line is if i zoom in it's bent so it like um would this is hard i don't really have my it would kind of like do this does it and that makes it like thicker or something so i i'd have to like try to figure this out but there's some kind of mapping of the grayscale pixel value to the uh curvature of the bezier curve itself i was thinking is the line getting thicker no it's just more pixels are being filled in because the curve has more uh the length of the curve there's more uh it's longer there's more space for it to fill and that by definition creates this sort of darker look to it so that's really wild i don't know that just would not have occurred to me to do that so what would be cool let's just see i'm just really curious um i want to take a version of this let me log in as coding train if you will indulge me for a second i don't know if this font is too small but and again i just want to emphasize this is um i am taking a larry campfire's example and i just want to see what it looks like with video so i'm going to say i'm going to add video let's comment out the image comment out preload and i'm going to say i know maybe it will take too long to run but let's let's we'll find out oh these are quadratic beziers so i was trying to in my attempt to think about it as a cubic bezier let's say uh create video actually let's just leave this as is with both the image just um create video uh create capture video so let's make sure this works so now i should have both this image and you can see there we are by the way so this is what it really looks like in here it's just a green curtain with a lot of lights and a much nicer camera than the webcam but that's what i look like standing here i one thing that i'm very unsure about so i need a haircut i don't always i don't need to wear a hat in every video but it's you can see this is a mess right now i'm a mess but uh lighting wise i'm just like i don't know if i have the right temperature lighting temperature settings on the camera anybody wants to help me with that i'm game but um okay so i should be able to figure out a way so this is using scale times image so let's do this i'm going to say uh video equals create capture and i want to take off the auto refresh and stop it so i'm going to make the video size i wanted to make it something that i know uh oh so it's actually multiplying up so let's make it like 40 let's take it 40 by 30. and let's just do the scale scale is eight i think that'll work is that going to be too slow i'm going to take out the no loop and so image should then where is it getting the pixel color it should be video ah so one thing will be this is an issue so it worked just fine because it was only doing it once but um using the get function to get the pixel color can be incredibly slow if you're doing it over every single pixel as opposed to just working with the pixel array directly but let's see what happens what's the worst thing that's going to happen let me try running this let me just comment out image so it'll throw an error if that's being used somewhere else and see what happens oh okay image is not defined right so i think what i'm going to do is just hard code in for right now what i know the size to be obviously i could pick it up from the video and then i got an error probably because the video isn't ready image is not defined no there's still another place where i'm using image ah okay this might throw an error because the video might not be ready oh nope totally working you can see it's totally working just running incredibly slow so is the slowness um just the bezier drawing the bezier curves themselves or i have to stop or can i get around that slowness by getting rid of that get function so the way to get rid of that get function i think gloria might have gotten tangled hold on everybody pause to help my poor no no she's not tangled she's not tangled okay she's on like a leash oops i'm okay um so what i can do instead is i should be able to say uh r equals video dot pixels the index plus zero so this is something i've covered uh like probably you know a thousand times um but i since i have this whiteboard thing here i'll do it again so let's just say these are my pixels they have row column numbers 0 1 2 row numbers 0 1 2 but the actual pixel number is 0 1 2 3 4 5 6 7 8. so if i need to get the index 4 for example i can actually just say what is its x value which is 1 plus what is its row or y value which is also 1 times the width which is 3. so in this case you can see that makes sense because 1 plus 3 is 4. 1 plus 3 is 4 4 plus 3 is 7. so i'm going to add that formula into this code here saying index equals x plus y times times video dot with now here's the catch so while this is true this diagram that i've done is absolutely true there's actually four values in the array in each one of these spots and i did that wrong because there's r wait what why is it sometimes just change to white what am i doing am i like triggering an eraser i am i switch the eraser i see um there's an r a g a b and an alpha so red green blue and alpha so what i actually have to do is take that index which is which pixel am i on and multiply it by four because i've got to advance for every four spots can you hear gloria barking by the way does that come in through the mic um i wonder if i can just i have not tried a stream ming i've worked in here but usually she'll she'll come or i'll go and check on her but um so this should give me the red green and blue values instead of using get by going directly into the array and then i could should just be able to replace them here with r this is a very fancy way i'm always so lazy and i just get the grayscale value by adding them up and dividing it by three the average of the rg and b but this looks like i guess this is probably using like luminosity or something it's using a larger percentage of the red value um wait what times r times yeah um 21 no no of the green value 21 of the red value 72 percent of the green value and seven percent of the b let's see if this uh improves anything i messed something up what did i do wrong i mean i thought i didn't have to do this do i need to call load pixels i think i do i think i have to call load pixels i know why i thought i didn't need to do that oh yeah look at that so see how much that improved the speed so now we're able to do this in real time oh i love this lovely look at this it's so cool now i think what i could do is make the scale let's see how could i do 80 by 60 or is that going to be much too slow let's give it a try um let's just do this to be a little bit more thoughtful about it um oh yeah okay let's just see if this works this might be too slow from a drawing standpoint yeah you can see now this is too slow from a drawing standpoint but it's actually kind of nicer with it and i think what i might like to do is even lower it and then just make the scale like 32 let's try that's probably too extreme let's try 16. let's try 24. and i guess i guess 40 by 30 was a little bit nicer um where is there a stroke weight somewhere begin shape no fill stroke weight i'm just curious to like bump up the stroke weight a little bit and let's hit stop and let's try looking at this in full screen mode i know i'm taking quite a bit of time here huh what happened there cool kind of slow but still pretty wild all right thank you simon i'm like looking for my watch all right uh it is now uh officially the midpoint of today's a stream i do have a pretty much i really do need to stop by like 12 30. um i i hope that this is um that you are enjoying today so far let's uh thank you uh so much to ah um to uh larry campfire for that let's go to ah quartic bezier curve exciting by codefish and i apologize that i'm gonna end up you know kind of looking at some of these more quickly but this is core tick right because it has three control points great work working that out wonderful job code fish uh you responded perfectly to the prompt in my video and i am so happy uh let us go now to animated and control point bezier curve by alex hunter and what do i do here i click oh wild so i can just keep adding points and then i can speed it up whoa oh that is wild oh amazing so this is very much like what we saw before but now i have the ability to i um reset um to just actually just make my own points like if i go in a circle what happens and then uh also play around with the speed so have it run very very slowly or very very quickly amazing job this is all great a lot of breath from that uh now we are going to moving on an infinite loop made with bezier curves i might regret this but i'm kind of excited just by the title of that here we go oh there's a fly hmm error not sure what happened you know this full screen thing sometimes does mess things up i've noticed recently ah there we go awesome oh so it's like the infinity symbol somehow made with bezier curves and i love this little dot look how it's like i'm going to do sound effects for this [Music] somehow that speed which is going is this an illusion it's actually always moving at the same speed or no i believe it's slowing down it's probably following the actual interpolation wow so let's take a look here oh i see i see oh it's using the vehicle oh amazing somehow this is using something from nature of code oh no the vehicle yeah it's got like a vehicle in it somehow which is a great segue because the i don't know that anyone has made a community contribution for this yet because the video was just released yesterday but if you haven't watched my most recent video release on the coding train it is [Music] part of the nature of code series um all the way down here we have i'm you know i'm on this quest as i mentioned in the video to implement every single um craig reynolds steering behaviors i'm curious what people if people like these kind of goofy thumbnails that sort of like show little uh uh this triangle character kind of acting out but this particular wander behavior um we can see here yes look at this it seems like there haven't been made any variations based on this lesson see that's a very awkward sentence i probably wrote that sentence at one point but this is what i need i need to re really work on rewriting the language for the website and is the community contribution a community contribution or is it like a passenger's [Music] ticket no that doesn't make sense i don't know that's what i'm trying to figure out but yes there are no community contributions yet yet uh yet but you could be the first one you could submit it today i will be looking at them this afternoon on my own and i could come back and show them in a future live stream if you want help figuring out how to do that i would definitely join the discord which i just posted a link in the chat but let's take a look just at the various examples one of the things that i wanted to show you that i made for this video which wasn't part of the actual um coding itself and why is this so did i zoom in on this or something yes there we go um let me see can i drag this over i try to try to do this in 3d so one thing i was really pleased about is and so what is what is going on here um basically um the wander algorithm involves a vehicle and it needs to decide which way should it steer and the way that it decides is it projects a point out in front of it uh creates a circle at that point's location then projects a point out onto uh the edge of that circle and then steers in that direction then this point moves randomly over time and so what the result there is instead of just like making a lot of random motions sure that point might be moving randomly over time but it's not going to cause the vehicle itself to make a drastic change in direction until maybe it gets all the way back down like over here over here so it's a very effective way uh no no this is not where i'm swiping ah this is where i'm swiping so this is like i was trying to do this in 3d uh i think i might need everybody just prepare yourself i'm going to say something it's going to be a little bit scary i'm going to try to stay standing here not go anywhere i might need quaternions um to really figure out how to get my vehicle pointing in the right direction but um anyway i was curious if somebody has a better take on how to do this in 3d and visualize it i would love a contribution in that uh um vane i'm trying to think if there's anything else here i think this is kind of maybe a useful one to just for me to show you um you know think about how so this is the actual algorithm uh wander algorithm playing out and one of the things that i did with this is that i just attached some sliders so we could sort of see like how does it look if that circle cup becomes closer um or if that circle is much bigger um as well as i don't know what this one is oh the dismount of displacement is like bigger so this is a much more like actively changing direction wander versus if i were to put all these sliders down i would assume that with everything low um it's going to kind of move in the same and it's when i say move in the same direction it's not actually resolving to moving straight it's continuing to turn the same way for a while and then turn another way so there's a lot of possibilities for this i hope that you get a chance to explore this particular video tutorial and submit your community contributions so they could show up here i would love that so much how's everybody doing how is this stream so far um on a scale uh how is this is this stream on a scale of one to five oh i can only get four i guess so four is um four would be you really this is the best stream i've ever seen and one would be like you know [Music] i've liked previous streams that i've watched quite a bit more i don't know why i'm asking this it's a very dangerous thing that i've done like self-indulgent thing that i've done so but i would like a lot of feedback because i'm trying to figure out like what am i really doing here again my i think the way that i think of the universe of coding train content individual project videos coding challenges tracks i'm calling them tracks which are more like courses beginner beginner lessons um and you can see those if you're if you are a beginner um these are the ones where that you can start with on the website as well as some other tracks that are more themed around machine learning or physics simulation i am working hard to try to um record these and release them with good production value and then also live streaming once a week which is me just interacting with the community answering questions showing community contributions and what i'm doing today and then always programming something kind of new which is what i'm going to do in the second half even though i have no idea what i'm going to do yet so that's kind of i i would love to hear about like i'm trying to really be more sort of thoughtful and organized about how all the stuff is going i did not eat a very big breakfast this morning i'm starting to feel feel the um it's starting to punish me here a little bit as i cannot form words all right so um before i take a break it is time for me to mention to you um sponsor brilliant so um if you like learning and if you like learning from really well done exciting and interesting resources that you can find on the internet um like the coding train hopefully you are really going to like brilliant and i think brilliant the reason why i'm so pleased to have brilliant as a sponsor is it is a really wonderful compliment to what i do so here's what i'm doing talking at you attempting to draw diagrams blah blah blah blah blah trying to write some code here and there but if you would prefer to be a little bit more self-paced to have some quiet time on your own whether on your computer or through an app brilliant has both of those for lots of interactive lessons so a couple of the courses do they have daily challenges i should go to the brilliant website which i will do um they have daily challenges and they have a whole set of courses like if i just click on this page it's like everything that i love is all here geometry neural networks statistics logic computer science fundamentals and one of the things that i really love about it i'm going to go here to the um like the al the out one of the algorithm algorithm fundamentals course i believe this is um is that the lessons not only are oh let me read through this material and see what's there are actually allowing you to interact and so if you want to learn more about coding you can see like figuring out pseudo code and logic checking your answers stepping through these interactive lessons that's really a wonderful thing to do ah yes this is um this is the course that i'm really excited about here um and what you um like that so many of the courses involve these really fun visual dynamic puzzles um really to teach a particular concept like if you if you maybe you know the formula for the pythagorean theorem a squared plus b squared equals c squared but you don't really know it until you've gone through all these different lessons where you get to move shapes around i actually found it quite difficult um but it really helped me sort of think about fractals and infinity in a wonderful way let's go to the next problem um so which is still so this uh this this particular element of the course is talking about uh infinite areas and how to do sort of infinite tiling and then how do you consider the total area of what you've tiled um so i'm gonna just step through this so what oh i did this one already too i'm i'm further ahead i did this one oh yeah i remember doing these uh here we go oh no what fraction of the largest circle is shaded orange okay let me put up another poll um nobody's hating this stream so far ah a couple of you um i'm gonna put up another poll so um these are going to be how do i add a new poll uh can i kind of end this poll end poll okay now it should let me do a new poll come on youtube refresh the page okay uh i'm gonna do a poll yeah there we go so infinite areas it'll let everybody sort of think about this problem and i'm going to call them from top to bottom actually you know what i just put the answer in one half two thirds three quarters this is a fun thing to do and four fifths so i'm going to ask everybody in the chat and i'm going to start to think about it now as i uh go through this now i don't know where i see the result there we go now i see the results of the poll okay so all the circles in the pattern have the same center each radius is half the length of the previous circle i wonder if having a little thing that i can diagram will help um i really need to eat to be able to think this through right now three quarters is winning out it looks like so a lot of people voted for four-fifths though let's see who's right all the all circles in the pattern have the same center each radius is half the length so what basically if i come over here um what fraction of the largest circle is shaded orange so in other words uh oops right if this is a circle of radius r the area is pi r squared so then if i were to take that radius and divide it by 2 half the area of this interior one is now pi r divided by two squared which is pi r squared divided by four so this area is three fourths right that area is three-fourths of the whole thing so it can't be three-fourths because we're going to get more stuff as we continue to go like we're adding up all the orange which fraction of the largest circle so it's got to be four-fifths i think it has to be four-fifths which interestingly enough now is gaining its momentum in the poll but like i uh you know if i look back at all the explanations there's a very precise way to provably know that it's four fifths but i'm just going to use my intuition to say four fifths and i got it right yes um wow this is like one of the most fun times we've ever had doing one of these um so and um we can see now that four fifths has in the poll taken over and is uh is now winning uh way up now um so that there's a nice little trick there like it does makes you do sort of see how you can get tricked in thinking that it would be three-fourths based on how i worked out that math but four-fifths is the answer and one of the things that i really like about brilliant as well is that if you go to um the explanations you will often you will see typically like a really excellent uh summary of how it is um that the you that have come to the correct answer so um i want to encourage everybody there's um to sign up for free you can sign up for free right now when i take a break it would uh um you know it helps out the coding train brilliant.org coding train um again if you want to unlock all of their premium content and courses um then you uh you would receive a uh the first 200 people do so will receive a 20 discount off of that i will also note up here you can't see it i'm gonna remove the banner the last thing i would like to say to you is that it's a really wonderful gift so maybe you know somebody who loves math and puzzles and science and learning and you know you're not as interested in doing it yourself or you already have it um gifting premium is a wonderful thing you can do and it'll work to do that as well through whatever this url is brilliant.org coding train okay um oh did the stream crash i wonder how much was hopefully not too much was lost that's a you know perfect timing i mean uh that's me being sarcastic there if you weren't sure um so i'm gonna take a break um perfect thing to do is sign up during the break and i will be back in um hopefully less than five minutes because i don't have a tremendous amount of time left and what do you think i should code whatever if you have some ideas of something i should look at i mean i was kind of there's two ideas that i'm working with um there was a recent um was it oh there's there's a bunch of suggestions that came in through the discord i'm already forgetting what they are there was the um um number file video maybe and then there was something else and then i really do want to continue the steering behaviors because i need to figure them all out and then make videos about them so that actually is kind of probably what i should do um although ultimately this fall um i'm going to be focusing on machine learning and text programming because those are the topics of my courses okay taking my break sign up for brilliant and see you in just a few minutes [Music] so [Music] so do [Music] [Music] [Music] [Music] [Music] [Music] do [Music] do [Music] hi everybody the stream seems to be crashing so [Music] i think i'm back um so apologies for that hopefully it will continue to work um just another 30 seconds here [Music] do [Music] back definitely having some technical issues with the internet today um all right the radish pie um so the so the um there's been some good suggestions of things that answer today's coding train um it will be so idea number one is um i do want to look at i want to do all of these steering behaviors so if you love steering behaviors so containment is the next one on my on my list to figure out so what i would be doing during the live stream is kind of working through it to see if i can get the basic algorithm going and then i would later record a separate video all about it so that's option number one uh a really wonderful um suggestion that came in from david although i'm a oof reconnection successful i don't know you know i could just reboot the router which might be a thing that i need to do but given that i have so little time left so this would be a great one to do [Music] um but i um i look uh you know you could also support numberphile uh with brilliant but um and by the way if you're not already uh following um on twitter matt henderson you definitely should be because these visualizations are all just what i mean like in another life i would love to be able to make stuff as brilliant as this um whoa what is going on here anyway so um so doing my own version of this particular um um this particular visualization there's a really great one with chaotic bouncing balls as well that's an option of course i'm taking so much time talking about the options that i won't necessarily have time for any of them and then the the other one is uh the website 538 a radish i don't know if i can find this very easily can you bake the radish pie up the boiler went on i'm surprised it didn't happen sooner than later makes a loud noise i don't know how how bothersome that is for you um would be to the next got louder um would be to look through this riddler problem can you bake the radish pie related to math logic and probability i assume i don't know if there's a good visual p5 element to this um so maybe this doesn't really fit so i'm kind of leaning towards just going the safe option which would be to work on containment and yqn is saying number file is my fav channel for coding inspiration which is absolutely true but why not uh 30 minute start of so steering containment the other option i said was venus rose if that's the right name for it and then the third option is this riddler and then do not follow what people actually voted on also it doesn't feel seem like the internet is working so this is all kind of a bit of a a bit of a mess i i'm like i've got a little bit of a headache i'm feeling a little late because i really did not eat anything this morning my wife likes to text me when i'm like busy teaching like remember to eat today because i really do just completely forget to go eat lunch and busy and then at some point later in the afternoon i'm like dying and this is sort of what's happening me now but i'm going to eat i have time to eat lunch at 12 30 before the rest of my afternoon meetings um but let's come back here and see uh steering looks like it is winning this right now which i'm pleased to see i might have put my thumb on the scale a little bit too much i'll give it another minute or two here um i'm looking at the various chats i mean containment would be the thing that would be best for me to like make forward progress on my life's work of redoing of implementing these steering behaviors so but i can see it's and it is um you know it's a little bit unfair because if you add up venus road and rose and riddler there's more votes than just containment although containment just got a huge burst all of a sudden so i'm gonna take this as uh gospel and let's go and start to actually work on the containment steering behavior so uh simon who is um oh and i need to go back to the oh i'm not in the live chat uh channel anymore um now i'm back look at the classic not the express that must have been related to the um radish pie i don't know but i think i'm going with containment based on the votes of the poll um and for have starting point for me i would love to hear it um how do you all feel i think what i'm gonna look i've got 25 minutes it's probably gonna take two or three minutes to reboot the router but the stream keeps crashing and the only thing i can think to do other than restart the computer would be to reboot the router restarting the computer feels much more um of an extreme thing because i've got everything set up the way that i've got things going i'm by the way i've purchased a new streaming computer because i do currently this one does not have the camera just went off are you serious yeah okay i'm gonna reboot the router camera's off i'll work on that so the stream is 100 going to go down but it will come back up say something hello i'm waiting to see a message from somebody confirming that you can hear and see me oh wow there's no everybody left wow rebooting the router is definitely did that end the stream hopefully not let me see if i can pull it up see me oh wow there's no everybody left oh no i'm back rebooting a router is def okay [Music] oh maybe people are coming back now people are coming back watch that number go up okay uh there we go all right maybe people are coming back maybe they actually didn't leave but everything got disconnected um all right so here i am back oh eric is in the chat i think i just saw eric why is this not showing up and i totally forgot um hi eric uh thank you for joining today um actually let me just if you'll indulge me for a second i want to just make a really quick plug of eric's gofundme if somebody could paste it into the chat one of the mods could paste the link i think you'll find it was recently on my twitter so eric is a dedicated viewer of the coding train i mean i don't wanna you're not so dedicated you don't have to be dedicated but i feel like you're dedicated you have corresponded with for uh many years i had a bicycle accident i think i met eric first when i had a bicycle accident and i broke my elbow and my wrist and i couldn't use either of my arms to type and i experimented with trying to use voice control i didn't get so far it was just a big learning curve and by the time i had learned how to do some things i was gaining use back and also just took a break so but um eric is disabled and works with his computer entirely through voice control that's really amazing and needs a new computer so i hope the coding train community could support um eric in helping him get um a new computer so i don't know if that got posted yet into the chat i haven't seen it i will pull it up myself i'm just going to go to twitter.com shiffman which is where you can find the link and there you go so uh find this gofundme link and if you're able to support please do okay now containment we're not going to get super far with this but i'm excited to at least get it started um it will lead me to the next videos that are coming out that have already been recorded are path following so if you're following along with my steering behavior obsession i have let's just look at these examples implemented of seek and flee pursuant of aid which i messed up so i think i need to record i'm going to make a little note here pursue and evade correction so that's a video i need to make if you're wondering i'm i'm look writing this stuff down here uh wander is done arrival is done obstacle avoidance is one um obstacles containment uh wall following [Music] so path following is done flow field following i have an example of but i don't know that i've ever explicitly made a video just about it other than some really old ones um so then a crowd path following leader following unlike so i'm not going to worry about these group ones but because i want to get through all of the simple behaviors first so it looks like i need to the videos that i need to make are on pursue and evade the correction obstacle avoidance containment and wall following and i believe that i have heard from my and by the way it hasn't crashed again right from my uh another dedicated viewer of the coding train simon that um that containment would be a good one for me to start with so let's go to it uh i um i didn't do any random numbers today and how come i lost the page the containment on it oh here it is so this is a little confusing to me because it is lumping it together in the paper with wall following but um i'm just creating a new page um but um i think i'm gonna be able to parse this okay variations on path following okay it's a variation on path falling that's good um obstacle avoidance is uh definitely the hardest of the three says simon wall following means to approach a wall or other surface or path what if by the way what if instead of making this full screen i kind of put this up in the corner here so if i start trying to diagram stuff while i'm reading this you'll be able to see both okay let's try this see how this goes wall following means to approach a wall or other surface or path than to maintain a certain offset from it okay containment refers to the motion which is restricted to remain within a certain region okay so just thinking about this let's start with like the simplest possible case i have a 2d canvas i have a vehicle and its job is to never is to stay within the canvas so that's containment okay and i've made my own version of this in a weird sort of way i think in the nature of code book i talk about having a steering behavior or a force that just emanates from the edges but that's probably my implementation is probably overly simplistic or different than here fish swimming in aquarium hockey players skating within an ice rink to implement first predict a character's future location great so that's something i can always do right look at the current velocity and predict its future location okay this is actually working quite well having the diagram like this i kind of like this if it is inside the allowed region no corrective steering is necessary otherwise we steer toward the allowed region this can be accomplished by using seek with an inside point oh wow this is starting to sound easier than i thought it might be so um so let's let's i don't even need to read any further obviously there's more to do but let's create a basic example so i think what i want to do and unfortunately the problem with my little method here is i have very little screen space for coding but let's open up um steering and these are my corrections let's look at i'm trying to remember this is pursue wander um let's look at i think this um let's look at i'm trying to remember where i first do a future location well wander does that let's just go to wander i'm so silly um so i'm gonna go to wander the very basic wonder okay so i'm gonna duplicate it and i'm gonna call this containment okay i'm gonna give myself much more space for the code i'm going to move this back over here and so the diagram stuff is going to be pretty small let's go to the sketch let's make this just like 300 by 200. there we go okay and i one thing i want to do right now as interesting as it is is let me take out this history thing because [Music] it is not as relevant here okay and whoops so now let's also take out this so i'm just trying to simplify wander for a moment and i need to write a new function called containment so it probably would make sense for this function to be something like um [Music] you know to receive like a region that you're being contained in but i'm going to make a again a lot of over simplistic i'm going to simplify this possible scenario space by just considering that the actual canvas is the region so the first thing that i need to do is get a prediction which i can do by and i'm kind of doing what i've done in other so this would make sense like predicting the future location probably would make sense to break that out into a separate function entirely because it's a repetitive task that's happening in multiple steering behaviors but for the sake of argument right now i'm going to keep it right here i'm going to say let's look at um it's future location like uh let's say like a 30 frames from now and let's add that to this position the position and uh draw a red dot and sometimes i like just using stroke which is sort of silly but uh and then say uh point at this step uh prediction x and this prediction y okay so all i'm doing so far is that i've got the vehicle i look at its velocity i make a longer version of the velocity and then i add that to the position right that's the position and i get this future location and i draw it red so hopefully if i run this cannot read property of undefined where is this push happening ah okay let's take this out and also instead of wander let's call containment uh cannot read property undefined of x where tell me where vehicle js line 35 i spelled it wrong good job no prediction equals this.velocity.copy add this position oh it's i put this prediction ah this is taking me much too long to find this clip oh i can't even find it there we go um okay let's see what we got now there we go okay great so we see i'm predicting the future location and let's predict it 100 frames ahead which is just and now basically what's the next step in containment if it is inside the allowed region no corrective steering is necessary so i need to know is it inside the um i still keep looking at my watch 10 minutes left and i'm really really struggling for energy and brain power here any suggestions for what i have lent for lunch today a nice salad with some beans maybe so this is going to be to be continued but so one thing that i probably would want to build for myself is generic functions to determine if um some particular spot is inside uh some particular region and i believe that i've maybe done this with looking at like is a point inside a polygon maybe i only did it in convex or concave or whatever thank you marvel man but um i think so let's let's let's do this in a sort of let's build the tools to be sort of more generic but um keep it sort of simple so i'm gonna write a function just called contains and a vector so i need like a region so i i want a generic function and oh the camera went off again i think it's overheating this is what's going on because it's fully charged wow so uh youtube mem youtube members or anyone when i announce on friday morning that i'm going to be live streaming like a couple hours from now your response should be did you eat breakfast uh simon's telling me that the diagram really explains this well which i can see that it does ah yeah so like we can see this like look at this ah this is great thank you simon so we can sort of see what's going on here right i've got this one if the point is outside the region somehow project a point back in and that's the steering target do nothing here do nothing here here this is outside projected so i don't know exactly how to project this point looks like it's doing it as like a normal somehow to the sort of path of the wall um yeah i need to get a referral bro is telling me to get a fan on it that's definitely what i need to do it's quite warm i mean it won't be an issue once it's cooler weather um but i'm like there's no air conditioning in here and i'm in a garage it's kind of like half an outdoor space which i'm a little bit worried about having all this equipment in they may have suggestions for how to appropriately keep like do i need like dehumidifiers is that the thing that i should be getting for this um garage space um i know i'm uh okay so um let's uh let's write this function um but i'm going to comment this out and just say it is now contains so eventually i want to figure out how to define the region and figure out if the vector is within that region but i'm going to treat this in a very simple way by just saying as long as v dot x is less than width and i should actually just do return so i'm going to return v dot x is less than with and v dot x is greater than zero and v dot y is uh less than height and v dot y is greater than zero and i'm going to change this to i should probably do this no no that's fine this works because it's just the point okay so uh let's take a look oh it wow it when i auto formatted it put it all in one line um so now i should be able to say um here if contains prediction and let's do um i was going to change the color of the dot but as soon as the dot is out okay my audio should be back unfortunately now i'm using this mic which is maybe a good mic for podcasting if i'm talking really close up to it in a very very deep voiced kind of way but i know it's going to be really echo-y and the audio won't be as good but as i have approximately two minutes left so much technical fail today um so and and i'm i'm kind of losing steam so i'm not i didn't this wasn't my best uh stream but pretty good for not having stream for a while from being in a brand new location with new equipment uh obviously it would have made sense if i could have done several practice streams before i came and did today but welcome to today's practice stream sponsored by brilliant i'm gonna wrap things up uh the audio is better this is better audio that seems crazy to me but maybe it is um uh it it will suffer from me like walking over here because now i'm like moved away from it or if i turn and talk in this direction versus turn and tonic in this direction but um um anyway so i think i've got to wrap this up i have to just uh i was gonna say quit while i'm ahead but i'm way behind so quit before i fall further behind i'm gonna read an explanation um it's a reflection like do you see the blue segment is the left yeah so so the next step here that i would need to do um and i think i can make this bigger is that basically if um if what i see is that the future location is here what i want to do is create a reflection i'm just looking at this which would go i guess like this oh sorry you can't see that which would reflect back so whatever this distance is this is a distance d ah i look for the distance so i'm going to be doing some kind of normal point finding just like i did in path following great so the tools of pathfinding will apply so i did i forgot i did this in path following uh the last mic was better okay i'm hearing hi stig um you're having dinner i haven't even had uh i had like literally like i had like of some blueberries this morning it's all i had as i was getting my kids ready for school so like kids at school i don't have to worry about they're like waiting for me to do something but apparently i forgot to feed myself um i had coffee uh not enough not enough sustenance to stream for two hours so i'm gonna do so this is in the path following videos which will be coming out as soon as i can get to reviewing and making the additional content for them do exactly this they take a given point project it onto some line segment this is scalar projection is what i'm doing or vector projection then whatever that distance is continue that normal out that same distance and then this is the target to which i will seek so i now understand uh i now understand that what i need to do so at a minimum this live stream was very useful for me i don't know uh it's harder for you maybe if you're new to things here to process this because i haven't released the path following examples yet but simon's been saying this to me probably for like six months and i can see now that he's absolutely right this containment will follow very well from um will follow really nicely from the path following content so i'll be able to so i will be back so i'm really um with the exception of what i will be october 22nd for sure um i will be live streaming every friday at this time i'm one thing i'm really hoping to do is establish a regular schedule i might like to do a poll in um i might like to do a poll in the discord about what like time on friday is best for everybody because i do have the flexibility to stream like earlier in the morning or a little later in the afternoon that i'm eastern time new york i'm you know on the east coast of the united states um so that i don't know if the mods want to help me remember this i do want to put out these polls about the new website stuff so that's first so join the discord there's another plug please join the discord um if you want to help engage with some of the surveys that we'll be putting out but i'm kind of curious to think about what time on friday might be best for the kind of global international audience um that there is um all right um yeah so will william asks what reference material are you using so in case this is um new to you here's where you want to look um so first of all all of this is coming from this paper 1991 paper steering behaviors for autonomous characters it's something that i'm working on working through i mean i've been working through this stuff since 2008 or probably even before that um a big source of inspiration for this also is um casey reese's work uh artworks and look at his process compendium which is a nice um um um this this particular set of videos about casey reese's work is highly relevant in braitenberg vehicles but um if you go to codingtrain youtube channel it should be here under nature of code two if i start to scroll through these once i get to oh well let me just go to here once i get to chapter five uh chapter five are all of is what i'm working on now the camera went off again this is so sad i'm just gonna i'm not even gonna try i'm gonna let it cool down for a minute so sorry um so um the the this the five point x series is me attempting to make a video about every one of these steering behaviors um and so uh you know if steering behaviors is new to you start with 5.1 but if a lot of this stuff about coding with vectors and motion is new to you then honestly i would start with 1.1 or even some of these other intro videos they don't necessarily um um it's not his exact sequence but 1.1 is where i would start um yeah so sorry for all the technical difficulties here the camera's shutting off the internet going in and out seems like rebooting the router really did fix that so maybe that's something i should just do every time before i stream uh the mic i have rechargeable batteries that i recharged for the lav mic all the way up to a hundred percent and i'm walking away from the mic down to turn the camera back on at least just say goodbye but i think i need new ones or something obviously didn't work so if you have thoughts or suggestions on ways that i can improve i'm really working on the setup here i'm curious what people thought of having this like ipad for diagrams versus um you know i'm just gonna um let's just do this really quick uh can i do this new uh well let me do it so i'm closing this out i'm gonna do this new movie recording because this is gonna be my rope oh no no no come on new movie recording oh yeah yeah i didn't have to close it i could just switched it to oh i bet you if i just plug in my oh wait a sec hold on can i just turn on the camera uh yeah ah there we go look at this okay so this is my setup a little bit you can see the outdoors there um this is like where i have a whiteboard and i would put another camera over there this is my new light oh you don't see any of this i'm not even showing you the screen that's so sad oh that was pathetic okay so uh here here i am um uh like here's me hi uh with my green screen uh and this is the space that's that mic and you can see uh gloria maybe gloria's maybe maybe uh my wife took gloria inside or she's sleeping somewhere in the grass where i can't see her um over here i should just reverse the camera i've never used like this uh over here you can see i have a white board and uh another tripod there which i was trying to put another camera on but i just need another kind of even put a little light over there but this is i knew this light is really awesome um i have two of these so i got a and i have this one i have some sound blankets and this is the camera there so you can see the setup that i'm kind of um working with now um this is a little like uh streaming pc i'm gonna give this to my son to be for his school and homework computer and get a new streaming computer um that can handle more inputs with a with a real capture card um so this hopefully gives you a little uh quick um behind the scenes and since my camera's not working um now you can see so uh and and david asked how many new studios have you had since december of 2019 so it's not my textbook i had i had uh do not disturb on so that my text messages wouldn't come through and one just came through so um anyway uh i'm wrapping up um it is so i started just recording videos in my little tiny office at nyu in the tisch building then i moved to a closet in the tisch building then i moved to brooklyn so i had a different closet in brooklyn which still exists that still exists i just haven't had time to go in there so i do have two studios right now but this is my my own space with my own equipment that i am putting all you know the sponsorship and the member stuff oh right now everything goes towards like building out this new studio and uh and also like the coding train team that's helping me with various things like video editing and social media and stuff like that so um thank you to brilliant and thank you to all of you who watch and support um i'm really hoping that this can become my own space that i can really have ownership over and kind of see where that leads so uh malu asks how old i am i am 48 years old uh my dream by the way i'd probably do this my 50th birthday i want to go on a like train ride maybe in like a scotland or like through alaska i don't know there's i went on this amazing train in norway once i want to go on a like trip so tell me all of your best like you know look i don't i don't that didn't be luxury but i just mean like an overnight where the train ride itself is the experience um i think they have some yeah i i think i saw one that looked interesting in scotland but maybe there's so let me know thank you william uh and so i um i want this to be the setup though where i can both record videos so i do extra streams for members which are my recording sessions but i don't have all the equipment yet to do that and i got to stop i got to say goodbye i love you all every single one of you watching right now i really appreciate you and um trans-siberian india says i should have never been to india it's a little traveling is a little complicated right now uh with the global pandemic i hope everybody's doing okay but um i hope to get back to it i'm exhausted i'm gonna go eat lunch i'm gonna say goodbye uh you're gonna hear this dot song and see the outro thing again if you wanna support me um uh uh um watch send me a nice um comment somewhere on youtube like a video is a thing people can do uh join sign up for brilliant that's probably the primary way right now that you should support uh and there's also the membership and all sorts of other things like that um i gotta stop talking i gotta find the this dot song i'm sorry i didn't read any random numbers by the way if you are a member in the chat and you received your whistle post about uh if you like it it's like laser etched oh hold on i can do this now i'm going to show you this whistle i swear i'm i swear i'm stopping hopefully no more embarrassing text messages will come in uh one more uh where's the movie recording i minimized it i want to show this to you all uh i need so um okay take a look at this this is your you can have this this is your very my very own laser etched coding train train whistle and it has on this side a um i don't know why i can't okay there we go where's the camera on this thing it has on this side i should get out a portrait it has and i'm sorry that this is inverted this is a random walk pattern that is using the random numbers from the random number book that i use this is the number and this is the position in the book that started this pattern um i'm giving these as gifts for uh members youtube members of the coding train starting with the conductor and above level but maybe eventually everybody will get them uh thank you for watching i will see you next time next friday same time right probably the same time next friday i will have eaten breakfast thank you so much uh uh yeah that's it that's all i got goodbye i don't have the music page open i'm like totally lost here uh there we go as always i always forget that this stop muting my microphone [Music] [Music] [Music] this dot [Music] this dot song never forget the this dot somebody composed that song for me i'm gonna say once again here we go sing it with me it's the forward coordinate song [Music] it's the forward to cartesian coordination autotune and the internet will fix that for me sing it with me it's the new cartesian coordinate [Music] [Music] unicorns and rainbows and cupcakes what else is there yes kittens thank you very much kittens and rainbows and cupcakes notice that look what i get i'm really losing my mind okay let's do it [Music] the kittens the kittens kids kittens and kittens [Music] the kittens the kittens kittens and kittens and kittens the kittens [Music] the kittens kittens [Music] [Music] i feel just sort of like a nice feeling of relaxation everything's gonna be okay today dream is not broken it has not frozen this is a this is a wonderful thing okay we're gonna do it i'm really getting to something i need my sound effect [Music] what else is there unicorns and rainbows and cupcakes that was invalid syntax i forgot uh there was one other thing here that i think is important that i will use continuously over and over again all sorts of text generation analysis things that i will use continuously over and over again first thing i need to do is yes [Music] goodbye everybody i've already turned the camera off so i can't come back to say goodbye but i'm ending the stream now i could just find where that button is to

Channel: The Coding Train

Views: 11,770

Rating: 4.9648352 out of 5

Keywords:

Id: xh9dbs7bo2w

Length: 128min 3sec (7683 seconds)

Published: Fri Sep 17 2021