For those of you who haven’t snuck off during work to browse Buzzfeed, an introduction is in order. Buzzfeed is a news aggregation site that collects content from around the web. Some of the news is provided by resident contributors or partner websites, but all of it is filtered by a community ranking system.
The site is one of the top sources for viral and breaking Internet content, and even though Buzzfeed’s editorial eye often settles on celebrity gossip and cute animal photos, some major media outlets are pointing to the site as a breakthrough concept. In fact, the The New York Times paired up with Buzzfeed to provide election coverage for the 2012 presidential race.
The webmasters at BuzzFeed do what most other media sites only dream of doing. They cram a lot of information onto a webpage while keeping it engaging and navigable. In addition to mastering one of the most serious design hurdles for mass media sites, BuzzFeed provides users with an interactive brand experience that keeps browsing fresh and relevant.
By taking a look at the layout and design of this popular blog, it’s easy to see how good design can create a fun, community-oriented experience for readers.
A Diverse Browsing Experience
Buzzfeed offers readers many different ways to browse content, and each information feed is tailored in design with readers in mind. Because each feed is slightly different than its counterparts, a reader is less likely to feel overwhelmed by large amounts of data. By providing a large amount of data with multiple avenues for interaction, readers are more likely to stumble upon a new section or mechanism of the site with each return visit. Fresh content and fresh user experiences make BuzzFeed a pleasure to browse.
Although browsing by topic is by no means revolutionary, BuzzFeed uses its content channels to identify its unique subject matter as well as its target audience.
Note the original categories of “rewind” and “LGBT.”
2. Photo Feed
Users can browse the photo feed by using the arrows or shuffle button. Users can also interact with the feed by hovering the cursor over an image.
3. Main Feed
Featured stories highlighted in the main feed are headlined with a translucent banner. A subtitle is located in a red flag above the banner. The design is simple, yet snazzy.
4. Buzz Labels
Buzz labels are the most unique and brand identifying aspect of the BuzzFeed user experience. By clicking on a Buzz label, users will be routed to that particular “Buzz feed.”
5. Big Stories
Though most of the content on BuzzFeed is curated or generated by an extended community, the “Big Stories” category offers new and important information to readers. These big stories also come with topic labels, another way that BuzzFeed offers a branded user experience.
6. Hot on the Web
Everyone loves knowing what’s popular on the Internet. BuzzFeed keeps this feed simple, eliminating headlines and other descriptive, instead opting for a simple ranking system. The brilliant aspect of this design is that it highlights top stories without giving away too much information. Readers are drawn in by the ranking system and are then forced to click in order to gather more information. It’s a clever design that leaves just enough to the imagination.
A Branded User Experience
1. From the Homepage
The branded user experience begins on the homepage. BuzzFeed uses popular Internet terminology to help readers search for and engage in the content that interests them.
2. Buzz Labels
These labels represent the collective opinion of the BuzzFeed community. In design, these brightly colored circles resemble stickers, making them fun and familiar for new users. Buzz labels are novelties that entice readers to explore and discover new content. If only used as information tags, these labels might lose their value over time. However, by making these labels interactive, the brand experience is woven throughout the entire user experience.
3. User Interaction
At the end of every post, the Buzz labels take on a new, rectangular shape. Users can weigh in with their opinions or see what others are saying about each story.
How you can start your own Buzz
Even if you aren’t trying to push mass amounts of information onto an adoring public, this Buzzfeed case study teaches us a few basic principles of web design.
1. Orient new visitors
The Buzzfeed platform is just as interesting to new visitors as it is to loyal readers. Buzz labels can orient the new reader and keep him from being overwhelmed by large quantities of information. These labels are only effective because they are buzzwords that exist outside of the BuzzFeed website. Most members of the Internet community understand the labels and naturally react to them.
All new visitors need some level of orientation, so take the opportunity to make it a branded experience. Even something as simple as the topics of a menu bar can help new visitors find the right information while interacting with your site in a personal and unique way.
2. Don’t give away too much information
Although news feeds and GI’s should be informative, in order to appeal to different demographics, the design must be adjusted to provide cues that spark a reader’s interest but that leave enough room for curiosity. Curiosity drives the click.
In order to prioritize the information that influences your design, you must first know your readers and A) what type of information and media they are searching for and B) what type of information and media you have to offer. If there are discrepancies between the two, a change is in order.
3. Give your readers control
One of the coolest things about an interactive site is the organic content creation that emerges from a collaborative ranking system. For some sites, this type of interactive labeling is not a logical path. However, there are plenty of ways to show your readers that you know who they are by creating graphics and user experiences that are designed specifically for them.