BuzzFeed’s Product Design Principles
And how we got here
The Product Design team here at BuzzFeed has spent the last couple years polishing up our tools and revamping processes — and it’s been rad. But our improvements in some areas have illuminated other rough patches. One of those rough patches: designers didn’t always seem to be following the same guiding principles when providing critique or making decisions on our own design work.
When sharing work in critique or Basecamp, the feedback would often sound a bit like this:
Designer A: I prefer option A because it’s really fun.
Designer B: I don’t know, I don’t like fun.
Designer C: Do we care about it being fun?
Designer B: I don’t know, it doesn’t seem… BuzzFeedy?
Being people with emotions, we can’t possibly avoid these types of conversations altogether, but we thought we could avoid some of them if we had a shared understanding of what we care about most in our products.
Our Product Design Principles
I’ll explain a bit about the process and path forward, but for those looking to cut to the chase and see them, here you go:
Delight with speed.
Use design to make our products feel fast and responsive.
Keep it fresh.
Use bold, high-contrast designs to bring focus and clarity to key actions or information, and to represent BuzzFeed’s youthful brand.
Know the goals.
When designing, whether in sketches, wireframes or multiple high-fidelity options, our work should always reflect the product goals.
Consider the ecosystem.
Design modules and write copy with an awareness of all the places they may show up, as well as which types of BuzzFeed content they may appear with.
Design with the platform.
Balance native platform elements and patterns with BuzzFeed’s own design patterns and content. Our products should behave natively, while remaining uniquely BuzzFeed.
Advocate for our users.
It’s our responsibility to understand our users’ needs, as well as to advocate for them with our teams and in our work.
Pair simplicity with delight.
Design purposeful interfaces that favor usability, while also infusing delight through color, animation and language.
Design for scale.
Design with an eye toward the future of our products. Value flexible, scalable designs that can quickly evolve alongside our content.
Learn, learn again.
Know the data surrounding your product well enough to discuss, describe and deeply inform your design work. Constantly validate your ideas through A/B testing or qualitative analysis.
The process
The goal
The primary goal of these Product Design principles is to establish a set of values to help inform our work, and serve as another tool for decision-making during the design process. Our hope is that with these in mind, our growing team can make faster, more consistent product design decisions that work for BuzzFeed.
Generating ideas
After taking a look at what other designers have done in this space for some inspiration, I facilitated note and vote sessions with members of our Product Design team. The first session, focused on user experience, attempted to answer questions like:
- What do we most value as product designers at BuzzFeed?
- What is unique about how we think about the user experience at BuzzFeed?
The second brainstorm centered around brand and visual design and focused on:
- What makes a BuzzFeed product look and feel like BuzzFeed?
- What is unique about BuzzFeed’s brand that we should strive to visually express in our products?
I used the “note and vote” brainstorm technique because it’s a great way to get everyone in the room to share their thoughts, no matter how introverted they may be. Each participant gets their own paper, pen, and a few minutes of silence to brainstorm and then edit. As facilitator, I then called on each person and asked them for their two top ideas and did some notetaking. After reading out the results, we then took turns selecting a favorite.
These sessions were really enjoyable and enlightening. While we all had different interpretations during the note portion, our votes all gravitated toward the same general themes. That alignment put us in a great spot to take the next step in the process…!
Creating pithy catchphrases
Next up was a lot of editing! I chunked up the brainstorm output into some themes, and started elaborating on them:
Tom and I took the early versions of my working doc to critiques and secretly did some test drives to see if they were useful. They seemed to be!
However, while the principles worked in practice, we were still thinking of brand and user experience as two separate things (in two separate documents), when in practice a product is both of these together. Duh. Our intrepid VP, Cap, wisely pointed this out and quickly course-corrected.
After weeks of wordsmithing, I presented our proposed principles during a design offsite to get another round of feedback, as well as to our product management team to see if they resonated with them. And a few more tweaks for clarity later, here we are.
What now?
A few members of the Product Design team are taking this as an opportunity to flex our graphic design muscles and design some artifacts to physically showcase our principles.
On top of being eye candy, we’ll be hanging posters in the office, sticking them on laptops, and tucking them in notebooks as reminders of what we care about. The hope is that they give us language to ground our critiques and decisions in, but we fully recognize them as a work-in-progress and expect them to evolve over time as our team, our products and our needs grow and change. Some things we hope to see happen as we roll these out:
- It’s easier for an individual product designer to pick between divergent design directions
- Other members of our teams (product managers, engineers, etc.) have a shared language for giving feedback on Basecamp, Slack, or IRL
- Outside of using shared components or styles, our design artifacts share a basic sensibility and feel more consistent
High hopes, I know! We’ll see how these principles perform across the whole team in the coming months and, as with everything, learn, revisit and iterate.
Do you think design principles might help your team?
Check out a few of the resources we referenced throughout the process:
- Design Principles FTW
- Facebook’s Four Business Design Principles for Crafting Elegant Tools
- Facebook Design Principles
- Government Digital Service Design Principles
- Material Design
- Note-and-vote: How to avoid groupthink in meetings
And of course, please reach out in the comments with questions or thoughts!
