I'm not a designer but I think this 1 pixel of interactive color highlight creates an immersion that there's more to the website besides the card you're hovering on. Like something you don't see creates that glow
I am a designer!!!! What makes this or feel so special is that it is so small, yet included, its something that only appears on your own interaction, which makes it feel personal to you, and it's such an elegantly small detail (that is just large enough for you to notice) that you really appreciate it, especially along with all the other items on the page that are super easy to hover over, and you almost automatically do so, and all the other items on that card respond, either via rotation, scale, or this light prism showing on them. and its these little details that you notice, but notice are small and think they could be neglected by the normal user that make them seem so damn nice! TL;DR these items are super eassy to hover over, and these items coming from them trick your brain into thinking theyre small, normally neglegable details, and because they resemble crystals and light beams, they give off some really good vibes.
Okay, this is my favorite front end tutorial channel. Hands down. I love that you go about making all of these videos trying to copy the best websites out there and learn what makes them so good. And that's exactly what you want us to try as well. Could you possibly make a video where you pretend you're a beginner at coding and break down a normal website? Something that you would see in free wix or Squarespace templates? I would love to see this on your channel. You explain things so nice, quick, and clearly. It's truly inspiring. Thank you!
i feel that the line gives off the effect of a realistic high quality card that you could pick up. and along with the rounded corners of the elements actually helps us relate it to real life cards and so it looks pleasant and "correct"
It's a neat effect, however, although something this simple won't use much resources at all, people should get in the habit of animating transforms, not the position properties.
Do u ever plan to do something like a portfolio review for some of your subscribers, we really look up to you and we want to get your honest opinion about the stuff we create.
We find this so appealing because it reminds us of Chatoyancy! The band of bright lustre caused by reflection on certain stones or... on stainless steel fridge doors.
You can't believe how thankful I am for these kinds of videos. As a webdev-autodidact, you're helping me so much with my imposter syndrome. Seriously, thanks
these re called splices and were used for some old sites they where great for gradients back when tables were popular for layouts and were single pixel (wide or tall) images. man i feel old
I think it's due to the fact that they are both small (non intrusive) but at the same time they stand out? Sort of like highlights but less aggressive. If I'm not mistaken, Apple has a similar approach with their design don't they? They do elegant minimalist design choices but they aren't "harmless", as they they do stand out despite being minimalist.
Keep in mind you shouldn’t animate top property. Instead, set top static and animate transform translateY to get nice looking and optimized transition ❤
Hey, Hyperplexed! It's an awesome video and tutorial, I'm impressed. Can you share a tutorial not on a frontend, but on BTS, how do you create this awesome videos? Which programs are you using to create, which tools etc? Thx in advance:)
I loved the video as usual, but I wish it was a bit slower paced. It felt extremely quick, and I didn’t feel like I had much time to process what was happening.
I was just recently visitng the apple website and saw that iphone 14 has this cool interactive arched carousel where as u change colour the iphone of tht colour moves to the middle and stuff...do u have any idea how to do that kind of carousel.
Transform doesn't actually change the element itself but moreso how it renders if that makes sense. While that's fine for this, it could cause weird issues for other things
it's not just looks, but also behavior that matters... if it was just stuck there, me, i would think that someone thought it will be a good idea to hide something, by setting it's width to 1px 🤷😁
I'm not a designer but I think this 1 pixel of interactive color highlight creates an immersion that there's more to the website besides the card you're hovering on. Like something you don't see creates that glow
attracts your eyes (moving objects stands out much more easily)
I am a designer!!!! What makes this or feel so special is that it is so small, yet included, its something that only appears on your own interaction, which makes it feel personal to you, and it's such an elegantly small detail (that is just large enough for you to notice) that you really appreciate it, especially along with all the other items on the page that are super easy to hover over, and you almost automatically do so, and all the other items on that card respond, either via rotation, scale, or this light prism showing on them. and its these little details that you notice, but notice are small and think they could be neglected by the normal user that make them seem so damn nice!
TL;DR these items are super eassy to hover over, and these items coming from them trick your brain into thinking theyre small, normally neglegable details, and because they resemble crystals and light beams, they give off some really good vibes.
The fireship of css and design videos. I love your content so much! Thank you!
this
"And with great power comes grrrrrrrrrrrradient responsibility."
- Hyperplexed, March 21st, 2023
The quality of your videos is beyond impressive, by far my creator at the moment, keep up the amazing work.
Okay, this is my favorite front end tutorial channel. Hands down.
I love that you go about making all of these videos trying to copy the best websites out there and learn what makes them so good. And that's exactly what you want us to try as well.
Could you possibly make a video where you pretend you're a beginner at coding and break down a normal website? Something that you would see in free wix or Squarespace templates?
I would love to see this on your channel. You explain things so nice, quick, and clearly. It's truly inspiring. Thank you!
You might like Kevin Powell
The end was the cherry on top. Grrrrrreat work as always :)
i feel that the line gives off the effect of a realistic high quality card that you could pick up. and along with the rounded corners of the elements actually helps us relate it to real life cards and so it looks pleasant and "correct"
Gradient responsibility 😂 this one liner humour is enough to make my day
Watching you implement things with great simplicity by your comprehensive CSS skills makes me believe I can do so toxicly
Bro Really Makes Top Quality Content !
Amazing video ! Keep up the hard work
Your videos are therapeutic, I wish you made more
more please
Ever since I started watching your videos my thought process has change and my CSS game have improve 😁⭐⭐⭐
"With great power comes grrrrrradient responsibility"
- some high developer + youtuber
I, too, watched the video.
He did, in fact, say that.
Another banger, and I love it.
elegant and cool
your explanation is impressive! Short and clear I really like it !!
In one minute you've compacted and articulated what many take 20 mins to do. My hero 😎💖
I just love your videos, it's so nice to watch, I can understand easily!
I really do aspire to be able videos as amazing quality as you.
0:06 thank you Hyperplexed, I appreciate it, even tho I don't know what I did
It's a neat effect, however, although something this simple won't use much resources at all, people should get in the habit of animating transforms, not the position properties.
Do u ever plan to do something like a portfolio review for some of your subscribers, we really look up to you and we want to get your honest opinion about the stuff we create.
We find this so appealing because it reminds us of Chatoyancy! The band of bright lustre caused by reflection on certain stones or... on stainless steel fridge doors.
The end got me bro 🤣🤣🤣
You can't believe how thankful I am for these kinds of videos. As a webdev-autodidact, you're helping me so much with my imposter syndrome. Seriously, thanks
these re called splices and were used for some old sites they where great for gradients back when tables were popular for layouts and were single pixel (wide or tall) images. man i feel old
Great video as always!
I just ran into your channel and you are amazing
love your channel!! Thanks for this!
wise words 🙌
loved it, don't have words to describe the satisfaction I got!
You're good with after effects too
Nice
Great way to represent how one builds stuff by exploring concepts! Thx yt algorythm 🎉
Classy!
i am loving your video ❤
I love your channel
i am a simple man. i see a new hyperplex video. i click.
Dude wake up! There's a new Hyperplexed video!
U know what , I m in love with ur videos …..
Nice.
"Grrradient responsibility."
lol
Please do a breakdown on iPhone 14 carousel 🙏
Bro left before we could get him
I see it more of a glint, like a shiny object caught in the light
That Pun😂😂
my god you are a wizard!
That ending xD
You can create a whole series of Micro Interactions in the UX/UI.
Please release more vids regularly 😭😭
yeah like... just make more videos. it's that simple
Great vid
i always thought more pixels = more detail but now i see the error of my ways.
Soo cool 🎉
I think it's due to the fact that they are both small (non intrusive) but at the same time they stand out? Sort of like highlights but less aggressive.
If I'm not mistaken, Apple has a similar approach with their design don't they? They do elegant minimalist design choices but they aren't "harmless", as they they do stand out despite being minimalist.
You could use an svg with stroke dash and offset to make this even cooler.
Windows 10 also has this effect when hovering over tiles and settings
Nice!
Keep in mind you shouldn’t animate top property. Instead, set top static and animate transform translateY to get nice looking and optimized transition ❤
Very cool! Could someone explain why content is set to ""?
Where's this guy 😭😭😭😭 release more vids man
They're fascinating because lizard brain sees minor but fancy interactivity details -> goes brrrr
Do soundclud next please 🙏
Hey, Hyperplexed! It's an awesome video and tutorial, I'm impressed.
Can you share a tutorial not on a frontend, but on BTS, how do you create this awesome videos? Which programs are you using to create, which tools etc?
Thx in advance:)
Kool
What tools are you using to create your video animations?
The pun got me so hard
Could you make a video on some cool particles
I loved the video as usual, but I wish it was a bit slower paced.
It felt extremely quick, and I didn’t feel like I had much time to process what was happening.
RUclips has speed control (best feature ever) can try .25 speed
@@dmlbs ...they mean the way he's explaining it. they want it more broken down....... they don't literally want him to talk slowly.
you are not meant to, this is not supposed to be a tutorial, it's just a highlight. did you see the feature? good, that's the point
@@YuriG03042 no, this is meant to be a tutorial
What do you use to edit your videos?
I've been watching your videos for a good while and can't figure out, if you really love Codepen or get sponsored by them 😅
Can you make a cs2 website slider tutorial
how did you get the little dots all over the card?
I was just recently visitng the apple website and saw that iphone 14 has this cool interactive arched carousel where as u change colour the iphone of tht colour moves to the middle and stuff...do u have any idea how to do that kind of carousel.
Frontend KING
Isn't it better to use the "transform" property to move rather than "top, left" properties?
Transform doesn't actually change the element itself but moreso how it renders if that makes sense. While that's fine for this, it could cause weird issues for other things
it's not just looks, but also behavior that matters... if it was just stuck there, me, i would think that someone thought it will be a good idea to hide something, by setting it's width to 1px 🤷😁
Can someone tell me the name of the font family he’s using? :D
the bois are early today
Ok but where's the hacker text?
W
like before watching
Did codepen sponsored you? xD
I'm sure this dude just thought the last joke and then made a video about it 🤣🤣🤣
No way that he just sended the least funny joke ever and eneded de video... what a man
Ok
literal lense flare
This video just reminded me how I absolutely despise css lmao jeez
I had to thumb down due to the corny dad joke at the end.
But love the concept of the actual 1px.
Fewer pixels.
Minimal websites are boring and they suck. Minimal websites like portfolio and other. I dare you to redesign them.
FIRST
Almost first. Better luck next
Do you have a discord? I would like to chat with u and ask some things