JavaScript Infinite Zoom Effect

Рет қаралды 4,948

Күн бұрын

Пікірлер: 59

@___d3p1 2 ай бұрын

I love how you turn a complicated problem into smaller, simpler problems that are easier to work on and solve. I still couldn't understand the last part, so I'll have to watch it again. I really enjoy these types of videos that exercise my mind! Thank you so much!

@Radu 2 ай бұрын

Glad you liked it. I'm not very happy about my explanation there, in the end. Usually I speak something 'smarter' and I can visualize / animate something on top of it in post... But this time, it didn't work very well. Basically, to fix that 'stutter' effect, I increase the speed every times the image changes. But doing that makes it collapse too quickly. So, I needed a gradual slowdown as well.

@shaddow11ro 2 ай бұрын

@@Radu Well no more cookies for you! How do you dare to make such a sacrilege! Anyway joke aside... great explanation and example and easy to take over!. This brings up some memories... not canvas but Pascal and Pascal Graphics :))). Worked my ass about half a year before finishing something like this!

@___d3p1 2 ай бұрын

@@Radu No problem! I think it's an excellent explanation, and I understand the 'why' behind the formula. Then, if I have time, I will try to implement the same thing this weekend to better grasp everything I learned from this video. Thank you so much for everything!

@Radu 2 ай бұрын

I can believe that... If I would have tried this 20 - 15 years ago, as I started coding, I wouldn't have been able to pull it off.

@Radu 2 ай бұрын

Good luck! It might also help noticing that, as you shrink the image, a point on the side will move faster compared to a point on the inside.

@durodolaoluwafemi8057 2 ай бұрын

I never regret SUBSCRIBING to your CHANNEL. I love Vanilla Coding, Pure Gold

@Radu 2 ай бұрын

Glad you like the content :-)

@pesterenan 2 ай бұрын

The effect is incredible, and the speed calculation was crucial to make it working correctly. Nice video Radu! I'll be waiting for the version with the photos, really cool!

@Radu 2 ай бұрын

Yeah, but I think the basic version can be cool as well. Especially if you time it with some music :-) Part 2 coming this week!

@firefox_tn1815 2 ай бұрын

Amazing content as always Dr Radu. I love the way you break down the problems to a simpler parts.

@Radu 2 ай бұрын

It's an important part of a developer's skill set :-)

@Khalid-je9pe 2 ай бұрын

The real lesson was how to humiliate someone ignored your messages, Good job, Radu.😀

@Radu 2 ай бұрын

What? :-)) no... I'm quite sure his email is just full and hard to organise properly. And... stuff like "I coded this for you" can also be marked as spam. Unregulated code could have mallware...

@yusuf.isyaku 2 ай бұрын

You just do amazing stuff Radu. This is soo cool, I particularly enjoyed the steps you took. Thank you, as always.

@Radu 2 ай бұрын

Hope the steps were clear. Thanks for watching :-)

@yusuf.isyaku 2 ай бұрын

@@Radu yes, they were clear.

@eugeniogonzato 2 ай бұрын

This video is a confirmation that you are a genius, thanks for your videos

@Radu 2 ай бұрын

Thanks, but I think it's just a lot of practice :-)

@codingprojects3324 2 ай бұрын

@@Radu I think that lot of practice made you a genius 😊

@Radu 2 ай бұрын

:-)) thanks, but I still think these are relatively simple things

@DarkGourmand 2 ай бұрын

YOU ARE THE GOAT!!

@Radu 2 ай бұрын

:-) thanks

@vadeserg657 2 ай бұрын

Very interesting, captivating and useful! :) Thank you!

@Radu 2 ай бұрын

Glad to hear! Thanks for watching :-)

@zylascope 2 ай бұрын

That's cool. Thanks for sharing. Subscribed.

@Radu 2 ай бұрын

Cool. Thanks for watching :-)

@adrianparr 2 ай бұрын

I never tire of your amazing intro song! 😂

@Radu 2 ай бұрын

Haha, some people like it, some don't :-)

@thatsJonLucas 2 ай бұрын

gonna prototype and desiiiign. As I said, sometimes this intro comes to my mind during my dreams

@Radu 2 ай бұрын

Oh my :-))

@thatsJonLucas 2 ай бұрын

that was awesome

@Radu 2 ай бұрын

Glad you liked it :-)

@pizdaxyu 2 ай бұрын

very nice, I thought maybe cutting off small portion of next image would solve the stutter problem too

@Radu 2 ай бұрын

The thing is, as you shrink an image, the outer part will shrink faster than the center part. Like, a corner of the original image will move 1/3 of the width but a point starting 1/3 away from the center will only move (1/3) x (1/3) of the width of the whole image. So, if you cut off a portion, it might make the effect less noticeable but it will not go away.

@MadaraAzukar 2 ай бұрын

Woah ❤

@Radu 2 ай бұрын

:-)

@eric7758 2 ай бұрын

Thats Awesome sire where is the second part for images🎉

@Radu 2 ай бұрын

It's already out for channel members, but coming for everyone else on Friday!

@bobobo1673 2 ай бұрын

Amazing content! A question, why use Canvas and not a simple css animation? 🤔

@Radu 2 ай бұрын

Well, we also generated the images procedurally in this one, so we need a kind of pixel-level control. Of course, generating vector shapes could have also worked, but I wanted it to be compatible with raster format too... Then, controlling the animation at this specific rate is something I wouldn't know how to do in CSS (there might be a way, I just don't know it).

@codingprojects3324 2 ай бұрын

Sir would love to see a series>live contribution to open source from you plz

@Radu 2 ай бұрын

Well, I do have the live streams where I code the advanced drawing app. And that one is open source. Does it count? :-)

@codingprojects3324 2 ай бұрын

@@Radu I have already watched some of that but that is quite complex to follow I mean Gsoc contribution

@Radu 2 ай бұрын

Oh, unfortunately I have no time for something like that :-)

@zanzaraloggan3713 2 ай бұрын

how about an image cropper like cropperjs next time? :D

@Radu 2 ай бұрын

Could be a nice project, but I think it will eventually be a feature I add to the advanced drawing app I build during the live streams.

@ChandrashekarCN 2 ай бұрын

💖💖💖💖

@Radu 2 ай бұрын

❤️

@GameMania-qv6nw 2 ай бұрын

Hi Radu, I have seen all of your videos regularly. I want to make a 8 ball pool game in js, but i am stuck at some points. Can you make a tutorial to make 8 ball pool game in js. I really appreciate it. Thanks

@Radu 2 ай бұрын

Can be a fun project, but I don't know when I get a chance to do it. Already recorded enough videos to last me until summer (once per week). And I have some other plans after that. So, probably no time to do it in 2025 :-\

@GameMania-qv6nw 2 ай бұрын

@@Radu ok may be time comes when you did it. Thanks

@Radu 2 ай бұрын

@@GameMania-qv6nw maybe. You can always try it out and ask question (like on my Discord, for example).

@DannyHille 2 ай бұрын

I'm not receiving updates whenever @Radu publishes a new video or comments on my comments, even though I am subscribed to the channel and have set my notifications to "All." Is anyone else experiencing this issue or knows how to resolve it?

@Radu 2 ай бұрын

Hi, I've heard others mentioning similar things, and I also experience things like that from time to time. Sometimes KZbin even removes comments without a good reason :-/ I've heard some people on KZbin say that unsubscribing and subscribing again can fix the problem (same with the bell), but I don't know if it really works. Anyway, thanks for ... trying to watch the channel :-)