What are some other UI effects/practices/techniques should I feature?
@EshwarNorthEast3 жыл бұрын
Can u make like all typical animations like slide up and reveal, and all those? From scratch without using any library?
@SantotoLeandro3 жыл бұрын
Hi Gary!! This was awesome! Can you please share that article about the "hack" that you mention in the video? Thanks!
@otazkin29373 жыл бұрын
Modal forms with calendar, time pickers and so on :)
@darklucifer28533 жыл бұрын
Hey I don't know why but on clipping that svg the image just disappeared 😓
@wamukota2 жыл бұрын
You mention an article, that explains why you should use the "0 0 1 1" viewbox but you never linked to it
@hammad-ilyas3 жыл бұрын
Floating head tutorials!
@sidson_aidson3 жыл бұрын
From a fullstack developer...I love these sort of 'cool discoveries' and your channel has been delivering for YEARS (at least for me)! Oh btw, if you hit Ctrl + Alt + F in vscode, it will automatically format your code! I noticed that you hit tab very often!
@andreja1073 жыл бұрын
"The deer is actually right here, unfortunately I cut it's head off " -Gary Simon 2021
@Z3ROR3 жыл бұрын
Counts as a zombie too :P
@dev10shah3 жыл бұрын
gARRY SIMON'S FACE IS ALSO CUT OFF BUT IT IS LIVING
@NBA6Fan3 жыл бұрын
Its head actually got moved to bottom left side
@hossamayman358710 ай бұрын
I just want to say one thing I love you OMG it helps me a lot after 3 hours of searching and you come to save the day ♥♥
@abhishekshukla78033 жыл бұрын
Today, I was searching for how to make a Svg clip path, Thank You it was great help.
@ilyesbrh76673 жыл бұрын
nice closing
@magdasokolovic3 жыл бұрын
I admire how consistent and productive you are with your videos. Each video teaches me so much. Thanks!!
@sonoftroy85723 жыл бұрын
I was actually more interested in the css filter rule and how it applied the shadows
@thepunisher19172 жыл бұрын
Dude, you are a Godsend. Your channel is a goldmine. Thanks for sharing your skills.
@omkarkottawar83093 жыл бұрын
You're the best Gary!!! Keep it up!!
@yahyawiab14233 жыл бұрын
I have so much fun watching your Tuto
@maviniii3 жыл бұрын
You are the best sir, please keep it up!
@ViktorOddy3 жыл бұрын
Got idea for my next vid, thanks 😊
@rahulsbhatt3 жыл бұрын
Your videos are gold🔥🙏
@christian_life3 жыл бұрын
muy buen tutorial, muchas gracias, muy buenos los atributos que utilizaste, no conocía el aspect ratio. por cierto ¿qué le sucedió a tu cabello?... me gustan tus videos.
@Anth-ony3 жыл бұрын
It hurts me when I see people clicking the taskbar to switch between programs. ALT + Tab is your best friend when it comes to switching quickly. Other than that, this video was really cool and inspiring. Think I'm going to test something like this out except with some more complicated shapes. I'm hoping it won't be too difficult. I'm assuming I can't use the aspect ratio thing if I want it to work on all browsers.
@elmalleable3 жыл бұрын
Epic work
@shekishral65703 жыл бұрын
You should probably use more the browser inspect so that one can see live the changes.
@tomaszkumiega43253 жыл бұрын
Hey, can you share link to the article with this 1x1px svg hack?
@strange57003 жыл бұрын
1:12 the dear is actually right here
@belike_fury3 жыл бұрын
Love it 😍
@juanmolinas3 жыл бұрын
Hi Gary!, that's cool!, greetings from Paraguay!
@franktielemans66243 жыл бұрын
I tried to recreate this with another simple shape that I made in Illustrator, scaled it to 1px * 1px and exported it as an svg. I cleaned up the svg and added the defs an clipPath bit, gave it an id,... Wrote the CSS and it didn't work. First thing I noticed when I look at the exported SVG was that the viewbox is not 0 0 1 1 but 0 0 0.1 0.1. Second, I see it exported in group, it has an ID from the layer and even a data attribute (data-name). I deleted all that code, so I only have the path. Also, when I look at your svg I see a transform translate property in the path. Where is this coming from? I don't have that, I only have the path coords in the svg. Strange thing is, when I copy paste your path from the codepen, it does work.
@amankothari2203 жыл бұрын
The same thing happened to me you are right bro
@shreyanshsharma92282 жыл бұрын
Just try using with only by adding id to clipPath tag don't delete anything
@BranGRadio2 жыл бұрын
I tried the viewbox trick with a more complex shape but it ended up slightly cropped on the edges...
@ShantanuAryan673 жыл бұрын
4:08 so that scale factor == size in px ?
@ildikoedit91102 жыл бұрын
I just love that you cut out the eyes and the face of the deer :O Huge fail
@medusiora86953 жыл бұрын
Could you share the article that you talking about SVG file please ? I'm a web developer, That's interesting article. Thanks.
@irfantayyib2 жыл бұрын
If you find it, share it with me please.
@frz_akbar3 жыл бұрын
awesome tutorials
@rattansingh40813 жыл бұрын
You are great boss👍
@sriramsrinivasan49653 жыл бұрын
When is designcourse.com getting released , eagerly waiting
@Tsomimotso3 жыл бұрын
me too but I haven't found any release info yet
@pauljohn38983 жыл бұрын
cool
@akshayvb68543 жыл бұрын
Dope🔥
@kapilxtio33303 жыл бұрын
Awsm
@metelomaniac2 жыл бұрын
Man I was dealing with that in Figma, even if I would set the height 1 and width was less than 1px (constrained proportions) it was being bigger than 1px. Then I just removed "constrain proportions" and set the width and height both to 1px and boom, problem solved!
@anfas1843 жыл бұрын
awesome but too frequent advertisements are killing it
@muhaimincs3 жыл бұрын
Can you do it side by side screen instead of keep switching it
@einfachnurlegendar79473 жыл бұрын
Couldnt this also be done by overlaying those 2 pictures and setting a mix-blend-mode?
@siamekanto3 жыл бұрын
2:59 That's what she said
@pratikkumarraval7673 жыл бұрын
ohhh.....
@mondejarmarron182 жыл бұрын
How can we change the shape of svg using animation?
@sblanz3 жыл бұрын
I'm trying to do something similar but moving the clip-path to css file instead of having that in the html, but I'm having troubles with the centering of the clip-path. Anyone tried that?
@qwerty743 жыл бұрын
Ok this is actually scary.
@oleksandrleskiv3 жыл бұрын
12:14 I though there was going to be a punchline
@doriomer3 жыл бұрын
Gary, first of all thanx for your tuts. But with all the respect, if you can't explain something - it means you dont understad it. Maybe this tut would be better if you make it with a shape that is not the same width and height.
@davidfitcher29533 жыл бұрын
what does the hair say?
@olegkoselev69753 жыл бұрын
Hi I found one issue... there is huge blank space under your design. How to get rid of that? If I use clip-path then svg itself is always place somewhere on the worst palce :D Does anyone has any advice ? Thanks ))
@ze_chooch3 жыл бұрын
I’m not at an editor to test this out, but you can try adding a div around the content, then using flexbox, then aligning the items to center.
@BranGRadio2 жыл бұрын
you can include your svg without pasting it into your HTML with clip-path: url( [path-to-your-svg].svg#your-id )
@Moopse1018 ай бұрын
i can't for the life of me get this to work, so frustrating!
@sushantkunkekar21553 жыл бұрын
First one to comment..you are simply the best
@manwailai78283 жыл бұрын
In my opinion, I will cut off the deer too and move it in front to look better.
@manpatel69843 жыл бұрын
I always use Figma to make stuff like this and then import it as an img. Is that fine??
@opeyemioyekunle15703 жыл бұрын
Image reduces page speed.
@vampirejs7583 жыл бұрын
How are your pets ?
@Arttyor3 жыл бұрын
Why....Why would you use svg for as simple element as box with rounded corners? If you already showing clip-path at least do some unique shape.
@aravindhhere3 жыл бұрын
First comment squad😘😘😘😘
@senior_developer3 жыл бұрын
Flying head
@tailofahippopotamus97753 жыл бұрын
Please put a trigger warning before showing decipitated animals (and Garies)