Coding Challenge

Поділитися
Вставка
  • Опубліковано 24 гру 2024

КОМЕНТАРІ • 226

  • @DonSolaris
    @DonSolaris 5 років тому +379

    This dude resonates positive energy.

    • @za_ozero
      @za_ozero 5 років тому +6

      radiates maybe

  • @cameron6464
    @cameron6464 5 років тому +236

    Truly earns his title of "Bob Ross of programming".

    • @aram285
      @aram285 5 років тому +2

      his new title you just assigned to him.

    • @alastairlocke4621
      @alastairlocke4621 5 років тому +2

      Which I like

    • @KundoKun
      @KundoKun 5 років тому +2

      random = happy accidents

    • @amogh3275
      @amogh3275 4 роки тому +6

      "Blob Ross"
      Sorry i had to

  • @АндрейБогданов-о1г
    @АндрейБогданов-о1г 5 років тому +24

    Love your channel. At first it felt to me as "obnoxious youtuber tries to teach basic programming techniques to people who never tried programming". But later you did such an amazing job with some advanced algorithms like quadtree and some machine learning you've earned a lot of my respect. Keep up the good work, dude!

  • @remcodejong2651
    @remcodejong2651 5 років тому +59

    The edits in this video are sooooo good!

  • @NatetheAceOfficial
    @NatetheAceOfficial 5 років тому +182

    It's dark in the room, quiet. Daniel stirs slightly in his slumber.
    Suddenly he is sat bolt upright!
    "Perlin Noise!"

    • @markimoop9416
      @markimoop9416 5 років тому +11

      It's never dark in the room whenever Daniel's around.

    • @theromancheezit7982
      @theromancheezit7982 5 років тому +1

      lol this sounds like a creation myth

  • @JonathanChute
    @JonathanChute 5 років тому +44

    14:20 - you eluded to an interesting challenge. You should create a program that creates a font based off of this noise so that each time you write down the letter "o" for example you'll get one of these subtly off circles that is constantly different, and then extrapolate that to the entire alphabet so when you type in your keyboard you get the computer "handwriting" your sentence. Each letter would look unique, similar to handwriting, whereas fonts each letter is made exactly equal.

    • @TheCodingTrain
      @TheCodingTrain  5 років тому +12

      Love this idea! You should make it!

    • @flameofthephoenix8395
      @flameofthephoenix8395 Рік тому

      Well, this would be great in a video game or something like that, you wouldn't be able to use it as easily for messenger apps, of course you could have it to where it has each person see a different variation of the same text, and no one would likely notice.

  • @marcoronzani7197
    @marcoronzani7197 5 років тому +22

    Unbelievable, i needed this kind of thing right now for a project i'm working on, i was going to watch back your asteroids video cause i remember from there something similar, all in all...perfect timing, you are the chosen one!

  • @DodaGarcia
    @DodaGarcia 2 роки тому

    Perlin noise is so awesome, I love learning more about it from this channel

  • @mehdiikbal1244
    @mehdiikbal1244 5 років тому +8

    Love from France Dan! You are so inspiring and positive. I began coding thanks to you and it was the best thing that could happen to me. Merci beaucoup!!!

  • @Cosmoandcracker
    @Cosmoandcracker 5 років тому +1

    Dude, I am watching your videos for a while now, and i have never seen someone with this kind of sunshine-happyness while coding. Your videos are great! Keep it like this. Awesome work!

  • @eideticex
    @eideticex 5 років тому +3

    Never realized this was it's own concept. Used a very similar approach about 6 or 7 years ago to test attenuating light geometry. The renderer I was working on used calculated geometry to represent lights, everything from spheres, cones, toriods to exotic super shapes. After implementing improved perlin noise in HLSL, up to 4 dimensions I was itching to apply it all over the place in the renderer. One of the first things I did was sample noise space at each vertex of the geometry for the lights and passing that into my lighting equations as an attenuation of the radius. Made lights have the familiar imperfection we see in real life and when animated across time, made for very convincing incandescent light sources even though I kept the attenuation so small that the final image showed no more than a delta of 10 in RGB values. Didn't even occur to me while doing that, that I was playing with a rather interesting usage of perlin noise. Then again are there really any non-interesting uses of perlin noise?

  • @TechnicJelle
    @TechnicJelle 5 років тому +12

    I just started making an Asteroids game today! Loved the video! Thanks, Dan!

  • @ericschneider4919
    @ericschneider4919 5 років тому +1

    This is fantastic. Cyclic noise feels like the kind of thing a lot of people have wanted and I didn’t realize it existed without summing some sort of time-shifted noise function or some other mumbo jumbo. This is a super elegant solution!
    I’m wondering if circles would be any better than, say, a square in this context. Surely any closed loop would have this property, but intuitively it feels like a circle is the “most random,” even though something like a square is less computationally taxing.
    Also, it would be interesting to see what would happen if you put multiple shapes in a perlin noise “field” that acted as a displacement map. If you varied each vertex in a shape by the value of the noise at that vertex, i’d imagine you’d get a really cool effect by moving that shape around or varying the field in 3d.
    Anyways, great video!

  • @Unplanted
    @Unplanted 5 років тому +4

    Kudos to the subtitler! Great work!

  • @waynewedge
    @waynewedge 5 років тому +3

    Very inspiring. Thank you. Once again, I need to go and program my brains out.

  • @NatetheAceOfficial
    @NatetheAceOfficial 5 років тому +6

    The edits were so fun!

  • @jakehenri9608
    @jakehenri9608 4 роки тому

    I am so glad you finally did this! I have been wondering about how to fix that blob for over a year now!

  • @kenan2386
    @kenan2386 3 роки тому +1

    How does he have all of that energy
    Keep up your work!

  • @willb.755
    @willb.755 5 років тому

    You channel is always so exciting! Thanks for all the great content over the years.

  • @porknwithbill
    @porknwithbill 5 років тому

    I love how human and practical your code is. We don’t have to talk about the semi colons

  • @MahBor
    @MahBor 4 роки тому

    You're such an amazing teacher. I finally understand what 2D perlin noise means.

  • @iamsushi1056
    @iamsushi1056 2 роки тому +1

    What an awesome video for inspiration! You could theoretically make a 3d random or self-avoiding walk through spherical coordinates (or a 2d polar random walk) and use that as the coordinates for your perlin noise to be able to just have so many random loops

  • @edwinjones134
    @edwinjones134 4 роки тому

    Best teacher on the internet

  • @dejoker9042
    @dejoker9042 5 років тому +1

    Im 0 seconds in to the video and the like button is already pressed. Love your videos!

  • @listeningcosmos
    @listeningcosmos 2 роки тому

    Was struggling with this problem, thanks for the solution. Tried this method for my music visualizations and it worked well. Now I think I'll try to improve it by adding a sound reacting component to make it interactive.

  • @granteadie2616
    @granteadie2616 4 роки тому

    you're a national treasure my friend 10/10

  • @paulusul
    @paulusul 5 років тому +1

    Perlin noise is always positive
    That made me really happy :)

  • @mujaahidhaywood9843
    @mujaahidhaywood9843 5 років тому

    I swear Mr Shiffman, you acknowledge every comment. Thanks for another intriguing video.

  • @BIG_CLARKY
    @BIG_CLARKY 5 років тому +1

    This guy has crazy math/science teacher vibes

  • @erumabo
    @erumabo 5 років тому

    Man, I like emotion you put on this, you got a new subscriber.

  • @alex_bc
    @alex_bc 3 роки тому

    EXACTLY the information I was looking for! Thank you so much

  • @drsmek
    @drsmek 2 роки тому

    I love how I found this video and it actually helped me solve a problem I was working on 😅

  • @aaronrothwell7615
    @aaronrothwell7615 5 років тому +1

    This is a really fun one to add alpha clearing to, so you get blurred lines as the shape morphs. So instead of background(0) you would use color(0,0,0,25); rect(0,0,width,height); and this will draw a rectangle over the entire screen that is slightly faded out and because these are layered on top of each other each previous generation of line is more blurred out and so slowly transitions to black. Hopefully this makes sense, not sure how to format code in comments.

  • @airxperimentboom
    @airxperimentboom 4 роки тому +1

    I love this !

  • @aram285
    @aram285 5 років тому +31

    Polar Perlin Loops, part of a balanced developer’s diet.
    edit: oops I did a mispelliginationating but its fixed now

    • @ABaumstumpf
      @ABaumstumpf 5 років тому

      But he didn't use Perlin noise.

    • @ABaumstumpf
      @ABaumstumpf 5 років тому +1

      @Manan Karnik No, it is *not*.
      IN processing and p5js at the very least it returns a fractal noise - that is NOT Perlin noise.
      Fractal noise is a form of noise generated by adding several different noises together. In case of processing/p5js that becomes apparent when you look at the "NoiseDetail" function: It set the number and falloff for the used noise-layers.
      Perlin Nosie itself is a very regular grid-based noise with uniform feature size and smooth transitions. Adding several layer of that with decreasing size and amplitude gives the nice rugged result that resembles a terrain.

    • @aram285
      @aram285 5 років тому

      @@ABaumstumpf It was a joke k dude. Calm.

    • @Dalendrion
      @Dalendrion 5 років тому +1

      According to the documentation, it's Perlin noise. processing.org/reference/noise_.html
      It is of course possible that the documentation is wrong. If it is, it's understandable where the confusion comes from.

  • @wkool9430
    @wkool9430 5 років тому +1

    Great video! You inspired me to make Snake (the game) in JavaScript. The twist is that i am not using any form of grid other than just the loose pixels... It's really close to being done. Thanks again for the inspiring video's

  • @markuzj.k9445
    @markuzj.k9445 5 років тому +6

    As always You made it very clear :).thanks.

  • @Wobbern
    @Wobbern 5 років тому +3

    You would be a great teacher! I can tell it on the way you leave the mouse in the middle of the images you want to show.

    • @prakharlondhe3876
      @prakharlondhe3876 5 років тому

      he is a *professor*

    • @Wobbern
      @Wobbern 5 років тому

      ​@@prakharlondhe3876 and this was a *joke*

  • @johnterpack3940
    @johnterpack3940 5 років тому

    It looks like the perfect technique for modeling a realistic planet. Just apply the exact same technique to spherical coordinates instead of polar coordinates. Maybe add a couple octaves of additional noise or an underlying sine wave pattern to help create larger scale areas like continents. At any rate, it certainly gives me a better idea of where to start than anything else I've found. Thank you.

  • @jolly8953
    @jolly8953 4 роки тому

    this channel is a real inspiration for stuff to do lol

  • @cellininicholas
    @cellininicholas 5 років тому +4

    As well as changing the Z-Offset, could you also move the centre of the circle (that is sampling values in 2D perlin noise)?
    You could also play with that circle in other ways... Maybe use an oval and slowly change it's shape over time?

  • @pdutube
    @pdutube 5 років тому +1

    The segment at 16:34 looks like the continent of Antarctica is morphing with Earth's rotation. Trippy. Another cool way to implement 3+ dimensions is to make the extra dimensions color based or sound based. Then a rotation/translation/etc., would change colors and sounds.

  • @hund4440
    @hund4440 5 років тому +1

    You can get a 2d tileable perlin noise texture by cutting a thorus through 3d perlin noise

  • @scalarnomad9330
    @scalarnomad9330 4 роки тому

    This dude is the best!

  • @monochromatech
    @monochromatech Рік тому

    Hey I just found your channel and I love it.

  • @iamjimgroth
    @iamjimgroth Рік тому

    This guy is amazing!

  • @Confuseddave
    @Confuseddave 5 років тому +1

    I was thinking about whether you could make a seamless 2-dimensional texture (there was a video were you used Perlin noise to create a vector field and had particles flow through it, but it had artefacts at the edges where the vector directions would change abruptly). My first thought was to use the surface of a 3D torus to give a looping 2d texture in the same way you're using the edge of a 2D circle to generate cyclic 1D noise here.
    Then I twigged that the would cause distortion in the texture, since the outer edges of the Torus would sweep through a larger length of the noise pattern than the inner surface for the same angle. You could minimise it by turning the minor circle so it's tangent to the major circle rather than radial (so your torus would be flattened as if you sucked all the air out of it) but it'd still have a slight distortion to it unless you actually projected the circle onto the surface of a cylinder (sounds complicated, but probably just needs the coordinate calculations to come in the right order).
    Part of me wonders if it would be simpler just to write a Perlin noise class that interpolates smoothly between the edges, but that would limit the scale of the noise to integer fractions of the screen space, and might cause issues if you wanted to create images with odd aspect ratios.

  • @JBahrsShiz
    @JBahrsShiz 5 років тому +1

    First of all, you rock. Thank you for your videos. As a newbie, I feel overwhelmed, but inspired by your videos. I guess it's like someone learning to play the drums and watching Neal Pert thinking, 'I have a long way to go' and 'man, that's awesome' all at the same time. What is your advice to the noob? I am currently more than half way through the codecademy full stack web development course and plan to finish that, but was curious to hear from the community what "best practices" are recommend for new guys/gals.

  • @kushagraverma9452
    @kushagraverma9452 5 років тому +1

    Nice editing!

  • @DustinGunnells
    @DustinGunnells 5 років тому

    I don't know what you found here, but I'm still studying it. I think you found something extremely important on accident. That phase thing is incredible!

    • @JNCressey
      @JNCressey 5 років тому +1

      As the phase changes, the orbit of (cos(A+phase), sin(A)) over A morphs as follows:
      Phase=0: counterclockwise circle
      Phase=pi/2: oscillating along the straight line between (1,-1) and (-1,1)
      Phase=pi: clockwise circle
      Phase=3pi/2: oscillating along the straight line between (-1, -1) and (1,1)
      And between those, it is various elliptical shapes.

  • @EliKennedy
    @EliKennedy 25 днів тому

    This is crazy. Last week i coded a wobbling blob of space jelly in a perlin noise loop for my space shooter and mine DOES have this visual artefact. Now I can fix it

  • @cielregister8828
    @cielregister8828 5 років тому +1

    good video Dan!

  • @WildAnimalChannel
    @WildAnimalChannel 5 років тому +4

    I use 3d fractal noise to make mountains on the 2D surface of planets in my game I'm making. You're giving away my secrets!

  • @turnipzoxi2853
    @turnipzoxi2853 5 років тому +11

    Chaotic good coding.

  • @KnakuanaRka
    @KnakuanaRka 4 роки тому +1

    Okay, the gag at 6:02 is hilarious. ¯\_(ツ)_/¯

  • @aryamankejriwal5959
    @aryamankejriwal5959 5 років тому +4

    Anyone else remember the debate about whether it was polar noise, perlin noise, polin noise or perlar noise?

  • @d_v_d1070
    @d_v_d1070 5 років тому

    18:03 in he plays the cards and lures you in with that oneliner, your passion for code ignites "if......the creative possibilities expl...." o yeszz :)

  • @roykepoyke
    @roykepoyke 4 роки тому

    That is my favorite video of yours

  • @creature_of_fur
    @creature_of_fur 5 років тому

    During your explanation I had another idea. What if we take 1D perlin noise, then take the end points, draw a line between them, and then shear the entire graph, so the line stays perfectly flat.
    Essentially, when we take the noise value, we subtract some amount from it. That amount ranges from the start point value at t=0 and the end point value at t=1.
    Just simulating it in my brain, I don't think it would be noticeable

  • @devi_buns
    @devi_buns 5 років тому

    Your videos always inspires me ♥

  • @diligar
    @diligar 5 років тому +4

    What if, when moving through 3D Perlin space, instead of looking at circles in x,y with increasing z, you looked at circular cross-sections of a torus? Then it’d definitely loop :D

  • @jazonjiao638
    @jazonjiao638 5 років тому

    Awesome! Finally fixed the broken blobby!

  • @vadsavin
    @vadsavin 5 років тому +1

    Do you remember your Perlin noise example with moving particles? Please, try to make the same staff but let particles move like drawing contours of input image.

  • @iwantedtohaveabigytnamepsi2007
    @iwantedtohaveabigytnamepsi2007 5 років тому +1

    Omg, that's so amazing

  • @slyer7695
    @slyer7695 5 років тому +10

    Love from Italy ❤️♥️🇮🇹, #LoveFromItaly5

  • @СергейКучерюк
    @СергейКучерюк 2 роки тому

    Great video!

  • @abdelrhmandameen2215
    @abdelrhmandameen2215 3 роки тому

    I’m here for the hands gestures.

  • @채병욱-i4o
    @채병욱-i4o Рік тому

    /** 적외선 센서에 물체가 감지되면, 시리얼 모니터에 "Detected"라는 문장을 출력*/int sensor = A0; // 센서핀은 A0번에 연결int val;void setup() { Serial.begin(9600); pinMode(sensor, INPUT); // 센서값을 입력으로 설정 Serial.println("arduino starts");}void loop() { val = digitalRead(sensor); // 센서값 읽어옴 if (val == LOW) { // IR센서는 LOW ACTIVE로 탐지 시 LOW값을 전송함 Serial.println("Detected"); delay(300); } else Serial.println("0"); delay(300);}

  • @topa9487
    @topa9487 5 років тому +47

    *give me the polar perlin noise LÖÖPS brother*

  • @JonDavies-Shiftbulk
    @JonDavies-Shiftbulk 2 роки тому

    Continuously good videos. Can you do one with the polar noise mapping seamlessly to a sphere. it is tricky as you change the radius the polar mapping the noise texture distorts.

  • @ABaumstumpf
    @ABaumstumpf 5 років тому

    I have said this on several of your other videos - but this is *NOT* perlin noise.
    Processing, p5js and several others might call it that, but this is a form of fractal noise - several layers of smooth noise of different frequencies added on top of each other.
    Also - Perlin noise is inherently closed. If you set the correct scale you automatically get your desired perfect closing loop. This also works for creating 2D perlin noise and making it tileable.

    • @TheCodingTrain
      @TheCodingTrain  5 років тому +1

      Thanks for the feedback! From what I understand, the implementation in Processing is "classic Perlin noise" from 1983. I agree that I could be better about being clear about this. Actually I'd love to make a video that shows the differences between this classic "VALUE" (?) method vs Simplex vs Perlin. It would be wonderful to have a Processing library with these different implementations. Maybe this can be a Coding Train project!

    • @ABaumstumpf
      @ABaumstumpf 5 років тому +1

      @@TheCodingTrain " From what I understand, the implementation in Processing is "classic Perlin noise" from 1983."
      the noise-function of processing is giving you a fractal noise. It might very well be using a form of Perlin-noise internally to generate the octaves, but what you get is certainly no longer Perlin.

  • @SaifUlIslam-db1nu
    @SaifUlIslam-db1nu 5 років тому

    Is there any possible chance you can arrange to teach professors and teachers how to make animations like this? Your graphics really help to understand Mathematics and Physics. I think it would help quite a lot in the class room!

  • @ahmedsharif9193
    @ahmedsharif9193 3 роки тому

    Actually, negative values for xoff & yoff are supported in the p5 Perkins noise function

  • @darkfrei2
    @darkfrei2 3 роки тому

    Can you explain how to code the *map* and *noise* functions?

  • @elyaizen
    @elyaizen 5 років тому

    Wow Dan. 👏

  • @АндрейБогданов-о1г
    @АндрейБогданов-о1г 5 років тому

    If you want a repeating pattern why not use a sum of sinewaves with period of 1, 1/2, 1/3 ... etc? You will have way more controls (amplitudes and phases for each wave), not just xyz for perlin. It will also have better resolution.

    • @TheCodingTrain
      @TheCodingTrain  5 років тому

      Great suggestion!

    • @АндрейБогданов-о1г
      @АндрейБогданов-о1г 5 років тому

      @@TheCodingTrain not even "better" resolution. Basically infinite resolution. At least as far as floating point comes if sin/cos is implemented correctly. Depends on compiler settings :)

  • @monlewi1976
    @monlewi1976 5 років тому

    Perfect spin loader

  • @jedmarshall217
    @jedmarshall217 5 років тому

    What if you moved where you were getting your perlin noise valises from, instead of moving around the circle? Say, having the circle trace around another circle in the perlin plain? Seems like this might be a cool way to add some more “randomness” to the space without having repeats before the end.

  • @deadend8111
    @deadend8111 5 років тому

    Nice video!! I challenge you to make a drawing predictor (simple neural network that calculates the next points locations from few starting points)

  • @poplikes
    @poplikes 2 роки тому

    brilliant!

  • @VictorNascimentoo
    @VictorNascimentoo 5 років тому

    Do a next challenge on Hilbert Curves and other space filling curves :)

  • @AuraVFX
    @AuraVFX 2 роки тому

    how do you make the noise loop follow a certain shape like the heart you showed in the start

  • @КлипыипесниНОВИНКИ

    Супер. Вы крутой!

  • @juschu85
    @juschu85 5 років тому

    12:48 No, you couldn't just split up a into two different variables and increment them in another way. Then you wouldn't end up at the point where you started in the 2-dimensional perlin noise space.
    Or I just misunderstood what you said you could do.

  • @TheHyperplayer
    @TheHyperplayer 5 років тому

    the question is why it has to be a 2D perlin noise instead of a simple 1D perlin noise which automatically starts and ends at the same point...
    you can just interpolinate the perlin noise array after replacing the last value with a copy of the first value. The first and last component will always stay the same that way.
    (for reference check out javidx9's video about perlin noise...)

    • @omereli1062
      @omereli1062 5 років тому

      He is proofing in the video that 1d perlin noise is not what he needs, he is simply circling around by the x offset in the 2D perlin noise and taking the y off set that it would match up

    • @TheHyperplayer
      @TheHyperplayer 5 років тому

      @@omereli1062 no hes using a predefined noise function. I was refering to a method which does the same while generating the noise. By interpolination. If you have a random Array and put the same Value at the start and beginning and interpolinate it you end up with a perlin noise that starts and ends at the same point.

    • @omereli1062
      @omereli1062 5 років тому

      @@TheHyperplayer he is using a build up perlin noise function I'm not sure if it can do that

    • @TheHyperplayer
      @TheHyperplayer 5 років тому

      @@omereli1062 Well the method I was refering to needs a tweak to the Perlin Noise generation so a predefined Method might not work with it.

    • @TheCodingTrain
      @TheCodingTrain  5 років тому +1

      Oh interesting technique, thanks for the reference!

  • @Seb135-e1i
    @Seb135-e1i 4 роки тому

    So. You use one noise loop to make sure that the circle is perfectly closed.
    At the end you also introduced the possibility of a z-offset. Could you use 4 dimensional perlin noise, use dimensions 1 and 2 for the perfectly closed circle, and move around dimensions 3 and 4 in another circle with a z-offset and w-offset so that it creates a perfectly looping animation?

  • @pinkierar_real
    @pinkierar_real 5 років тому

    Потрясающе

  • @DotNetRussell
    @DotNetRussell 5 років тому

    This would be cool to use to generate random terrain

    • @TheCodingTrain
      @TheCodingTrain  5 років тому

      See: ua-cam.com/video/IKB1hWWedMk/v-deo.html

  • @DiamondSane
    @DiamondSane 2 роки тому

    A finical note is that these noise additions are not exactly 1d Perlin noise. It was not stated though. Anyway, nice video.

  • @execskies4245
    @execskies4245 3 роки тому

    Now I want to see rolling Perlin noise

  • @pluffcrock3438
    @pluffcrock3438 2 роки тому

    21:35 that shooting sound resonates in my nose

  • @crumblinggolem6327
    @crumblinggolem6327 5 років тому +1

    Wouldn't 4-dimensional Perlin noise allow you to loop the changing blob by using the same process that you use on x and y?

  • @azomtech4852
    @azomtech4852 5 років тому +4

    wonderful wonderful wonderful wonderful wonderful wonderful wonderful wonderful wonderful wonderful wonderful wonderful

  • @franchello1105
    @franchello1105 5 років тому

    seems like the shape of these perlin noise values might be different than the 1 dimensional ones. and depending what angle it might be a bigger or smaller step. Not 100 percent sure.

  • @ritikamandal8253
    @ritikamandal8253 3 роки тому

    How can one create circles within the circle?

  • @perlindholm4129
    @perlindholm4129 5 років тому

    Just a thought. If the problem is creating some function(a) = b. Could there exist a Problem-Focused-Number-System? I mean since there is more than one number system. There has to be a reason. Like there are more than one problem. All a little different. So maybe there exist a way to adapt to each problem that could arise in the creation path. Why should the system be set from the beginning is what I guess. Then if a machine learning model() can classify a problem it can jump between problem solutions.

  • @delpear_
    @delpear_ 3 роки тому

    How do you make a slider to use in processing?

  • @hendasheng
    @hendasheng 3 роки тому

    thank you for your help:)

  • @praveshgaire3437
    @praveshgaire3437 5 років тому

    Never though noise would be that useful

  • @kautukkundan8001
    @kautukkundan8001 5 років тому

    Just amazing