Etpay — Website Migration to Framer

Etpay is a global financial platform that processed over $2B in 2023. They needed to migrate their corporate website to Framer to modernize the stack, make updates faster for their team, and support a content-heavy structure without losing brand polish.

The challenge: move 20+ pages with advanced visuals and keep everything consistent, accessible and easy to scale.

The main goal was to fully migrate Etpay’s existing website to Framer with pixel-perfect precision. The project needed to maintain the same structure and layout while ensuring every detail aligned with the company’s established design language.

Beyond the migration, the focus was also on preserving Etpay’s premium visual identity while improving overall performance and SEO hygiene. Each page had to feel just as refined as before — only faster, lighter, and easier to manage.

Another key objective was to recreate complex animations and interactive elements in a way that remained maintainable for the long term. This required balancing creativity with scalability, ensuring that visual polish never came at the cost of performance.

Finally, the project included setting up a modular structure inside Framer, allowing the internal team to easily create or duplicate new pages without rebuilding from scratch — ensuring future agility as the company continues to grow.

As a freelance Framer developer, I led the migration end-to-end. I partnered closely with Etpay’s internal design lead to align on components, interactions, and content structure.

Beyond the build, I recommended improvements to information architecture, asset management, and handoff so the internal team could work confidently after launch.

The process began with a discovery and audit phase, where all pages, components, and dependencies were mapped to understand the full scope of the migration. This included identifying SEO patterns, existing URLs, and any redirects needed to ensure a seamless transition.

Next came the architecture stage, where I defined a modular component library, section variants, and tokens for spacing and typography. This created a consistent and scalable design system that simplified updates and guaranteed visual alignment across all pages.

During the build phase, I rebuilt more than 20 pages in Framer, optimizing images and media assets while implementing detailed interaction states such as hover, focus, and error behaviors.

The animation work was particularly challenging, as the goal was to match Etpay’s refined motion language. I used a mix of Framer’s native animation tools and external integrations to create smooth, brand-consistent transitions and interactions.

Once the structure was complete, I moved on to performance and SEO optimization, setting up meta tags, Open Graph data, heading hierarchies, clean URL structures, and a lightweight asset management strategy to improve loading times and accessibility.

Finally, I performed thorough QA and handoff, testing across devices and screen sizes, checking accessibility, and creating a short admin guide to help the client’s internal team manage the site confidently post-launch.

Delivered a modern, scalable site in ~30 days, with a cleaner structure, faster editing, and a motion system that elevates the brand without adding technical debt.

The client highlighted my proactivity (constant proposals to simplify and scale) and the overall smooth collaboration (daily workflow through Figma and calls), which reduced friction and accelerated decision-making.

Framer · Figma · External animation tooling · Structured components & variants · SEO foundations · Accessibility & QA checklist