How To Create Backgrounds for the New Twitter

Twitter Front Page

Twitter recently updated the user interface, which dramatically changed the appearance of Twitter profiles.  The new now offers an enhanced user experience over their current interface. Nevertheless, the new interface comes with a hitch; (branded) background images and information are now sharply limited. This is because the new platform utilizes more of your computer screen than it did before, to accommodate for its updated features.

Twitter backgrounds are valuable and offer a unique way to incorporate your creative prowess and branding. Previously the vacant left hand margin of the Twitter background proved to be a popular area in which to share additional information about yourself using a customized Twitter background. Since the vast majority of viewers use a screen resolution (width) of 1024 or 1280, most old Twitter backgrounds will now look less professional on the New Twitter.

One of the first things you’ll notice about the New Twitter user interface is that there is far less available space in the margins. The left margin has been reduced considerably leaving only 110 or less pixels in each margin on a 1024 or 1280 display, which means it’s time for some innovative background redesigns. Though the overall width of the sidebar and website has been expanded to make room for more relevant information, only at higher resolutions will more than 40 pixels appear along the left side margin.

1024 x 768
At a 1024×768 screen resolution you have a minimal area to place any background images and information. You have about 40 free pixels on the left side margin, only 30 pixels on the right side, and a meager 21 pixels on the top margin, just right above your profile picture. The right panel area has a subtle 75% opacity you can experiment with though.

1280 x 1024
The next resolution, in terms of the number of people who make use of it on their computer screens, is 1280×1024. At 1280×1024, you have a total of 105 pixels on the left side margin, approximately 103 pixels on the right side margin and still only 21 pixels for the top margin. The Twitter user interface is much more proportioned at this resolution and I recommend it to most folks.

The new larger avatar (profile picture) is a welcome change to the previous one, so I deleted most of the images from my original background. No need for redundant images afterall. You can view my original Twitter background below:


Fortunately, you’ll notice that on the new Twitter profile interface that the right side region is slightly transparent, which is useful because we can now use that transparent area of our profile to our advantage.

Here’s my new background on the new Twitter:

At 1024×768 (Click Image to See Larger Size)

AUDIOMIND on Twitter1024x768

At 1280×800 (Click Image to See Larger Size)

AUDIOMIND on Twitter1280x800

At 1280×1024 (Click Image to See Larger Size)

AUDIOMIND on Twitter1280x1024

You no doubt observed how I added a few social networking url’s along with a few social network icons (that are unfortunately only visible when viewing my Twitter profile using a 1024×768 screen resolution) in the right side panel. This transparency apparently works only in Firefox, Safari and Chrome but not Internet Explorer, but I haven’t tested it in IE9.

Nonetheless, for easy customization of your Twitter profile, there’s no need for you to be a designer, as there are numerous websites that offer options to create personalized Twitter backgrounds. Here are few of them, which I hope will help you create a personalized Twitter profile.
It provides both free and paid service for customizing your Twitter background. You can download free templates or add your image, text, URL, badge etc.
Twitter images offers a lot of attractive Twitter backgrounds which you can customize according to your wishes and upload it to your Twitter profile. There are varieties of categories available like 3D, abstract, vehicles, fantasy, etc.
This is free service which you can use for customizing your profile by adding images, text and url’s. You can even use a self portrait as a Twitter background. There are more than 80 templates available to choose from or you can also create your own.
This service allows you to generate custom backgrounds according to your specific requirements. It provides you an easy way to add information about yourself and customize the colors, image or background of Twitter. This web tool is free to use.
Free Twitter Designer is a free and easy to use web app to create a customized Twitter background. You can add your own creative image or choose one from the given template and you can also add text, icons etc. to give personal touch to your Twitter background.
TweetyGotBack has an amazing collection of Twitter backgrounds. You just need to login into Twitter, select the background from given attractive templates and then apply it to your Twitter profile. It is fast and easy to use but it doesn’t add your image or name in your Twitter profile.

Hopefully this post has helped you recognize the adjustments you’ll need to make between the old and the new user interfaces, particularly the new background dimensions. As an added bonus I’ve provided you 5 custom .PSD Twitter templates (for download below) to help you create your new Twitter background. Enjoy and share this post and templates with your colleagues. Further, if you have any suggestions please leave them in the comments below.