Figma Shadow Cast Design Tutorial (2021)

all right so let's go so we're gonna rename our project this is basically gonna be about shadows okay that would do then we're gonna insert a frame um the size doesn't matter just make sure to insert that frame then we're gonna change the color a little bit i'm gonna use my favorite light green color something light green almost bluish something like that okay i think that would do then we're going to type in our text i'm going to type in the text shadows all right so mine is actually already a set of segment font poppins size 90 and it's bold just make sure yours is also bold and uh okay so for that we so next we're going to just duplicate this we're going to duplicate it i do that by holding alt all right then i'm gonna right click before i do that there's a plug-in on to make sure you've installed so just go to your plugins browse community and then inside your plugins options here just type the words isometric then click enter as you can see just go to the plugins options as you can see there is a plugin here it's called isometric this will help us out with uh with the direction okay so just make sure you have that installed so i have mine installed i'm going to right click then i'm going to choose isometric right here then i'm going to open isometric all right so inside isometric i'm going to just make sure that your your first your first letters are selected just make sure then you're gonna click on the right side okay and there we go we have our isometric uh format okay then for this next one we're going to change the color to something dark grayish let's try something like that all right this will be fine all right then there's something we want to make sure we do because a shadow can be adjustable what as you can see when i stretch this up and down the text actually does not does not increase in length or something yet a shadow should be able to like uh increase in length and height so what happens is we're going to change this text into a shape so do that by right clicking and then i'm going to click on outline stroke okay so when you outline stroke you can actually see there's actually a change when you pull it it actually pulls out and that's something we want to want that flexibility okay then we're gonna right click then go back to our plugins here isometric open isometric and also we're gonna align that to top right okay so there we go is that our shadow so it's still above the other so we're gonna send it to the back okay then we're gonna adjust it just make sure to adjust it until it actually just fits and looks realistic okay that actually looks fine then we can actually play with its length so the shadow can be as long as we want all right that's actually looking good already oh sorry then we can actually group this group selection we've grouped the shadow together with oh sorry right click both and then right click and then group selection all right so that allows them to actually move together that actually looks better so i'm just going to show you how to also do it using a cube in just a few seconds so we're going to choose the rectangle shape then make sure you hold shift as you enlarge it then we're going to just give this a white color and i'm gonna duplicate it twice okay that actually looks fine then just make sure one side is selected right click and then sorry let me close this then right click go back to your plugins isometric open isometric then we're going to change this i'm going to click on the right option for this we're going to click on the top right option then for this i'm going to click on the side option okay then i'm gonna position them this is gonna be on the left side of this all right it's positioning okay now it actually doesn't look like a realistic cube we're gonna add just some something about it we're gonna give this we're gonna change the white and just make it a little bit darker all right that actually looks much better i'm also gonna make this a little bit uh darker okay that actually looks much better right that's actually our cube right there and then right behind the cube we can actually just place the rectangular shape to actually act as a shadow so this is our rectangle shape right here we can actually rotate it then we can double click on the rectangle shape when you double click on it we can actually adjust different elements inside it just make sure it's actually set to go into the back just click on done actually that looks much better we just want to make sure it actually has the same color as this that actually looks better let's position it properly okay and actually looks like a more realistic shadow okay that's what i wanted to show you in this figma tutorial so if you learned something new just feel free to tell me below in the comments and just feel free to leave a like on the video because it actually helps promote the video and if you're new to this channel encourage join the community by subscribing and then please don't forget to hit the notification bell so that you get updates every time i upload a new video thank you so much for watching i'll see you all in my next video bye [Music] you

Channel: Create Beautiful Things

Views: 11

Keywords: Figma Shadow Cast Design Tutorial (2021), figma shadow plugin, figma shadow spread disabled, figma shadow, figma shadow effect, figma isometric tutorial, figma isometric mockup, figma isometric, figma easometric plugin, isometric drawing practice, isometric exercises, shadow cast effect using figma, cast shadows in perspective, cast shadows using figma, figma 3d shadow, figma long shadows

Id: V5yyUYVZT6c

Length: 6min 10sec (370 seconds)

Published: Thu Dec 16 2021