Twitter Background : Step by step how to design!

Welcome to another tutorial from Adobe Tuts! This time you are going to learn on how to create your very own customized twitter background.

For those, who don't really know what is Twitter all about, here's the right definition! Twitter is a service for friends, family, and co–workers to communicate and stay connected through the exchange of quick, frequent answers to one simple question: What are you doing?

Here's a sample of my own Twitter page and join today to start receiving my updates! @ramesstudios



In this tutorial, I'll be showing you the process of creating twitter background of my adobe tuts! @adobetuts

First of all, download the Twitter backround template that I've created for you here

Step 1

I'll be using 1280x1024 resolution because it's the standard size + mostly used screen res these days. We'll be working on only the part I've specified above. You can go beyond the size but it can only be seen on larger size monitors.

Step 2

In order to create the background, you'll need plain, patterned or image. In this tutorial, I'll be using wood with black color fading around it. Why fading? Because later on, we need to blend the image with the twitter page background.

Step 3

Adjust the opacity to 70%, so that you can actually see where is the exact working area of your twitter background.

Step 4

Now, you need to start adding all your logos or graphics onto your twitter design.

Step 5

Here's a lil tips.
- Add your logos (if you have any)
- Email address (your followers can email you)
- Your blog/ website URL (followers can check out portfolio or services offered by you)

Step 6

Add some photos or image props to make the page look more attractive.

Step 7

This is how the design will look like once you've added all the necessery info and graphics.

Step 8

Make the wood background's opacity back to 100%.

Step 9

Crop the whole image and save it.

Step 10


Use the File> Save for web in order to save it. Choose the right optimized size and quality and proceed to save it.

Step 11

Now go to http://twitter.com to register. Once you've done that, go to Settings and click on the Design tab. Select the "Change Background Image" and click on browse. Locate the photo and "Save Changes"

Step 12

Next, click on the "Change Design Colors". Change the colors according to your background designs. Use the color picker in your photoshop (see below) to help you decide which color suits your twitter page.



Walla!!!!! That's all! You're done! See below for the final twitter page design. It's now up live at http://twitter.com/adobetuts/



Let me know if you have any questions!