Introducing BuzzFeed’s Design Process
Introducing BuzzFeed’s Design Process - BuzzFeed Design - Medium
The word “process” appears 44 times in our roles doc — our reference for evaluating designers — and only increases its prevalence as a designer grows in seniority. So, why is having a unified process important? And, what does BuzzFeed’s design process look like? This post details the shiny new process we recently rolled out and how we’re aiming to increase the chance of our projects unfolding like the synchronized divers below.Our goal was not to enforce a new way of working, but to observe and codify what’s currently effective and create just enough structure to aid communication, clarity and transparency throughout the lifecycle of a project, both inside and outside of the design team.A unified process provides a precise vocabulary and set of expectations to help all involved understand what’s happening and course correct early as a project unfolds — not waiting until there are polished visuals before questioning something more fundamental to the product.A strong design process establishes a shared vocabulary and sets clear expectations to course correct early and oftenThe process behind the process involved plenty of research ranging from user interviews with the team to looking at approaches used in product, consulting and academic contexts. Finding the sweet spot between each led us down the path of two complementary models, one provides a macro-view while the other focuses on the micro-view of a project. While each has its strengths it’s the combination of both that I’m really excited about and that I hope will be most effective at meeting our needs.The Phases of Product DesignPhases provide the macro-view of a design project with a focus on navigating time and clarifying expectations. Whatever stage they’re at designers should have a strong sense of what the remaining phases look like and be able to reflect on what phases they’ve been through so far, both for themselves but also to communicate with others on a project. Adapting quickly is important to how our organization functions so dealing with uncertainty is a reality we need to face. Due to this we choose an approach that highlights known knowns and known unknowns rather than forcing a designer through a specific sequence, or series of gates, ala the waterfall method.There are five phases in the BuzzFeed Product Design Process, which break down as follows:Define — Know the problem and uncover as many constraints as possibleExplore — Generate as many solutions as possible while exploring the problem spaceRefine — Validate which solutions work before distilling down the simplest designBuild — Translate this design into reality through code or specsLearn — Understand whether the design was successful and what needs further workThey unfold over time:A project doesn’t necessarily have to conform to a particular sequence but the goal of reaching Learn as quickly as possible provides a north-star and the flexibility to adapt as the realities of a project unfold after kick off. The scale on the x-axis is variable to fit any sized project, this works as well for a project lasting a week as it does for a 6-month marathon.And here is a project showing a slightly more realistic sequence complete with the loops that each phase is made up of:Note the overlapping phases, out of order sequence and dates on the x-axis, all helping this technique scale to a variety of projects.The Product Design Feedback LoopThe loop provides the micro-view, it’s the atomic unit of our design process. While it also happens over time, time is much less relevant here, the focus is toward deconstructing something designers typically internalize as one fluid movement in order to pinpoint areas for clarity and growth. Think of a tennis coach deconstructing a serve, this is our toolkit for analyzing each component part and helping designers grow their capability across them.Gather input through observation, listening or research.Synthesize this input, identifying where you need to go next and what artifact will help get you there.Make an artifact, using an appropriate tool and level of fidelity.Communicate the artifact you’ve made, through the right channel, to the appropriate audience, to gather further input.Digital product design is such a new discipline that most practitioners have learned through experience, but everyone has taken a different path and some work environments simply don’t require as much explicit communication or synthesis e.g. a solo designer without a team or manager. It’s not uncommon for inexperienced designers to jump to solutions before they’ve fully unpacked and understood a problem, or to fold in all feedback they’ve received because “my peers are smart” without practicing the skill of filtering out input that’s distracting or not inline with the goals of a project. This model provides a shared language allowing others to offer precise feedback, helping a designer grow capabilities throughout the loop.Here’s an example of three loops that could happen during an explore phase.As you can see, this is less of a hard science and more of a tool to reveal blind spots. While this GIF explicitly mentions tools like Sketch, the framework is intended to be tool agnostic.