Тёмный

I Fired a CSS Cannon at a Famous Streamer 

Hyperplexed
Подписаться 652 тыс.
Просмотров 417 тыс.
50% 1

Watch as I show you how I fired a metaphorical CSS Cannon at Ludwig. By this I mean that I recreated an effect from his video using CSS.
Merch: bit.ly/Hyperpl...
Support the channel: bit.ly/Support...
Tools used: HTML, CSS, JavaScript
CodePen: bit.ly/CodePen...
Ludwig video timestamp: bit.ly/LudwigV...
Music Licensed by Artlist:
Ikoliks - In the Kitchen of the Mountain King
Maya Belsitzman & Matan Ephrat - Chaplin - Scene 2
Nsee - Frozen Lake

Опубликовано:

 

26 сен 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 686   
@ThatMumboJumbo
@ThatMumboJumbo Год назад
I don't even program and I'm not sure why I'm here but I highly enjoyed this.
@WalterMan
@WalterMan Год назад
Woah it’s Mumbo Jumbo! Love your vids!
@sameetpatil_5
@sameetpatil_5 Год назад
Damn he got Mombo too!
@overexplained7416
@overexplained7416 Год назад
When my worlds collide
@asky740
@asky740 Год назад
for sure you can build this with redstone
@Octopixel40
@Octopixel40 Год назад
css isn't really programming, it's just a language to make html look pretty and there isn't logic like in normal programming
@ashishgupta2124
@ashishgupta2124 Год назад
Truly a fun way to learn css .
@ImNotFine44
@ImNotFine44 Год назад
But learning css is already fun
@knedlikcz6517
@knedlikcz6517 Год назад
@@ImNotFine44 🤨
@ikoedgod
@ikoedgod Год назад
@@knedlikcz6517 no no, he's right
@baconerie
@baconerie Год назад
@@ikoedgod me trying to figure out how to center a div:
@fisch37
@fisch37 3 месяца назад
​@@ImNotFine44 the doctors should arrive in 15 minutes
@nikolabosevski1435
@nikolabosevski1435 Год назад
Not only are your front end skills immaculate, the video editing is insane as well. The way you edited the cards so we see them from up top and every animation in beetween is just so good.
@thecatontheceiling
@thecatontheceiling 10 месяцев назад
his editing software supports adding in JavaScript to add animations and stuff so I'm guessing that's how he's doing it
@js3671
@js3671 2 месяца назад
@@thecatontheceiling what editing software is he using?
@nikhilispog
@nikhilispog Год назад
The 3D animations in this are incredible, another great vid well done
@Picklerage
@Picklerage Год назад
Big 3Blue1Brown vibes
@tomasrasimavicius1914
@tomasrasimavicius1914 10 месяцев назад
Yeah, and I love how much more complicated they are compared to the animation that the video is focused on replicating :dd
@Goodgu3963
@Goodgu3963 Год назад
I started watching you a bit less than 9 months ago. Every video you have uploaded has leaped in quality. This video was absolutely fantastic, from the editing to the humor to the information to the music. Amazing as always!
@jamieheald
@jamieheald Год назад
the crossover episode i never knew i needed
@leitto-corleone
@leitto-corleone Год назад
What a time to be alive inline with such god tier content
@Benwager12
@Benwager12 Год назад
A fellow scholar in disguise!
@BlockMasterT
@BlockMasterT Год назад
If only there was a paper
@clickBait-x9p
@clickBait-x9p Год назад
This man don't just do random stuff, he hunts them down.
@alex.g7317
@alex.g7317 Год назад
Lol, I can see this becoming a comment that everyone copies! That’s how you know it’s good! 👍
@Fabian8a
@Fabian8a Год назад
This is hands down one of the best videos I've seen on the platform, unbelievable quality fitted in such a short time frame
@borain7210
@borain7210 Год назад
I don't even watch to learn, its just too enjoying to watch you videos. Keep up the good work ❤
@DarkG7X
@DarkG7X Год назад
As a subscriber to both this is not a crossover I was expecting
@charlesm.2604
@charlesm.2604 Год назад
I started watching Ludwig during among us phase, right before the subathon so it was crazy to see everything unfolds and how successful he has become over the years. I kinda been watching on the sidelines since his move to RU-vid but supporting nonetheless !
@Snowfly1
@Snowfly1 Год назад
Babe wake up, new Hyperplexed video just dropped
@genericuser321
@genericuser321 Год назад
WOW, I am so impressed by your ability to translate how typical programming decisions get made, and the complex 3D models you have in your head to solve it all. Fantastic video and animations!!!
@TheWizardsOfOz
@TheWizardsOfOz 9 месяцев назад
I always imagined it was the separate images on separate sides, it being one stretched image wouldn't even come to mind.
@alvemaster
@alvemaster Год назад
This is actually a very interesting concept you brought up in the end. It would make a page very immerseful
@Alanhallow
@Alanhallow Год назад
These videos are helping me so much in my project. Thanks man
@zaczourbang4454
@zaczourbang4454 Год назад
The real magic in this video is your animating on explaining how everything worked. Bravo!
@AbyssEtc
@AbyssEtc Год назад
Woah. somebody took a premiere course. exceptional video as per usual but the editing is a step up. cheers
@morosov4595
@morosov4595 Год назад
I was extremely surprised when I saw there is no JavaScript code for this needed. This is why HTML+CSS is turing complete. Well done!
@1NonlyEren
@1NonlyEren Год назад
LMAO THE ENDING i love this guy allready
@XDBjoernXD
@XDBjoernXD Год назад
I love the full thought process and envy your proficiency :)
@adrianbecker6438
@adrianbecker6438 Год назад
wow the animations in this Video are mind blowing!!!
@husseinkobeisi5022
@husseinkobeisi5022 Год назад
I love how your videos are starting to become more and more dummy friendly, the effort to make them more digestible really shows. Yet even though they're more educational they're just as fun as always if not more
@muzammil.0011
@muzammil.0011 Год назад
Knowledge with a bit of comedy 😅 Love the way you explain stuff. Really Impressive 💯👏
@ims1n
@ims1n Год назад
This whole video was so impressive. I think the editing was nice, but more importantly I think the storytelling was super amazing. How you got across clearly so much about programming and managed to make it so interesting. While also retaining such a short runtime. Great job!
@socialdamage
@socialdamage Год назад
Using transform: scale() would have been my go to as well just to make it work, but there is transform: translateZ(20px) to actually move items further away on the z axis. For this to work you will have to define a "perspective(100px)" for example. The Perspective will be the starting point where the element will be rendered. 100px will start rendering elements 100px far away from your computer screen into the website. Our translateZ(20px) element would then be rendered 20px further away from the starting point, actually rendering it at 120px on the Z axis
@AdamLeis
@AdamLeis Год назад
The point: vanity projects, sizzle reels, and conference websites built by-and-for front-end developers and designers. But… but probably mostly vanity projects. Excellent content, as always!
@reggie7653
@reggie7653 9 месяцев назад
Wow the visual representations are amazing. Sick video
@firojpaudel
@firojpaudel Год назад
the only reason why I subscribed you ! Thanks for motivating KING !
@TropicalVR
@TropicalVR Год назад
legend has it this video was animated on a website.
@chroma_toaster3910
@chroma_toaster3910 5 месяцев назад
I've been learning CSS this past year, and i genuinely enjoyed this video because I got to understand it
@corlay77
@corlay77 Год назад
Amazing, please keep doing videos as often as you can, I love them ❤
@andrwondabeat
@andrwondabeat Год назад
Your videos somehow keep getting better and better tf
@copaceticobserver
@copaceticobserver Год назад
Crazy how fast your channel grew I remember subscribing when you only had like 2k subs
@toby_cm
@toby_cm Год назад
i was here at like 10k and thought this was another fireship channel lol great content tho and this channel totally deserved it
@koneeche
@koneeche Год назад
JAJHAHA, WHAT! Bro just said: "nah, forget it, I quit"
@SuperVitality
@SuperVitality Год назад
Art is subjective. While I personally not a fan of this effect, it's animated enough to be eye catching. Adding a small wiggle might help it pop more.
@bones_twisting_sorrow4750
@bones_twisting_sorrow4750 Год назад
Every single one is a gem. Thank you.
@LARADEKA
@LARADEKA 8 месяцев назад
Dude decided to make art out of the power of HTML, CSS, and JS. *_I crave that knowledge._*
@darian.rosebrook
@darian.rosebrook Год назад
These are some of my favorite videos. Thanks for sharing (:
@aval6734
@aval6734 Год назад
This channel makes me fall in love with css. Truly amazing
@cluzi
@cluzi Год назад
Your videos are actually so underrated. Keep up the great content!👍🏻💯
@Isaac-i7r1f
@Isaac-i7r1f 6 месяцев назад
I don't think I have seen any sleeker video editing skills. Conveys the information in such an artistic way. I need to learn this
@YMilkshake
@YMilkshake 10 месяцев назад
I like how the visuals you made to showcase your process of making the effect in CSS is way more complicated than actually making the effect in CSS
@PicSta
@PicSta Год назад
I'm always impressed by your videos. The way you explain, analyze and re-create ideas and effects is amazing. They all have got a “Wow Effect”. Like What the F… 😄 Keep up the good work and have a nice weekend.
@Burbie
@Burbie Год назад
the 3d animation was so good this video was so good
@m.4074
@m.4074 Год назад
The details in your videos are amazing!
@azeek
@azeek Год назад
Woooow, the video quality is increasing dramatically, good job dude.
@Cahnisama
@Cahnisama Год назад
I love how watching your videos takes me to a journey. And I still learn and get inspired in the process.
@ottersmeep25
@ottersmeep25 Год назад
I made it in an iOS app after watching you do it. The urge to animate things is very strong.
@mrmacneil
@mrmacneil Год назад
I know so very little about programming but I would 100% watch a million videos like this.
@k00p28
@k00p28 Год назад
Before discovering your channel I used to hate CSS . You are amazing man !
@matt.5815
@matt.5815 Год назад
Your best video so far, your skill in simplyfiying and explaining is insane, and the humor in this was superb
@KA1KITE
@KA1KITE Год назад
absolutely despise coding, absolutely need those kind of videos
@AaronHuffmanPerson
@AaronHuffmanPerson 9 месяцев назад
I like the idea, it gives good practice and adds tools to the toolbelt
@DevinFraze
@DevinFraze Год назад
Wow! This is the best one of these yet!!!
@4uffin
@4uffin Год назад
The explanation visuals were VERY good 👏
@achrefnasri8847
@achrefnasri8847 Год назад
it's like commandement for ui develeper "Thou shalt not watch without copy thine design."
@officialbfi01
@officialbfi01 Год назад
Very entertaining video! They just keep getting better and better :)
@DesignFrameCaseStudies
@DesignFrameCaseStudies 8 месяцев назад
This was incredibly well edited and produced. Great work!
@darlonhenrisouza8555
@darlonhenrisouza8555 Год назад
i dont expect that final
@GarrytheIII.
@GarrytheIII. Год назад
This is a level of profundity and goofiness at the same time, that only Hyperplexed can achieve.
@Itaypoo
@Itaypoo Год назад
love your videos man. keep doing what this thing is
@zackator4565
@zackator4565 Год назад
I did not no i was looking for this content. But the fascination of this effect was defenitely conveyed in an elegant and playful manner. This opened up the video even for non programmers. Well done.
@kingalpha1174
@kingalpha1174 Год назад
The editing, animation and narration are simply just off the charts, very amusing.
@pilotreaux
@pilotreaux Год назад
This might be your best video
@diert
@diert Год назад
The explanation video editing is just iconic, thanks man
@GuitarSlayer136
@GuitarSlayer136 Год назад
1 the presentation is far more impressive than the actual CSS and I'm here for it. 2 this has inspired me to make it myself to test my own method.
@David.Lopezz
@David.Lopezz Год назад
The amount of work you put in the video animation to show how you animate an image with CSS is crazy!! I really respect your work! Keep it going!
@myradoesstuff
@myradoesstuff Год назад
the story telling is immaculate .
@cloudydayss
@cloudydayss Год назад
holy shit my two worlds have collided
@lucimacaron
@lucimacaron Год назад
"Can I? Yes. Why? Beats me"
@chojaywangchuk8720
@chojaywangchuk8720 Год назад
Bro casually dropping a banger edit and thought we wouldn't notice
@abdelrahmanabboud3384
@abdelrahmanabboud3384 Год назад
It's good that ur video editing skills are improving gj❤
@maherylala2153
@maherylala2153 Год назад
The quality of these videos are leveling up real quick, keep the work man !
@dailydoseofhalal6767
@dailydoseofhalal6767 Год назад
the video editing here is insane
@sabbbir
@sabbbir Год назад
love you bro
@jaxsyntax
@jaxsyntax Год назад
The production quality keeps getting better with every release. Keep up the good work :)
@Mrdavaidavai
@Mrdavaidavai Год назад
Good explanation. You should make a course about CSS or JavaScript. I would totally watch it.
@budgetarms
@budgetarms Год назад
I knew that end would be like that because, sometimes we do things for no reason except because it can be done.
@darzelizam8404
@darzelizam8404 5 месяцев назад
Love your videos, love the humor , I'm a beginner and these are truly inspiring !
@Nadal-
@Nadal- Год назад
that was beautiful
@yaeldiez8281
@yaeldiez8281 Год назад
The way that this guy combine creativity, video edit and progresses from nothing to 100% through a step-by-step process is just amazing
@eip408
@eip408 Год назад
actually, this would be great to add specially if a website's theme is playful. nice!
@Cookies-cv3nd
@Cookies-cv3nd Год назад
This guy is so underrated, great skills, amazing humor and actually have a good narrative voice !!
@Frawkesish
@Frawkesish Год назад
I'm a simple man.. I see Ludwig.. I click.. also every last hyperplex video I've seen has been 🔥🔥
@GenE-Brennan
@GenE-Brennan Год назад
I can not wait to use this animation to make my engineers dislike me more
@tr0_0rt
@tr0_0rt Год назад
i wanna be a css wizard like you someday
@Adaywithjon
@Adaywithjon 9 месяцев назад
this is such a dope video. Job well done making CSS actually explainable to all of us!!!
@LifeIsBayWatch
@LifeIsBayWatch Год назад
nothing can stop this man
@matheusazevedooliveira8222
@matheusazevedooliveira8222 Год назад
Enough questions.
@justinpooters
@justinpooters Год назад
"Eh, somebody smarter then me figure it out". This man, you made me laugh so hard. Thanks again Hyper! 💪
@AminalCreacher
@AminalCreacher Год назад
i think it looks like a loading effect. you select the game from your library, and the page fades away except for the thumbnail, which plays that little animation as the game loads :)
@NateLevin
@NateLevin Год назад
That 3D visualization is insane
@leifn
@leifn Год назад
You should make a video on how you make videos. The effects are amazing and i have seen a few keyframes in my life!
@lilrex2015
@lilrex2015 Год назад
I would love to see a vide on how you made this video. The animations were really well done, very captain disillusion
@v01c3
@v01c3 Год назад
If it fades to bottom instead of middle, it could look pretty regal
@wlockuz4467
@wlockuz4467 Год назад
I wish I could fiddle CSS like this man. Every time I try it, I end up fighting with it instead.
@philliptune
@philliptune 10 месяцев назад
Hah, patting myself on the back since I figured out that it was two separate images on either side.
@wasd3108
@wasd3108 Год назад
I only kept watching this to find out where you'd use it... eh, not today.
@simonswiss
@simonswiss 8 месяцев назад
I LOVE the very end of this video
Далее
If Programming Tutorials Were Super Dramatic
2:42
Просмотров 282 тыс.
I Redesigned Popular Websites (Quora & Steam)
6:25
Просмотров 326 тыс.
А Вы за пластику?
00:31
Просмотров 12 тыс.
It's time to talk about these UI trends
9:09
Просмотров 481 тыс.
I Redesigned Popular Websites (Amazon & Google)
6:58
Просмотров 279 тыс.
I tried using AI. It scared me.
15:49
Просмотров 7 млн
I Tricked the Internet with an AI Rapper
26:37
Просмотров 3,1 млн
Subtle, yet Beautiful Scroll Animations
5:04
Просмотров 1,7 млн
I Redesigned the ENTIRE Steam UI from Scratch
20:34
Просмотров 751 тыс.
This Website Theme Hasn't Been Perfected Since 1996
9:43
How to take your front-end skills TO THE MOON
4:47
Просмотров 253 тыс.
Building The Extraordinary Using Only The Ordinary
6:37
А Вы за пластику?
00:31
Просмотров 12 тыс.