Turning Pixels Into Waves

Поділитися
Вставка
  • Опубліковано 20 жов 2023
  • In this video, we're building an awesome graphical effect, where an image is processed into a series of animated waves. The math behind the technique is fascinating, and will lead us into to how sine waves work, the magic of linear interpolation, and signal processing techniques like amplitude modulation!
    =[ 🔗 Links 🔗 ]=
    🗣 Discord: / discord
    ⭐️ Patreon: / lowleveljavascript
    💻 Github Repo: github.com/lowbyteproductions...

КОМЕНТАРІ • 21

  • @strat5520
    @strat5520 7 місяців тому +3

    i absolutely love your channel. Its like it was made for me personally lol. What a treasure.

  • @electrolyteorb
    @electrolyteorb 7 місяців тому +1

    I have heard about something about it in how MRI constructs images... Now this hand on approach teaches a LOT... Thank u

  • @MarcelRobitaille
    @MarcelRobitaille 7 місяців тому +10

    An explanation of AM/FM without a single mention of radios? It looks awesome though I'm definitely going to steal that effect for something. I'm thinking you could vectorise an image like that for laser engraving or something

    • @LowByteProductions
      @LowByteProductions  7 місяців тому +1

      Extremely fair point, I guess I thought those terms were so ingrained in most people's minds!
      I'm certain you could indeed vectorise this - or at least modify the algorithm to be able to take an image of a lower resolution and upsample, so that you could map lines drawn by the sine waves to the coordinate system of the laser engraver.

  • @lunarwitch1967
    @lunarwitch1967 6 місяців тому

    well this is amazing, when i find some time i will try to make a basic wave image generator and host it somewhere (i'll make sure to drop you a link and to credit you)
    (i also have an idea for a game with these images as graphics but that's for another day when i'm bored)
    anyway, awesome video 🤍

  • @Roxor128
    @Roxor128 7 місяців тому

    It feels like you're halfway to recreating analogue television here!

  • @shubhamsingh3068
    @shubhamsingh3068 7 місяців тому +3

    Your mapRange formula is wrong at 15:20. Try putting v = a, outcome must be c but the mentioned formula gives 0. And thanks for this awesome content.

  • @skilz8098
    @skilz8098 7 місяців тому

    Before I get to far into this video just wondering if you're using FFTs and their inverses within your algorithms...

    • @LowByteProductions
      @LowByteProductions  7 місяців тому

      No this video doesn't use FFT. Its an effect based on amplitude modulation of a fixed-frequency wave (at least frame to frame), which takes it's modulation information from an interpretation of the pixel data.

    • @skilz8098
      @skilz8098 7 місяців тому

      @@LowByteProductionsOh wow, didn't expect a response that fast but thank you. Was just curious... I'm partially aware or familiar with the method you're using. It's just that when it comes to FFTs they're one of my favorite algorithms both mathematically and within the context of a computer program... They're just fascinating at what they can achieve and the rate at which they can achieve it.

  • @andy_lamax
    @andy_lamax 7 місяців тому

    Near the end, you fixed mapRange but did not fix your lerp function, they were all wrong, but you just fixed one

    • @LowByteProductions
      @LowByteProductions  7 місяців тому

      True. I fixed it before I pushed to github. It was only defined to be used for map Range in any case

  • @Natalia-zt1dq
    @Natalia-zt1dq 7 місяців тому

    Your lerp function in the code is wrong, you did basically lerp() => t*b

  • @KangJangkrik
    @KangJangkrik 7 місяців тому

    Well.. this is low level channel, try to render it with Vulkan

    • @LowByteProductions
      @LowByteProductions  7 місяців тому

      Looking at something like the architecture of vulkan, and comparing it to traditional graphics targets like opengl could be fun. Not something I really know enough about right now to do effectively, but maybe in future

    • @KangJangkrik
      @KangJangkrik 7 місяців тому

      @@LowByteProductions me too! +1 subscriber

  • @blade8880
    @blade8880 7 місяців тому

    i hear js i comment i quit the video