Social Pattern Library

As a UX design intern, I helped create the Social Pattern Library, which is a collection of design patterns aimed at reducing harassment and improving safety across social platforms. I designed user flows, as well as refined and expanded the design system for clarity and scalability. The library has since been cited in media and congressional testimony, underscoring its real-world impact.

As a UX design intern, I was tasked with designing the UI for 25 patterns in the library that could guide teams in building more humane, consistent experiences across social media platforms.

UX design:

• Designed flows and interfaces for 25 anti-harassment patterns.

Components library expansion:

• Identified that the existing design system was strained, so I proactively revised it, which improved clarity across multi-step tasks, reduced modal overload, and enhanced contrast between core interface pages.

My process for designing each pattern:

• Defined the anti-harassment goal and user context
• Researched how existing platforms handled the issue
• Designed UX flows that reduced friction and confusion
• Iterated based on feedback from policy experts and the design team

My process for designing each pattern

The library became a coherent, scalable framework for policy-makers and designers to reduce online hate.

Multi-step tasks & modals

• Before: Multi-step tasks were all made using pop-up boxes, which made the tasks difficult to follow.
• After: I redesigned all multi-step tasks into pages with clear back, next, and exit options for clarity and consistency.

Modal consistency

• Before: Too many types of pop-ups and modals caused inconsistency and confusion in task flows.
• After: I reduced pop-ups and modals to only 3 types so they are easier to understand and don't distract from key features.

Interface contrast

• Before: There was little contrast between core interfaces such as Feed and Post, which made it difficult for the viewer to tell where in the social media platform the UX patterns were being implemented.
• After: I added more contrast between the core pages so viewers can easily differentiate the interfaces. I also created a layout for settings and menu interfaces, which didn't exist prior.

Before: little contrast between Feed, Post, and Comments

After: differentiated core pages, plus the new Settings & Menus layout

The library was featured in news articles and cited in ADL's testimony before the House Committee on Homeland Security in October 2022:

"Platforms must implement recommendations found in ADL's Social Pattern Library and build anti-hate by design principles into their products."

I created an ecosystem map of the Social Pattern Library to visualize its stakeholders and influence.

Ecosystem map of the Social Pattern Library's stakeholders and influence

This has been one of the most interesting and most difficult-to-explain projects I've worked on. Explaining UX frameworks that mitigate hate and harassment on social media is not the easiest thing to do when you first meet someone :)

However, through this project, I found my passion for systems design and an interest in finding causality and order within complex systemic issues. My internship was extended for 5 months to continue working on the Social Pattern Library, and I hope to take on more projects similar to this!