Figma to Framer Tutorial (Real Client Website)

Описание: In this video I teach you how to turn a Figma mockup into a live Framer website! You will learn the difference between Frames, Containers and Stacks and when to use what. I also will share how to set up an efficient CMS page.

Check out Framer here: https://framer.link/meganweeks2026
Get a FREE month of Framer Pro with code: MEGANWEEKS2026

0:00 introduction
2:15 design style set up
5:25 header & footer
9:35 button component
10:55 frames, stacks & containers
15:15 CMS set up
23:00 final website

Join the Patreon community here for weekly exclusive graphic design tutorials and to connect with other creatives!!!
use code: YOUTUBESUBS for 15% off:   / curatedcollectiveco  

---------------------------------------

// WHERE TO FIND ME //

join my community or take my courses:
https://curatedcollectiveco.com/

instagram:
  / meganweeksdesign  

pinterest:
  / meganweeksdesignco  

online portfolio:
https://meganweeksdesignco.com/

collaboration or business inquiries:
[email protected]

---------------------------------------

// MY FREE GRAPHIC DESIGNER RESOURCES //

GET THE FREE WEBSITE DESIGN PROCESS GUIDE HERE:
https://view.flodesk.com/pages/6333c1...

PRE-WRITTEN EMAILS FOR YOUR GRAPHIC DESIGN BUSINESS:
https://view.flodesk.com/pages/643820...

WEBSITE IN A WEEK PROCESS GUIDE:
https://view.flodesk.com/pages/64c0bb...

BRAND DESIGN ROADMAP:
https://view.flodesk.com/pages/645bf9...

FREE LOGO DESIGN QUESTIONNAIRE:
https://view.flodesk.com/pages/63edbe...

PROJECT MANAGEMENT WORKFLOW:
https://view.flodesk.com/pages/64aefc...

HOW TO GO FROM HOURLY FREELANCER TO TRUSTED DESIGNER
GET MY FREE TRAINING VIDEO 💥
https://view.flodesk.com/pages/62f402...

---------------------------------------

// TAKE MY COURSES //

LOGO DESIGN: SIMPLIFIED
https://courses.curatedcollectiveco.c...

DUBSADO DECODED: PROJECT MANAGEMENT
https://courses.curatedcollectiveco.c...

GUIDE TO: LANDING GRAPHIC DESIGN CLIENTS
This course has 5 video led modules, a downloadable e-book and you will be able to join my community as well 💕
https://meganweeksdesignco.thinkific....

✨ WordPress Website Design Course ✨
https://meganweeksdesignco.thinkific....

✨ Custom Branding Process Course ✨
https://meganweeksdesignco.thinkific....

NOW OFFERING BRAND + WEB DESIGN COURSES IN A BUNDLE 💥
https://meganweeksdesignco.thinkific....

---------------------------------------

// OTHER HELPFUL LINKS //

Join my email list for more helpful design tips:
https://view.flodesk.com/pages/61eed0...

LIKE MY EMAIL STYLE?! JOIN FLODESK FOR 50% OFF
https://app.flodesk.com/sign-up?ref=8...

GET DUBSADO (my project management system):
https://www.dubsado.com/?c=meganweeks

SITEGROUND (my favorite website hosting for WordPress):
https://www.siteground.com/go/meganwd...

---------------------------------------

I do make a commission on some of the links in this description box. Thank you so much for the support.

#graphicdesign #framer #webdesign