Пікірлер
@brunsky277
@brunsky277 6 сағат бұрын
Amazing vid, but how do you export these cards to web, as svg?
@nidarahman2305
@nidarahman2305 7 сағат бұрын
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-n6z
@MaximilianoCervantes-n6z 11 сағат бұрын
Awesome 🫰🏻🔥🔥
@khushboobisht705
@khushboobisht705 11 сағат бұрын
Pls make a video of advance website with parallox effects and also animated website
@khushboobisht705
@khushboobisht705 11 сағат бұрын
I want to design an advance website... With parallox effects
@digitalsahara6670
@digitalsahara6670 18 сағат бұрын
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
@specialfriedrice4949 Күн бұрын
Amazing work guys, commenting to boost the video letsgoooo
@KomalTomar-r1m
@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
@kenilpatel5163 Күн бұрын
yess same here, i also faced the same issue
@pixelpoint-io
@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
@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
@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
@porushpuri Күн бұрын
GOATed Content! Thanks for creating this
@specialfriedrice4949
@specialfriedrice4949 Күн бұрын
the junior designer watching this video right now: 👁👄👁
@peretcz
@peretcz Күн бұрын
Thanx for your content, you're doing great job
@im_bk2120
@im_bk2120 2 күн бұрын
Just Amazing!
@mosudrs7608
@mosudrs7608 2 күн бұрын
Make more, I fully support your efforts! And will continue to do it !!
@pixelpoint-io
@pixelpoint-io Күн бұрын
Thank you very much!
@AtomicPixels
@AtomicPixels 2 күн бұрын
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.
@dangers
@dangers 2 күн бұрын
How would you implement it with CSS, won't it be a mess when making a responsive web page?
@TolaFJB
@TolaFJB 2 күн бұрын
How did you add the texture to the number
@MariaRina-km9vg
@MariaRina-km9vg 2 күн бұрын
Form and content are simply excellent. A high level of professionalism is in every corner of this presentation. Thank you
@pixelpoint-io
@pixelpoint-io Күн бұрын
Thank you very much!
@FlowVeeran
@FlowVeeran 2 күн бұрын
huly labs i think is it lottie?
@matheussantos4312
@matheussantos4312 2 күн бұрын
insane edition 🔥
@guilhermeaugusto9541
@guilhermeaugusto9541 3 күн бұрын
can u make a tutorial showing how to export the groups of textures and borders that u applied in the frames?
@otavioalexandre7575
@otavioalexandre7575 3 күн бұрын
Amazing free content, please keep making
@pixelpoint-io
@pixelpoint-io Күн бұрын
Thank you!
@designjayesh7928
@designjayesh7928 3 күн бұрын
Thanks man! For sharing this!
@Gatfullhet
@Gatfullhet 3 күн бұрын
😍
@jmg9509
@jmg9509 3 күн бұрын
Excellent, excellent, excellent. Will be using something similar to this aesthetic for a post
@igordezi3025
@igordezi3025 3 күн бұрын
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
@igordezi3025
@igordezi3025 3 күн бұрын
Alex, this is legendary! Thanks, keep on rolling!
@pixelpoint-io
@pixelpoint-io Күн бұрын
Thanks! Will do!
@rodz
@rodz 4 күн бұрын
GOAT content fr
@MohamedShawky
@MohamedShawky 4 күн бұрын
can u make a slower and more detailed please? new people like will struggle following through this xd
@haythamwali6642
@haythamwali6642 4 күн бұрын
My new favorite KZbin channel. Keep up the great work ❤❤❤❤.
@pixelpoint-io
@pixelpoint-io Күн бұрын
Thank you! Will do!
@abhayrahul482
@abhayrahul482 4 күн бұрын
I really appreciate the tutorial. Thank you. 😊 How do I take this to website? Like how do I optimise this for Framer/Webflow?
@wittywolk
@wittywolk 4 күн бұрын
Great work as always, thank you!
@mariajackson8923
@mariajackson8923 4 күн бұрын
Great video. Well done.
@dariamag1937
@dariamag1937 4 күн бұрын
what is the name of the music playing in the background? :)
@teksdesign
@teksdesign 5 күн бұрын
Thanks
@raasukk4419
@raasukk4419 5 күн бұрын
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!
@simonl9027
@simonl9027 5 күн бұрын
Thank you very much for this tutorial. I'll be subscribing straight away. Quick question: where does the texture you use come from, please?
@SmartPhoneDesigner
@SmartPhoneDesigner 5 күн бұрын
Well You deserved million subs ❤💕💕 hoping for more content on development side Thank you.
@PremKumar-gl2tr
@PremKumar-gl2tr 5 күн бұрын
this video is a chef's kiss 😘👌
@pixelpoint-io
@pixelpoint-io Күн бұрын
Ha-ha, glad you liked it!
@uiuxhpro
@uiuxhpro 5 күн бұрын
Best channel so far on youtube
@afiuza1718
@afiuza1718 5 күн бұрын
Amazing UI but what a nightmare for the DEVs...
@sajjad_aziz
@sajjad_aziz 5 күн бұрын
Valuable content ❤
@bright_moses
@bright_moses 5 күн бұрын
Your channel is a blessing in disguise... am still going through your videos.. planing on watch and replicating every single one.. thank you 😊
@pixelpoint-io
@pixelpoint-io 5 күн бұрын
Thank you! You will become a pro if you do this.
@miraz_kabir
@miraz_kabir 5 күн бұрын
Full breakdown video in slow speed will be more helpful 💝
@ahmeddaud9233
@ahmeddaud9233 5 күн бұрын
Prolly the best UI design channel on the internet
@pixelpoint-io
@pixelpoint-io 5 күн бұрын
Wow, thanks!
@rodnem
@rodnem 5 күн бұрын
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-io
@pixelpoint-io 5 күн бұрын
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.