speedy figma to framer portfolios!

one of the most popular questions I get is where should I build my portfolio and personally I find that framer is a good one to consider if you don't want to code and you also want to highly customize your portfolio today I'm going to show you how you can take a design from figma and Port it over to framer super fast so here I have a casity that I designed all in figma I'm going to go ahead and import it over to framer so I'm going to select this Frame and then I'm going to go to my plugins and select figma to HTML with framer you notice how it's copying all my layers okay so now that I am in framer I can go ahead and do command B to paste my Design Within framer like this it might take a second notice how my design is cut off and so in order to fix that I can go ahead and click this Frame and then hit fit content like this so that it magically fits all the content within my page next I'm going to make my phone screen work so notice how it's really cool it already has ported over to the right side but the proportions aren't quite right and so in order to do this I'm going to set the width of this case study layer to be Max of 100% I'm also going to do that for this layer in here as well Max of 100% so notice how it's almost there but the text in here is not fitting within the area and that's because I need to set the text so that it's all filling the container unfortunately this currently does not pour over directly from figma but that's okay it doesn't take that long to go through and change these different elements to all be fill you can also select the elements within your layers on the left side and it might be a little faster so notice here how now most of my layers are within the frame that I have so let me check this one so this one is Phil and so now if I want to publish this as a website all I have to do is hit publish up here on the top right and then because I published this before it says update I'm going to go ahead and hit update and now when I open up this link you'll notice I have my website like this which is pretty cool and I can also adjust the size like this and you notice that it works for mobile sizing so hope you try it out I thought this was pretty cool and it's a really great way to put together your portfolio really quickly

Channel: Elizabeth Lin

Views: 1,543

Keywords:

Id: BGgyU3IKh80

Length: 2min 12sec (132 seconds)

Published: Wed Jan 17 2024