#3 Why (and why not) Framer?
Insights from a Designer, Developer, and Product Manager
Framer is quickly becoming a favourite for non-techies, especially designers familiar with tools like Figma, who also want to build their designs. But is Framer the right tool for your next project? Let’s dive into what makes Framer great and where it might fall short.
Why Framer is a Designer’s Dream 🖌️
Framer simplifies web development for designers, turning the process into an intuitive, visual experience that feels more like working with Figma than traditional web development tools.
One of Framer’s core strengths is its canvas-based approach. You work with three separate canvases—one for mobile, one for tablet, and one for desktop. This means you’re not bound to strict web development principles like flexbox or grid. Even if you’re unfamiliar with the nuances of CSS, you can still create a fairly responsive website just by arranging elements on each canvas, similar to how you would in Figma.
However, if you invest a little time in learning basic CSS concepts like flex, grid, and positioning, etc., you can elevate your Framer projects into fully responsive, professional-grade websites.
Variations: A Designer’s Secret Weapon
Another game-changing feature in Framer is variations, which designers can relate to Figma’s smart-animate. Variations allow you to define different states for a component and link them using triggers—no coding required. This opens the door to creating dynamic, interactive websites, making the platform ideal for designers who want to experiment with animations and state transitions without diving into JavaScript
Security, Hosting, and Community Support
Beyond design flexibility, Framer takes care of the technical side of things, including security, hosting, and performance optimizations, so you don’t need to worry about setting up servers or managing security protocols.
Framer’s growing community is another huge advantage. There are plenty of free and paid resources available, and if you ever hit a roadblock, the community has your back. Framer University, created by the highly respected Nandi Muzsik, is one of the best learning hubs for Framer. Nandi’s tutorials have set industry standards, with many of his design ideas becoming staples across modern websites. The quality and quantity of free resources make it easier than ever to get started.
Collaborative Magic with Copy-Paste Features
Another attractive aspects of Framer is its ability to copy components from other developers and directly paste them into your project. There’s no need for complex integrations or dependencies—you simply copy and paste the element into your canvas, and you’re done. This opens up endless possibilities for quick prototyping and feature integration.
Why Framer Might Not Be for You 🚫
While Framer has many strengths, it’s not without its limitations. The platform is ideal for small to medium projects, but when it comes to more complex use cases, you might hit a wall.
Lock-in and Scalability Issues
Framer’s pricing structure can become prohibitive as your project grows. While the initial cost is manageable, features like limited page publishing, limited CMS collection and restricted traffic quickly add up. The more traffic your website receives, the more Framer will charge you—making it less cost-effective for scaling businesses.
One glaring issue is the need for additional expensive add-ons for tasks that should be simple. For instance, if you want to link a sub-url or canonical URL (e.g., framer.com/form) to an external webapp like a React form hosted elsewhere, you’ll need Framer’s custom AJAX add-on, which costs a staggering $350 per month. To use it, you must first subscribe to Framer’s enterprise plan. Even then, you’ll need third-party services like Cloudflare to manage the integration. It feels like Framer is charging a premium for solving a flaw in its own system—a flaw that costs as much as running a mid-sized SAAS application!
Limited Complex Integrations
If your project requires heavy interaction with external applications or APIs, Framer’s limitations become more apparent. It’s not built for handling complex, large-scale applications or projects that rely on external data or high-level integrations. Developers may find it frustrating to work around these limitations, and the costs quickly spiral out of control.
Conclusion: Is Framer Right for You? 🤔
Framer is perfect if you want to get started quickly and don’t want to spend months learning to code. If you’re a designer or creative thinker looking to launch a small website or MVP, Framer will help you get the ball rolling. Its intuitive interface, community resources, and focus on design make it the best option for people who want to build without diving too deep into the technical side of things.
However, if you’re building something complex that requires advanced integrations or the ability to scale without exorbitant costs, you may want to consider other platforms like Webflow or a custom-coded solution. Framer still has a lot of work to do to meet the needs of larger, more complex projects.
For smaller websites, landing pages, or personal projects, Framer is a fantastic choice. But for bigger ventures, it might be worth exploring other options.
Tools I Recently Discovered 🔧
Here’s a quick roundup of tools that I’ve come across this month:
Frameship: Frameship allows you to build a Framer-based e-commerce frontend using Shopify as the backend. It’s a Shopify plugin that lets you design and publish your Shopify store using Framer’s intuitive website builder. Sync Shopify with Framer and build faster than ever before. Check Frameship →
Framer Commerce: Looking to add e-commerce functionality directly to your Framer site? Framer Commerceintegrates powerful e-commerce features, making it easy to manage your products, process payments, and handle orders without leaving Framer. A great solution for those who want to create visually stunning, functional storefronts. Check Framer Commerce →
Tolstoy: Tolstoy helps you create shoppable videos that capture your customers’ attention and boost conversions by integrating video feeds and stories directly into your e-commerce website. You can import videos automatically from TikTok, Instagram, and Google Drive, and tag products to create a seamless in-video shopping experience. Check Tolstoy →
I hope you are 👍🏻liking my newsletter, please help me achieve the 🎯goal of “Empowering 💡💡thinkers to become 🦺doers“ by spreading a work about this newsletter.
Ask the Readers 💬
What do you think about including detailed tutorials as separate blog posts? Does it keep the newsletter more concise, or would you prefer everything in one place? Let me know!
Also, I’m considering launching a new service—monthly design subscriptions for startups. Clients would get access to a full design team, with unlimited revisions, starting at $4,000/month. Would you subscribe to such a service? Share your thoughts!