Navigation & Design Systems

Designing Career Pathways at Meta

Designed and shipped scalable navigation and page systems for Meta Careers; helping introduce a new "Pathways Program" initiative while extending Meta's existing design system across flexible, story-driven templates.


Shipped late 2021 / early 2022. Work shown reflects the experience prior to later Meta Careers redesigns.

Impact at a glance:

Shipped navigation architecture reflcted in Meta Careers evolution

Established clearer entry points into Meta's career pathway ecosystem

Reduced dependency on custom page creation through modular component strategy

Designed scalable templates supporting multiple program types and stories

Role


UX Designer
Led UX strategy, navigation architecture, and page system design for Meta Careers' new "Pathway Programs" initiative.


Responsibilities included:

  • navigation strategy and information architecture

  • UX exploration and interaction modeling

  • scalable template design using Meta's design system

  • wireframing and systems-based page composition

  • stakeholder presentations and iterative refinement

Opportunity


Meta Careers was introducing a new “Pathway Programs” initiative aimed at supporting multiple audience segments beyond traditional students and graduates.


The team faced two primary challenges:

  • determining where Pathway Programs should live within the existing careers navigation

  • designing flexible templates capable of supporting evolving storytelling needs across different programs


The work needed to:

  • align with existing navigation behaviors

  • leverage Meta’s established design system

  • scale without requiring custom page builds for each new initiative

Product Focus — Career Pathways


Designed a scalable navigation and content system helping users discover and explore Meta’s career development programs.


The experience included:

  • navigation entry points

  • landing page templates

  • detail page templates

  • reusable modular content structures

Problem Definition


Meta’s existing careers navigation had established interaction patterns and user expectations.


Introducing a new category into the ecosystem created several challenges:

  • determining the most intuitive navigational placement

  • balancing discoverability with simplicity

  • extending the navigation without disrupting existing behaviors

  • creating flexible templates using a constrained component library


The solution needed to feel native to Meta Careers while supporting future scalability.

Solution Overview

Designed a scalable pathway system consisting of:

  • integrated navigation architecture

  • modular landing page templates

  • flexible detail page templates


The system leveraged Meta’s existing design system and component library to:

  • maintain consistency across the Careers ecosystem

  • support evolving storytelling needs

  • reduce implementation complexity

  • enable reusable layouts across multiple programs

Experience Overview

The experience enables users to:

  • discover Pathway Programs through existing navigation structures

  • explore program categories and opportunities

  • navigate between overview and detail experiences

  • access relevant application and career entry points

Key Design Decisions

Navigation grounded in existing user behavior
Analyzed Meta Careers’ existing navigation patterns to ensure new functionality aligned with established mental models.

Embedded vs. standalone navigation exploration
Explored multiple navigational approaches balancing, discoverability, clarity, interaction complexity, and consistency with existing patterns

Design-system-first execution
Worked entirely within Meta’s existing design system and component library to ensure implementation efficiency and ecosystem consistency.

Modular page system architecture

Designed flexible templates capable of supporting multiple storytelling structures without requiring new page designs.

Nested navigation interaction model
Introduced a nested interaction approach to better group and distinguish Pathway Programs from existing content categories.


This provided:

  • stronger organizational clarity

  • dedicated exploration space for Pathway Programs

  • scalable expansion opportunities for future content

Navigation Exploration

Existing Navigation Analysis

Mapped existing navigation behaviors and interaction models to identify the most scalable placement opportunity for Pathways Programs.

Navigation Concept — Embedded Approach

Explored integrating Pathway Programs directly within the existing Facebook Life navigation structure.


Benefits

  • Immediate visibility

  • Minimal interaction change

  • Lower learning curve


Tradeoffs

  • Reduced contextual clarity

  • Potential discoverability ambiguity

Navigation Concept — Nested Navigation

Explored a nested navigation interaction introducing a secondary exploration layer for Pathway Programs.


Benefits

  • Clearer grouping and hierarchy

  • Stronger distinction between content areas

  • Better scalability for future expansion


Tradeoffs

  • Introduced a new interaction behavior

  • Increased interaction depth


The nested navigation approach was ultimately selected and shipped.

Template System Design

Landing Page Template (wires, left | in-prod, right)

Designed to:

  • provide program overviews

  • surface exploration pathways

  • support flexible storytelling structures

Detail Page Template

Designed to:

  • support program-specific storytelling

  • highlight opportunities and application pathways

  • maintain flexibility through modular component composition

Considerations & Constraints


  • Limited timeline and budget prevented formal usability validation

  • Needed to work entirely within existing Meta component ecosystem

  • Navigation changes required balancing innovation with familiarity

  • Templates needed to support evolving program content over time

Research & Validation Considerations


While formal testing was constrained by timeline and budget, the proposed validation plan included:

  • usability testing

  • tree testing

  • navigation discoverability studies

  • A/B testing against existing navigation patterns


Design decisions were guided by:

  • existing platform behaviors

  • information architecture best practices

  • mental model consistency

Outcome


The nested navigation solution was selected and shipped as part of Meta Careers.


Following Meta’s broader Careers evolution, the organizational structure of the navigation evolved further, but the foundational interaction patterns and grouping concepts established during this work remained reflected in later implementations.


The modular page system also enabled scalable expansion of career pathway content without requiring custom page redesigns for each initiative.

Reflection


This project reinforced the importance of designing within established systems—balancing user expectations, scalability, and platform consistency while introducing entirely new content structures.


Rather than designing isolated pages, the challenge centered around extending an existing ecosystem in a way that felt intuitive, scalable, and native to the product.