Unravelling the Magic behind Polyrhythms

Watch as I show you how to recreate an awesome audio visual animation inspired by / @project_jdm .
Merch: hyperplexed.store
Tools used: HTML, CSS, JavaScript
CodePen: bit.ly/CodePenPolyrhythmicSpiral
Music licensed by Artlist:
Bishara Haroni - Gymnopédie No 1
SpongeBob in thumbnail:
Hypnotized SpongeBob And Patrick 3D Desktop Wallpaper By jes123 on wallpaper.com
Link: bit.ly/3IPuJw2

[@aydenherbst]

Let me put it like this, if all school and university teachers worldwide were half as astonishingly excellent at conveying information as you, we'd be living in a very different world.

[@YuriG03042]

damn, if only we could have classes once every 2 months so they could create content in this fashion too

[@yaverjavid]

if you can't keep up with the pace and style teachers, then you shouldn't study at all. It feels like i am taking a class in a disability school;

[@austinedeclan10]

​@Yaver Javid people aren't the same, don't learn at the same rate or in the same way or care about the same subjects. I realised if I care about a subject or field I'll learn it really fast. That's how I learned to cook and code but can't do math or chemistry beyond the basics because I don't need, don't have to, can't be bothered. I just wish I didn't have to spend time in school on things I had no interest in and only focused only on things I had interest in.

[@joaoroberto1497]

It's not really a problem with the teachers. They're usually underpaid and overpressured. it's really hard to keep loving teaching when education is just a product, like everything else. Even lives. So don't blame the teachers, it's really not their fault.

[@ciprianparaschiv7591]

Nah bro. They too busy inventing new ways to tax the monopole they created on certifying to 90% of society that you are worth something in some domain. Don't have the money or the interest to actually find real teachers, people that live to transmit knowledge to others. At least wonderful people like Hyperplexed exist.

[@AdityaTheGoat]

18 minutes of animation editing is crazy. This video must've taken you a while. GJ.

[@danboy12342]

Given how long it took fortune video to come out from the pen, I'd say so

[@ajzack983]

your videos are music to my eyes

[@prashank]

Hol up

[@zaiffyyy]

Exactlyyy...

[@beforedrrdpr]

And videos to my ears

[@ggsap]

I feel like I did not learn anything because all the points you make are sort of obvious in isolation, while in reality, after you present them, it seems so trivial and intuitive and felt I knew it all along. I also like how you give an extra recap and not leave it up to the viewer to rewind 50 times, just to become frustrated and lose hope. I hope you make more videos like this, this is excellent teaching

[@narutokunn]

Yes the recaps make such a huge difference. Excellent video this is

[@coldlombax]

Honestly, my favourite part of your guides/videos is that you ask questions, as if you were developing, it helps understand how to find the answers using google, rather than just copying a guide directly. It seems silly and obvious but I'm glad you do it! Thanks for the videos Hyperplexed

[@GiveMeSomeMeshuggah]

I love how you bump into problems and walk through them instead of just presenting the correction up front. It feels like problem solving with a real developer and makes the learning so natural.

[@CalebCrowe11111]

Seriously a video that deserves more attention. Your editing is smooth, your script is seamless, and the topic is interesting. I hope this gains traction

[@Jason-mk3nn]

Within a matter of a couple minutes, this brought me back nearly 40 years to coding on an Apple ][. The sheer approach and explanation was so similar to how I learned, but instead of the internet or a fancy KZbin video, it was through books and magazines of sample programs and code blocks. I have not even finished this video yet, but I am smiling ear to ear and listening and watching you go through this was the same energy I had at the time and soon to be the same energy I would try to teach others with. In a single word: Wow. Thank You. This was a precious 20 minutes of time that I won't soon forget, and will definitely share it with others.

[@Viakavish]

Everyone already told you *why* the you explain things are outstanding, I'm here just to ask you to create a course. You will earn money and people will learn better, it's a win win. You are a teacher in your blood, I never saw someone explain things so good, just WOW.

[@exyl_sounds]

this is awesome. I think this kind of project would sound best if you use a pentatonic scale just to avoid any super dissonant intervals and to make it sound good no matter how random

[@quackerdeezles]

Exyl from flute gang?!

[@jonathanalonso6492]

I like your funny words, magic man

[@seomeenu]

next exyl song = polyrhythm?!?!??

[@IshmamAhmed]

Ahh man of culture

[@Spherey]

flute gang moment

[@andrewboldi47]

Now THAT's a tutorial. Great work hyperplexed!

[@byteatatime]

I don't think the speeds are staggered, it's just that the radius and circumference of a circle are proportional (2πr) so the inner circle has a smaller circumference, therefore making it faster to reach the end.

[@codeoptimal7197]

You learn a lot about radians (and sin/cos) in trig. I just completed the class, and it is so cool to see it actually used in the real world!

[@samienr]

Dude just wait till you learn calculus! It all comes together for so many subjects and seeing math being used everywhere is fascinating!

[@samienr]

I’d suggest watching 3Blue1Brown if you really want to get your mind blown with math applications. It’s a bit advanced and you might not understand everything but you learn as you watch. I’d highly recommend watching the guy, he does really amazing stuff.

[@koy5902]

@@samienr Is calculus a requirement for a career in programming? That level of math destroys me.

[@Wolforce]

hyperplexed is slowly nearing game design. I'd also watch the hell out of that. Awesome video.

[@thespeedyyoshi]

So many times watching this video I was like completely flabbergasted at how much info was flying at me all at once and how it kept going. This was a trip, and I'm shocked you made it to the end. That break down is amazing.

[@JayronWhitehaus]

This is the most genius approach to showing someone how to step wise problem solve. Really fantastic stuff.

[@p07a]

You do a great job bringing back the genre of video, or written tutorials that used to exist in magazines and the internet 15 years ago. Thank you! We definitely need more hobbyist / creative programmers in this era.

[@sleepy-gogo]

I really love this content! It's so high quality that I literally cannot think another way of explaining all the logic and code required to create stuff as complicated visually as appealing as your videos! I would love to see the kind of worlflow you go through to create this videos, man!

[@bradenborman4396]

Awesome job as always, HYPERPLEXED! 🤩

[@currenluna]

I love the way you recapped the most recent steps throughout the video. This is an excellent breakdown and explanation of your process! And I appreciate it when you "thought out loud" through bugs.

[@malindukumaradasa3851]

Your animations, pacing, dedication to making sure we understand everything you did, and the process of thinking and tackling problems, even the minor ones, is truly magical. Thank you for these amazing videos!

[@tHekrack23]

Not only an amazing concept, but a masterclass on teaching itself. The way you present the content and concepts is just amazing

[@lagknowswhy]

You make programming seem so easy, love your animation and explanation style!

[@SuperSmashMarco]

Coming from your most recent video on the wand animation, and I have no words - the quality of your videos, explanations, and approachable demeanor are inspiring. Once again, please don't stop making videos, you have a real talent to inspire!

[@eisah0919]

The 'unit circle' will unlock all the secrets to what is happening mathematically with sin, cos, and the selected angles whether in degrees (0-360) or radians(pi - 2pi)! I think this is a critical tool for understanding the arc math. This video unlocked this hidden memory from high school algebra/trig lol!

[@eisah0919]

Amazing video as always! Cheers!

[@ajilpappachan]

This video was an audiovisual masterpiece.

[@FlorinPop]

I'm always looking forward to your videos. OMG such amazing work! Great job!

[@alexanderbang4116]

Amazing video! I think you could have just used the absolute value of sine to get it to "bounce" back, thats because sine controls the y position og it goes between -1 and 1. So taking the absolute value keeps it above zero, then you wouldn't need to have the adjustedDistance calculation.

[@LionTheFish]

This is my favorite channel. Always a good day when you upload.

[@DrJimmyBob]

Awesome video. I love the way you explained this and you're animations make for incredible visual support. I'm very impressed

[@TeePlunder]

You are a real motivation for new coding projects and try out new things! 🙏🏼🎉

[@local9]

One of your best videos, seeing you grow over the last year has been an amazing journey.

[@emmavdev]

I love this channel a lot! Your videos are literally perfect. Thank you

[@MultiShiv19]

I like the feel of these videos, it feels like we're writing code together. I like how analyze the next step and also do recaps along the way. ❤

[@jawidz4636]

bro you're freaking excellent with all your content! happy I found you ! keep up the good work

[@narutokunn]

This is amazing stuff. So well taught. Kudos to you and the super hard work you put in.

[@maherylala2153]

Really waited for that one and it's great as always ! Ty

[@chovbee]

Not only are these videos so entertaining, but these really teach me how to learn. The way you go about researching problems you run into gives me ideas on how I can approach future issues in projects

[@chaotech8962]

Very well simplified! I'm happy to see someone making coding approachable, too many videos assume people are comfortable with high-level explanations and overcomplicated systems.

[@ahjsbkdjhavkcjhvac]

yet another great video from my favorite web design channel on KZbin. You never disappoint.

[@fueledbycoffee583]

i have been using canvas fior almost 7 years and i never understood the arc function. i just memorized it and this is the first video i have come across that actually make radians have sense! really nice!. One piece of advice tho... just redraw the circles. just can leave the line and the arcs on a secondary canvas so you dont have to redraw them each frame

[@AndreasBeder]

Thanks for your time explaining every step in such a pleasant way.

[@PierreChevallier]

The editing and animations are amazing! Great work!

[@skydivertyler]

FANTASTIC video, extremely well presented and easy to understand. You rock!

[@AnwarulIslamYT]

Wow! Incredible. the time and patience you took to animate the whole things is splendid. You're awesome. Learned so many things in a single video. It made my day

[@lalasmith2137]

Love to see a video from you, much more so when it's a long one. Thank you so much for sharing, would love more long format videos so I can learn much more from you

[@SRG-Learn-Code]

The recaps are a very smart way to engage. I love your videos.

[@harrisonhutton]

Absolutely amazing! Thank you, once again 🙏

[@levifzephyr]

That was nice and clean, easy stuff until 13:59. At 14:00, "the WholeLoop time is constant to 900 sec, whatever is the number of loop done". WHAAAAT ?!? CRAZY IDEA ! And I was like 😯😱🤯! Thanks for this very nice video, with very nice animation, and very good explanations.

[@AcridDragoon]

never stop what you do. your videos are AMAZING

[@OliverEbsworth]

In my opinion. This is the best video you have made and that is seriously saying something. Good work man. 💛

[@glorysamuel898]

Just found this channel and i love itttt. You make programming seem easy and fun.

[@Ron-op8es]

like others have said, i love how you walk through one problem at a time. it really goes to show how you don’t need all the answers up front when you want to build something. you solve problems as they come up

[@BriggsMullen]

You always find the most interesting things to build, and you make the process of building them look interesting and less intimidating. You've outdone yourself this time though. Fantastic work.

[@ladokakhashvili8820]

Man, where has this channel been all my life. I recreated this project with some of my own twists. I am just getting into canvas and this definitely helped a lot. Thanks and take the Sub

[@FridgeFucker96]

This was so easy to understand, that's quite rare in the programming and the math scene. You're amazing!

[@sidharthgujja4533]

this is beautiful. i truly have no words to describe how interactive, entertaining, and educating this video is.

[@ardianhotii]

One of the best videos I've seen recently , very well explained also its very satisfying, keep making videos like this

[@ayushkumarchandra]

Man, this is legit gold! Thank you so much!

[@-hackers_industry]

I have a short attention span but I just cant get enough of your videos. I don't know what it is maybe the smoothness or narrating but regardless, its working :)

[@flwi]

You're a really good educator! The pacing was perfect imo - it often felt obvious what the next step is. Well done! At first I thought it'll surely de-sync because of rounding or whatever. But just using t, v and d is a great idea I didn't think of when I had a first look at the animation.

[@NoobomgWhy]

Amazing, see children, this is how it really works. It does not take a super knowledgable person, it just needs inspiration and asking questions. It's about not beeing afraid to ask the question :)

[@gradientO]

I like the way you solve problems. Wow

[@bcharles9605]

Omg man this video is a piece of art! Amazing!

[@juleshorne2331]

Terrific teaching - thank you!💐

[@yunierolivera5091]

Mesmerizing. The editing, the explanation, all 😍

[@bailey29]

This is seriously one of the best coding videos I have ever seen. I wish I had stuff like this when I was learning, the way that you discover solutions to problems in an intuitive way is pure genius.

[@hereisabhi]

Best javascript video I have seen :)

[@antoinekikkers9022]

your content is amazing!

[@nairol203]

What a great Video! Thank you very much

[@akos.prestigio4927]

Your teaching skills are amazing.😄

[@KalebPeters99]

This is masterful pedagogy. Bravo ✨

[@hadzimmuhammad5365]

Love you dude. I hate UI but youve been keeping me interested

[@BestHelp07]

I am really inspired from you, the way you explain things , your way of teaching things is really perfect, i am going to start making videos on KZbin again, tutorial videos and my journey to become a good coder, I will try my best to make tutorial like you. Thank you for your efforts in teaching like this. I really appreciate this..

[@gonzalopineiro9147]

You are next level, you explain like Sebastian Lague, you rock.

[@ScientObject40]

This was really instructive, thanks a lot Hyperplexed.

[@mikymuky1171]

Absolutely stellar educational video! I am showing this to everyone who ever has a doubt in their ability to learn the programing world.

[@anweshandev]

The amount of trigonometry I did here could complete my university syllabus. Great video again.

[@JakeHaugen]

This is exactly how computer programming feels. I’m using this next time someone asks me what being a software engineer is like. Thank you for the wonderful video ❤

[@2difficult2do]

Amazing, exciting and incredibly interesting video. It's like magic. Thanks for sharing your knowledge.

[@CiY3]

You are such an incredible teacher, that my mom (who has no idea how to code) enjoys these videos! Thank you so much, Hyperplexed.

[@Alpha-yh8wq]

This is the most comprehensive tutorial I’ve ever seen to the point that I didn’t even realize it was a tutorial

[@ezehbomote6384]

So many things I learnt in maths and physics that I get to see a real world application for the first time.

[@querela92]

Nice. Really good explanation and especially how to build this. I saw those musical points on line animations a few times but never thought about how they were made. And thanks for trying out the sound API so that we don't minimize on full volume in the future 😂

[@dhanushpthampi5587]

Love your vedios bro please keep making them

[@pablowbk]

This is crazy man, thanks a lot

[@ashleyrothn313]

so much polish. such a pleasure to watch.

[@Robbiefrfr]

I love the editing and recaps ❤❤ Ps: Good you picked soundtrap 😄😉

[@BackassWordsWeirdworld]

This is so meaningful to the big picture. Thank you. God bless.

[@user-mk8mm4nv2m]

I love the way that even you create music it’s looks like you mastered and looks so easy😂

[@ordinaryperson-my7qr]

OMGGG, loveeee ya work... ❤❤❤

[@AhmedSaeed97]

broo this so good! ty

[@Bonksy42]

You and fireship are the absolute best youtube channels to go and learn useful new things and become better at what I do. Thank you so much for everything!

[@nikykovalski5869]

Wow great video! I'm going to learn javascript right now

[@Ramej]

the style of editing is very good

[@GratuityMedia]

this is awesome, thanks!

[@cihankafadar2739]

what a nice video to watch, thanks

[@StellarWeb008]

This is the first man I saw who gave a different variable name to the canvas element and it's context instead of "canvas" & "ctx"

[@Famelhaut]

this is just incredible. im not sure how you do it please keep doing these! ill follow this and make one for me later :3

[@NumbBlaze]

Amazing work man, math makes my head go on strike so this is very impressive :)