Amazing vid, but how do you export these cards to web, as svg?
@nidarahman23057 сағат бұрын
really high qaulity video and designing , would have been nicer if you had explained better how to achieve this instead of telling what we can achieve with this
@MaximilianoCervantes-n6z11 сағат бұрын
Awesome 🫰🏻🔥🔥
@khushboobisht70511 сағат бұрын
Pls make a video of advance website with parallox effects and also animated website
@khushboobisht70511 сағат бұрын
I want to design an advance website... With parallox effects
@digitalsahara667018 сағат бұрын
Amazing work! I really love the effort you put into those videos and the output. I was wondering whether you will be creating a handoff type of video from design to code. Would love to see that.
@specialfriedrice4949Күн бұрын
Amazing work guys, commenting to boost the video letsgoooo
@KomalTomar-r1mКүн бұрын
hey, i'm following you're video and i'm stuck in 3:17 timeframe part so can you solve it. or send me you're figma file so i can solve it
@kenilpatel5163Күн бұрын
yess same here, i also faced the same issue
@pixelpoint-ioКүн бұрын
Hi, here is a Figma file to that specific example. I think you're talking about Dots + Pen Tool technique. www.figma.com/design/MqbcytXcZpIeLILJpQ60XT/Masks---Pen-Tool-%2B-Stroke-Example?node-id=0-1&t=IYW3R4uyjCbBpeZU-1 Basically you have a grid of dots as a one group(grey dots). Then you have another group with a duplicated dots group, you make that dots group as a mask and then draw on top of them with a pen tool + white stroke. I hope it made it clear. Let me know if you have more questions.
@kenilpatel5163Күн бұрын
Hey its really a great video, as i learned the concept of masking, i was following "the dots - shape" tutorial from video to get the output, but am confused at a point, do you have a file of it by any chance, in which i can see and compare my work to get the error solve ?? If yes then it will be definetly of great help:)
@pixelpoint-ioКүн бұрын
Hey, you might refer to this part. Let me know if I get it right. Thank you! www.figma.com/design/MqbcytXcZpIeLILJpQ60XT/Masks---Pen-Tool-%2B-Stroke-Example?node-id=0-1&t=IYW3R4uyjCbBpeZU-1
@porushpuriКүн бұрын
GOATed Content! Thanks for creating this
@specialfriedrice4949Күн бұрын
the junior designer watching this video right now: 👁👄👁
@peretczКүн бұрын
Thanx for your content, you're doing great job
@im_bk21202 күн бұрын
Just Amazing!
@mosudrs76082 күн бұрын
Make more, I fully support your efforts! And will continue to do it !!
@pixelpoint-ioКүн бұрын
Thank you very much!
@AtomicPixels2 күн бұрын
You need to base your spacing and radius and size based on an actual vertical rhythm set by your baseline line-height. Formula? Baseline x line-height = vertical rhythm. Eg 18px * 1.5 = 27px. That’s your row height, column size, margins, and everything is a multiple of that value. Radius: FontSize (of whatever your component is using in the typescale like h6/24px) + scale(-2) = radius Eg take the size of what’s 2x below your h6, so go from 24px then look at baseline 18px then you’d be at the body or 16px. That’s your radius for a card using the h6 as its primary text element.
@dangers2 күн бұрын
How would you implement it with CSS, won't it be a mess when making a responsive web page?
@TolaFJB2 күн бұрын
How did you add the texture to the number
@MariaRina-km9vg2 күн бұрын
Form and content are simply excellent. A high level of professionalism is in every corner of this presentation. Thank you
@pixelpoint-ioКүн бұрын
Thank you very much!
@FlowVeeran2 күн бұрын
huly labs i think is it lottie?
@matheussantos43122 күн бұрын
insane edition 🔥
@guilhermeaugusto95413 күн бұрын
can u make a tutorial showing how to export the groups of textures and borders that u applied in the frames?
@otavioalexandre75753 күн бұрын
Amazing free content, please keep making
@pixelpoint-ioКүн бұрын
Thank you!
@designjayesh79283 күн бұрын
Thanks man! For sharing this!
@Gatfullhet3 күн бұрын
😍
@jmg95093 күн бұрын
Excellent, excellent, excellent. Will be using something similar to this aesthetic for a post
@igordezi30253 күн бұрын
This video hits as hard as the masks one, and I like how you made this one even more simple and easier to follow! The blend modes videos...yes please :D
@igordezi30253 күн бұрын
Alex, this is legendary! Thanks, keep on rolling!
@pixelpoint-ioКүн бұрын
Thanks! Will do!
@rodz4 күн бұрын
GOAT content fr
@MohamedShawky4 күн бұрын
can u make a slower and more detailed please? new people like will struggle following through this xd
@haythamwali66424 күн бұрын
My new favorite KZbin channel. Keep up the great work ❤❤❤❤.
@pixelpoint-ioКүн бұрын
Thank you! Will do!
@abhayrahul4824 күн бұрын
I really appreciate the tutorial. Thank you. 😊 How do I take this to website? Like how do I optimise this for Framer/Webflow?
@wittywolk4 күн бұрын
Great work as always, thank you!
@mariajackson89234 күн бұрын
Great video. Well done.
@dariamag19374 күн бұрын
what is the name of the music playing in the background? :)
@teksdesign5 күн бұрын
Thanks
@raasukk44195 күн бұрын
I love the effect and the design but I really hoped you can actually do it in 3D instead of basic 2D image compositing, Is that all Rive is? Thanks for the insight!
@simonl90275 күн бұрын
Thank you very much for this tutorial. I'll be subscribing straight away. Quick question: where does the texture you use come from, please?
@SmartPhoneDesigner5 күн бұрын
Well You deserved million subs ❤💕💕 hoping for more content on development side Thank you.
@PremKumar-gl2tr5 күн бұрын
this video is a chef's kiss 😘👌
@pixelpoint-ioКүн бұрын
Ha-ha, glad you liked it!
@uiuxhpro5 күн бұрын
Best channel so far on youtube
@afiuza17185 күн бұрын
Amazing UI but what a nightmare for the DEVs...
@sajjad_aziz5 күн бұрын
Valuable content ❤
@bright_moses5 күн бұрын
Your channel is a blessing in disguise... am still going through your videos.. planing on watch and replicating every single one.. thank you 😊
@pixelpoint-io5 күн бұрын
Thank you! You will become a pro if you do this.
@miraz_kabir5 күн бұрын
Full breakdown video in slow speed will be more helpful 💝
@ahmeddaud92335 күн бұрын
Prolly the best UI design channel on the internet
@pixelpoint-io5 күн бұрын
Wow, thanks!
@rodnem5 күн бұрын
Hummm… without a doubt it is perfectly executed and gorgeous but… I already know the front end developer reaction… To my mind the process must be a bit different for a good handoff. Please can you make a second part to show the responsive behaviours of your cards? How you manage the fonts, paddings, margins, border-radius changes depending on the breakpoints ? Thanks Doing a single image of this composition is not the right solution.
@pixelpoint-io5 күн бұрын
Thank you! I keep getting this question about devs, so I will probably do another video about it :) It feels like neither developers nor designers understand how simple it is to implement. > How you manage the fonts, paddings, margins, border-radius changes depending on the breakpoints? Good point, forgot to highlight it in the video. In the examples shown in the tutorial, you can go even without changing font-size/paddings,margins/border radius on different breakpoints. They will still look fine, in case it much the overall size reduction across other sections of the site. If the font size is 18px, you can simply change it to 16px on mobile devices if you need a more compact version. Paddings can be adjusted slightly from 20px to 16px. You can check examples of bento cards we developed for neon.tech and huly.io on different resolutions.