Impact

Created design consistency across Facebook Gaming news feed, shortening development time with reusable components

‍

Introduction

Facebook Gaming lived under the Entertainment organization. There were multiple layers of design systems to adhere to: Facebook design system, Entertainment product system and finally Facebook Gaming’s design system

‍

Problem

• With the speed at which Facebook Gaming operated, multiple similar but different components were shipped. This created a perception of inconsistency
• Many components were customized and not adhering to the Facebook Design standards

‍

Goal

To develop a consistent design pattern between Facebook Gaming and Entertainment product system

‍

My role

• Pitched and led entire effort, including building a team
• Created a consistency path for the Gaming feeds to adhere to
• As an Entertainment product systems representative, I added the unique Gaming components into the EPS system

‍

Project goals

Creating consistency:

- Add: Identify and add new design patterns unique to Gaming

- Subtract: Deprecate old and inconsistent design patterns

Shipping it: Help developers to create components to ship the new design standards

‍

Process summary

1. Identification: auditing all feed units
2. Consolidation: mapping components from the feed units to their basic components
3. Standardization: create guidelines for new patterns

‍

Identification

The audit took the form of screenshots of every unit within the Gaming feed and organizing them based on their smallest component: header, content and footer

‍

Consolidation

Consolidation process

‍

Standardization

‍

Solutions

With standards in place, the feed was cleaned up with consistent patterns.