Close

Contact me

Message sent. Thanks!
Oops! Something went wrong. Try again.
Contact
H1

Redesigning the Facebook Marketplace Website

H2

Overview

P2
The redesign of Marketplace on Facebook.com solved many problems that had manifested over the years. It aimed to modernize Marketplace by bringing Facebook's new design system, Tetra, to the forefront and was built on top of a new progressive web app tech stack. Marketplace was one of the first products to adopt the new framework and helped influence its future direction.
My Role
Lead designer
Interaction designer
Visual designer
Prototype
Design system
Project manager
Platforms
Desktop web
Mobile web
Year
2019-2020
The old Facebook Classic website
H3

1. Slow

P3

Facebook.com was slow to load when compared to other sites, and people were bouncing. They expected the website to be as fast as mobile, if not faster.

H3

2. Dated

P3

People unanimously agreed that Facebook.com looked visually dated and out of touch with modern website design.

H3

3. Cluttered

P3

People felt the website was cluttered and overwhelming, especially when compared to other websites like Instagram and other competitors.

H2

Problems

P2

Our research team identified 3 primary problems with the old website.

H1

How might we make Marketplace fast, modern, and relevant?

H2

Opportunity

H3

Slow → Fast

P3

The new website should have competitively fast performance by improving Time-to-Interaction and increasing the overall perceived interface responsiveness.

H3

Dated → Modern

P3

The user interface of the website should be visually refreshed and use the new Facebook Tetra design system, which is based on modern Progressive Web App tech.

H3

Cluttered → Relevant

P3

The redesign should make key features easier to find and use, remove underperforming features, and ensure we show the right content to the user across Facebook.

H2

Goals

P2

We converted our key problems into opportunities to solve for during the redesign.

Facebook Tetra Design System
H2

Facebook Tetra Design System

P2

The backbone of the new website redesign was based on the Facebook Tetra Design System. The design system was ported over from the mobile app and built specifically for the website which ensured it was high-performing and supported Dark Mode natively.

H2

Design Iterations

P2

The new website went through many iterations before we had a shippable design candidate.

Design iterations in SketchDesign iterations in SketchDesign iterations in SketchDesign iterations in SketchDesign iterations in SketchDesign iterations in Sketch
H2

Final Designs

P2

The following designs shipped publicly to everyone across the world.

Facebook Marketplace feedFacebook Marketplace notification settingsFacebook Marketplace product details pageFacebook Marketplace location pickerFacebook Marketplace listing composerFacebook Marketplace composerFacebook Marketplace item managementFacebook Marketplace seller profile
H2

Project Launch Results

P2

After more than a year of hard work, we launched the new website.

H2

A Faster Website

P2

The new Marketplace website loads four times faster than the old site.

8 Sec
1.8 Sec

4x

Faster Load Time
H2

Objectively Modern

P2

People have an overall positive sentiment toward the new Marketplace website and frequently describe the site as modern, simple, and improved.

modern updated new fresh current fast cool love great fun future amazing simple easy Enjoy website revived improved better Clean
H2

Less Cluttered

P2

People engage more with the new Marketplace website.

DAP
15%

+15%

Daily Active People
H2

Press

H1

Let’s Chat

P1

I’m currently looking for a new role and would love to chat with you!

Site developed by Aaron James · 2024