Winnie Yoe logo

Logo

Pinterest brand

Refreshing Pinterest’s brand site to an interactive self-guided brand hub
Prompt
Create a home to tell Pinterest’s approach to their brand in an intuitive and informative manner, as well as inspire a wide array of audiences, and find new ways to showcase the brand.

Outcome
We organized Pinterest’s vast content on their brand site and Figma documents into three intuitive sections — Discover (Brief overview), Learn (Brand guidelines), and Inspire (Gallery & blog) — for audiences of various needs. We also created a highly interactive brand site by combining visual storytelling, smart interaction and motion details, and carefully crafted content.

Role
I was one of three designers on the team, contributing significantly from concept, visual design, prototyping, to creating a robust and well-documented design system. I also audited and consolidated Pinterest brand materials to create a new section explaining Pinterest’s approach to visual narratives.
Product Design · Visual Design · Content

Company: Sanctuary Computer + XXIX



Bold typography, leveraging hover states to reveal visual moments
The homepage is a manifesto of Pinterest’s brand set in big type and glyph. A boot with a list of topics is shown at the bottom of all pages to guide viewers to different Pinterest’s brand elements.





Smart interaction to collapse a large amount of content
On Pinterest’s old brand site, which only hosts guidelines and resources, people often struggle to know where to begin to look since there’s an overwhelming amount of information. We decided to highlight key principles in a series of inset cards while collapsing dense deep-dive content within.



Storytelling through custom interactive modules
On the typography page, I designed a slider controlling font sizes to introduce the Pinterest typefaces and a module powered by Translation API to highlight the typeface’s support for different languages. On the color page, I designed an interactive color palette that allows viewers to easily browse through the vast brand colors and copy RGB, CMYK, and Hex codes for their project.





Grid/List + Filter Toggle
On Inspire landing page and resources pages for viewers who prefer to browse through visuals vs a condensed list, as well as filtering content





Design system
Early on in the project, we realized Pinterest's existing product design system was limited for our project. The brand team also feels it is important to differentiate between the brand site and product sites.

We created a robust and well-documented design system to fit the Pinterest brand team’s various editorial needs and for development hand-off. The system was successful such that the brand team is considering introducing it to other projects.


© winnie yoe 2023