30+ Examples of Facebook timelines

Over 500 million people use Facebook worldwide. It’s no wonder companies and brands are keen to make an impact using the social networking site with their respective pages.

The new Facebook Timeline feature has been rolled out over the last few months for both profiles and pages. New features include space for a large photo at the top of the profile and a new layout for the ‘wall’.

As more and more people use Facebook it is becoming more important than ever for companies and brands to maintain a well-crafted presence on the site by keeping up to date with the latest changes and adapting as necessary.

Here is a roundup of some of the best Facebook Timeline Profiles from a range of companies.

Facebook

Facebook’s own timeline features a map of the ‘interconnectedness’ of Facebook users across the globe. A very interesting photo to look at which draws you in.


Ekkapong Techawongthaworn

Ekkapong Techawongthaworn’s timeline has an amazing design; the seamless integration of the cover photo and profile picture is great. It’s simple but very effective.


Mighty Deals

MightyDeals uses a great looking mascot and the price tag from the logo with a color scheme which works really well.


Microsoft

Microsoft uses one of their advertising images as their cover photo and leaves the branding for the profile picture, which again uses an orange theme throughout.


ABC

ABC uses a timeline as their timeline cover photo with reference to what they do. The logo looks good as the profile picture, too.


ABC News uses a big cover photo of their staff which looks great and the overall feel of the timeline is great; the cover photo works especially well.


Red Bull

Red Bull’s timeline features an amazing cover photo that stands out from many other timelines.


Coca Cola

Coca Cola is a leading world brand and their timeline design reflects this. There’s a great cover photo and a very simple profile picture that looks good.


Coldplay

Coldplay’s timeline is great. The colors used in the cover photo’s design makes it attractive and adds something extra to the overall timeline.


BBC

The classic BBC Apprentice show’s timeline uses a great cover photo. It’s a shame that the logo isn’t correctly sized for the profile picture though as this detracts from the page as a whole.


The Eastenders page uses a classic image of The Queen Victoria making it instantly recognizable as the Eastenders page.


The BBC’s The Real Hustle timeline features a large image of the hustlers with the new TV logo as the profile picture. It looks great and makes good use of the cover photo feature.


Design Art

Design Art takes a minimalistic approach to their timeline with a great cover photo. The color scheme is really good and is used throughout.


Sky News

Sky News have managed to join the profile picture with their cover photo creating a very nice effect with fluidity between the profile picture and the cover photo. It looks really good.


Channel 4

Channel 4′s cover photo is well thought out and fits in perfectly with the rest of the timeline. A very nice example.


Apple

Apple’s timeline has the same feel as the Apple website using minimalism and clean design.


Adobe

Adobe takes an artistic approach with the Adobe Flash timeline; the cover photo looks great.


Adobe Illustrator again takes an artistic approach with its cover photo and uses the Adobe Illustrator icon as the profile picture.


Starbucks

Starbucks UK’s new timeline looks great; the clean, simple styling of Starbucks is very clear. The profile picture is particularly good.


Fanta

Fanta again uses the concept of seamless integration of the cover photo and profile picture creating this amazing design that looks really good.


Florence and the Machine

Florence and the Machine’s timeline is a great piece of art. The cover photo looks great and fits the style of Florence and the Machine perfectly.


Rihanna

Rihanna’s timeline features a great cover photo that goes well with the chosen profile picture.


Ford

Ford uses the seamless integration concept with great effect creating a smart and professional feel to their page.


Smirnoff

Smirnoff has created a brilliant timeline. The use of seamless integration of cover photo and profile picture is really effective the color scheme well coordinated.


Captain Morgan

Captain Morgan uses a cover photo with a focus on the bottle of the drink and Captain Morgan himself, again integrating with the profile picture.


Ben & Jerry’s

Ben & Jerry’s timeline has a great artistic feel to it, with cartoon like clouds and hand drawn cows to put across their brand.


UNICEF

UNICEF’s cover photo is brilliant, the concept of peeling away is very effective and the use of children doing this further allows you to identify the timeline with the charity.


The Hobbit Movie

The highly anticipated The Hobbit Movie’s timeline is really good. The cover photo is really good and the color scheme and fonts are used throughout the timeline.


The New York Times

The New York Times timeline has a great cover photo which works really well with the rest of the timeline.


Webdesigner Depot

Last but not least, the official WDD Facebook page with the awesome illustrations of Radim Malinic.


David Pickett is a musician and web designer from the UK. Follow him on twitter.

Have you found any great Facebook timelines? Let us know!

The Ultimate Startup Bundle – only $59

Source


Posted in Blog | Comments Off on 30+ Examples of Facebook timelines

20 Fresh CSS3 Tutorials

Advertise here with BSA

The design industry is probably one of the fastest changing and growing. Designers have to keep their eyes on everything, including new trends in visual design, as well as interaction technologies like jQuery, HTML5, and CSS3. Designers are using these technologies to express more creativity in design production and make user experience richer.

In this post today, I would like to share with you some amazing and beautiful CSS3 tutorials for creating various web design elements and interactions. Use this collection to learn something new and be prepared for the near future of the web.

Quickly Build a Swish Teaser Page With CSS3

Quickly Build a Swish Teaser Page With CSS3

In this tutorial, you’ll learn how to build a teaser page using just CSS, no images or even a Photoshop design. Use it for any app or website that’s getting ready to launch.

How to Create a CSS3 Dropdown Menu [Tutorial]

How to Create a CSS3 Dropdown Menu [Tutorial]

In this short tutorial you will learn to code navigation menu in pure CSS3. Simple, clean and professional outcome.

Orman Clark’s Vertical Navigation Menu: The CSS3 Version

Orman Clark’s Vertical Navigation Menu: The CSS3 Version

By following this tutorial you will learn to recreate Orman Clark’s vertical navigation menu with CSS3 and jQuery while using the minimal amount of images possible.

Accordion with CSS3

Accordion with CSS3

In this tutorial you will see how to create an accordion that will animate the content areas on opening and closing using hidden inputs and labels.

Tutorial: CTA button without images using CSS3 and Entypo

Tutorial: CTA button without images using CSS3 and Entypo

In this tutorial you will learn to create button using 100% CSS and Entypo. Buttons without images are more flexible, require less data to be downloaded and are easily changed and updated.

Create the Illusion of Stacked Elements with CSS3 Pseudo-Elements

Create the Illusion of Stacked Elements with CSS3 Pseudo-Elements

In this tutorial Tom Kenny will guide you in creating the illusion of stacked elements with CSS3 pseudo-elements.

Pure CSS3 LavaLamp Menu

Pure CSS3 LavaLamp Menu

Another cool tutorial for creating originally jQuery based effect. Learn how to create LavaLamp effect using only CSS3 transitions.

CSS3 signup form

CSS3 signup form

In this article you will find out how to design a clean and attractive CSS3 signup form.

Timeline Portfolio

Timeline Portfolio

In this tutoriail you will see how to create beautiful and impressive portfolio using Timeline jQuery plugin and CSS3.

Apple-like Login Form with CSS 3D Transforms

Apple-like Login Form with CSS 3D Transforms

In this tutorial you will see how you can use CSS3 transforms to create an interesting flipping effect on an Apple-inspired form.

How to Create an Image Slider using jQuery and CSS3 [Tutorial]

How to Create an Image Slider using jQuery and CSS3 [Tutorial]

In this tutorial you will learn to create a slider with “Nivo Slider jQuery Script” and CSS3.

Making an Impressive Product Showcase with CSS3

Making an Impressive Product Showcase with CSS3

Amazing tutorial showing you how to spice up a plain old product page with some CSS3 magic and jQuery.

How to Create a Stylish Image Content Slider in Pure CSS3 [Tutorial]

How to Create a Stylish Image Content Slider in Pure CSS3 [Tutorial]

In this tutorial you will see how to create a clean and beautiful CSS3 only image slider.

CSS3 Pricing Table

CSS3 Pricing Table

This tutorial consists of a whole bunch of new CSS3 features including: transforms, gradient, shadow and nth-child.

CSS3 breadcrumbs

CSS3 breadcrumbs

Catalin Rosu will show you how to create your own cool CSS3 breadcrumbs in order to increase website’s usability.

Animated Content Tabs with CSS3

Animated Content Tabs with CSS3

In this tutorial you are going to implement some simple CSS3 content tabs using radio buttons together with the :checked pseudo-class and sibling combinators.

Responsive Horizontal Layout

Responsive Horizontal Layout

In this tutorial you will find out how to create a horizontal layout with several content panels.

Login and Registration Form with HTML5 and CSS3

Login and Registration Form with HTML5 and CSS3

In this tutorial you are going to create two HTML5 forms that will switch between login and registration using the CSS3 pseudo class :target.

Responsive Content Navigator with CSS3

Responsive Content Navigator with CSS3

In this tutorial Mary Lou will show you how to create a content navigator with CSS only.

How to Create Calendar using jQuery and CSS3 [Tutorial]

How to Create Calendar using jQuery and CSS3 [Tutorial]

In this tutorial you will learn to code the CSS3 calendar using jQuery and jQuery UI.

Posted in Blog | Comments Off on 20 Fresh CSS3 Tutorials