From Webflow to Framer: How One Designer Streamlined His Workflow and Boosted Earnings

Introduction

The speaker shares his journey from a Webflow‑focused freelancer to a Framer expert, highlighting why he switched tools, how the transition happened, and the role of the Contra platform in scaling his freelance business.

Why the Switch?

• Curiosity & Early Adoption – After seeing Framer’s pivot to “Framer Sites” (2021) and its visual similarity to Figma, he wanted to stay ahead of emerging design tools.
• Learning‑Curve Advantage – Being already comfortable with Figma’s Auto Layout and Flexbox meant Framer felt natural; the transition required only a small learning curve.
• Figma‑to‑Framer Plugin – The plugin let him export designs directly, turning a Figma page into a functional Framer site in about an hour.
• Speed & Animation – Framer allowed faster builds and richer animations (smart‑animate, transitions) without the extra effort he faced in Webflow.

The First Framer Project

1. A previous Webflow client paid ~$8,000 for a site.
2. The client returned a year later with a new project.
3. He proposed using Framer, promising a quicker turnaround.
4. The client trusted him, the site was delivered, and the client loved the added animations.
5. This success earned a testimonial on Contra and sparked more referrals.

Growing with Contra

• All‑in‑One Freelance Hub – Contra replaced Fiverr and other platforms by offering proposal submission, client messaging, payment processing, and portfolio hosting in one place.
• Community Support – An active team and community on social media made the platform feel reliable and engaging.
• Framer Expert Program – After his first Framer site, Contra invited him to apply for the Framer Expert badge, which boosted credibility and led to more client requests.

Workflow Synergy

• Design → Development – Keeping Figma files clean, using Auto Layout, and exporting via the plugin created a frictionless pipeline.
• Design System Experience – His background in design systems and collaboration with developers meant he could anticipate implementation constraints early.
• Reduced Friction – Unlike Webflow, where certain styles required hacks, Framer’s native capabilities aligned better with his design process.

Impact on Pricing & Business

• Higher Rates – After mastering Framer and Contra, he now charges around $2,000 for a simple landing page, a rate he couldn’t command before.
• Diversified Skill Set – The Webflow Masterclass (2021) not only taught Webflow but also helped him become a more independent designer, easing the later transition to Framer.
• Continuous Growth – Ongoing referrals from satisfied clients keep the pipeline full, and the combined use of Twitter for discovery, Framer for execution, and Contra for business management creates a sustainable freelance ecosystem.

Key Takeaways

• Early adoption of tools that match your existing workflow can dramatically reduce learning time.
• Integrating design (Figma) with a development‑ready platform (Framer) streamlines project delivery.
• A unified freelance platform like Contra simplifies client management and enhances professional credibility.
• Investing in foundational education (e.g., Webflow Masterclass) prepares you for future tool shifts and higher pricing power.

Switching to Framer and consolidating freelance operations on Contra gave the designer a faster, more animation‑rich workflow, higher client satisfaction, and the ability to charge premium rates—showing that the right tool combo can transform a freelance career.