Role: Lead Frontend Developer & Technical Designer

The Business Problem The agency needed a high-converting CRO (Conversion Rate Optimization) landing page. However, standard Framer forms lacked the flexibility to securely route data directly into their custom CRM pipeline. Furthermore, they needed an aggressive marketing popup to capture leads, but feared that spamming returning visitors would damage their premium brand experience and increase bounce rates.

Instead of relying on bloated, expensive third-party form builders, I engineered a fully native, custom React architecture directly within Framer to solve their operational bottlenecks:

Automated CRM Pipeline (Custom DOM Scraping): I built a secure REST integration that dynamically scrapes form inputs and packages them into a clean JSON payload. This routes leads instantly to their production Railway webhook, eliminating the need for Zapier and ensuring zero data loss.

Protecting Email Deliverability (State-Driven UX): To solve the issue of users ignoring confirmation emails, I engineered a dual-state React component. Upon a successful form submission, the UI instantly morphs into a custom "Success Card" and holds the user on the page for exactly 6 seconds. This guarantees they read the instructions to check their inbox before safely redirecting them, directly improving their email open rates.

Eliminating "Popup Fatigue" (Session-Locked Overlays): To balance aggressive marketing with a premium user experience, I wrote a custom logic gate using browser sessionStorage. The lead-capture modal only triggers after a precise 30-second engagement delay and is permanently locked for the remainder of the session once seen, ensuring returning users are never spammed.

The Result: Delivered a blazing-fast, entirely bespoke landing page that operates as an automated lead-capture machine. The build successfully bridged high-end visual design with complex backend data routing, protecting the user experience while maximizing verified conversions.