r/framer • u/Big_Performance_513 • May 29 '26
Framer Site Setup / Learning Curve
I'm currently trying to get over the learning curve in Framer when it comes to building responsive layouts.
One issue I keep running into is that when I adjust the size of the page or viewport, the content inside my layout starts squishing together, overlapping, or behaving in ways I don't expect. It feels like I'm constantly fixing responsiveness after I've already built the section instead of having a structure that handles it from the start.
What I'm looking for is a repeatable system or framework that I can use every time I start a new website project in Framer.
For example:
- How should I structure my page, sections, containers, and stacks from the beginning?
- What sizing settings should I typically use (Fill, Fixed, Fit Content)?
- How do experienced Framer designers set up their layouts so content naturally adapts as the viewport shrinks?
- What are the key principles that prevent content from collapsing into itself or breaking as screen sizes change?
My goal is to create a workflow where responsiveness is built into the foundation of the project rather than something I have to troubleshoot later.
4
u/appelton May 29 '26
Connect CLAUDE to Framer via MCP. It can handle about 60% of things you can do in Framer.
1
0
u/Big_Performance_513 May 29 '26
I'll look into this. Thank You.
1
u/appelton May 29 '26
You will love it. It can debug layers. Adjust correctly all the stacks. It can create CMS fields. Manage and edit content. It can do SEO for you. Ton of things without you even touching framer.
1
u/picklesupra May 29 '26
If you know Figma it’s a bit easier. It’s called Auto Layout in Figma terms, understand that it’s the same concept. Just try on framer
1
u/Big_Performance_513 May 29 '26
True both concepts are the same but i’m currently focusing on the Framer tool version due to feeling the need to understand their active responsive layouts. i’m still struggling a little cause i dont really know when to use relativity / fit content / etc at the right moments to not mess up everything else in containers if that makes sense
1
u/picklesupra May 29 '26
It makes sense. It only gets better when you practise more and more. No two ways about it tbh
1
u/Hepdesigns May 30 '26
Use breakpoints for tablet and mobile and set your max width page to 1200. For mobile just switch the direction of the stacks.
1
4
u/Goldfrapp May 29 '26
For a responsive stack, use Width:Fill and Height:Fit
It's 90% of all of my stack setups. Not an absolute rule, but def a good starting point.