Facebook’s UI had grown cluttered, inconsistent, and non-scalable. Depth, shape, and spacing decisions were made per-component with no shared rules — accruing visual debt as the app scaled.

Founding designer on the Blueprint team. I led a cross-org design sprint across 20+ designers to redefine the foundations, set the delivery strategy, and owned six design-language elements end to end.

• Scaled the system from 12 → 15 foundational areas (1.0 → 2.0)
• Rebranded Facebook’s design language across surfaces
• First positive metric movement from a design system in FB history

Teams used different corner radii with no unified rules. Rounding wasn’t tied to meaning, didn’t scale to new components, and felt disconnected from spacing and elevation.

I defined a shape language mapping radius to role: circle for identity, fully-rounded for grouped actions and pills, rounded containers for composers and cards, and edge-agnostic full-bleed for immersive media.

• Neutral topline, no regressions on rollout
• Adopted across Facebook with Eng — 700+ tasks solved
• 2.0 adds dynamic corners that reinforce visual grouping

Feed felt crowded and inefficient. The hypothesis: simplifying and modernizing spacing would improve vertical scanning efficiency on Feed surfaces — without losing content.

Reduced vertical spacing from 8dp to 4dp and removed the hairline divider, tightening rhythm while preserving legibility across iOS and Android.

• +0.038% iOS Cap15 Sessions
• +0.18% iOS / +0.25% Android BBR
• +0.35% iOS / +0.5% Android VPVs

Facebook had no depth vocabulary. Color-only controls collapsed on photos and video, every surface handled elevation differently, and there were no shared depth tokens to scale.

Three material treatments mapped to intent — Surface UI (context-first, modal), Standard UI (content-first overlays), and Temporary UI (icon / quick actions) — adopting Apple’s blur APIs into the system.

• Reels: Cap15 Sessions → SS positive
• Photo Viewer: SS wins on interactions & private sharing
• Reusable depth tokens, consistent across surfaces

Profile pages had long, overwhelming lists — scrolling felt endless and heavy, and users rarely updated their information.

Designed collapsible headers with accessible chevron states and smooth motion. When Profile couldn’t launch, I pivoted to Marketplace and PDP to validate — learning that collapsed-by-default hurt, so we shipped expanded-by-default.

• Neutral results, no negative impact → safe to scale
• Profile eng requested adoption on the About Edit page
• Now part of the shared Blocks code library (iOS & Android)

Users fatigue early in horizontal modules and taps interrupt the scroll flow. The bet: “Scrolling is already a gesture — let’s not make people stop to tap.”

Pull to Local Refresh — pull right from the left dead space to refresh the module in place. Pull to See All — pull left from the right dead space to expand into the full view, no navigation away.

• Eliminate tap-to-refresh interruptions
• Surface more content while keeping users in flow
• Increase discoverability & engagement

~75% of Facebook’s users are on Android, where small inconsistencies amplify into global quality issues. Visual noise, gesture conflicts, and iOS designs degrading under Android constraints erode trust.

Declutter & simplify for calmer surfaces, align to cross-platform standards with justification, and design for Android-specific constraints rather than porting iOS.

• Q1 Planning & measurement baseline
• Q2 UXR + design guidance & components
• Q3–Q4 Live experiment, then validation UXR