Co.Design

The Unsung Product Minds Behind Facebook Home

As Facebook’s engineers worked on its new “family of apps,” another team spent three months designing a way to explain it to the world—and that, in turn, helped craft the product.

Facebook Home isn’t quite a phone, though it will soon be preinstalled on one. Nor is it quite an operating system, despite changing how phones operate. And though it will be available for download in the Google Play store, it’s not really an app either. “It’s an Android Integration,” says Facebook Communications Designer Nick Kwiatek. “What it literally is, an integration with Android, is really jargony and technical.”

As part of a team that created Home’s homepage, Kwiatek began translating that jargon for Facebook’s one billion users in December, back when Home’s prototype hadn’t yet been loaded onto test phones and its creators referred to it as simply a “homescreen replacement.”

During the process that turned "homescreen replacement" into "Home: a family of apps," collaboration between engineers, designers, and content strategists assigned to the project’s communication and product teams didn’t just create new jargon; they, at times, influenced the product itself.

“We share ideas," says Skyler Molen, the designer who worked on Home’s homepage. "Sometimes it means we need to change how we’re thinking about talking about the product, and we go back to the drawing board. Sometimes it means that, Oh, this actually reveals facets about this product that we’re not emphasizing enough in the product or we’re emphasizing too much in the product.’”

The communications team, for instance, found it difficult to explain that a users’ profile photo doubles as a navigation button, so the product team built in a tip that explains how the feature works. Meanwhile, because the tutorial for a double-tap-to-Like feature seemed awkward in the product, the communications team instead featured the action throughout its marketing efforts. Deciding which features best explain the experience helped indicate which of them should take priority in the product. "Exploring these ideas help us discover which features and actions of the product are most important for launch," Molen says. "It’s happened with this product. It’s happened with past products. It’s really part of the process."

As the product team refined Home’s experience, the communications team designed its narrative—which, at times, can be equally important. For many Facebook users, Home’s homepage will be their first interaction with the product. It had to explain not just that home was “a family of apps,” but what, exactly, that meant.

“What is Chat Heads? Would you download an app for Chat Heads?” Kwiatek says. “Sometimes these individual features, when examined on their own, it’s hard to talk about them in a way that is actually what they feel like when you use them, that has the same coherence. The whole idea is that these things work together. And that’s why in the marketing we had to establish what this thing is in a holistic way."

At first the team had planned to emulate Home’s features in an interactive module. But Home has touch-based features like chat heads that users can pick up and move around the screen. Its design breaks a fourth wall that doesn’t shatter as easily on a desktop browser, and its capabilities are difficult to emulate within a web page.

Instead of replicating Home on the web, the product’s explainers decided to separate Home’s feeling from its features by opening the home page with a video. In the montage of smiling young people, scenes of friends cooking and eating together split time with demonstrations of friend interactions on Home. It ends with something that looks like a secret handshake.

“When you’re talking about a project like this, you have to establish what it is immediately, and that is what the video achieves because it shows the product and it shows people using it,” Kwiatek says. “And through that, it communicates a sense of feeling. Once we establish that, we can start talking about what it actually is, the features that come together to create the experience.” Below the video, the team built simulations and wrote short descriptions for each feature. Depending on which section a user scrolls to, they’ll see a story slide show, notification pop-ups or a chat heads message ping on an image of a phone. Kwiatek coded the page in the same war room where the product’s creators were working out its final touches.

The resulting homepage is essentially a mini product that explains the bigger product.

“I heard something interesting about New York Times engineers,” says Molen when I ask him about creating an echo product. “They refer to them as journalists. Because their process is journalistic…[similarly], In a way, you could think of us as doing product design in our own way. The distinction is that the goal for a product designer is the experience. Our goal is message. But in the way, it’s the same process.”

Add New Comment

0 Comments