In 2011, E.B. Boyd wrote an article for Co.Design about the story behind Facebook’s Timeline feature. She started, “Nick Felton and Joey Flynn shared that when creating a page to tell someone’s life story, you have to throw out the UI rulebook and study how people recount memories.”

This week I’m taking some liberties to re-share her article. It’s not often that you can find a writer who can eloquently (artfully) traverse the tech world. The story is just as relevant now as it was then. Read on and enjoy!

Designers Behind Facebook Timeline: 5 Keys To Creating A UI With Soul

For most of computing history, interfaces have been about function. Word processing programs help you compose documents. Banking websites help you make transactions. Sites like Flickr help you display and share photographs.

But Facebook’s Timeline (the new version of the user profile which is slated to be released to the general public “in the next few weeks”) wanted to do something more: It wanted to convey a feeling. Two feelings actually: The feeling of telling someone your life story, and the feeling of memory–of remembering your own life.

If Facebook had simply had utilitarian goals in mind for its new profile, like “Help me identify what happened in 2008,” designing Timeline would have been simple. It could have created a functional interface that allowed you to navigate your life data in a functional way, allowing you to filter items by time, for example, or by event type or data type.

But Facebook didn’t want to do that. It wanted to create an emotional experience. And as such, the design of the Timeline interface was much more challenging. Nick Felton (he of the “Feltron” annual reports, who joined Facebook earlier this year) and Joey Flynn, a Facebook product designer, tell Co.Design about the decisions they made.

Time Is The Most Universal Framework Across Cultures

One of the primary decisions that had to be made was what the basic organizing framework would be. If you ask someone to tell you the story of their life, Flynn explains, they don’t tell it chronologically (“In 1999, this happened, in 2000, this happened,” etc…). Instead, they talk about moments. So the team experimented with a framework around the important moments in a person’s life: When they got married, for example, or special birthdays.

As Felton puts it, “You gently consume time.”

But they soon realized that wouldn’t scale. Facebook has almost a billion users, spread across the whole world. What constitutes an important moment differs across cultures. “It’s really hard to create a common language around that,” Flynn says, a way so that, if you go to anyone’s profile, you understand how to use it immediately. So instead, Facebook decided on time as the organizing framework. It’s a shell on which users themselves can define what they want to highlight. Controls on each individual item (like status updates and photos) allow users to make certain items larger or smaller, or even whether to include them at all.

Life Feels Like A Stream; Life’s UI Should Too

The amount of data that will get accumulated over the course of a person’s life will be huge. So the team experimented with chopping that all up into specific years. A Facebook hackathon project called Memories, for example, which was accidentally released to the user base briefly last year, did that very thing. Users navigated between various buckets of content by clicking on years.

But that didn’t achieve the effect Facebook wanted. That’s not how we remember our life, Felton says. We don’t remember it in chunks. We remember it as a stream. “I felt strongly that your life should be shown in one long continuum,” Felton says.

And so in the final design, the Timeline appears on a single page. Up at the top, it looks more like a typical Facebook Wall, with recent events called out. But as you start to scroll back in time, fewer events pop out. A slider ticks off the years as you roll back in time, giving you the feeling of time whizzing by. Or, as Felton puts it, “You gently consume time.”

Self-Expression Is About Content, Not Frills

Facebook wanted the Timeline to be a place for self-expression: A way for users to reveal who they are and what their lives are about. The team experimented with giving a users a lot of control over various design elements on the page–different kinds of photo borders, so you could use an elegant border for a wedding photograph, for example, and a sporty one for an action shot.

But the scale problem made that unwieldy. Facebook wants any user to be able to drop in to any other user’s Timeline and immediately understand the visual language and know how to navigate the Timeline. The more control over visual elements they gave to users, the greater the chance that conflicting languages would emerge, thereby degrading the usability across all users.

So instead, Flynn says, Facebook decided to tightly control the visual language and instead give users control over what to emphasize within that framework. Users can’t decide what borders to use, but they can decide which photographs to emphasize, for example, by making them bigger or smaller. “It’s about being personal through the content, rather than being personal through the veneer,” Flynn says.

We Relate To Old And New Experiences Differently

Timeline doesn’t just need to be a place to reflect back to users all the things they’ve already put into Facebook. It also needs to be a receptacle for all the exponentially growing amount of data that users will likely be putting into the system, both actively, as with status updates and photos, or passively, through new tools that allow the system to automatically capture what songs you’re listening to on sites like Rdio and Earbits, for example, or the runs you’ve taken using RunKeeper.

Facebook could simply have given the same weight to each individual event–a song you listened to or a run you took–as it gives other pieces of data, like status updates, and listed them all in the Timeline. But that doesn’t work well over time. Individual songs are interesting in the moment you’re listening to them. But over time, you’re more interested in patterns. So Facebook created a set of aggregations and reports, to let you “find those individual patterns that define your identity,” Felton says. By seeing aggregate reports on what songs you listened to at particular times in your life, you get to see “the soundtrack of your life.”

The Importance of Dog-Fooding

Felton says the main lesson he learned from the experience of designing and iterating Timeline is that “Photoshop lies.” “You can come into a meeting with a very beautiful comp and it’s like, ‘Oh yes, we should do it that way,’” he says. “But you’re never going to know if you can do it that way until you pump in the real data and live with it for days or weeks.”

To make sure they got it right, Facebook released Timeline to its own employees during the development process, to make sure that the paradigms they were developing worked for all users, those with a ton of status updates, for example, as well as those with just a few.

“As a designer, you have your baby that you want to try and sell. To make it saleable, you might pick someone who has really nice photos in their profile and use that to make your mockups,” Felton says. “But you’re ultimately just lying to yourself and the rest of the group if you think everyone’s page is going to look like that.”

About The Author: E.B. Boyd has holed up in conference rooms with pioneers in Silicon Valley and hunkered down in bunkers with soldiers in Afghanistan. Her work has appeared in Fast Company, San Francisco, Elle, Vogue-India, and BusinessWeek.com. She’s reported from the Middle East, China, and Haiti. A story about her first trip to Afghanistan was featured in Best Women’s Travel Writing, Vol. 10. See more at: about.me/ebboyd‍