Designing a responsive, scaleable web system

overview

As Foursquare's audiences and business goals evolved, our website needed to evolve with them. What began as a visual refresh became an opportunity to rethink how we communicated our products, guided users toward the content that mattered, and supported the company's shift toward product-led growth.

I led the redesign from strategy through execution, using the website as a testing ground for a more product-forward visual language and scalable design system that ultimately extended across 10+ pages and the broader brand.

lead designer

Brand strategy, web design, animation, copywriting

Collaborators

Alosha Shkolnik, CD
Yana Belitckaia, Designer
View Context

Designing a responsive, scaleable web system

overview

As Foursquare's audiences and business goals evolved, our website needed to evolve with them. What began as a visual refresh became an opportunity to rethink how we communicated our products, guided users toward the content that mattered, and supported the company's shift toward product-led growth.

I led the redesign from strategy through execution, using the website as a testing ground for a more product-forward visual language and scalable design system that ultimately extended across 10+ pages and the broader brand.

LEad designer

Brand strategy
Visual language
Web design + visual assets
Animation
Copywriting

Collaborators

Alosha Shkolnik, CD
Nathan Miller, Web Ops + Content
View live site

Initial Branding

Foursquare’s 2020 rebrand painted it as fresh-faced, minimalist, bold, and trendsetting. As the branding was put into practice, however, it became evident that there was still work to be done. The new visuals lacked character and substance, not quite communicating the brand’s mission of constructing meaningful bridges between digital spaces and physical places, while the youthful personality missed the mark for our B2B audiences, too abstract and artistic to stand out amongst the competition or draw meaning.

3

months

from design to launch

33

%

reduction in drop-off rate

18

%

increase in scroll depth

27

%

increase in MQLs QoQ

Prioritizing the user journey

Stakeholders wanted a more modern, engaging site that delivered value to users faster. But after analyzing scroll depth, bounce rates, and user behavior, I identified a deeper problem: years of content bloat had buried high-value use cases beneath marketing jargon.

Rather than treating the project as a visual refresh, I worked with cross-functional partners to restructure content around the user journey—bringing the most relevant information forward and creating clearer paths toward conversion.

redesign priorities:

  1. Content strategy
  2. Responsive, WCAG accessible, UX best practices
  3. Bonus: incorporating micro-animations and motion

Prioritizing the user journey

Stakeholders wanted a more modern, engaging site that delivered value to users faster. But after analyzing scroll depth, bounce rates, and user behavior, I identified a deeper problem: years of content bloat had buried high-value use cases beneath marketing jargon.

Rather than treating the project as a visual refresh, I worked with cross-functional partners to restructure content around the user journey—bringing the most relevant information forward and creating clearer paths toward conversion.

before

The initial website lacked a unique brand POV and felt dated. Areas of the website didn't meet accessibility standards nor observe UI best practices, resulting in a clunky user experience. While mobile visitors comprised nearly 50% of web traffic, responsive design was not prioritized.

Without a dedicated copywriter or content strategist, messaging missed the mark and was written with a captive audience in mind instead of providing value up front.

after

We redesigned in dark mode to better appeal to developer and technical audiences and differentiate from competitor marketer sites. The overall look is more modern, and observes WCAG accessibility guidelines + UI best practices for an enhanced user experience.

We examined web analytics to audit content and restrategized the most valuable content for our visitors, resulting in higher engagement and lower bounce rates.

Moving the needle

The solutions

Show, don't tell

As Foursquare shifted toward product-led growth, abstract imagery no longer gave users enough visibility into what our products actually did. I developed a product-forward imagery system that brought real UI and technology to the forefront, helping users understand the product before ever talking to Sales.

I also identified a shared friction across Sales, Product, and Marketing: our products were largely gated behind sales conversations. I championed the adoption of interactive demos, giving prospects direct access to the product experience for the first time in 15 years while creating a reusable demo library for sales and customer enablement.

Turning content into a conversion opportunity

Our blog and content pages were primarily designed to attract organic traffic, but did little to guide that traffic toward the next step. I redesigned the experience around clearer information hierarchy, easier navigation, and more intentional CTAs—turning high-value content from a standalone SEO/GEO resource into another pathway for lead generation.

FSQ Brand Evolution

*pw required*

Swarm App Relaunch

Infographic

Carousel graphics

LinkedIn sponsored post

Drop me a line

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.