Surfe - My Framer Site

Back

Surfe

Browser App

Scaled the Browser Extension experience for Surfe, a B2B SaaS product that helps sales teams seamlessly connect their CRM with LinkedIn. As the product scaled, I shaped the evolution of the Browser App and extented the Design System.

Problem

I joined Surfe, a B2B SaaS platform that helps sales teams seamlessly connect their CRM with native environments like LinkedIn. As the product scaled, the core Browser App needed to evolve from a lightweight tool into a comprehensive interface. Throughout my time at the company, I partnered with over 12 engineers and cross-functional teams to drive this transformation — delivering a global rebrand, evolving the design system, and launching more than 30 features across critical workflows.

A look at the legacy Leadjet browser extension

Research

As Surfe scaled, the Browser App needed to evolve without overwhelming the user. Our audit revealed that because the legacy interface blended seamlessly into LinkedIn, users struggled with discoverability and lacked visual cues after installation. This drove our structural strategy: overhaul the architecture for core workflows and design intuitive paths that eliminated friction whilst maintaining a native feel.

A completely redesign of the Broswer app, providing users with more space to manage their credits, subscription, and onboarding progress directly within LinkedIn

End-to-end messaging workflows streamline lead outreach on LinkedIn, leveraging AI-enhanced templates and seamless Surfe integration to optimize the user experience and drive higher response rates

Challenges

The primary challenge was transforming the Browser App into a full-featured SaaS interface whilst preventing user drop-off during the transition. Simultaneously, we faced an aggressive one-month deadline to design, define, and ship a foundational global rebrand. Scaling design output across 30+ new features also required seamless collaboration and rapid hand-offs with a large team of engineers and multiple stakeholders, all whilst ensuring the new interface did not disrupt existing user habits.

To eliminate context switching, Surfe’s template library is directly accessible within LinkedIn’s native messaging interface

A completely new end-to-end team invitation flows streamline the referral process and encourage team adoption

Key Solutions

To address these complexities, I evolved and scaled the existing design system to accommodate the global rebrand and expanding feature set. By establishing a more robust single source of truth, we significantly accelerated the design-to-development hand-off. I led the end-to-end design for critical workflows, defining and launching new capabilities for Profile, Message, Invite, Pricing and more. We also introduced a completely new guided onboarding experience that intuitively led users to their first core action, resolving underlying architectural friction. Furthermore, I fostered a highly collaborative environment by supporting designers and establishing processes, empowering the team to scale its impact.

A glimpse into the design handoff process

Once a contact is added to the CRM, Surfe leverages AI to generate insights to to optimise sales outreach and increase reply rates

Impact

84% new user activation rate, a 2.5x lift 16% drop-off rate, sharply reduced from a 66% baseline 3 mins for time to value 11% increase in user referrals